From b3aaaf8fb79acac05c14038ea84c3976efb3d837 Mon Sep 17 00:00:00 2001
From: afnzmn <afnzmn@gmail.com>
Date: Thu, 21 Jul 2022 09:14:34 -0400
Subject: [PATCH] navbar media queries

---
 src/lib/components/atoms/Navigation.svelte  |  6 +++---
 src/lib/components/molecules/NavHost.svelte | 20 ++++++++++++++++++++
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/atoms/Navigation.svelte b/src/lib/components/atoms/Navigation.svelte
index 6dfbe56..ad77420 100644
--- a/src/lib/components/atoms/Navigation.svelte
+++ b/src/lib/components/atoms/Navigation.svelte
@@ -12,16 +12,16 @@
 
 <style>
 	li {
+		border: var(--grey-six);
 		width: 150px;
 		text-align: center;
 		list-style: none;
 		display: inline-block;
 		position: relative;
+		margin-left: 0.25rem;
+		margin-right: 0.25rem;
 		font-weight: 300;
-		margin-left: 0.5rem;
-		margin-right: 0.5rem;
 		align-items: center;
-		border: var(--grey-six);
 		transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
 		transition-duration: 0.25s;
 	}
diff --git a/src/lib/components/molecules/NavHost.svelte b/src/lib/components/molecules/NavHost.svelte
index b9ed76b..a3dcd87 100644
--- a/src/lib/components/molecules/NavHost.svelte
+++ b/src/lib/components/molecules/NavHost.svelte
@@ -34,6 +34,7 @@
 		user-select: none;
 	}
 
+
 	.logo {
 		display: inline-block;
 	}
@@ -54,4 +55,23 @@
 	h1 span {
 		color: var(--red);
 	}
+
+
+	@media screen and (max-width: 1050px) {
+
+		h1 {
+			display: none;
+		}
+
+		nav {
+			padding-right: 1rem;
+			padding-left: 4rem;
+		}
+	}
+
+	@media screen and (max-width: 768px) {
+		nav {
+			background-color: purple;
+		}
+	}
 </style>