update prose / figcaption styles

This commit is contained in:
madrilene 2025-01-09 14:04:21 +01:00
parent 43d97641c0
commit ce5326dfe8
2 changed files with 16 additions and 12 deletions

View file

@ -105,6 +105,14 @@ a:hover {
text-decoration: none;
}
figcaption {
margin-block-start: var(--space-s);
font-size: var(--size-step-min-1);
text-align: center;
padding-block-end: var(--space-xs);
border-bottom: 1px solid var(--color-bg-accent);
}
:focus-visible {
outline: 3px solid;
outline-offset: 0.3ch;

View file

@ -5,27 +5,23 @@
--wrapper-width: 64rem;
}
.prose :where(pre, pre + *, figure, figure + *) {
.prose :is(pre, pre + *, figure, picture) {
--flow-space: var(--space-m-l);
}
.prose figcaption {
font-size: var(--size-step-min-1);
text-align: center;
padding-block-end: var(--space-xs);
margin-block-end: var(--space-s);
border-bottom: 1px solid var(--color-bg-accent);
}
:where(.prose :is(h2, h3, h4)) {
.prose :is(figure + *, picture + *) {
--flow-space: var(--space-xl);
}
:where(.prose :is(h2 + *, h3 + *, h4 + *):not(figure)) {
.prose :is(h2, h3, h4) {
--flow-space: 2em;
}
.prose :is(h2 + *, h3 + *, h4 + *):not(figure) {
--flow-space: var(--space-m);
}
.prose .heading-anchor:is(:hover, :focus) {
.prose .heading-anchor:where(:hover, :focus) {
text-decoration: none;
}