diff --git a/src/css/base/elements.css b/src/css/base/elements.css index d3748852424..718fa29a041 100644 --- a/src/css/base/elements.css +++ b/src/css/base/elements.css @@ -38,7 +38,7 @@ h4, h5, h6 { font-family: var(--font-family-head); - letter-spacing: 0.04em; + letter-spacing: -0.04em; line-height: 1.05; & a { @@ -67,7 +67,7 @@ a { outline: 0; color: var(--color-accent); text-decoration: none; - transition-property: color; + transition-property: color, background; transition-duration: var(--transition-duration-fast); &.plain { @@ -130,6 +130,8 @@ img:-moz-loading { background-color: var(--color-accent); text-decoration: none; border-radius: var(--space-m); + transition-property: color, background; + transition-duration: var(--transition-duration-fast); &:hover { @media not all and (hover: none) { diff --git a/src/css/base/fonts.css b/src/css/base/fonts.css index 023fdd2c6e8..7e4abd33560 100644 --- a/src/css/base/fonts.css +++ b/src/css/base/fonts.css @@ -2,3 +2,18 @@ font-family: 'The Bold Font'; src: url('../fonts/theboldfont.woff2') format('woff2'); } + +/* https://google-webfonts-helper.herokuapp.com/fonts/noto-sans?subsets=cyrillic,cyrillic-ext,latin */ +@font-face { + font-family: 'Noto Sans'; + font-style: normal; + font-weight: 400; + src: url('../fonts/noto-sans-400.woff2') format('woff2'); +} + +@font-face { + font-family: 'Noto Sans'; + font-style: normal; + font-weight: 700; + src: url('../fonts/noto-sans-700.woff2') format('woff2'); +} diff --git a/src/css/base/variables.css b/src/css/base/variables.css index 74cd16f998f..c0a73decc09 100644 --- a/src/css/base/variables.css +++ b/src/css/base/variables.css @@ -31,12 +31,10 @@ --transition-duration-medium: 0.75s; --transition-duration-slow: 1.5s; - --font-family-base: sans-serif; - --font-family-head: 'The Bold Font', var(--font-family-base); + --font-family-base: 'Noto Sans', sans-serif; + --font-family-head: var(--font-family-base); - --font-weight-light: 300; --font-weight-normal: 400; - --font-weight-medium: 500; --font-weight-bold: 700; --font-size-base: 18px; diff --git a/src/css/sections/podcast.css b/src/css/sections/podcast.css index e6c26af8060..b9755564f4a 100644 --- a/src/css/sections/podcast.css +++ b/src/css/sections/podcast.css @@ -13,7 +13,7 @@ display: inline-block; text-align: center; padding: var(--space-s) var(--space-l); - color: var(--color-neutral-0); + color: var(--color-secondary); text-decoration: none; border-radius: var(--space-xl); border: 1px solid var(--color-secondary); @@ -106,7 +106,7 @@ & h3 { margin-top: var(--space-s); font-family: var(--font-family-base); - font-weight: var(--font-weight-medium); + font-weight: var(--font-weight-bold); font-size: var(--font-size-m); line-height: 1.2; } diff --git a/src/includes/template.pug b/src/includes/template.pug index 2bfc5882b59..81847a71ec0 100644 --- a/src/includes/template.pug +++ b/src/includes/template.pug @@ -31,7 +31,8 @@ html(lang="en") meta(property="twitter:image" content=assetUrl(pageCard)) meta(name="msapplication-TileColor" content=themeColor) meta(name="theme-color" content=themeColor) - link(rel="preload" as="font" crossorigin href=assetPath("/fonts/theboldfont.woff2")) + link(rel="preload" as="font" crossorigin href=assetPath("/fonts/noto-sans-400.woff2")) + link(rel="preload" as="font" crossorigin href=assetPath("/fonts/noto-sans-700.woff2")) link(rel="apple-touch-icon" href=assetPath("/img/einundzwanzig-square.svg")) link(rel="icon" href=assetPath("/img/einundzwanzig-square.svg")) link(rel="manifest" href="/site.webmanifest") diff --git a/src/index.pug b/src/index.pug index 670dc99d9ee..c137ecf9fa2 100644 --- a/src/index.pug +++ b/src/index.pug @@ -2,8 +2,7 @@ extends /template.pug block main section + .lead.centered :markdown-it(html linkify typographer) - # Start - Content - - [Shoutouts](https://tallyco.in/s/zfxqtu/) + a.button(href="https://t.me/einundzwanzigpodcast") Komm in die Gruppe! diff --git a/static/fonts/noto-sans-400.woff2 b/static/fonts/noto-sans-400.woff2 new file mode 100644 index 00000000000..b97dce06f4f Binary files /dev/null and b/static/fonts/noto-sans-400.woff2 differ diff --git a/static/fonts/noto-sans-700.woff2 b/static/fonts/noto-sans-700.woff2 new file mode 100644 index 00000000000..3bd0b602f4a Binary files /dev/null and b/static/fonts/noto-sans-700.woff2 differ