68 lines
1.1 KiB
SCSS
68 lines
1.1 KiB
SCSS
// 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);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|