Figures have a few different node structures; make them all lay out correctly

This commit is contained in:
Eryn Wells 2024-10-26 08:31:50 -06:00
parent 4a6dd87603
commit d7353308fa

View file

@ -9,6 +9,8 @@
.figure {
grid-column: wide-gutter-start / wide-gutter-end;
display: grid;
grid-template-columns: subgrid;
.figure__container {
align-items: center;
@ -19,12 +21,17 @@
min-width: fit-content;
}
&:has(img:only-of-type) {
&:has(> img:only-child, .figure__container > img:only-child) {
display: flex;
justify-content: center;
}
> a:has(img:only-child) {
grid-column: wide-gutter-start / wide-gutter-end;
}
}
.figure--code {
grid-column: gutter-start / gutter-end;
}
@ -47,6 +54,6 @@ figcaption {
color: var(--text-color-secondary);
font-weight: normal;
font-size: var(--text-xs);
grid-column: main-start / main-end;
letter-spacing: 0.01em;
grid-column: main-start / main-end;
}