refactor: improve heading layout

This commit is contained in:
Cotes Chung 2024-08-25 00:12:00 +08:00
parent 80bd7928a0
commit 707a209424
No known key found for this signature in database
GPG key ID: 0D9E54843167A808
2 changed files with 15 additions and 17 deletions

View file

@ -42,20 +42,29 @@ body {
@extend %heading; @extend %heading;
@if $i > 1 { @if $i > 1 {
@extend %section;
@extend %anchor; @extend %anchor;
} }
@if $i < 5 { @if $i < 5 {
$factor: 0.18rem; $size-factor: 0.25rem;
@if $i == 1 { @if $i > 1 {
$factor: 0.23rem; $size-factor: 0.18rem;
main & {
@if $i == 2 {
margin: 2.5rem 0 1.25rem;
} @else {
margin: 2rem 0 1rem;
}
}
} }
font-size: 1rem + (5 - $i) * $factor; & {
font-size: 1rem + (5 - $i) * $size-factor;
}
} @else { } @else {
font-size: 1rem; font-size: 1.05rem;
} }
} }
} }

View file

@ -10,17 +10,6 @@
font-family: $font-family-heading; font-family: $font-family-heading;
} }
%section {
main & {
margin-top: 2.5rem;
margin-bottom: 1.25rem;
&:focus {
outline: none; /* avoid outline in Safari */
}
}
}
%anchor { %anchor {
.anchor { .anchor {
font-size: 80%; font-size: 80%;