From 2a08bf543fbcfaa0e9fc617d81f5f35765f294b6 Mon Sep 17 00:00:00 2001
From: MaximilianMcC <max@maximilian.co.nz>
Date: Sun, 4 Aug 2024 23:37:17 +1200
Subject: [PATCH] responsive for phones

---
 style/general.css  | 16 ++++++++++++++++
 style/general.scss | 38 +++++++++++++++++++++++++++++++++++++-
 2 files changed, 53 insertions(+), 1 deletion(-)

diff --git a/style/general.css b/style/general.css
index e6863e1..021759b 100644
--- a/style/general.css
+++ b/style/general.css
@@ -54,4 +54,20 @@ main {
 section h2 {
   border-bottom: 5px solid #212121;
   margin-bottom: 10px;
+}
+
+@media (max-width: 480px) {
+  html {
+    font-size: 1.5rem;
+  }
+  main {
+    margin: 10% 15%;
+  }
+  nav {
+    display: none;
+  }
+  header {
+    font-size: 1.3rem;
+    height: 25%;
+  }
 }/*# sourceMappingURL=general.css.map */
\ No newline at end of file
diff --git a/style/general.scss b/style/general.scss
index acc0ffa..45eda38 100644
--- a/style/general.scss
+++ b/style/general.scss
@@ -52,7 +52,6 @@ header {
 nav {
 	background-color: $background-secondary;
 	height: 5%;
-	// box-shadow: 0px 5px 10px black;
 	
 	ul {
 		height: 100%;
@@ -83,4 +82,41 @@ section {
 		border-bottom: 5px solid $background-secondary;
 		margin-bottom: 10px;
 	}
+}
+
+
+
+
+
+
+
+
+
+
+// Responsive phone
+@media (max-width: 480px) {
+
+	// Make the base font smaller
+	html {
+		font-size: 1.5rem;
+	}
+
+	// Make the margins smaller
+	main {
+		margin: 10% 15%;
+	}
+
+	// Just straight up get
+	// rid of the navbar if
+	// they are on a phone
+	nav {
+		display: none;
+	}
+
+	// Make the header size smaller
+	// and also text smaller
+	header {
+		font-size: 1.3rem;
+		height: 25%;
+	}
 }
\ No newline at end of file