From bf7443c985f2b26458586ece6661dd3e13215b79 Mon Sep 17 00:00:00 2001
From: August Skare <post@augustskare.no>
Date: Mon, 22 Oct 2018 09:02:59 +0200
Subject: button styling on small screens

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

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

diff --git a/packages/dev-tools-pages/ts/components/Button.tsx b/packages/dev-tools-pages/ts/components/Button.tsx
index 2d0fbc353..eae6aaf54 100644
--- a/packages/dev-tools-pages/ts/components/Button.tsx
+++ b/packages/dev-tools-pages/ts/components/Button.tsx
@@ -1,6 +1,7 @@
 import styled from 'styled-components';
 import { colors } from '../variables';
 
+import { media } from 'ts/variables';
 import { withContext, Props } from './withContext';
 
 interface ButtonProps extends Props {
@@ -22,6 +23,12 @@ const Button =
   border-radius: 5rem;
   padding: ${props => (props.large ? '1.125rem 2.375rem' : '.5625rem 1.25rem')};
   display: inline-block;
+  ${props =>
+      props.large &&
+      media.small`
+    font-size: 1rem;
+    padding: .875rem 1.5rem;
+  `}
 `;
 
 export default withContext(Button);
-- 
cgit v1.2.3

