From 89c6b5be8f9be7fc2ed1a6b927c440baed38cb44 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Wed, 28 Apr 2021 20:31:37 +0200 Subject: Update --- assets/css/_vars.scss | 4 ++-- assets/css/scopes/_body.scss | 40 ++++++++++++++++++++++++++++------------ content/symbols.svg | 2 +- templates/layouts/page.html | 2 +- 4 files changed, 32 insertions(+), 16 deletions(-) diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index 2ab5efd..1123862 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss @@ -13,8 +13,8 @@ $unit-intervals: ( ); $responsive-mod-scale: ( - xs: (.5rem, 1.4), - md: (.5rem, 1.6) + xs: (.8rem, 1.4), + md: (.8rem, 1.6) ); $font-fam--text: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif; diff --git a/assets/css/scopes/_body.scss b/assets/css/scopes/_body.scss index f725b0a..0a22828 100644 --- a/assets/css/scopes/_body.scss +++ b/assets/css/scopes/_body.scss @@ -1,11 +1,11 @@ @include namespace('body') { - @include scope(namespace()) { - > :first-child { - //margin-top: 0; - } - } -} -@include namespace('body') { + @include store(( + --colors: ( + --emph-fg: prop(--colors --accent --color, $global: true), + --emph-bg: prop(--colors --bg-hi, $global: true) + ) + )); + @include scope(namespace()) { font-size: 1 / 16 * 18em; @@ -31,29 +31,45 @@ } h1 { - @include iro-responsive-modular-scale(font-size, 4, $responsive-mod-scale); + @include iro-responsive-modular-scale(font-size, 3, $responsive-mod-scale); } h2 { - @include iro-responsive-modular-scale(font-size, 3, $responsive-mod-scale); + @include iro-responsive-modular-scale(font-size, 2, $responsive-mod-scale); } h3 { - @include iro-responsive-modular-scale(font-size, 2, $responsive-mod-scale); + @include iro-responsive-modular-scale(font-size, 1, $responsive-mod-scale); - letter-spacing: .1em; + letter-spacing: .05em; text-transform: uppercase; } h4, h5, h6 { - @include iro-responsive-modular-scale(font-size, 1, $responsive-mod-scale); + @include iro-responsive-modular-scale(font-size, 0, $responsive-mod-scale); letter-spacing: .1em; text-transform: uppercase; } + h5, + h6 { + color: currentColor; + font-weight: 400; + } + + @include element('title-inner') { + background-image: linear-gradient( + to top, + transparent .15em, + #{prop(--colors --emph-bg)} .15em, + #{prop(--colors --emph-bg)} .6em, + transparent .6em + ); + } + img { max-width: 100%; } diff --git a/content/symbols.svg b/content/symbols.svg index acc7f4f..00ea701 100644 --- a/content/symbols.svg +++ b/content/symbols.svg @@ -51,7 +51,7 @@ diff --git a/templates/layouts/page.html b/templates/layouts/page.html index b6ff7c3..bccdeae 100644 --- a/templates/layouts/page.html +++ b/templates/layouts/page.html @@ -1,6 +1,6 @@
-

$title$

+

$title$

$body$
-- cgit v1.2.3-70-g09d2