Merge commit 'c4a4ba0' (phase 5h hotfix: contain Tiles grid to prevent horizontal scroll)
This commit is contained in:
@@ -342,13 +342,22 @@ table.bulk .chip-add-btn:hover { background: var(--accent); color: var(--accent-
|
||||
|
||||
.dashboard .dash-tiles {
|
||||
display: grid; gap: 12px; margin-top: 8px;
|
||||
grid-template-columns: 1fr;
|
||||
/* minmax(0, 1fr) overrides the implicit min-content minimum on 1fr —
|
||||
without it, any tile with a long unbreakable string (slug-path or
|
||||
a long task summary) widens its column and pushes the grid past
|
||||
the viewport, causing horizontal scroll. */
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
min-width: 0;
|
||||
}
|
||||
.dashboard .tile {
|
||||
border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px;
|
||||
background: var(--surface);
|
||||
display: flex; flex-direction: column; gap: 6px;
|
||||
min-height: 110px;
|
||||
/* min-width: 0 lets the grid item shrink below its content's
|
||||
min-content width — critical pairing with minmax(0, 1fr) above. */
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.dashboard .tile.tile-pinned { border-left: 3px solid var(--accent); }
|
||||
.dashboard .tile.tile-stale { border-style: dashed; opacity: 0.85; }
|
||||
@@ -365,6 +374,11 @@ table.bulk .chip-add-btn:hover { background: var(--accent); color: var(--accent-
|
||||
.dashboard .tile .tile-path {
|
||||
font-family: ui-monospace, SFMono-Regular, monospace;
|
||||
font-size: 0.78em;
|
||||
/* Long dot-separated slugs (dev.youpc.kommentar.knowledge-tools)
|
||||
are unbreakable by default — let them wrap at any character so
|
||||
they don't widen the tile. */
|
||||
overflow-wrap: anywhere;
|
||||
min-width: 0;
|
||||
}
|
||||
.dashboard .tile .tile-live {
|
||||
font-size: 0.72em; padding: 1px 6px; border-radius: 999px;
|
||||
@@ -567,12 +581,14 @@ table.bulk .chip-add-btn:hover { background: var(--accent); color: var(--accent-
|
||||
.dashboard .card-stale { grid-column: span 2; }
|
||||
}
|
||||
|
||||
/* Phase 5h — Tiles grid breakpoints (1/2/3 cols at 600/900/—). */
|
||||
/* Phase 5h — Tiles grid breakpoints (1/2/3 cols at 600/900/—).
|
||||
minmax(0, 1fr) on every breakpoint so long unbreakable strings
|
||||
(slug-paths, task summaries) don't push columns past the viewport. */
|
||||
@media (min-width: 600px) {
|
||||
.dashboard .dash-tiles { grid-template-columns: 1fr 1fr; }
|
||||
.dashboard .dash-tiles { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
|
||||
}
|
||||
@media (min-width: 900px) {
|
||||
.dashboard .dash-tiles { grid-template-columns: 1fr 1fr 1fr; }
|
||||
.dashboard .dash-tiles { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
|
||||
}
|
||||
|
||||
/* Graph fit-to-screen toggle (Phase 3i): when ".fit" is on the canvas,
|
||||
|
||||
Reference in New Issue
Block a user