hugo-theme-termlite/assets/css/050_figures.css
Eryn Wells e1ad32ab12 Add styles for youtube figures
Bring over the youtube shortcode from the old theme, and add styles for the figures
it creates. Add the .figure--youtube class to the <figure> element.
2024-10-08 22:24:39 -07:00

40 lines
606 B
CSS

/**********
* FIGURES
**********/
.figure--image {
display: grid;
grid-column: wide-gutter-start / wide-gutter-end;
grid-template-columns: subgrid;
img {
grid-column: wide-gutter-start / wide-gutter-end;
}
}
.figure--youtube {
grid-column: main-start / main-end;
.youtube {
width: 100%;
iframe {
aspect-ratio: 16 / 9;
margin-bottom: -3px;
width: 100%;
}
}
}
figcaption {
color: var(--text-color-secondary);
font-weight: normal;
font-size: var(--text-xs);
letter-spacing: 0.01em;
grid-column: main-start / main-end;
}