From 943ee062fe2c0344165e28f4d612176878159133 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Mon, 21 Jul 2025 16:03:52 +0200 Subject: Consolidating button, action-button and badge; change design to have some 3D components --- src/objects/_alert.scss | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) (limited to 'src/objects/_alert.scss') diff --git a/src/objects/_alert.scss b/src/objects/_alert.scss index 825f7ce..de0e913 100644 --- a/src/objects/_alert.scss +++ b/src/objects/_alert.scss @@ -14,12 +14,26 @@ padding-block: props.get(vars.$pad-b); padding-inline: props.get(vars.$pad-i); background-color: props.get(vars.$bg-color); - border: props.get(vars.$border-width) solid props.get(vars.$border-color); + border: props.get(vars.$border-width) solid transparent; + border-color: props.get(vars.$border-color); border-radius: props.get(vars.$rounding); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$shadow-color); @each $mod, $theme in vars.$themes-config { @include bem.modifier($mod) { + background-color: props.get(vars.$themes, $theme, --bg-color); border-color: props.get(vars.$themes, $theme, --border-color); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$themes, $theme, --shadow-color); } } } -- cgit v1.3.1