From eadad19cb586dd06bc41c63eebf05ca81c023fc7 Mon Sep 17 00:00:00 2001
From: Fred Carlsen <fred@sjelfull.no>
Date: Fri, 14 Dec 2018 16:04:16 +0100
Subject: Mobile tweaks jobs table

---
 packages/website/ts/@next/pages/about/jobs.tsx | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

(limited to 'packages/website/ts/@next')

diff --git a/packages/website/ts/@next/pages/about/jobs.tsx b/packages/website/ts/@next/pages/about/jobs.tsx
index c0279b63e..5bcb0b855 100644
--- a/packages/website/ts/@next/pages/about/jobs.tsx
+++ b/packages/website/ts/@next/pages/about/jobs.tsx
@@ -99,17 +99,17 @@ export const NextAboutJobs = () => (
 
 const Position = ({ position }) => (
     <PositionWrap>
-        <Column width="30%">
+        <StyledColumn width="30%">
             <Heading asElement="h3" size="small" fontWeight="400" marginBottom="0"><a href={position.href}>{position.title}</a></Heading>
-        </Column>
+        </StyledColumn>
 
         <StyledColumn width="50%" padding="0 40px 0 0">
             <Paragraph isMuted={true} marginBottom="0">{position.location}</Paragraph>
         </StyledColumn>
 
-        <Column width="20%">
+        <StyledColumn width="20%">
             <Paragraph marginBottom="0" textAlign="right"><Link href={position.href}>Apply</Link></Paragraph>
-        </Column>
+        </StyledColumn>
     </PositionWrap>
 );
 
@@ -137,6 +137,12 @@ const ImageWrap = styled.figure`
 
 const StyledColumn = styled(Column)`
     flex-shrink: 0;
+
+    @media (max-width: 768px) {
+        & + & {
+            margin-top: 15px;
+        }
+    }
 `;
 
 const PositionWrap = styled(FlexWrap)`
-- 
cgit v1.2.3