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 | } |