kw/verdande
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(notes): match the note-list headers to the new heading design

Browse Source 
The note list still wore the old faint-uppercase group header beside the
sidebar's bold plain-case one, so the two columns read as two apps. The
group headers are bold, plainly cased and in the reading ink now, at
menu size, and their separator boxes carry the same rounded corner as an
active menu item — the hard rule underneath is gone, the box is the
separation. The disclosure mark stays: unlike a sidebar section, a
time-group has no icon, so it is the only thing that says "this folds".

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
kristianwind
2026-09-03 14:22:19 +02:00
co-authored by Claude Opus 4.8
parent f89fb21502
commit e1683ef09d
7 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/routes/noter/+page.svelte
+15 -7
View File
@@ -1367,30 +1367,37 @@
*
* Baggrunden er ikke gennemsigtig. En klæbende overskrift uden en er en
* overskrift med rækkerne kørende igennem sig. */
/* One design with the sidebar headings: a rounded box, the same corner as an
active menu item, filled just enough to separate one group of notes from the
next. The hard rule underneath is gone — the box is the separation now. */
h3.group {
position: sticky;
top: 0;
z-index: 1;
margin: 0;
margin: 0 0 var(--s1);
background: var(--ground);
border-bottom: 1px solid var(--line);
border-radius: var(--radius);
}
/* Bold and plainly cased, in the reading ink — the faint uppercase label read as
a different app's heading beside the sidebar's. Menu size, so the two tiers of
heading in front of the eye at once are the same size. */
h3.group button {
display: flex;
align-items: center;
gap: var(--s2);
width: 100%;
padding: var(--s2) var(--s2);
font-size: var(--text-xs);
font-size: var(--menu-size);
font-weight: 600;
letter-spacing: 0.07em;
text-transform: uppercase;
color: var(--ink-faint);
letter-spacing: normal;
text-transform: none;
color: var(--ink);
border-radius: var(--radius);
}
h3.group button:hover {
color: var(--ink-muted);
background: var(--surface-sunken);
}
h3.group .mark {
@@ -1419,6 +1426,7 @@
margin-left: auto;
font-weight: 500;
letter-spacing: 0;
color: var(--ink-muted);
}
/* Stregen mellem rækkerne er væk.