summaryrefslogtreecommitdiffstats
path: root/src/objects/_status-indicator.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_status-indicator.scss')
-rw-r--r--src/objects/_status-indicator.scss15
1 files changed, 11 insertions, 4 deletions
diff --git a/src/objects/_status-indicator.scss b/src/objects/_status-indicator.scss
index 0ddd115..6bcb547 100644
--- a/src/objects/_status-indicator.scss
+++ b/src/objects/_status-indicator.scss
@@ -4,7 +4,8 @@
4@include iro.props-namespace('status-indicator') { 4@include iro.props-namespace('status-indicator') {
5 @include iro.props-store(( 5 @include iro.props-store((
6 --dims: ( 6 --dims: (
7 --size: iro.fn-px-to-rem(10px), 7 --100: fn.global-dim(--size --100),
8 --125: fn.global-dim(--size --125),
8 ), 9 ),
9 ), 'dims'); 10 ), 'dims');
10 11
@@ -19,11 +20,17 @@
19 20
20 @include iro.bem-object(iro.props-namespace()) { 21 @include iro.bem-object(iro.props-namespace()) {
21 display: inline-block; 22 display: inline-block;
22 width: fn.dim(--size); 23 width: fn.dim(--100);
23 height: fn.dim(--size); 24 height: fn.dim(--100);
24 border-radius: fn.dim(--size); 25 border-radius: fn.dim(--100);
25 background-color: fn.color(--default); 26 background-color: fn.color(--default);
26 27
28 @include iro.bem-modifier('125') {
29 width: fn.dim(--125);
30 height: fn.dim(--125);
31 border-radius: fn.dim(--125);
32 }
33
27 @each $color in 'green' 'yellow' 'red' { 34 @each $color in 'green' 'yellow' 'red' {
28 @include iro.bem-is($color) { 35 @include iro.bem-is($color) {
29 background-color: fn.color(--#{$color}); 36 background-color: fn.color(--#{$color});