diff options
-rw-r--r-- | src/objects/_status-indicator.scss | 3 | ||||
-rw-r--r-- | tpl/views/status-indicator.pug | 2 |
2 files changed, 4 insertions, 1 deletions
diff --git a/src/objects/_status-indicator.scss b/src/objects/_status-indicator.scss index 0849d82..eb3990b 100644 --- a/src/objects/_status-indicator.scss +++ b/src/objects/_status-indicator.scss | |||
@@ -11,6 +11,7 @@ | |||
11 | @include iro.props-store(( | 11 | @include iro.props-store(( |
12 | --colors: ( | 12 | --colors: ( |
13 | --default: fn.global-color(--obj-lo), | 13 | --default: fn.global-color(--obj-lo), |
14 | --primary: fn.global-color(--fg), | ||
14 | --green: fn.global-color(--green --solid --bg-hi), | 15 | --green: fn.global-color(--green --solid --bg-hi), |
15 | --yellow: fn.global-color(--yellow --solid --bg-hi), | 16 | --yellow: fn.global-color(--yellow --solid --bg-hi), |
16 | --red: fn.global-color(--red --solid --bg-hi), | 17 | --red: fn.global-color(--red --solid --bg-hi), |
@@ -24,7 +25,7 @@ | |||
24 | border-radius: 10em; | 25 | border-radius: 10em; |
25 | background-color: fn.color(--default); | 26 | background-color: fn.color(--default); |
26 | 27 | ||
27 | @each $color in 'green' 'yellow' 'red' { | 28 | @each $color in 'primary' 'green' 'yellow' 'red' { |
28 | @include iro.bem-is($color) { | 29 | @include iro.bem-is($color) { |
29 | background-color: fn.color(--#{$color}); | 30 | background-color: fn.color(--#{$color}); |
30 | } | 31 | } |
diff --git a/tpl/views/status-indicator.pug b/tpl/views/status-indicator.pug index 6d7ad30..553e454 100644 --- a/tpl/views/status-indicator.pug +++ b/tpl/views/status-indicator.pug | |||
@@ -3,6 +3,8 @@ mixin view-status-indicator | |||
3 | .c-box | 3 | .c-box |
4 | +status-indicator | 4 | +status-indicator |
5 | = ' ' | 5 | = ' ' |
6 | +status-indicator('primary') | ||
7 | = ' ' | ||
6 | +status-indicator('green') | 8 | +status-indicator('green') |
7 | = ' ' | 9 | = ' ' |
8 | +status-indicator('yellow') | 10 | +status-indicator('yellow') |