Misc structure styles

This commit is contained in:
Eryn Wells 2024-07-23 09:13:03 -07:00
parent 1925a0109f
commit bccadced1b

View file

@ -7,6 +7,7 @@
/************************* /*************************
# CONTENT AREA STRUCTURE # CONTENT AREA STRUCTURE
************************/ ************************/
@ -44,29 +45,47 @@ body {
.body__container, .body__container,
.site-header, .site-header,
main .main--list,
.main--single,
article.content
{ {
display: grid; display: grid;
grid-template-columns: subgrid; grid-template-columns: subgrid;
grid-column: full-start / full-end; grid-column: full-start / full-end;
} }
.body__container { .main--list {
gap: var(--space-xl) 0; .page-header,
} .main--list__content,
.main--list__page-list
.site-header__content,
.site-footer
{ {
grid-column: main-start / main-end; grid-column: main-start / main-end;
} }
{{- $wideElements := "figure, pre" -}} .page-header,
.main--list__content
{
margin-block-end: var(--space-xl);
}
}
.body__container > :not({{ $wideElements }}) { .body__container {
gap: var(--space-xl) 0;
}
.site-header__content {
grid-column: main-start / main-end; grid-column: main-start / main-end;
} }
.body__container > :is(figure, pre) {
:is(.list-header, p) {
grid-column: main-start / main-end;
}
article.content > :not(figure, pre) {
grid-column: main-start / main-end;
}
article.content > :is(.figure--image, pre) {
grid-column: wide-gutter-start / wide-gutter-end; grid-column: wide-gutter-start / wide-gutter-end;
} }