stwaidele/dorfteich
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases 22 Wiki Activity

#137 Fix: Checkbox-Ausrichtung (:first-of-type statt :first-child) #139

Merged
fable-5 merged 2 commits from fix-137-checkbox into main 2026-07-19 11:25:15 +02:00
Conversation 0 Commits 2 Files Changed 1 +20 -8
1 changed files with 20 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
apps/web/src/styles/base.css
View File

@ -72,6 +72,12 @@ button {
padding: 0 var(--space-4);
border-bottom: 1px solid var(--color-border);
background: var(--color-bg);
/* Own stacking context above the scrolling `.main` content: the nav comes
before `.app-body` in the DOM, so without this the sticky editor toolbar
(z-index 20 inside `.main`) paints over the nav's overflow "…" menu, hiding
its entries. 30 > the toolbar's 20; modals (1100+) still win. */
position: relative;
z-index: 30;
}
.topbar__brand {
@ -1076,10 +1082,13 @@ button {
padding: var(--space-2) var(--space-3);
border-bottom: 1px solid var(--color-border);
background: var(--color-bg-subtle);
/* Long articles: the toolbar pins to the top of the scrolling content
area instead of scrolling away. */
/* Long articles: the toolbar pins to the top of the scrolling content area
instead of scrolling away. The scroll container `.main` has a top padding
(`--space-6`); a plain `top: 0` would stick the toolbar at that padding
edge, leaving a visible gap below the nav. Offset by `-1 * --space-6` so it
pins flush against the navigation, with no scrolling page showing through. */
position: sticky;
top: 0;
top: calc(-1 * var(--space-6));
z-index: 20;
}
@ -1616,20 +1625,23 @@ ul[data-type='task_list'] li {
/* The checkbox is the top flex child; nudge it onto the first text line and
drop the leading/trailing margins of the item's paragraph so the text meets
the checkbox instead of dropping a line. Covers both DOM shapes: read-mode
`li > input` + `li > p`, and editor `li > label > input` + `li > div > p`. */
`li > input` + `li > p`, and editor `li > label > input` + `li > div > p`.
Uses `:first-of-type`/`:last-of-type` (NOT `:first-child`): in the read-mode
markup the `<input>` is the first child, so the paragraph is never
`:first-child` and a `:first-child` reset would silently miss (issue #137). */
ul[data-type='task_list'] li > input[type='checkbox'],
ul[data-type='task_list'] li > label {
flex: none;
margin-top: 0.25em;
}
ul[data-type='task_list'] li > p:first-child,
ul[data-type='task_list'] li > div > p:first-child {
ul[data-type='task_list'] li > p:first-of-type,
ul[data-type='task_list'] li > div > p:first-of-type {
margin-top: 0;
}
ul[data-type='task_list'] li > p:last-child,
ul[data-type='task_list'] li > div > p:last-child {
ul[data-type='task_list'] li > p:last-of-type,
ul[data-type='task_list'] li > div > p:last-of-type {
margin-bottom: 0;
}