From ba0b9b259fdd84c34254cb9d9cab4a2dc4c91f94 Mon Sep 17 00:00:00 2001
From: Megan Pearson <megan.e.pearson@gmail.com>
Date: Fri, 19 Oct 2018 11:59:03 +0200
Subject: Responsive header

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

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

diff --git a/packages/dev-tools-pages/ts/components/Header.tsx b/packages/dev-tools-pages/ts/components/Header.tsx
index dca562421..aeefae3cc 100644
--- a/packages/dev-tools-pages/ts/components/Header.tsx
+++ b/packages/dev-tools-pages/ts/components/Header.tsx
@@ -5,6 +5,8 @@ import { withContext, Props } from './withContext';
 import Container from './Container';
 import { Small } from './Typography';
 
+import { media } from '../variables';
+
 function Header(props: Props) {
     const { icon, title, colors } = props;
 
@@ -36,6 +38,8 @@ const StyledHeader = styled.header`
         justify-content: space-between;
         align-items: center;
     }
+
+    ${media.small`padding-top: 2.125rem;`};
 `;
 
 const LogoMark = styled.div`
@@ -53,6 +57,8 @@ const Title = styled.h1`
     font-size: 1.5rem;
     margin: 0;
     margin-left: 0.8125rem;
+
+    ${media.small`font-size: 1.25rem;`};
 `;
 
 const StyledLink = styled(Small)`
-- 
cgit v1.2.3

