From 818950f4422b906aaf87ede3ea7082cfe471c1ff Mon Sep 17 00:00:00 2001 From: Vinta Chen Date: Sun, 22 Mar 2026 02:25:58 +0800 Subject: [PATCH] fix(website): fix sticky header on mobile and add border shadow Move overflow-x: auto from .table-wrap to the mobile breakpoint only, so horizontal scrolling only applies on small screens. Add box-shadow to sticky thead th for visual separation. Reset th position to static on mobile to avoid stacking context issues. Co-Authored-By: Claude --- website/static/style.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/website/static/style.css b/website/static/style.css index 63b40e5..867246f 100644 --- a/website/static/style.css +++ b/website/static/style.css @@ -227,7 +227,6 @@ a:hover { color: var(--accent-hover); text-decoration: underline; } .table-wrap { width: 100%; padding: 0; - overflow-x: auto; } .table-wrap:focus { @@ -254,6 +253,7 @@ a:hover { color: var(--accent-hover); text-decoration: underline; } background: var(--bg); z-index: 10; white-space: nowrap; + box-shadow: 0 1px 0 var(--border); } .table thead th:first-child, @@ -634,6 +634,8 @@ th[data-sort].sort-asc::after { } @media (max-width: 640px) { + .table-wrap { overflow-x: auto; } + .table thead th { position: static; } .hero { padding: 2rem 1.25rem 1rem; } .controls { padding: 0 1.25rem 0.75rem; }