Move image styles from componets to base.

This commit is contained in:
Fredrik Jonsson 2023-11-14 17:32:01 +01:00
commit f13595fad3
2 changed files with 7 additions and 76 deletions

View file

@ -5,5 +5,6 @@
@import 'forms/forms';
@import 'grouping/grouping';
@import 'headings/headings';
@import 'images/images';
@import 'links/links';
@import 'tables/tables';

View file

@ -0,0 +1,74 @@
// Figure and image.
figure,
img {
&.image {
--padding: .75rem;
@include respond-to(s) {
&.center {
margin-inline: auto;
}
&.left {
padding-inline-end: var(--padding);
padding-block-end: var(--padding);
margin: 0;
float: left;
clear: both;
}
&.right {
padding-inline-start: var(--padding);
padding-block-end: var(--padding);
margin: 0;
float: right;
clear: both;
}
}
}
}
figure {
&.image {
--padding: .75rem;
figcaption {
padding-block-start: var(--padding);
@include respond-to(s) {
display: table-caption;
caption-side: bottom;
padding-block-start: 0;
}
p {
margin: 0;
}
}
@include respond-to(s) {
display: table;
&.left {
figcaption {
padding-inline-end: var(--padding);
padding-block-end: var(--padding);
}
}
&.right {
figcaption {
padding-inline-start: var(--padding);
padding-block-end: var(--padding);
}
}
}
}
&.podcast {
audio {
width: 95%;
}
}
}