diff --git a/TODO.md b/TODO.md index 6f782c6..066509b 100644 --- a/TODO.md +++ b/TODO.md @@ -63,6 +63,12 @@ - [ ] Verify TCP reachability from XAMXAM VM to LDAP server (port 636) - [ ] See `docs/LDAP_AUTH_PLAN.md` for full phase-by-phase plan +## Répertoire layout + +- [x] Make column headings sticky/non-scrollable; only `ul` scrolls per column +- [x] Remove padding from `.search-main` and `.repertoire-index` +- [x] Minimal horizontal padding inside columns (`var(--space-2xs)`) + ## CSS refactor - [x] Move semantic HTML element baseline styles into common.css diff --git a/app/public/assets/css/repertoire.css b/app/public/assets/css/repertoire.css index ef7c518..2424cfb 100644 --- a/app/public/assets/css/repertoire.css +++ b/app/public/assets/css/repertoire.css @@ -8,6 +8,7 @@ flex: 1; min-height: 0; overflow: hidden; + padding: 0; } /* ---- 6-column index layout ---- */ @@ -15,14 +16,14 @@ display: grid; grid-template-columns: 0.7fr 1.2fr 1.4fr 0.9fr 1.4fr 1fr; gap: 0; - padding: 0 var(--space-m); + padding: 0; height: 100%; } @media (max-width: 1024px) { .repertoire-index { grid-template-columns: 1fr 1fr 1fr; - padding: 0 var(--space-s); + padding: 0; min-height: auto; } @@ -38,14 +39,13 @@ @media (max-width: 600px) { .repertoire-index { grid-template-columns: 1fr; - padding: 0 var(--space-s); + padding: 0; min-height: auto; } .repertoire-col { border-right: none; border-bottom: 1px solid var(--border-primary); - padding: var(--space-s) 0 var(--space-m); } .repertoire-col:last-child { @@ -54,32 +54,40 @@ } .repertoire-col { - padding: var(--space-xs) var(--space-2xs) var(--space-l); - overflow-y: auto; - overflow-x: hidden; + display: flex; + flex-direction: column; + padding: 0; + overflow: hidden; } -.repertoire-col:last-child { - border-right: none; -} - -.repertoire-index section > h2 { +.repertoire-col > h2 { + flex-shrink: 0; font-family: var(--font-display); font-size: var(--step--2); letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-secondary); font-weight: 400; - margin: 0 0 var(--space-2xs) 0; - padding-bottom: var(--space-3xs); + margin: 0; + padding: var(--space-xs) var(--space-2xs) var(--space-3xs); border-bottom: 1px solid var(--border-secondary); } +.repertoire-col > ul { + flex: 1; + overflow-y: auto; + overflow-x: hidden; + padding: var(--space-2xs) var(--space-2xs) var(--space-l); +} + +.repertoire-col:last-child { + border-right: none; +} + /* Strip list chrome inside repertoire columns */ .repertoire-col ul { list-style: none; margin: 0; - padding: 0; } /* ---- rep-entry: shared base (button + link variants) ---- */