sjg/trx-rs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[fix](trx-frontend-http): widen card bookmark gutter so side stacks are not clipped

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Signed-off-by: Stan Grams <sjg@haxx.space>
This commit is contained in:
Stan Grams
2026-03-21 21:58:49 +01:00
parent bc596dd9a1
commit 6079407257
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+6 -4
View File
@@ -33,7 +33,7 @@
--header-waterfall-overlap: 0rem; --header-waterfall-overlap: 0rem;
--card-base-max-width: 1280px; --card-base-max-width: 1280px;
--card-max-width: 1600px; --card-max-width: 1600px;
--card-bookmark-gutter: 4rem; --card-bookmark-gutter: 9.5rem;
--spectrum-bookmark-side-width: 6.5rem; --spectrum-bookmark-side-width: 6.5rem;
--spectrum-bookmark-side-offset: 8.85rem; --spectrum-bookmark-side-offset: 8.85rem;
} }
@@ -92,7 +92,7 @@ body {
overflow: visible; overflow: visible;
} }
@media (min-width: 1440px) { @media (min-width: 1100px) {
.card { .card {
width: min( width: min(
var(--card-max-width), var(--card-max-width),
@@ -2325,6 +2325,10 @@ button:focus-visible, input:focus-visible, select:focus-visible {
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent-green) 55%, var(--border-light)); } ::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent-green) 55%, var(--border-light)); }
* { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--border-light) 70%, transparent) transparent; } * { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--border-light) 70%, transparent) transparent; }
@media (max-width: 1099px) {
/* Side bookmark panels need the gutter; hide when card is full-width */
.spectrum-bookmark-side { display: none !important; }
}
@media (max-width: 900px) { @media (max-width: 900px) {
.card { width: 100%; padding-left: 0.9rem; padding-right: 0.9rem; } .card { width: 100%; padding-left: 0.9rem; padding-right: 0.9rem; }
} }
@@ -2555,8 +2559,6 @@ button:focus-visible, input:focus-visible, select:focus-visible {
.spectrum-edge-shift { .spectrum-edge-shift {
width: 0.95rem; width: 0.95rem;
} }
/* Bookmark side panels need too much horizontal space on narrow screens */
.spectrum-bookmark-side { display: none !important; }
.spectrum-bookmark-side .spectrum-bookmark-chip { .spectrum-bookmark-side .spectrum-bookmark-chip {
font-size: 0.58rem; font-size: 0.58rem;
padding: 2px 6px; padding: 2px 6px;