Draw only one hash for headings, and place them in the gutter in wide layouts, or trailing the heading text in narrow layouts. Do this with grid in the wide version, and flexbox in the narrow layout. Add a --text-color-light CSS variable for content that should be lighter than --text-color-secondary.
28 lines
469 B
CSS
28 lines
469 B
CSS
|
|
.main--single,
|
|
.main--list,
|
|
.content
|
|
{
|
|
blockquote,
|
|
dl,
|
|
ol,
|
|
ul,
|
|
.footnotes
|
|
{
|
|
grid-column: main-start / main-end;
|
|
}
|
|
|
|
.codeblock {
|
|
color: var(--foreground);
|
|
background-color: var(--background);
|
|
border: 1px solid var(--gray6);
|
|
font-family: var(--font-family-monospace);
|
|
grid-column: gutter-start / gutter-end;
|
|
overflow: auto;
|
|
padding-block: var(--space-s);
|
|
|
|
.line {
|
|
margin-inline: var(--gutter-width);
|
|
}
|
|
}
|
|
}
|