From 1e902449652213eb1feae5e61740cb9ce3b9d6e3 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 22 Jun 2024 10:39:48 +0200 Subject: WIP: Refactoring --- src/scopes/_code.scss | 59 ++++++++++++++++++++++++++++++++++++++++++++++++++ src/scopes/_links.scss | 5 +++-- 2 files changed, 62 insertions(+), 2 deletions(-) create mode 100644 src/scopes/_code.scss (limited to 'src/scopes') diff --git a/src/scopes/_code.scss b/src/scopes/_code.scss new file mode 100644 index 0000000..a6905a3 --- /dev/null +++ b/src/scopes/_code.scss @@ -0,0 +1,59 @@ +@use 'iro-sass/src/index' as iro; +@use '../functions' as fn; + +@include iro.props-namespace('code') { + @include iro.props-store(( + --dims: ( + --inline: ( + --pad-i: fn.global-dim(--size --50), + --pad-b: fn.global-dim(--size --10), + --rounding: fn.global-dim(--rounding), + ), + --block: ( + --pad-i: fn.global-dim(--size --150), + --pad-b: fn.global-dim(--size --85), + --margin-bs: fn.global-dim(--paragraph --margin-bs), + --rounding: fn.global-dim(--rounding), + ) + ), + --colors: ( + --inline: ( + --fg: fn.global-color(--red --1100), + --bg: fn.global-color(--red --200), + ), + --block: ( + --fg: fn.global-color(--text), + --bg: fn.global-color(--bg-l2), + ) + ) + )); + + @include iro.bem-scope(iro.props-namespace()) { + code { + padding-block: fn.dim(--inline --pad-b); + padding-inline: fn.dim(--inline --pad-i); + border-radius: fn.dim(--inline --rounding); + background-color: fn.color(--inline --bg); + color: fn.color(--inline --fg); + } + + pre { + margin-block: fn.dim(--block --margin-bs) 0; + margin-inline: 0; + padding-block: fn.dim(--block --pad-b); + padding-inline: fn.dim(--block --pad-i); + border-radius: fn.dim(--block --rounding); + background-color: fn.color(--block --bg); + color: fn.color(--block --fg); + + code { + display: inline-block; + margin-inline-end: fn.dim(--block --pad-i); + padding: 0; + border-radius: 0; + background-color: transparent; + color: currentColor; + } + } + } +} diff --git a/src/scopes/_links.scss b/src/scopes/_links.scss index 115b199..d0c47ef 100644 --- a/src/scopes/_links.scss +++ b/src/scopes/_links.scss @@ -15,7 +15,7 @@ --idle: ( --text: fn.global-color(--accent --1000), - --underline: fn.global-color(--accent --700), + --underline: fn.global-color(--accent --1000), --hover: ( --text: fn.global-color(--accent --1200), @@ -24,7 +24,7 @@ --visited: ( --text: fn.global-color(--purple --1000), - --underline: fn.global-color(--purple --700), + --underline: fn.global-color(--purple --1000), --hover: ( --text: fn.global-color(--purple --1200), @@ -50,6 +50,7 @@ &:hover { text-decoration: underline; text-decoration-thickness: fn.dim(--hover --underline); + text-decoration-skip-ink: none; } @include iro.bem-at-theme('keyboard') { -- cgit v1.2.3-70-g09d2