benstull/rfc-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(slice3): faceted catalog pane gated on collection fields (§22.4a §5.1)

Browse Source
This commit is contained in:
Ben Stull
2026-06-07 17:40:29 -07:00
parent ae083bfcaa
commit ae3afe2f48
2 changed files with 123 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/App.css
+33
View File
@@ -150,6 +150,39 @@
.row-title { font-size: var(--text-base); margin-top: 2px; }
.catalog-row.is-super .row-title { color: var(--c-gray-500); }
.row-tags { font-size: var(--text-xs); color: var(--c-gray-500); margin-top: 2px; }
.row-malformed { font-size: var(--text-2xs); color: var(--c-warning-accent); font-weight: 600; }
/* §22.4a SLICE-3 — faceted left-pane filters (§5.1). */
.facets {
padding: 8px 14px;
border-bottom: 1px solid var(--c-gray-150);
}
.facet-group { margin-bottom: 8px; }
.facet-header {
background: none; border: 0; cursor: pointer; width: 100%; text-align: left;
font-size: var(--text-xs); font-weight: 700; color: var(--c-gray-600);
text-transform: uppercase; letter-spacing: 0.04em; padding: 4px 0;
}
.facet-values { display: flex; flex-direction: column; gap: 2px; }
.facet-value {
display: flex; align-items: center; gap: 6px;
font-size: var(--text-xs); color: var(--c-gray-600); cursor: pointer;
}
.facet-value-label { flex: 1; }
.facet-count { color: var(--c-gray-500); font-variant-numeric: tabular-nums; }
.facet-value-search {
width: 100%; margin: 4px 0; font-size: var(--text-xs);
padding: 2px 6px; border: 1px solid var(--c-gray-150); border-radius: var(--radius-sm);
}
.facet-clear {
background: none; border: 0; cursor: pointer; padding: 0 0 6px;
font-size: var(--text-xs); color: var(--c-ink); text-decoration: underline;
}
.facet-empty { font-size: var(--text-xs); color: var(--c-gray-500); }
.facet-malformed {
display: flex; align-items: center; gap: 6px; margin-top: 6px;
font-size: var(--text-xs); color: var(--c-warning-accent); cursor: pointer;
}
.catalog-pending {
border-top: 1px solid var(--c-gray-150);