gnosis-css/css/scss/bootstrap/_typography.scss
2024-05-28 11:11:00 +00:00

68 lines
1.2 KiB
SCSS

%heading {
margin-top: 0; // 1
margin-bottom: .25em;
font-family: $headings-font-family;
font-optical-sizing: auto;
font-style: $headings-font-style;
font-weight: $headings-font-weight;
color: var(--#{$prefix}heading-color);
}
a {
color: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-opacity, 1));
text-decoration: $link-decoration;
text-underline-offset: 0.25rem;
text-decoration-thickness: 2px;
&:hover {
--#{$prefix}link-color-rgb: var(--#{$prefix}link-hover-color-rgb);
text-decoration: $link-hover-decoration;
}
}
h1 {
@extend %heading;
@include font-size($h1-font-size);
line-height: 1.48;
}
h2 {
@extend %heading;
@include font-size($h2-font-size);
line-height: 1.5;
}
h3 {
@extend %heading;
@include font-size($h3-font-size);
line-height: 1.52;
}
h4 {
@extend %heading;
@include font-size($h4-font-size);
line-height: 1.5;
}
h5 {
@extend %heading;
@include font-size($h5-font-size);
line-height: 1.5;
}
h6 {
@extend %heading;
@include font-size($h6-font-size);
line-height: 1.52;
}
p {
max-width: 80ch;
}
.alternative {
font-family: $display-font-family;
line-height: 1.1;
font-weight: 500;
font-size: 21px;
}