Files

100 lines
1.5 KiB
SCSS

@import "../../globals.core";
// Typography
// --------------------------------------------------
// All font sizes use rem units
// By default, 1rem equals 10px. For example, 1.4rem === 14px
// $font-size-root value, which is on the <html> element
// is what can scale all fonts
$font-size-root: 62.5% !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
$h1-font-size: 2.6rem !default;
$h2-font-size: 2.4rem !default;
$h3-font-size: 2.2rem !default;
$h4-font-size: 2.0rem !default;
$h5-font-size: 1.8rem !default;
$h6-font-size: 1.6rem !default;
html {
font-size: $font-size-root;
}
a {
background-color: transparent;
}
.enable-hover a:hover {
opacity: 0.7;
}
h1, h2, h3, h4, h5, h6 {
font-weight: $headings-font-weight;
line-height: $headings-line-height;
margin-top: 1.6rem;
margin-bottom: 1rem;
}
[padding] {
h1, h2, h3, h4, h5, h6 {
&:first-child {
margin-top: -0.3rem;
}
}
}
h1 + h2,
h1 + h3,
h2 + h3 {
margin-top: -0.3rem;
}
h1 {
font-size: $h1-font-size;
margin-top: 2rem;
}
h2 {
font-size: $h2-font-size;
margin-top: 1.8rem;
}
h3 {
font-size: $h3-font-size;
}
h4 {
font-size: $h4-font-size;
}
h5 {
font-size: $h5-font-size;
}
h6 {
font-size: $h6-font-size;
}
small {
font-size: 75%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}