From 172f8dd1b84f04b0e3b439c25af67f612acbbdbb Mon Sep 17 00:00:00 2001
From: MeowcaTheoRange <me@abtmtr.link>
Date: Wed, 21 Aug 2024 11:43:42 -0500
Subject: [PATCH] Make v13 fit the minimum width Firefox can render at

---
 assets/components/about-boxes/style.css |  8 ++++++++
 assets/components/header/style.css      | 23 ++++++++++++++++++-----
 2 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/assets/components/about-boxes/style.css b/assets/components/about-boxes/style.css
index 6a1d47c..75e5c85 100644
--- a/assets/components/about-boxes/style.css
+++ b/assets/components/about-boxes/style.css
@@ -6,6 +6,7 @@
   gap: 8px;
   width: 100%;
   box-sizing: border-box;
+  overflow: hidden;
 
   border: 1px solid currentColor;
   padding: 8px;
@@ -18,6 +19,7 @@
     height: var(--height);
     display: grid;
     box-sizing: border-box;
+    overflow: hidden;
     grid-template-columns: 1fr calc(var(--height) - 2px);
     box-shadow: var(--inset) var(--inset) 0 var(--foreground);
 
@@ -39,3 +41,9 @@
     }
   }
 }
+
+@media (max-width: 600px) {
+  .Aboutbox .AboutboxElement {
+    --height: 200px;
+  }
+}
diff --git a/assets/components/header/style.css b/assets/components/header/style.css
index 2b95645..3a38124 100644
--- a/assets/components/header/style.css
+++ b/assets/components/header/style.css
@@ -1,10 +1,10 @@
 .Header {
   display: grid;
   width: 100%;
+  overflow: hidden;
   grid-template-rows: 150px 1fr;
   box-sizing: border-box;
   border: 1px solid currentColor;
-  padding: 8px;
   gap: 8px;
   font-size: 16px;
   background: transparent var(--tiles-last-black);
@@ -12,7 +12,9 @@
 
   .HeaderTop {
     display: grid;
-    width: 100%;
+    /* width: 100%; */
+    margin: 0.5em;
+    overflow: hidden;
     height: 100%;
     grid-template-columns: 150px 1fr;
     box-sizing: border-box;
@@ -37,6 +39,7 @@
       align-items: center;
       justify-content: center;
       box-sizing: border-box;
+      overflow: clip;
 
       h1,
       p {
@@ -58,17 +61,21 @@
   }
 
   .HeaderLinks {
-    display: flex;
+    display: inline-flex;
     align-items: center;
-    justify-content: center;
-    gap: 0.5em;
+    justify-content: safe center;
     font-family: var(--font-text-header);
     font-weight: bold;
     font-size: 1em;
+    overflow: auto;
+    max-width: 100%;
+    padding: 0.5em;
+    gap: 0.5em;
 
     .HeaderLinksLink {
       display: inline-block;
       width: 100%;
+      min-width: max-content;
       text-align: center;
       padding: 0.5em;
       border: 1px solid currentColor;
@@ -79,3 +86,9 @@
     }
   }
 }
+
+@media (max-width: 600px) {
+  .HeaderTopName h1 {
+    font-size: 2em !important;
+  }
+}