From 4616d6f59d19c108b9f50c6fd07401475992dfa2 Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Tue, 30 Oct 2018 08:39:24 +0100
Subject: button tweaks

---
 packages/dev-tools-pages/ts/components/Button.tsx | 23 +++++++++++++++--------
 1 file changed, 15 insertions(+), 8 deletions(-)

(limited to 'packages/dev-tools-pages/ts/components')

diff --git a/packages/dev-tools-pages/ts/components/Button.tsx b/packages/dev-tools-pages/ts/components/Button.tsx
index 97c08ad21..94466d75d 100644
--- a/packages/dev-tools-pages/ts/components/Button.tsx
+++ b/packages/dev-tools-pages/ts/components/Button.tsx
@@ -13,7 +13,6 @@ const Button =
     ButtonProps >
     `
   font-family: inherit;
-  font-size: ${props => (props.large ? '1rem' : '.875rem')};
   line-height: 1;
   font-weight: 500;
   white-space: nowrap;
@@ -22,20 +21,28 @@ const Button =
   color: ${colors.black};
   border: 0;
   border-radius: 5rem;
-  height: ${props => (props.large ? '3.25rem' : '2rem')};
-  padding: ${props => (props.large ? '0 2.375rem' : '0 1.25rem')};
   display: inline-flex;
   justify-content: space-between;
   align-items: center;
+
+  ${props =>
+      props.large
+          ? `
+      font-size: 1rem;
+      padding: 1.1875rem 2.375rem 1.0625rem;
+  `
+          : `
+      font-size: .875rem;
+      padding: .5625rem 1.25rem;
+  `}
+
   :hover, :focus {
     background-color: ${props => props.colors.secondary_alt};
   } 
-  ${props =>
-      props.large &&
-      media.small`
+
+  ${media.small`
     font-size: .875rem;
-    height: 2rem;
-    padding: 0 1.25rem;
+    padding: .5625rem 1.25rem;
   `}
 `;
 
-- 
cgit v1.2.3