From 3d7d4c01f73d774ac5dcfdf551f89582d3bdc4e4 Mon Sep 17 00:00:00 2001
From: nessi <sascha@nesterovic.cc>
Date: Sat, 7 Feb 2026 11:17:54 +0100
Subject: [PATCH] Update layout and scrolling styles for better responsiveness

Adjusted grid column sizing using "clamp" for improved adaptability to various screen sizes. Minor tweaks to sticky position and maximum height calculation ensure better alignment and consistent scroll behavior.
---
 frontend/src/App.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 3a8927f..58c06dd 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -268,7 +268,7 @@ export default function App() {
         style={{
           ...styles.shell,
           display: "grid",
-          gridTemplateColumns: "1fr min(420px, 36vw)",
+          gridTemplateColumns: "1fr clamp(420px, 28vw, 560px)",
           gap: 14,
           alignItems: "start",
         }}
@@ -348,7 +348,7 @@ export default function App() {
         <div
           style={{
             position: "sticky",
-            top: 12,
+            top: 14,
             alignSelf: "start",
             borderRadius: 22,
             border: `1px solid ${stylesTokens.panelBorder}`,
@@ -356,7 +356,7 @@ export default function App() {
             boxShadow: "0 22px 90px rgba(0,0,0,0.55)",
             backdropFilter: "blur(10px)",
             padding: 12,
-            maxHeight: "calc(100dvh - 24px)",
+            maxHeight: "calc(100vh - 28px)",
             overflow: "auto",
           }}
         >