From 67722515b4882458547bcbe8ac13e60ba3790a56 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Fri, 11 Feb 2022 17:34:57 +0100 Subject: Added backdrop and dialog --- src/objects/_backdrop.scss | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) create mode 100644 src/objects/_backdrop.scss (limited to 'src/objects/_backdrop.scss') diff --git a/src/objects/_backdrop.scss b/src/objects/_backdrop.scss new file mode 100644 index 0000000..bc63a27 --- /dev/null +++ b/src/objects/_backdrop.scss @@ -0,0 +1,36 @@ +@use 'iro-sass/src/index' as iro; +@use '../functions' as fn; + +@include iro.props-namespace('backdrop') { + @include iro.props-store(( + --dims: ( + --z-index: 10000, + --pad-x: iro.fn-px-to-rem(14px), + --pad-y: iro.fn-px-to-rem(60px), + ), + ), 'dims'); + + @include iro.props-store(( + --colors: ( + --bg: rgba(#000, .3), + ), + ), 'colors'); + + @include iro.props-store(( + --dims: ( + --pad-y: iro.fn-px-to-rem(30px), + ) + ), 'sm'); + + @include iro.bem-object(iro.props-namespace()) { + position: fixed; + z-index: fn.dim(--z-index); + top: 0; + right: 0; + bottom: 0; + left: 0; + box-sizing: border-box; + padding: fn.dim(--pad-y) fn.dim(--pad-x); + background-color: fn.color(--bg); + } +} -- cgit v1.2.3-70-g09d2