diff options
Diffstat (limited to 'src/objects/_divider.scss')
| -rw-r--r-- | src/objects/_divider.scss | 30 |
1 files changed, 15 insertions, 15 deletions
diff --git a/src/objects/_divider.scss b/src/objects/_divider.scss index 49bc028..6932c7e 100644 --- a/src/objects/_divider.scss +++ b/src/objects/_divider.scss | |||
| @@ -1,7 +1,7 @@ | |||
| 1 | @use 'sass:map'; | 1 | @use 'sass:map'; |
| 2 | @use 'sass:meta'; | 2 | @use 'sass:meta'; |
| 3 | @use 'sass:string'; | 3 | @use 'sass:string'; |
| 4 | @use 'iro-sass/src/iro-sass' as iro; | 4 | @use 'iro-sass/src/bem' as bem; |
| 5 | @use 'iro-sass/src/props'; | 5 | @use 'iro-sass/src/props'; |
| 6 | @use '../props' as *; | 6 | @use '../props' as *; |
| 7 | @use '../core.vars' as core; | 7 | @use '../core.vars' as core; |
| @@ -12,7 +12,7 @@ | |||
| 12 | @mixin styles { | 12 | @mixin styles { |
| 13 | @include materialize-at-root(meta.module-variables('vars')); | 13 | @include materialize-at-root(meta.module-variables('vars')); |
| 14 | 14 | ||
| 15 | @include iro.bem-object('divider') { | 15 | @include bem.object('divider') { |
| 16 | display: flex; | 16 | display: flex; |
| 17 | flex: 0 0 auto; | 17 | flex: 0 0 auto; |
| 18 | flex-direction: row; | 18 | flex-direction: row; |
| @@ -39,11 +39,11 @@ | |||
| 39 | display: block; | 39 | display: block; |
| 40 | } | 40 | } |
| 41 | 41 | ||
| 42 | @include iro.bem-elem('label') { | 42 | @include bem.elem('label') { |
| 43 | flex: 0 0 auto; | 43 | flex: 0 0 auto; |
| 44 | } | 44 | } |
| 45 | 45 | ||
| 46 | @include iro.bem-modifier('vertical') { | 46 | @include bem.modifier('vertical') { |
| 47 | align-self: stretch; | 47 | align-self: stretch; |
| 48 | inline-size: 1px; | 48 | inline-size: 1px; |
| 49 | block-size: auto; | 49 | block-size: auto; |
| @@ -56,7 +56,7 @@ | |||
| 56 | } | 56 | } |
| 57 | } | 57 | } |
| 58 | 58 | ||
| 59 | @include iro.bem-modifier('medium') { | 59 | @include bem.modifier('medium') { |
| 60 | font-size: props.get(vars.$medium--label-font-size); | 60 | font-size: props.get(vars.$medium--label-font-size); |
| 61 | font-weight: 500; | 61 | font-weight: 500; |
| 62 | color: props.get(vars.$medium--label-color); | 62 | color: props.get(vars.$medium--label-color); |
| @@ -68,7 +68,7 @@ | |||
| 68 | } | 68 | } |
| 69 | } | 69 | } |
| 70 | 70 | ||
| 71 | @include iro.bem-modifier('faint') { | 71 | @include bem.modifier('faint') { |
| 72 | font-size: props.get(vars.$faint--label-font-size); | 72 | font-size: props.get(vars.$faint--label-font-size); |
| 73 | font-weight: 500; | 73 | font-weight: 500; |
| 74 | color: props.get(vars.$faint--label-color); | 74 | color: props.get(vars.$faint--label-color); |
| @@ -80,7 +80,7 @@ | |||
| 80 | } | 80 | } |
| 81 | } | 81 | } |
| 82 | 82 | ||
| 83 | @include iro.bem-modifier('labelled') { | 83 | @include bem.modifier('labelled') { |
| 84 | &::before { | 84 | &::before { |
| 85 | margin-inline-end: 1em; | 85 | margin-inline-end: 1em; |
| 86 | } | 86 | } |
| @@ -92,47 +92,47 @@ | |||
| 92 | } | 92 | } |
| 93 | 93 | ||
| 94 | @each $theme in map.keys(props.get(vars.$themes)) { | 94 | @each $theme in map.keys(props.get(vars.$themes)) { |
| 95 | @include iro.bem-modifier(string.slice($theme, 3)) { | 95 | @include bem.modifier(string.slice($theme, 3)) { |
| 96 | &::before, | 96 | &::before, |
| 97 | &::after { | 97 | &::after { |
| 98 | background-color: props.get(vars.$themes, $theme, --bg); | 98 | background-color: props.get(vars.$themes, $theme, --bg); |
| 99 | } | 99 | } |
| 100 | 100 | ||
| 101 | @include iro.bem-elem('label') { | 101 | @include bem.elem('label') { |
| 102 | color: props.get(vars.$themes, $theme, --label); | 102 | color: props.get(vars.$themes, $theme, --label); |
| 103 | } | 103 | } |
| 104 | } | 104 | } |
| 105 | } | 105 | } |
| 106 | 106 | ||
| 107 | @each $theme in map.keys(props.get(vars.$static-themes)) { | 107 | @each $theme in map.keys(props.get(vars.$static-themes)) { |
| 108 | @include iro.bem-modifier(string.slice($theme, 3)) { | 108 | @include bem.modifier(string.slice($theme, 3)) { |
| 109 | &::before, | 109 | &::before, |
| 110 | &::after { | 110 | &::after { |
| 111 | background-color: props.get(vars.$static-themes, $theme, --strong, --bg); | 111 | background-color: props.get(vars.$static-themes, $theme, --strong, --bg); |
| 112 | } | 112 | } |
| 113 | 113 | ||
| 114 | @include iro.bem-elem('label') { | 114 | @include bem.elem('label') { |
| 115 | color: props.get(vars.$static-themes, $theme, --strong, --label); | 115 | color: props.get(vars.$static-themes, $theme, --strong, --label); |
| 116 | } | 116 | } |
| 117 | 117 | ||
| 118 | @include iro.bem-modifier('medium') { | 118 | @include bem.modifier('medium') { |
| 119 | &::before, | 119 | &::before, |
| 120 | &::after { | 120 | &::after { |
| 121 | background-color: props.get(vars.$static-themes, $theme, --medium, --bg); | 121 | background-color: props.get(vars.$static-themes, $theme, --medium, --bg); |
| 122 | } | 122 | } |
| 123 | 123 | ||
| 124 | @include iro.bem-elem('label') { | 124 | @include bem.elem('label') { |
| 125 | color: props.get(vars.$static-themes, $theme, --medium, --label); | 125 | color: props.get(vars.$static-themes, $theme, --medium, --label); |
| 126 | } | 126 | } |
| 127 | } | 127 | } |
| 128 | 128 | ||
| 129 | @include iro.bem-modifier('faint') { | 129 | @include bem.modifier('faint') { |
| 130 | &::before, | 130 | &::before, |
| 131 | &::after { | 131 | &::after { |
| 132 | background-color: props.get(vars.$static-themes, $theme, --faint, --bg); | 132 | background-color: props.get(vars.$static-themes, $theme, --faint, --bg); |
| 133 | } | 133 | } |
| 134 | 134 | ||
| 135 | @include iro.bem-elem('label') { | 135 | @include bem.elem('label') { |
| 136 | color: props.get(vars.$static-themes, $theme, --faint, --label); | 136 | color: props.get(vars.$static-themes, $theme, --faint, --label); |
| 137 | } | 137 | } |
| 138 | } | 138 | } |
