104 lines
1.8 KiB
SCSS
104 lines
1.8 KiB
SCSS
@use '../mixins' as *;
|
|
|
|
body {
|
|
@include font-sans;
|
|
@include font-normal;
|
|
@include leading-normal;
|
|
}
|
|
|
|
/////////////
|
|
// HEADINGS
|
|
/////////////
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h5,
|
|
h6 {
|
|
@include text-primary;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
h1 {
|
|
@include font-hed;
|
|
@include text-3xl;
|
|
@include leading-none;
|
|
margin-block-start: calc(var(--theme-font-size-base) * 1.5);
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.75);
|
|
}
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
@include font-subhed;
|
|
@include leading-tighter;
|
|
margin-block-start: calc(var(--theme-font-size-base) * 1.5);
|
|
}
|
|
h2 {
|
|
@include text-xl;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.75);
|
|
}
|
|
h3 {
|
|
@include text-lg;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.625);
|
|
}
|
|
h4 {
|
|
@include text-base;
|
|
@include text-secondary;
|
|
@include tracking-wider;
|
|
text-transform: uppercase;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.5);
|
|
}
|
|
h5 {
|
|
@include text-sm;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.375);
|
|
}
|
|
h6 {
|
|
@include text-sm;
|
|
@include font-normal;
|
|
text-transform: uppercase;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 0.375);
|
|
}
|
|
|
|
//////////////
|
|
// Body text
|
|
//////////////
|
|
|
|
%body-type-block {
|
|
display: block;
|
|
margin-block-start: 0px;
|
|
margin-block-end: calc(var(--theme-font-size-base) * 1.125);
|
|
margin-inline-start: 0px;
|
|
margin-inline-end: 0px;
|
|
@include font-body;
|
|
@include text-base;
|
|
@include font-normal;
|
|
@include leading-normal;
|
|
@include text-primary;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
p {
|
|
@extend %body-type-block;
|
|
}
|
|
|
|
ol,
|
|
ul {
|
|
@extend %body-type-block;
|
|
padding-left: 2rem;
|
|
ol,
|
|
ul {
|
|
margin-block-end: 0;
|
|
}
|
|
}
|
|
|
|
a {
|
|
color: inherit;
|
|
text-decoration: underline;
|
|
text-underline-offset: 2px;
|
|
text-underline-offset: 8%;
|
|
}
|
|
|
|
strong {
|
|
@include font-bold;
|
|
}
|