Hynes/Void-Homelab
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(sacred-valley): masonry card layout — content-height row spans + dense flow

Browse Source 
Cards keep their column span but now span grid rows proportional to
measured content height (ResizeObserver re-packs async cards), with
grid-auto-flow: dense. Fixes mismatched sizes / rigid rows / vertical gaps.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
root
2026-06-09 18:58:24 +10:00
parent 25ac261862
commit e8f655ed27
4 changed files with 24 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/style.css
View File

@@ -382,7 +382,7 @@ ul.plain li:last-child { border-bottom: none; }
/* reserved for a future agent-output phase — unused now:
--hue-dross: #ff4f2e; --hue-yerin: #c45a4a; --hue-orthos: #6fa86a; */
}
#sv-cards { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; align-items: start; }
#sv-cards { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; align-items: start; grid-auto-rows: 8px; grid-auto-flow: row dense; }
.sv-card { grid-column: span 6; } /* fallback; svCard sets an inline span (1–12) */
@media (max-width: 700px) { #sv-cards { grid-template-columns: 1fr; } .sv-card { grid-column: 1 / -1 !important; } }
.sv-ed-span { display: inline-flex; align-items: center; gap: 3px; }