diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/objects/_avatar.scss | 2 | ||||
| -rw-r--r-- | src/objects/_status-indicator.scss | 15 |
2 files changed, 12 insertions, 5 deletions
diff --git a/src/objects/_avatar.scss b/src/objects/_avatar.scss index 0d9773f..1ccfa00 100644 --- a/src/objects/_avatar.scss +++ b/src/objects/_avatar.scss | |||
| @@ -16,7 +16,7 @@ | |||
| 16 | --size: fn.global-dim(--size --225), | 16 | --size: fn.global-dim(--size --225), |
| 17 | --font-size: fn.global-dim(--font-size --50), | 17 | --font-size: fn.global-dim(--font-size --50), |
| 18 | ), | 18 | ), |
| 19 | --indicator-size: fn.foreign-dim(--status-indicator, --size), | 19 | --indicator-size: fn.foreign-dim(--status-indicator, --100), |
| 20 | --indicator-spacing: iro.fn-px-to-rem(3px), | 20 | --indicator-spacing: iro.fn-px-to-rem(3px), |
| 21 | --rounding: 25%, | 21 | --rounding: 25%, |
| 22 | ), | 22 | ), |
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}); |
