Repository navigation
Task lists: the checkbox replaces the bullet, per item (#892) - #1191
Merged
Merged
Conversation
…y (bd-2ydvebkc) Triage record and repro under claude-notes/issue-reports/892/, plus a survey of how ~20 markdown renderers/SSGs emit and style task lists. Root cause: the Quarto 1 styles.html list-style:none rule was never ported to the Q2 HTML pipeline. Related: bd-nnvvomg6 (loose list items lose <p>). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…ydvebkc)
Task items in q2 render and q2 preview showed both the list bullet and the
checkbox: Q2 never ported the `list-style: none` rule Quarto 1 gets from its
patched pandoc styles.html. Following the ecosystem survey
(claude-notes/issue-reports/892/survey.md) the marker is now hidden per item
rather than per list, so task items in mixed lists lose their bullet too.
- HTML writer + q2-preview: every task <li> carries class="task-list-item"
(additive; ul.task-list keeps Pandoc's all-items rule). Static checkboxes
are `disabled` (edit surfaces keep enabled, toggleable ones). Fixes a
hoisted item attr (`- [ ] x {.c}`) being dropped on task items.
- SCSS: hide the marker on li.task-list-item and hang the checkbox into the
marker gutter (text aligns with plain items); ordered task items keep
their number unless a theme sets `$task-list-ordered-markers: false`
(HTML and revealjs).
- Grammar/reader: an empty task item (`- [ ] `, what a user has typed just
before the text) is a task item, `Plain [Str "☐"]` as in Pandoc, instead
of a parse error; the qmd writer round-trips it. Regenerated parser.c and
the pampa parse-error table (_autogen-table.json: state renumbering only).
- q2-preview: the incremental (reveal) <ol> path renders task checkboxes
like the <ul> path.
- Docs: task lists in the markdown basics guide; the theme variable in the
HTML themes guide.
Tests: tree-sitter corpus (2 new), pampa test_task_list (5 new, 3
updated), quarto-sass (3 new, 1 updated), preview-renderer integration (2
new, 3 extended), hub-client e2e q2-preview-task-list (computed
list-style-type and checkbox/text geometry). No insta .snap files changed;
the phase5 baseline styles.css hash is re-captured (CSS-only change, doc.html
unchanged).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…ebkc) Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Contributor
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #892.
Problem
Task-list items in
q2 renderandq2 previewshowed both the list bullet and the checkbox. Quarto 1 hides the bullet with aul.task-list { list-style: none }rule from its patched Pandocstyles.htmltemplate. Q2 never ported that rule. It only ported the two_quarto-rules.scssrules.Approach
Before choosing a fix, the triage surveyed about 20 markdown renderers and SSGs (
claude-notes/issue-reports/892/survey.md, summary intriage.md). Nearly every renderer that ships CSS hides the marker per item. Pandoc, and therefore Quarto 1, hides it per list, so a mixed list still shows a bullet next to the checkbox. We follow the ecosystem. The design decisions are recorded intriage.md§ Decisions:class="task-list-item"to every task<li>. The class is additive, andul.task-listkeeps Pandoc's rule that every item must be a task.li.task-list-itemand hangs the checkbox into the marker's gutter, so task text lines up with plain items.$task-list-ordered-markerstheme variable is an escape hatch: set it tofalsein a theme'sscss:defaultslayer. It works in both the HTML and revealjs themes and is documented in the themes guide.- [ ]is a task item. This is what a user has just typed in the collaborative editor. It used to be a parse error. The grammar now accepts it, the reader produces Pandoc'sPlain [Str "☐"], and the qmd writer round-trips it.- [ ]with no trailing space is still an ordinary item, as in GFM.disabled. Edit surfaces keep enabled, toggleable checkboxes.Other fixes found along the way
- [ ] todo {.c}) was dropped on task items. The writer now splits the attribute off before rewriting the task item.<ol>path in q2-preview didn't render task checkboxes. It now matches the<ul>path.Review notes
parser.candgrammar.jsonare regenerated.crates/pampa/resources/error-corpus/_autogen-table.jsonis regenerated withbuild_error_table.ts; parser state numbers shifted, and every table entry maps one-to-one onto a new state..snapfiles changed. Thestyles.csshash in the phase5 single-doc baseline was re-captured: this is a CSS-only change,doc.htmlis unchanged, and the reason is noted in the file.<p>in loose list items that hold a single paragraph. This is general Pandoc parity work and also affects loose task lists.Tests
test_task_list: 5 new, 3 updated (markup, empty item, attribute composition, qmd round-trip).custom.scss, revealjs), 1 updated.q2-preview-task-list.spec.ts(Chromium, real q2-preview iframe):<li>computeslist-style-type: none;<li>box, and the text starts within 2px of the<li>content edge;cargo xtask verify(full) passes locally.End-to-end check (inspected):
q2 renderonclaude-notes/issue-reports/892/repro.qmdemits<li class="task-list-item"><label><input type="checkbox" disabled="" />task</label></li>next to<li>plain item</li>. The compiled CSS containsul>li.task-list-item{list-style-type:none}and the hang rulemargin:0 .4em .2em -1.2em.🤖 Generated with Claude Code