From ce022dc447c5cea9a26a9555d28a84e5875d1b80 Mon Sep 17 00:00:00 2001
From: Mike Freno <michael@freno.me>
Date: Tue, 10 Feb 2026 13:15:25 -0500
Subject: [PATCH] add explicit width

---
 src/pages/Discover/DiscoverPage.tsx | 3 +--
 src/pages/Feed/FeedPage.tsx         | 1 +
 src/pages/MyShows/MyShowsPage.tsx   | 2 +-
 src/pages/Player/PlayerPage.tsx     | 2 +-
 src/pages/Search/SearchPage.tsx     | 2 +-
 src/pages/Settings/SettingsPage.tsx | 2 +-
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/pages/Discover/DiscoverPage.tsx b/src/pages/Discover/DiscoverPage.tsx
index 57b68c4..cab0284 100644
--- a/src/pages/Discover/DiscoverPage.tsx
+++ b/src/pages/Discover/DiscoverPage.tsx
@@ -37,14 +37,13 @@ export function DiscoverPage(props: PageProps) {
 
   const { theme } = useTheme();
   return (
-    <box flexDirection="row" flexGrow={1} height="100%" gap={1}>
+    <box flexDirection="row" flexGrow={1} height="100%" width="100%" gap={1}>
       <box
         border
         padding={1}
         borderColor={theme.border}
         flexDirection="column"
         gap={1}
-        width={20}
       >
         <text
           fg={
diff --git a/src/pages/Feed/FeedPage.tsx b/src/pages/Feed/FeedPage.tsx
index 255b037..2292885 100644
--- a/src/pages/Feed/FeedPage.tsx
+++ b/src/pages/Feed/FeedPage.tsx
@@ -46,6 +46,7 @@ export function FeedPage(props: PageProps) {
       backgroundColor={theme.background}
       flexDirection="column"
       height="100%"
+      width="100%"
     >
       {/* Status line */}
       <Show when={isRefreshing()}>
diff --git a/src/pages/MyShows/MyShowsPage.tsx b/src/pages/MyShows/MyShowsPage.tsx
index 35dbeeb..643b595 100644
--- a/src/pages/MyShows/MyShowsPage.tsx
+++ b/src/pages/MyShows/MyShowsPage.tsx
@@ -128,7 +128,7 @@ export function MyShowsPage(props: PageProps) {
   };
 
   return (
-    <box flexDirection="row" flexGrow={1}>
+    <box flexDirection="row" flexGrow={1} width="100%">
       <box flexDirection="column" height="100%">
         <Show when={isRefreshing()}>
           <text fg="yellow">Refreshing...</text>
diff --git a/src/pages/Player/PlayerPage.tsx b/src/pages/Player/PlayerPage.tsx
index 96b9d95..ee01328 100644
--- a/src/pages/Player/PlayerPage.tsx
+++ b/src/pages/Player/PlayerPage.tsx
@@ -25,7 +25,7 @@ export function PlayerPage(props: PageProps) {
   };
 
   return (
-    <box flexDirection="column" gap={1}>
+    <box flexDirection="column" gap={1} width="100%">
       <box flexDirection="row" justifyContent="space-between">
         <text>
           <strong>Now Playing</strong>
diff --git a/src/pages/Search/SearchPage.tsx b/src/pages/Search/SearchPage.tsx
index f5d0efd..7336d6d 100644
--- a/src/pages/Search/SearchPage.tsx
+++ b/src/pages/Search/SearchPage.tsx
@@ -57,7 +57,7 @@ export function SearchPage(props: PageProps) {
   };
 
   return (
-    <box flexDirection="column" height="100%" gap={1}>
+    <box flexDirection="column" height="100%" gap={1} width="100%">
       {/* Search Header */}
       <box flexDirection="column" gap={1}>
         <text>
diff --git a/src/pages/Settings/SettingsPage.tsx b/src/pages/Settings/SettingsPage.tsx
index 3d5240b..d9ee873 100644
--- a/src/pages/Settings/SettingsPage.tsx
+++ b/src/pages/Settings/SettingsPage.tsx
@@ -31,7 +31,7 @@ export function SettingsPage(props: PageProps) {
   );
 
   return (
-    <box flexDirection="column" gap={1} height="100%">
+    <box flexDirection="column" gap={1} height="100%" width="100%">
       <box flexDirection="row" gap={1}>
         <For each={SECTIONS}>
           {(section, index) => (