From 8eecc3db90b8963cf3d85d2d144c2a38aa3f86a0 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 13 Nov 2021 12:09:34 +0100 Subject: Simplified header --- assets/css/_basics.scss | 2 +- assets/css/_vars.scss | 2 +- assets/css/components/_header.scss | 17 ++++++----------- assets/css/scopes/_body.scss | 10 +--------- 4 files changed, 9 insertions(+), 22 deletions(-) (limited to 'assets/css') diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss index 09b9585..ec1a07a 100644 --- a/assets/css/_basics.scss +++ b/assets/css/_basics.scss @@ -37,7 +37,7 @@ body { main { @include iro-responsive-env(('sm', 'md')) { - font-size: iro-responsive-set((1rem, 1 / 16 * 19rem)); + font-size: iro-responsive-set((1rem, 1 / 16 * 18rem)); } } diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index eea1764..ca7abd3 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss @@ -22,7 +22,7 @@ $font-fam--large: 'Garet', $font-fam--text; $font-fam--mono: 'Iosevka Term SS09', 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace; $font-size: 16px; $line-height: 1.7; -$content--width: 46rem; +$content--width: 42rem; @include iro-execute { $gray0: hsl(220, 5%, 7%); diff --git a/assets/css/components/_header.scss b/assets/css/components/_header.scss index 1a10345..341be75 100644 --- a/assets/css/components/_header.scss +++ b/assets/css/components/_header.scss @@ -1,9 +1,8 @@ @include namespace('header') { @include store(( --colors: ( - --bg: prop(--colors --bg-lo, $global: true), - --fg: prop(--colors --fg-lo, $global: true), - --border: prop(--colors --bg, $global: true), + --bg: prop(--colors --bg-lo, $global: true), + --fg: prop(--colors --fg-lo, $global: true), --hover: ( --bg: prop(--colors --fg-lo, $global: true), --fg: prop(--colors --bg-hi, $global: true), @@ -26,13 +25,9 @@ ), 'light'); @include component(namespace()) { - height: prop(--dims --height); - - @include element('nav') { - display: inline-flex; - height: 100%; - box-shadow: prop(--dims --obj-shadow, $global: true) prop(--colors --obj-shadow, $global: true); - } + display: flex; + height: prop(--dims --height); + filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); @include element('item') { padding: 0 prop(--dims --pad-x); @@ -43,7 +38,7 @@ transition: background-color .2s, color .2s, border-left-color .2s; @include next-twin-element { - border-left: 1px solid prop(--colors --border); + margin-left: 2px; } &:hover, diff --git a/assets/css/scopes/_body.scss b/assets/css/scopes/_body.scss index 6abaeb0..1de4dc5 100644 --- a/assets/css/scopes/_body.scss +++ b/assets/css/scopes/_body.scss @@ -9,7 +9,7 @@ --fg: prop(--colors --accent --strong, $global: true), --bg: prop(--colors --bg-hi, $global: true), ), - --obj-border: prop(--colors --obj, $global: true), + --obj-border: prop(--colors --obj-hi, $global: true), ), --dims: ( --meta: ( @@ -67,13 +67,5 @@ background-color: transparent; color: currentColor; } - - @include media('<=sm') { - font-size: 1 / 16 * 17em; - } - - @include media('<=xs') { - font-size: 1em; - } } } -- cgit v1.2.3-54-g00ecf