From 204f862917e9a9014e47a475d6c49cc33d5a6d5e Mon Sep 17 00:00:00 2001
From: realtradam <github@tradam.dev>
Date: Thu, 20 Jun 2024 15:27:54 -0400
Subject: fix layout for desktop

---
 src/components/Layout.tsx |  2 +-
 src/index.css             | 31 +++++++++++++++++--------------
 2 files changed, 18 insertions(+), 15 deletions(-)

(limited to 'src')

diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 9abfdf0..83aa172 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -27,7 +27,7 @@ export default function Layout ({userData}: userData)
 	return (
 	<>
 		<div id="page" className="star flex flex-row min-h-screen max-h-screen bg-amber-400 text-stone-950 text-xl bg-star bg-repeat bg-[length:170px_170px]">
-				<div onClick={handleSidebarOpen} className="fixed shadow-xl right-4 m-4 p-1 w-min h-min text-stone-50 bg-stone-800 rounded-[5px] z-[5]">
+				<div onClick={handleSidebarOpen} className="md:hidden fixed shadow-xl right-4 m-4 p-1 w-min h-min text-stone-50 bg-stone-800 rounded-[5px] z-[5]">
 				<div className="rounded-[5px] border-2 border-stone-50 border-amber-500">
 		<Button width={12} height={12} link={ <i className="fa-solid fa-bars"></i> }/>
 		</div>
diff --git a/src/index.css b/src/index.css
index 153686f..1a84e98 100644
--- a/src/index.css
+++ b/src/index.css
@@ -29,23 +29,26 @@
 	}
 }
 
-.sidebarInit {
-	left: -16rem;
-}
+@media (max-width: 768px)
+{
+	.sidebarInit {
+		left: -16rem;
+	}
 
-.sidebarOpen {
-	animation-name: sidebar-enter;
-	left: 0;
-}
+	.sidebarOpen {
+		animation-name: sidebar-enter;
+		left: 0;
+	}
 
-.sidebarClosed {
-	animation-name: sidebar-exit;
-	left: -16rem;
-}
+	.sidebarClosed {
+		animation-name: sidebar-exit;
+		left: -16rem;
+	}
 
-#sidebar {
-	animation-duration: 0.5s;
-	animation-iteration-count: 1;
+	#sidebar {
+		animation-duration: 0.5s;
+		animation-iteration-count: 1;
+	}
 }
 
 .gameCard {
-- 
cgit v1.2.3