131 lines
2.5 KiB
CSS
131 lines
2.5 KiB
CSS
/* =========================
|
|
Local Fonts
|
|
========================= */
|
|
|
|
/* OSWALD */
|
|
@font-face {
|
|
font-family: 'Oswald';
|
|
src: url('../fonts/oswald-400.woff2') format('woff2');
|
|
font-weight: 400;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Oswald';
|
|
src: url('../fonts/oswald-500.woff2') format('woff2');
|
|
font-weight: 500;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Oswald';
|
|
src: url('../fonts/oswald-700.woff2') format('woff2');
|
|
font-weight: 700;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
/* ROBOTO */
|
|
@font-face {
|
|
font-family: 'Roboto';
|
|
src: url('../fonts/roboto-400.woff2') format('woff2');
|
|
font-weight: 400;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Roboto';
|
|
src: url('../fonts/roboto-500.woff2') format('woff2');
|
|
font-weight: 500;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Roboto';
|
|
src: url('../fonts/roboto-700.woff2') format('woff2');
|
|
font-weight: 700;
|
|
font-stretch: 100%;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
|
|
/* =========================
|
|
Typography System (Static)
|
|
========================= */
|
|
|
|
:root {
|
|
--primary-font: 'Oswald', var(--zeitfresser-heading-fallback);
|
|
--secondary-font: 'Roboto', sans-serif;
|
|
|
|
--site-identity-font-size: 40px;
|
|
|
|
--font-weight: 400;
|
|
--line-height: 1.6;
|
|
}
|
|
|
|
|
|
/* =========================
|
|
Base Typography
|
|
========================= */
|
|
|
|
body,
|
|
p,
|
|
div,
|
|
span,
|
|
article,
|
|
section,
|
|
li,
|
|
input,
|
|
textarea,
|
|
button {
|
|
font-family: var(--secondary-font);
|
|
font-weight: var(--font-weight);
|
|
line-height: var(--line-height);
|
|
}
|
|
|
|
|
|
/* =========================
|
|
Headlines (Hierarchy Fix)
|
|
========================= */
|
|
|
|
h1, h2, h3, h4, h5, h6,
|
|
.entry-title {
|
|
font-family: var(--primary-font);
|
|
font-weight: 500;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
|
|
/* =========================
|
|
Site Title (Branding)
|
|
========================= */
|
|
|
|
.site-title,
|
|
.site-title a {
|
|
font-family: var(--primary-font);
|
|
font-size: var(--site-identity-font-size);
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
|
|
/* =========================
|
|
Secondary Text
|
|
========================= */
|
|
|
|
.site-description,
|
|
.entry-content,
|
|
.news-snippet .excerpt {
|
|
font-family: var(--secondary-font);
|
|
}
|