From 50f6acc739f24bfa2ca080d08e90d82f8fa83543 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Thu, 17 Oct 2024 16:45:00 +0200 Subject: Revamped variable management --- src_old/objects/_popover.scss | 51 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 51 insertions(+) create mode 100644 src_old/objects/_popover.scss (limited to 'src_old/objects/_popover.scss') diff --git a/src_old/objects/_popover.scss b/src_old/objects/_popover.scss new file mode 100644 index 0000000..5ad58ec --- /dev/null +++ b/src_old/objects/_popover.scss @@ -0,0 +1,51 @@ +@use 'iro-sass/src/index' as iro; +@use '../functions' as fn; + +@include iro.props-namespace('popover') { + @include iro.props-store(( + --dims: ( + --z-index: 10000, + --pad-i: 0, + --pad-b: fn.global-dim(--size --85), + --separator: fn.global-dim(--size --85), + --rounding: fn.global-dim(--rounding), + --border: fn.global-dim(--border --thin), + ), + --colors: ( + --bg: fn.global-color(--bg-l2), + --border: fn.global-color(--border), + --filter: drop-shadow( + fn.global-dim(--shadow --x) + fn.global-dim(--shadow --y) + fn.global-dim(--shadow --blur) + fn.global-color(--shadow) + ), + ), + )); + + @include iro.bem-object(iro.props-namespace()) { + position: absolute; + z-index: fn.dim(--z-index); + inset-block-start: 0; + inset-inline-start: 0; + padding-block: fn.dim(--pad-b); + padding-inline: fn.dim(--pad-i); + transform: translate(var(--x), var(--y)); + border: fn.dim(--border) solid fn.color(--border); + border-radius: fn.dim(--rounding); + background-color: fn.color(--bg); + filter: fn.color(--filter); + + @include iro.bem-modifier('up-left') { + transform: translate(var(--x), calc(var(--y) - 100%)); + } + + @include iro.bem-modifier('up-right') { + transform: translate(calc(var(--x) - 100%), calc(var(--y) - 100%)); + } + + @include iro.bem-modifier('down-right') { + transform: translate(calc(var(--x) - 100%), var(--y)); + } + } +} -- cgit v1.2.3-70-g09d2