diff options
Diffstat (limited to 'src/objects/_popover.scss')
-rw-r--r-- | src/objects/_popover.scss | 62 |
1 files changed, 31 insertions, 31 deletions
diff --git a/src/objects/_popover.scss b/src/objects/_popover.scss index 4356dff..2746477 100644 --- a/src/objects/_popover.scss +++ b/src/objects/_popover.scss | |||
@@ -7,39 +7,39 @@ | |||
7 | @use 'popover.vars' as vars; | 7 | @use 'popover.vars' as vars; |
8 | 8 | ||
9 | @mixin styles { | 9 | @mixin styles { |
10 | @include materialize-at-root(meta.module-variables('vars')); | 10 | @include materialize-at-root(meta.module-variables('vars')); |
11 | 11 | ||
12 | @include bem.object('popover') { | 12 | @include bem.object('popover') { |
13 | position: fixed; | 13 | position: fixed; |
14 | inset-block-start: 0; | 14 | inset-block-start: 0; |
15 | inset-inline-start: 0; | 15 | inset-inline-start: 0; |
16 | z-index: props.get(vars.$z-index); | 16 | z-index: props.get(vars.$z-index); |
17 | padding-block: props.get(vars.$pad-b); | 17 | padding-block: props.get(vars.$pad-b); |
18 | padding-inline: props.get(vars.$pad-i); | 18 | padding-inline: props.get(vars.$pad-i); |
19 | margin: 0; | 19 | margin: 0; |
20 | color: currentColor; | 20 | color: currentColor; |
21 | background-color: props.get(vars.$bg-color); | 21 | background-color: props.get(vars.$bg-color); |
22 | border: props.get(vars.$border-width) solid transparent; | 22 | border: props.get(vars.$border-width) solid transparent; |
23 | border-color: props.get(vars.$border-color); | 23 | border-color: props.get(vars.$border-color); |
24 | border-radius: props.get(vars.$rounding); | 24 | border-radius: props.get(vars.$rounding); |
25 | transform: translate(var(--x), var(--y)); | 25 | box-shadow: |
26 | box-shadow: | 26 | props.get(vars.$shadow-x) |
27 | props.get(vars.$shadow-x) | 27 | props.get(vars.$shadow-y) |
28 | props.get(vars.$shadow-y) | 28 | props.get(vars.$shadow-blur) |
29 | props.get(vars.$shadow-blur) | 29 | props.get(vars.$shadow-grow) |
30 | props.get(vars.$shadow-grow) | 30 | props.get(vars.$shadow-color); |
31 | props.get(vars.$shadow-color); | 31 | transform: translate(var(--x), var(--y)); |
32 | 32 | ||
33 | @include bem.modifier('up-left') { | 33 | @include bem.modifier('up-left') { |
34 | transform: translate(var(--x), calc(var(--y) - 100%)); | 34 | transform: translate(var(--x), calc(var(--y) - 100%)); |
35 | } | 35 | } |
36 | 36 | ||
37 | @include bem.modifier('up-right') { | 37 | @include bem.modifier('up-right') { |
38 | transform: translate(calc(var(--x) - 100%), calc(var(--y) - 100%)); | 38 | transform: translate(calc(var(--x) - 100%), calc(var(--y) - 100%)); |
39 | } | 39 | } |
40 | 40 | ||
41 | @include bem.modifier('down-right') { | 41 | @include bem.modifier('down-right') { |
42 | transform: translate(calc(var(--x) - 100%), var(--y)); | 42 | transform: translate(calc(var(--x) - 100%), var(--y)); |
43 | } | 43 | } |
44 | } | 44 | } |
45 | } | 45 | } |