From 7ae3089f30db90eaec958269fe7215d23c1d43dc Mon Sep 17 00:00:00 2001
From: Gabe Farrell <gabe@mnrva.dev>
Date: Wed, 4 Feb 2026 13:13:20 -0500
Subject: [PATCH 1/3] reduce min width of top chart on mobile

---
 client/app/routes/Charts/AlbumChart.tsx  | 4 ++--
 client/app/routes/Charts/ArtistChart.tsx | 4 ++--
 client/app/routes/Charts/TrackChart.tsx  | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/client/app/routes/Charts/AlbumChart.tsx b/client/app/routes/Charts/AlbumChart.tsx
index 7bc4eea..7a157a8 100644
--- a/client/app/routes/Charts/AlbumChart.tsx
+++ b/client/app/routes/Charts/AlbumChart.tsx
@@ -30,7 +30,7 @@ export default function AlbumChart() {
       initialData={initialData}
       endpoint="chart/top-albums"
       render={({ data, page, onNext, onPrev }) => (
-        <div className="flex flex-col gap-5">
+        <div className="flex flex-col gap-5 w-full">
           <div className="flex gap-15 mx-auto">
             <button className="default" onClick={onPrev} disabled={page <= 1}>
               Prev
@@ -47,7 +47,7 @@ export default function AlbumChart() {
             ranked
             separators
             data={data}
-            className="w-[400px] sm:w-[600px]"
+            className="w-11/12 sm:w-[600px]"
             type="album"
           />
           <div className="flex gap-15 mx-auto">
diff --git a/client/app/routes/Charts/ArtistChart.tsx b/client/app/routes/Charts/ArtistChart.tsx
index f128027..8bc2935 100644
--- a/client/app/routes/Charts/ArtistChart.tsx
+++ b/client/app/routes/Charts/ArtistChart.tsx
@@ -30,7 +30,7 @@ export default function Artist() {
       initialData={initialData}
       endpoint="chart/top-artists"
       render={({ data, page, onNext, onPrev }) => (
-        <div className="flex flex-col gap-5">
+        <div className="flex flex-col gap-5 w-full">
           <div className="flex gap-15 mx-auto">
             <button className="default" onClick={onPrev} disabled={page <= 1}>
               Prev
@@ -47,7 +47,7 @@ export default function Artist() {
             ranked
             separators
             data={data}
-            className="w-[400px] sm:w-[600px]"
+            className="w-11/12 sm:w-[600px]"
             type="artist"
           />
           <div className="flex gap-15 mx-auto">
diff --git a/client/app/routes/Charts/TrackChart.tsx b/client/app/routes/Charts/TrackChart.tsx
index 023dceb..450d022 100644
--- a/client/app/routes/Charts/TrackChart.tsx
+++ b/client/app/routes/Charts/TrackChart.tsx
@@ -30,7 +30,7 @@ export default function TrackChart() {
       initialData={initialData}
       endpoint="chart/top-tracks"
       render={({ data, page, onNext, onPrev }) => (
-        <div className="flex flex-col gap-5">
+        <div className="flex flex-col gap-5 w-full">
           <div className="flex gap-15 mx-auto">
             <button className="default" onClick={onPrev} disabled={page <= 1}>
               Prev
@@ -47,7 +47,7 @@ export default function TrackChart() {
             ranked
             separators
             data={data}
-            className="w-[400px] sm:w-[600px]"
+            className="w-11/12 sm:w-[600px]"
             type="track"
           />
           <div className="flex gap-15 mx-auto">

From 0956e5868c0c661bd694d74f5ce95659aaf3c0c3 Mon Sep 17 00:00:00 2001
From: Gabe Farrell <gabe@mnrva.dev>
Date: Wed, 4 Feb 2026 13:27:03 -0500
Subject: [PATCH 2/3] adjust error page style

---
 client/app/root.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/client/app/root.tsx b/client/app/root.tsx
index 077d09e..cb0723f 100644
--- a/client/app/root.tsx
+++ b/client/app/root.tsx
@@ -116,12 +116,12 @@ export function ErrorBoundary() {
     <AppProvider>
       <ThemeProvider>
         <title>{title}</title>
+        <Sidebar />
         <div className="flex">
-          <Sidebar />
           <div className="w-full flex flex-col">
-            <main className="pt-16 p-4 container mx-auto flex-grow">
-              <div className="flex gap-4 items-end">
-                <img className="w-[200px] rounded" src="../yuu.jpg" />
+            <main className="pt-16 p-4 mx-auto flex-grow">
+              <div className="md:flex gap-4">
+                <img className="w-[200px] rounded mb-3" src="../yuu.jpg" />
                 <div>
                   <h1>{message}</h1>
                   <p>{details}</p>

From 15d38cffaaae77f2cee17b298300c8549c6fff32 Mon Sep 17 00:00:00 2001
From: Gabe Farrell <gabe@mnrva.dev>
Date: Wed, 4 Feb 2026 13:31:36 -0500
Subject: [PATCH 3/3] adjust h1 line height

---
 client/app/app.css | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/client/app/app.css b/client/app/app.css
index bc60042..15cfbc0 100644
--- a/client/app/app.css
+++ b/client/app/app.css
@@ -58,6 +58,7 @@
   --header-sm: 16px;
   --header-xl-weight: 600;
   --header-weight: 600;
+  --header-line-height: 3rem;
 }
 
 @media (min-width: 60rem) {
@@ -68,6 +69,7 @@
     --header-sm: 16px;
     --header-xl-weight: 600;
     --header-weight: 600;
+    --header-line-height: 1.3em;
   }
 }
 
@@ -98,6 +100,7 @@ h1 {
   font-family: "League Spartan";
   font-weight: var(--header-weight);
   font-size: var(--header-xl);
+  line-height: var(--header-line-height);
 }
 h2 {
   font-family: "League Spartan";