From ea8e5c4da7be314083ad3db540eb12a6de0c83d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ond=C5=99ej=20Mekina?= <mekina@duck.com>
Date: Sun, 20 Apr 2025 19:02:59 +0200
Subject: [PATCH] fix menu button misalign on mobile

---
 styles/styles.css | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/styles/styles.css b/styles/styles.css
index 9a8bc26..7c4fdf7 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -240,24 +240,24 @@ nav div {
 .menu-button .inner div {
 	display: block;
 	transition: .2s ease opacity, .2s ease transform, .2s ease width;
-	height: .2em;
-	width: 2em;
+	height: 3px;
+	width: 30px;
 	background-color: white;
 	border-radius: .1em;
-	margin: .2em 0;
+	margin: 3px 0;
 }
 
 #menu-trigger:checked + .menu-button .center {
 	width: 0;
-	transform: translateX(.3em);
+	transform: translateX(4px);
 }
 
 #menu-trigger:checked + .menu-button .upper {
-	transform: translateY(.625em) rotate(45deg);
+	transform: translateY(100%) translateY(6px) rotate(45deg);
 }
 
 #menu-trigger:checked + .menu-button .lower {
-	transform: translateY(-.625em) rotate(-45deg);
+	transform: translateY(-100%) translateY(-6px) rotate(-45deg);
 }
 
 #menu-trigger {