Files
sage/resources/styles/global/_typography.scss
2024-11-05 17:19:47 +00:00

138 lines
1.6 KiB
SCSS

.wysiwyg {
*:first-child {
margin-top: 0;
}
*:last-child {
margin-bottom: 0;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: $primary;
font-weight: 700;
font-family: $font;
line-height: 1.1em;
margin: 1.5em 0 0.25em;
padding: 0;
&.section-title {
margin-top: 0;
}
@media screen {
.knockout & {
color: $white;
}
}
}
h1 {
font-size: 1.75em;
margin-top: 0;
}
h2 { font-size: 1.5em; }
h3 { font-size: 1.25em; }
h4,
h5 { font-size: 1.15em; }
@media (min-width: $screen-sm) {
h1 { font-size: 2.5em; }
h2 { font-size: 2em; }
h3 { font-size: 1.5em; }
h4,
h5 {
font-size: 1.25em;
}
}
p,
li,
td,
label {
color: $grey;
font-family: $font;
font-weight: 400;
line-height: 1.5em;
margin: 0 0 0.8em;
padding: 0;
@media screen {
.knockout & {
color: $white;
}
}
}
a {
color: $primary;
text-decoration: none;
outline: none;
transition: all 300ms ease;
&:hover,
&:focus {
color: $primary-dark;
text-decoration: none;
}
@media screen {
.knockout & {
color: $white;
&:hover,
&:focus {
color: $primary-light;
}
}
}
}
strong { font-weight: 700; }
small { font-size: 0.8em; }
li {
margin: 0.125em 0;
line-height: 1.5em;
}
ul,
ol {
margin: 0 0 0.7em;
padding: 0 0 0 1.2em;
text-align: left;
}
.nolist {
margin: 0;
padding: 0;
text-align: inherit;
list-style: none;
li {
margin: 0;
padding: 0;
}
}
hr {
margin: 1.5em auto 2em;
height: 0;
border: 0 solid $grey-light;
border-width: $borderThin 0 0;
@media screen {
.knockout & {
border-color: $white;
}
}
}