From 5b92f7adbab3b17bc8c56773ce41be9bfba78810 Mon Sep 17 00:00:00 2001
From: "E. Almqvist" <elalmqvist@gmail.com>
Date: Mon, 4 Jul 2022 21:35:39 +0200
Subject: [PATCH] Menu cross

---
 components/burgermenu.tsx | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/components/burgermenu.tsx b/components/burgermenu.tsx
index bd68f97..b572601 100644
--- a/components/burgermenu.tsx
+++ b/components/burgermenu.tsx
@@ -16,10 +16,13 @@ const BurgerContainer = styled.div<{open: boolean}>`
 	display: none;
 	width: 1.8rem;
 	height: 1.8rem;
-	background-color: yellow;
 	flex-direction: column;
 	justify-content: center;
 
+	div {
+		transition: .2s;
+	}
+
 	&:hover {
 		cursor: pointer;
 	}
@@ -28,14 +31,24 @@ const BurgerContainer = styled.div<{open: boolean}>`
 		display: flex;
 
 		nav {
-			display: none;
+			display: none !important;
+			position: absolute;
+			top: 0;
 		}
 	}
 
 	${({open}) => open && css`
-		background-color: red;
-		div:not(:last-child) {
-			background-color: green;
+		div {
+			position: absolute;
+			height: 4px;
+		}
+
+		div:nth-child(1) {
+			transform: rotate(45deg) translate(.2rem, .2rem);
+		}
+
+		div:nth-child(2) {
+			transform: rotate(-45deg) translate(-.18rem, .2rem);
 		}
 
 		div:last-child {