Deprecate sass spacing mixin, use css variables --spacing-x instead.

This commit is contained in:
Fredrik Jonsson 2025-03-27 14:59:46 +01:00
commit 73a555446b
5 changed files with 41 additions and 33 deletions

View file

@ -2,13 +2,13 @@
form {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
}
input,
textarea,
select {
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
}
label {

View file

@ -12,7 +12,7 @@
blockquote {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
// Also indent the quote on both sides.
@ -28,7 +28,7 @@ ol,
ul,
menu {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
}
dt {
@ -76,7 +76,7 @@ hr {
p {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
@ -90,7 +90,7 @@ p {
pre {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
font-family: var(--ff-monospace);
}

View file

@ -15,7 +15,7 @@ h5,
%h5,
h6,
%h6 {
@include margin-block(1 .33, 'em');
margin-block: 1.5em .5em;
color: var(--color-headings);
font-family: var(--ff-headings);
font-weight: var(--fw-headings);
@ -24,7 +24,7 @@ h6,
// Smaller margin when a headeing is right after another heading.
& + & {
@include margin-block-start(.5, 'em');
margin-block-start: .75em
}
// Set max text line width in main for readability.
@ -36,7 +36,8 @@ h6,
h1,
%h1 {
// h1 only on top of page so different margins.
@include margin-block(1 .5, 'rem');
margin-block-start: var(--spacing-m);
margin-block-end: var(--spacing-xs);
font-size: var(--fs-xxl);
letter-spacing: -.01em;
}

View file

@ -31,7 +31,7 @@ img {
figure {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
&.image {
figcaption {
@ -81,6 +81,6 @@ figure {
img {
&.image {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
}
}

View file

@ -4,7 +4,7 @@
table {
// Add vertical rhythm margins.
@include margin-block(0 1);
margin-block: 0 var(--spacing-m);
// Remove default spacing between table cells.
border-collapse: collapse;
// Prevent cramped-looking tables