diff --git a/apps/web/src/styles/base.css b/apps/web/src/styles/base.css index 43a6602..a491c3d 100644 --- a/apps/web/src/styles/base.css +++ b/apps/web/src/styles/base.css @@ -1616,20 +1616,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 `` 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; }