From d736d0899c3f6705f599bb122ac53f10bd1dba13 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Fri, 29 Sep 2023 17:33:14 -0700
Subject: feat(layout): custom mobile navigation bar

---
 src/routes/+layout.svelte | 27 ++++++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

(limited to 'src')

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 4080d5be..19df3f1c 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -49,13 +49,20 @@
 
 		<p />
 
-		<p>
+		<p id="desktop-navigation-bar">
 			「 <a href="/">Home</a> • <a href="/completed">Completed</a> •
-			<a href="/updates">Manga & LN Updates</a>
-			•
+			<a href="/updates">Manga & LN Updates</a> •
 			<a href="/tools">Tools</a> • <a href="/settings">Settings</a> 」
 		</p>
 
+		<div id="mobile-navigation-bar">
+			<a href="/">Home</a> • <a href="/completed">Completed</a> • <a href="/tools">Tools</a><br />
+			<a href="/settings">Settings</a>
+			<a href="/updates">Manga & LN Updates</a>
+
+			<p />
+		</div>
+
 		<hr />
 	</div>
 
@@ -80,4 +87,18 @@
 		display: flex;
 		flex-direction: column;
 	}
+
+	#mobile-navigation-bar {
+		display: none;
+	}
+
+	@media (max-width: 640px) {
+		#desktop-navigation-bar {
+			display: none;
+		}
+
+		#mobile-navigation-bar {
+			display: unset;
+		}
+	}
 </style>
-- 
cgit v1.2.3