From 6376f1a5225b2fa45f6c861d4a265bf13b56d038 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 29 Jun 2024 10:01:02 +0200 Subject: Update --- src/.old/objects/_list-group.scss | 61 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 src/.old/objects/_list-group.scss (limited to 'src/.old/objects/_list-group.scss') diff --git a/src/.old/objects/_list-group.scss b/src/.old/objects/_list-group.scss new file mode 100644 index 0000000..a346828 --- /dev/null +++ b/src/.old/objects/_list-group.scss @@ -0,0 +1,61 @@ +@use 'iro-sass/src/index' as iro; +@use '../functions' as fn; + +@include iro.props-namespace('list-group') { + @include iro.props-store(( + --dims: ( + --pad-i: fn.global-dim(--size --175), + --pad-b: fn.global-dim(--size --125), + --rounding: fn.global-dim(--rounding), + --border: fn.global-dim(--border --thin), + ), + --colors: ( + --bg: fn.global-color(--base --75), + --border: fn.global-color(--border), + --hover: fn.global-color(--border-mute), + --active: fn.global-color(--border), + ) + )); + + @include iro.bem-object(iro.props-namespace()) { + border: fn.dim(--border) solid fn.color(--border); + border-radius: fn.dim(--rounding); + background-color: fn.color(--bg); + + @include iro.bem-elem('item') { + padding-block: fn.dim(--pad-b); + padding-inline: fn.dim(--pad-i); + + @include iro.bem-next-twin-elem { + border-width: 0; + border-block-start-width: fn.dim(--border); + border-style: solid; + border-color: fn.color(--border); + } + + @include iro.bem-multi('&:link, &:visited, &:enabled', 'modifier' 'interactive') { + &:hover, + &:focus-visible { + background-color: fn.color(--hover); + } + + &:active { + background-color: fn.color(--active); + } + } + } + + @include iro.bem-modifier('horizontal') { + display: flex; + + @include iro.bem-elem('item') { + flex: 1 0 auto; + + @include iro.bem-next-twin-elem { + border-block-start-width: 0; + border-inline-start-width: fn.dim(--border); + } + } + } + } +} -- cgit v1.2.3-54-g00ecf