From e89cf5bc3afbaa85ea2d534070e7eb630b58bea3 Mon Sep 17 00:00:00 2001
From: CTO Hermes <cto-hermes@users.noreply.github.com>
Date: Sat, 30 May 2026 15:48:09 +0700
Subject: [PATCH] =?UTF-8?q?fix:=20QA=20=E2=80=94=20remove=20stale=20max-wi?=
 =?UTF-8?q?dth=20media=20queries,=20fix=20spacing=20scale=20refs?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Remove 2 stale @media (max-width: 640px) overrides (section + table)
- Fix docs sidebar: use min-width: 768px for mobile-docs-nav hide
- Fix docs sidebar collapse: max-width: 767px (below md breakpoint)
- Fix connect-line max-width: --space-15 → --space-10 (exists in scale)
- Mobile section spacing now purely from min-width queries
---
 website/src/app.css | 29 ++++++-----------------------
 1 file changed, 6 insertions(+), 23 deletions(-)

diff --git a/website/src/app.css b/website/src/app.css
index 68cc771..3f8ec32 100644
--- a/website/src/app.css
+++ b/website/src/app.css
@@ -388,16 +388,7 @@ body {
   }
 }
 
-@media (max-width: 640px) {
-  .section-tall {
-    padding-top: 3rem;
-    padding-bottom: 3rem;
-  }
-  .section-compact {
-    padding-top: 2rem;
-    padding-bottom: 2rem;
-  }
-}
+/* section-tall and section-compact mobile handled by min-width queries above */
 
 /* ---- Badge ---- */
 .badge {
@@ -516,13 +507,7 @@ body {
   color: var(--accent);
 }
 
-@media (max-width: 640px) {
-  .compare-table th,
-  .compare-table td {
-    padding: var(--space-2) var(--space-3);
-    font-size: 13px;
-  }
-}
+/* Compare table mobile handled by min-width queries in section container */
 
 /* ---- Syntax Highlighting ---- */
 .syntax-cmd { color: var(--muted-foreground); }
@@ -559,7 +544,7 @@ body {
   content: '';
   display: block;
   width: 100%;
-  max-width: var(--space-15);
+  max-width: var(--space-10);
   height: 1px;
   background: linear-gradient(
     90deg,
@@ -892,16 +877,14 @@ body {
   color: var(--accent);
 }
 
-@media (max-width: 768px) {
+@media (min-width: 768px) {
   .mobile-docs-nav {
-    display: flex;
-    align-items: center;
-    gap: var(--space-1);
+    display: none;
   }
 }
 
 /* ---- Mobile: collapse docs sidebar ---- */
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .docs-sidebar {
     display: none;
   }