109 lines
1.2 KiB
SCSS
109 lines
1.2 KiB
SCSS
/*
|
|
* Typography
|
|
* @see https://designsystem.digital.gov/components/typography/
|
|
* @source https://github.com/uswds/uswds/blob/develop/src/stylesheets/elements/_typography.scss
|
|
*/
|
|
|
|
* {
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
p {
|
|
margin: 0 0 ($gap * 2) 0;
|
|
|
|
&.centered {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
font-family: $font-sans;
|
|
margin: ($gap * 2) 0;
|
|
|
|
.subtitle,
|
|
+ .subtitle {
|
|
color: $color-gray;
|
|
}
|
|
|
|
+ .subtitle,
|
|
* {
|
|
margin-top: 0;
|
|
}
|
|
|
|
em {
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
.h1 {
|
|
@include h1;
|
|
}
|
|
|
|
.h2 {
|
|
@include h2;
|
|
}
|
|
|
|
.h3 {
|
|
@include h3;
|
|
}
|
|
|
|
.h4 {
|
|
@include h4;
|
|
}
|
|
|
|
.h5 {
|
|
@include h5;
|
|
}
|
|
|
|
.h6 {
|
|
@include h6;
|
|
}
|
|
|
|
a,
|
|
a:hover {
|
|
transition: background 0.2s, border 0.2s, box-shadow 0.2s, color 0.2s;
|
|
}
|
|
|
|
a:visited {
|
|
color: $color-blue;
|
|
}
|
|
|
|
dl {
|
|
dt {
|
|
display: inline;
|
|
font-weight: bold;
|
|
}
|
|
|
|
dd {
|
|
-webkit-margin-start: 0;
|
|
margin-inline-start: 0;
|
|
margin-left: 0;
|
|
|
|
.label {
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
|
|
> div {
|
|
margin-bottom: $gap * 2;
|
|
}
|
|
}
|
|
|
|
@mixin small-label {
|
|
font-size: $h6-font-size;
|
|
font-weight: $font-bold;
|
|
color: $color-black;
|
|
}
|
|
|
|
@mixin small-copy {
|
|
font-size: $small-font-size;
|
|
}
|