bdeshiandClaude Opus 5
69f43e5791
ADR-0058 kept task lists out as "a note-taking affordance, not a publishing one". That reasoning measured the wrong axis: a checklist inside a published technical piece — setup steps, a runbook, a what-I-tried list — is publishing, and nothing else in the dialect expresses "this item is done" without the author hand-writing an entity. ADR-0078 supersedes that half and records why. The half of ADR-0058 that mattered is untouched: extension.GFM stays refused, because the bundle drags linkify in with the tables it is wanted for, and linkify rewrites an author's plain text into markup — the line ADR-0034 draws. One named extension is not a bundle, and wire.go now says so where the temptation to reach for GFM will next appear. ADR-0058's Status line names its successor, so a reader arriving there learns the task-list sentence no longer holds. Same in-place Status annotation the mutability rule allows, Decision text untouched. Checkboxes render disabled: static markup, nothing clickable, nothing stored. A reader with scripting off sees the same page, which is the property the whole theme is built on. goldmark adds no class to the list, so theme.css finds it with :has rather than the engine inventing markup to be styled by. Demo carries the case ADR-0051 requires — a colophon checklist of what this build does and does not do, including the unticked "ship a single byte of JavaScript", which is true of that page and asserted by the test's absent list. No counter moves: state.md's counters are explicit that an upstream extension enabled in the list is dialect, not a feature of this engine — only a package under internal/ext/ counts. 8 files, +55/-10. 1 line of engine code. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
73 lines
4.2 KiB
CSS
73 lines
4.2 KiB
CSS
/* Reference theme: legibility only, no design opinions (ADR-0026). */
|
|
html { font-family: Georgia, serif; line-height: 1.6; color: #1a1a1a; background: #fdfdfb; }
|
|
main { max-width: 34rem; margin: 3rem auto; padding: 0 1rem; }
|
|
h1, h2, h3 { line-height: 1.25; font-weight: 600; text-wrap: balance; }
|
|
/* Line breaking belongs to the browser, which knows the line box no engine-side guess can see (ADR-0045). */
|
|
p, li, figcaption { text-wrap: pretty; }
|
|
a { color: #1a4d7a; }
|
|
img { max-width: 100%; height: auto; }
|
|
pre, code { font-family: ui-monospace, monospace; font-size: 0.9em; }
|
|
pre { overflow-x: auto; padding: 0.75rem; background: #f3f2ee; }
|
|
/* Enough structure to read the demonstration; a real theme starts over (ADR-0026). */
|
|
header, footer { max-width: 34rem; margin: 1.5rem auto; padding: 0 1rem; font-size: 0.9em; }
|
|
header .site { font-weight: 600; margin: 0 0 0.25rem; }
|
|
nav.sections a, nav.languages a, nav.tags a { margin-right: 0.75rem; }
|
|
nav.sequence, nav.ends { display: flex; gap: 1rem; justify-content: space-between; margin: 1.5rem 0; }
|
|
ul.extras, ol.archive { padding-left: 1.25rem; }
|
|
/* A task list is an ordinary <ul> whose items open with a checkbox — goldmark adds no class, so `:has` is
|
|
how a theme recognises one without the engine inventing markup for it (ADR-0078). A bullet beside a box
|
|
says the same thing twice. */
|
|
ul:has(> li > input[type="checkbox"]) { list-style: none; padding-left: 0; }
|
|
li > input[type="checkbox"] { margin-right: 0.4em; }
|
|
.kind { color: #6b6b6b; font-size: 0.85em; }
|
|
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 0.75rem; }
|
|
.gallery figure { margin: 0; }
|
|
table { border-collapse: collapse; display: block; overflow-x: auto; }
|
|
th, td { border-bottom: 1px solid #d8d5cd; padding: 0.35rem 0.75rem 0.35rem 0; text-align: left; }
|
|
dt { font-weight: 600; margin-top: 0.75rem; }
|
|
dd { margin-left: 1.25rem; }
|
|
.footnotes { font-size: 0.9em; }
|
|
.admonition { border-left: 3px solid #d8d5cd; border-radius: 0; padding: 0.25rem 0 0.25rem 1rem; margin: 1.5rem 0; }
|
|
.admonition-title { font-weight: 600; margin: 0 0 0.5rem; }
|
|
details { margin: 1rem 0; }
|
|
summary { cursor: pointer; font-weight: 600; }
|
|
aside.side { border-left: 3px solid #d8d5cd; border-radius: 0; padding: 0 0 0 1rem; margin: 1.5rem 0; font-size: 0.95em; }
|
|
.side-title { font-weight: 600; margin: 0 0 0.5rem; }
|
|
@media (min-width: 55rem) { aside.side { float: right; width: 12rem; margin: 0.25rem 0 1rem 1.5rem; } }
|
|
mark { background: #fbf1a9; color: #16161a; padding: 0 0.15em; }
|
|
figure.code { margin: 1.5rem 0; }
|
|
figure.code figcaption { font-size: 0.85em; color: #6b6b6b; padding-bottom: 0.25rem; }
|
|
.chroma { overflow-x: auto; padding: 0.75rem; background: #f3f2ee; }
|
|
.chroma .lnt { color: #9a9a9a; padding-right: 0.75rem; user-select: none; }
|
|
.chroma .hl { background: #e6e3d8; display: block; }
|
|
.chroma .k, .chroma .kd, .chroma .kn { color: #7a3e9d; }
|
|
.chroma .s, .chroma .s1, .chroma .s2 { color: #2a6b2a; }
|
|
.chroma .c, .chroma .c1, .chroma .cm { color: #6b6b6b; font-style: italic; }
|
|
.chroma .m, .chroma .mi, .chroma .mf { color: #a0522d; }
|
|
.chroma .nf, .chroma .nx { color: #1a4d7a; }
|
|
.chroma .nt, .chroma .nb { color: #8a5a00; }
|
|
nav.toc { border-top: 1px solid #d8d5cd; border-bottom: 1px solid #d8d5cd; padding: 0.5rem 0; margin: 1.5rem 0; font-size: 0.95em; }
|
|
nav.toc ol { list-style: none; padding-left: 0; margin: 0; }
|
|
.toc-title { font-weight: 600; margin: 0 0 0.35rem; }
|
|
nav.toc .toc-3 { padding-left: 1rem; }
|
|
nav.toc .toc-4 { padding-left: 2rem; }
|
|
@media (prefers-color-scheme: dark) {
|
|
html { color: #e8e6e1; background: #16161a; }
|
|
a { color: #8ab4dd; }
|
|
pre { background: #22222a; }
|
|
.kind { color: #9a9a9a; }
|
|
th, td { border-bottom-color: #33333c; }
|
|
.admonition, aside.side { border-left-color: #33333c; }
|
|
mark { background: #5d5320; color: #f2efe6; }
|
|
nav.toc { border-color: #33333c; }
|
|
figure.code figcaption { color: #9a9a9a; }
|
|
.chroma { background: #22222a; }
|
|
.chroma .hl { background: #2f2f3a; }
|
|
.chroma .k, .chroma .kd, .chroma .kn { color: #c8a0e8; }
|
|
.chroma .s, .chroma .s1, .chroma .s2 { color: #9ed49e; }
|
|
.chroma .c, .chroma .c1, .chroma .cm { color: #8a8a8a; }
|
|
.chroma .m, .chroma .mi, .chroma .mf { color: #e0a878; }
|
|
.chroma .nf, .chroma .nx { color: #8ab4dd; }
|
|
.chroma .nt, .chroma .nb { color: #d8b46a; }
|
|
}
|