Large inline margins and small text. No more italics. I think this is easier to read and more consistent with the surrounding text.
80 lines
1 KiB
CSS
80 lines
1 KiB
CSS
|
|
|
|
|
|
|
|
|
|
/*******
|
|
* LISTS
|
|
*******/
|
|
|
|
dl,
|
|
ol,
|
|
ul
|
|
{
|
|
grid-column: main-start / main-end;
|
|
margin-block: 0;
|
|
}
|
|
|
|
|
|
ol {
|
|
display: grid;
|
|
grid-template-columns: min-content 1fr;
|
|
list-style: none;
|
|
padding-inline-start: 0;
|
|
|
|
&:not([start]) {
|
|
counter-reset: list-item 1;
|
|
}
|
|
|
|
&[start] {
|
|
counter-reset: list-item attr(start integer);
|
|
}
|
|
|
|
li {
|
|
display: grid;
|
|
gap: 1ch;
|
|
grid-column: 1 / -1;
|
|
grid-template-columns: subgrid;
|
|
|
|
/* TODO: Figure out support for <li value="42"> */
|
|
|
|
&:not([value]) {
|
|
counter-increment: list-item;
|
|
}
|
|
|
|
&::before {
|
|
content: counter(list-item) ".";
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
ul {
|
|
list-style-type: "*";
|
|
padding-inline-start: 1ch;
|
|
|
|
li {
|
|
padding-inline-start: 1ch;
|
|
}
|
|
}
|
|
|
|
|
|
li {
|
|
&::marker, &::before {
|
|
color: var(--text-color-secondary);
|
|
font-family: var(--font-family-monospace);
|
|
}
|
|
}
|
|
|
|
|
|
dl {
|
|
dd {
|
|
color: var(--text-color-secondary);
|
|
font-size: var(--text-s);
|
|
margin-inline: var(--space-l);
|
|
|
|
&:has(+ dt) {
|
|
margin-block-end: var(--space-paragraph);
|
|
}
|
|
}
|
|
}
|