From c99558606347682c6c5c9bb20d37aa4fbe8ab6be Mon Sep 17 00:00:00 2001
From: Fred Carlsen <fred@sjelfull.no>
Date: Mon, 10 Dec 2018 11:19:20 +0100
Subject: WIP mobile header + developer dropdown

---
 packages/website/ts/@next/components/hamburger.tsx | 68 ++++++++++++++++++++++
 1 file changed, 68 insertions(+)
 create mode 100644 packages/website/ts/@next/components/hamburger.tsx

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
new file mode 100644
index 000000000..0eac4a53f
--- /dev/null
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -0,0 +1,68 @@
+import * as React from 'react';
+import styled from 'styled-components';
+
+interface Props {
+    isOpen: boolean;
+    onClick?: () => void;
+}
+
+export const Hamburger: React.FunctionComponent<Props> = (props: Props) => {
+    return (
+        <StyledHamburger isOpen={props.isOpen} onClick={props.onClick}>
+            <span />
+            <span />
+            <span />
+        </StyledHamburger>
+    );
+};
+
+const StyledHamburger = styled.button<Props>`
+    background: none;
+    border: 0;
+    width: 22px;
+    height: 16px;
+    position: relative;
+    z-index: 2;
+    padding: 0;
+    outline: none;
+    user-select: none;
+
+    @media (min-width: 768px) {
+        display: none;
+    }
+
+    span {
+        display: block;
+        background-color: #fff;
+        width: 100%;
+        height: 2px;
+        margin-bottom: 5px;
+        transform-origin: 4px 0px;
+        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
+            background-color 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
+            opacity 0.55s ease;
+
+        &:first-child {
+            //transform-origin: 0% 0%;
+        }
+
+        &:last-child {
+            //transform-origin: 0% 100%;
+        }
+
+        ${props => props.isOpen && `
+            opacity: 1;
+            transform: rotate(45deg) translate(0, 1px);
+            background-color: #fff;
+
+            &:nth-child(2) {
+                opacity: 0;
+                transform: rotate(0deg) scale(0.2, 0.2);
+            }
+
+            &:last-child {
+                transform: rotate(-45deg) translate(1px, -4px);
+            }
+        `}
+    }
+`;
-- 
cgit v1.2.3


From bf56a2c7c49ec2817adedea359b7750a8ced15d7 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Wed, 12 Dec 2018 16:47:12 +0100
Subject: Header mobile styling

---
 packages/website/ts/@next/components/hamburger.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index 0eac4a53f..37aabcd10 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -27,7 +27,7 @@ const StyledHamburger = styled.button<Props>`
     outline: none;
     user-select: none;
 
-    @media (min-width: 768px) {
+    @media (min-width: 800px) {
         display: none;
     }
 
-- 
cgit v1.2.3


From b4b1d54e49ff3d6c146b257ddb918fca5ddb1329 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Thu, 13 Dec 2018 12:33:45 +0100
Subject: WIP refactor mobileNavMenu

---
 packages/website/ts/@next/components/hamburger.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index 37aabcd10..97c9ba26d 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -22,7 +22,7 @@ const StyledHamburger = styled.button<Props>`
     width: 22px;
     height: 16px;
     position: relative;
-    z-index: 2;
+    z-index: 9999;
     padding: 0;
     outline: none;
     user-select: none;
-- 
cgit v1.2.3


From d2e29fb081ca4b55912cfb2c004c441acda75ea0 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Thu, 13 Dec 2018 13:18:51 +0100
Subject: Refactors mobile nav, theming

---
 packages/website/ts/@next/components/hamburger.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index 97c9ba26d..28d58ab82 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -33,7 +33,7 @@ const StyledHamburger = styled.button<Props>`
 
     span {
         display: block;
-        background-color: #fff;
+        background-color: ${props => props.theme.textColor};
         width: 100%;
         height: 2px;
         margin-bottom: 5px;
-- 
cgit v1.2.3


From 6f7e27bd7fbb0e28acb245bec3b18cf944e24523 Mon Sep 17 00:00:00 2001
From: Fred Carlsen <fred@sjelfull.no>
Date: Thu, 13 Dec 2018 13:52:55 +0100
Subject: Tweak z-index

---
 packages/website/ts/@next/components/hamburger.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index 28d58ab82..3ca276705 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -22,7 +22,7 @@ const StyledHamburger = styled.button<Props>`
     width: 22px;
     height: 16px;
     position: relative;
-    z-index: 9999;
+    z-index: 25;
     padding: 0;
     outline: none;
     user-select: none;
-- 
cgit v1.2.3


From 47db165afc51a8ffe5ffe0d194a1e893bfb94083 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Mon, 17 Dec 2018 19:56:10 +0100
Subject: Fixes hamburger icon bgcolor, jobs link

---
 packages/website/ts/@next/components/hamburger.tsx | 1 -
 1 file changed, 1 deletion(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index 3ca276705..b5c01a2b0 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -53,7 +53,6 @@ const StyledHamburger = styled.button<Props>`
         ${props => props.isOpen && `
             opacity: 1;
             transform: rotate(45deg) translate(0, 1px);
-            background-color: #fff;
 
             &:nth-child(2) {
                 opacity: 0;
-- 
cgit v1.2.3


From 9bd71aeeffbadebb41756a605ef6a0aacbfd47c4 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Tue, 18 Dec 2018 13:24:53 -0800
Subject: run prettier on website

---
 packages/website/ts/@next/components/hamburger.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(limited to 'packages/website/ts/@next/components/hamburger.tsx')

diff --git a/packages/website/ts/@next/components/hamburger.tsx b/packages/website/ts/@next/components/hamburger.tsx
index b5c01a2b0..435d206cd 100644
--- a/packages/website/ts/@next/components/hamburger.tsx
+++ b/packages/website/ts/@next/components/hamburger.tsx
@@ -16,7 +16,10 @@ export const Hamburger: React.FunctionComponent<Props> = (props: Props) => {
     );
 };
 
-const StyledHamburger = styled.button<Props>`
+const StyledHamburger =
+    styled.button <
+    Props >
+    `
     background: none;
     border: 0;
     width: 22px;
@@ -50,7 +53,9 @@ const StyledHamburger = styled.button<Props>`
             //transform-origin: 0% 100%;
         }
 
-        ${props => props.isOpen && `
+        ${props =>
+            props.isOpen &&
+            `
             opacity: 1;
             transform: rotate(45deg) translate(0, 1px);
 
-- 
cgit v1.2.3

