130 lines
1.5 KiB
SCSS
130 lines
1.5 KiB
SCSS
// Typography
|
|
// Headings
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
color: inherit;
|
|
font-weight: 500;
|
|
line-height: 1.2;
|
|
margin-bottom: .5em;
|
|
margin-top: 0;
|
|
}
|
|
.h1,
|
|
.h2,
|
|
.h3,
|
|
.h4,
|
|
.h5,
|
|
.h6 {
|
|
font-weight: 500;
|
|
}
|
|
h1,
|
|
.h1 {
|
|
font-size: 2rem;
|
|
}
|
|
h2,
|
|
.h2 {
|
|
font-size: 1.6rem;
|
|
}
|
|
h3,
|
|
.h3 {
|
|
font-size: 1.4rem;
|
|
}
|
|
h4,
|
|
.h4 {
|
|
font-size: 1.2rem;
|
|
}
|
|
h5,
|
|
.h5 {
|
|
font-size: 1rem;
|
|
}
|
|
h6,
|
|
.h6 {
|
|
font-size: .8rem;
|
|
}
|
|
|
|
// Paragraphs
|
|
p {
|
|
margin: 0 0 $line-height;
|
|
}
|
|
|
|
// Semantic text elements
|
|
a,
|
|
ins,
|
|
u {
|
|
text-decoration-skip: ink edges;
|
|
}
|
|
|
|
abbr[title] {
|
|
border-bottom: $border-width dotted;
|
|
cursor: help;
|
|
text-decoration: none;
|
|
}
|
|
|
|
kbd {
|
|
@include label-base();
|
|
@include label-variant($light-color, $dark-color);
|
|
font-size: $font-size-sm;
|
|
}
|
|
|
|
mark {
|
|
@include label-variant($body-font-color, $highlight-color);
|
|
border-bottom: $unit-o solid darken($highlight-color, 15%);
|
|
border-radius: $border-radius;
|
|
padding: $unit-o $unit-h 0;
|
|
}
|
|
|
|
// Blockquote
|
|
blockquote {
|
|
border-left: $border-width-lg solid $border-color;
|
|
margin-left: 0;
|
|
padding: $unit-2 $unit-4;
|
|
|
|
p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
// Lists
|
|
ul,
|
|
ol {
|
|
margin: $unit-4 0 $unit-4 $unit-4;
|
|
padding: 0;
|
|
|
|
ul,
|
|
ol {
|
|
margin: $unit-4 0 $unit-4 $unit-4;
|
|
}
|
|
|
|
li {
|
|
margin-top: $unit-2;
|
|
}
|
|
}
|
|
|
|
ul {
|
|
list-style: disc inside;
|
|
|
|
ul {
|
|
list-style-type: circle;
|
|
}
|
|
}
|
|
|
|
ol {
|
|
list-style: decimal inside;
|
|
|
|
ol {
|
|
list-style-type: lower-alpha;
|
|
}
|
|
}
|
|
|
|
dl {
|
|
dt {
|
|
font-weight: bold;
|
|
}
|
|
dd {
|
|
margin: $unit-2 0 $unit-4 0;
|
|
}
|
|
}
|