Remove 16:9 aspect ratio constraint - fill available viewport space instead

2026-04-09 13:24:43 -04:00
parent 94c619ce7c
commit b4de9d112b
1 changed files with 4 additions and 5 deletions
--- a/src/styles.css
+++ b/src/styles.css
@@ -29,7 +29,7 @@ html, body {
  background: transparent;
 }

-/* Main App Container - 16:9 aspect ratio for TV */
+/* Main App Container - fills viewport accounting for browser chrome */
 #app {
  width: 100%;
  height: 100%;
@@ -40,11 +40,10 @@ html, body {
 }

 #app > * {
-  aspect-ratio: 16 / 9;
+  width: 100%;
+  height: calc(100vh - 100px);
+  max-width: 100%;
  max-height: calc(100vh - 100px);
-  max-width: 100vw;
-  width: auto;
-  height: auto;
  min-width: 0;
  min-height: 0;
 }