You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
2.1 KiB
SCSS
120 lines
2.1 KiB
SCSS
// @font-face definitions
|
|
@include -cdd-font-face('Input Sans Narrow', 'input-sans-narrow-regular', normal, normal);
|
|
@include -cdd-font-face('Input Sans Narrow', 'input-sans-narrow-italic', normal, italic);
|
|
@include -cdd-font-face('Input Sans Narrow', 'input-sans-narrow-bold', bold, normal);
|
|
@include -cdd-font-face('Input Serif Narrow', 'input-serif-narrow-bold', bold, normal);
|
|
|
|
:root {
|
|
font-size: 112.5%;
|
|
line-height: 1.7;
|
|
font-family: "Input Sans Narrow", Tahoma, Helvetica, sans-serif;
|
|
word-spacing: -0.1em;
|
|
|
|
// Make everything slightly smaller on small screens
|
|
@media (max-width: 30em) {
|
|
font-size: 100%;
|
|
}
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
font-family: "Input Serif Narrow", "Hoefler Text", Palatino, serif;
|
|
line-height: 1.35;
|
|
text-rendering: optimizeLegibility;
|
|
|
|
margin-top: 1.3em;
|
|
margin-bottom: 0.9em;
|
|
|
|
@media print {
|
|
page-break-after: avoid;
|
|
}
|
|
}
|
|
h1 {
|
|
font-size: -cdd-rem(36);
|
|
}
|
|
h2 {
|
|
font-size: -cdd-rem(27);
|
|
}
|
|
h3 {
|
|
font-size: -cdd-rem(20);
|
|
|
|
margin-bottom: 0.6em;
|
|
}
|
|
h4 {
|
|
font-size: -cdd-rem(18);
|
|
}
|
|
h5 {
|
|
font-size: -cdd-rem(18);
|
|
font-variant: small-caps;
|
|
}
|
|
h6 {
|
|
font-size: -cdd-rem(14);
|
|
text-transform: uppercase;
|
|
|
|
margin-top: 1.6em;
|
|
}
|
|
|
|
a {
|
|
transition: color 0.2s ease;
|
|
|
|
&:link, &:visited {
|
|
text-decoration: none;
|
|
color: $color--brand-primary;
|
|
}
|
|
&:hover, &:focus, &:active {
|
|
color: $color--brand-primary-alternate;
|
|
}
|
|
}
|
|
|
|
hr {
|
|
height: 0;
|
|
margin-top: 2em;
|
|
margin-bottom: 2em;
|
|
|
|
border-top: -cdd-rem(2) solid $color--passive;
|
|
|
|
@media print {
|
|
page-break-after: avoid;
|
|
}
|
|
}
|
|
|
|
small {
|
|
font-size: -cdd-rem(14);
|
|
}
|
|
|
|
// Content within Kirbytext
|
|
.text {
|
|
&-container {
|
|
@include container--text;
|
|
}
|
|
|
|
p:not(:last-child), ul:not(:last-child),
|
|
ol:not(:last-child), blockquote:not(:last-child) {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
ul, ol {
|
|
padding-left: 40px;
|
|
}
|
|
ul li {
|
|
list-style: disc;
|
|
}
|
|
ol li {
|
|
list-style: decimal;
|
|
}
|
|
li:not(:last-child) {
|
|
margin-bottom: 0.1em;
|
|
}
|
|
|
|
a:visited {
|
|
color: $color--brand-primary-alternate;
|
|
}
|
|
|
|
blockquote {
|
|
padding: 0.5em 1em;
|
|
|
|
background: $color--passive-light;
|
|
border-left: 0.7em solid $color--passive;
|
|
border-radius: 0 0.3em 0.3em 0;
|
|
}
|
|
}
|