summaryrefslogtreecommitdiffstats
path: root/src/objects/_action-button.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2024-10-22 08:23:33 +0200
committerVolpeon <git@volpeon.ink>2024-10-22 08:23:33 +0200
commit5855a6821cf5585378a70f9bee13563bdbfe2d86 (patch)
tree0ee25906c9e73912137a56b7d6214c89bf43e8a6 /src/objects/_action-button.scss
parentUpdate (diff)
downloadiro-design-5855a6821cf5585378a70f9bee13563bdbfe2d86.tar.gz
iro-design-5855a6821cf5585378a70f9bee13563bdbfe2d86.tar.bz2
iro-design-5855a6821cf5585378a70f9bee13563bdbfe2d86.zip
Less broad imports
Diffstat (limited to 'src/objects/_action-button.scss')
-rw-r--r--src/objects/_action-button.scss20
1 files changed, 10 insertions, 10 deletions
diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss
index 046cd16..caba917 100644
--- a/src/objects/_action-button.scss
+++ b/src/objects/_action-button.scss
@@ -2,7 +2,7 @@
2@use 'sass:map'; 2@use 'sass:map';
3@use 'sass:meta'; 3@use 'sass:meta';
4@use 'sass:string'; 4@use 'sass:string';
5@use 'iro-sass/src/iro-sass' as iro; 5@use 'iro-sass/src/bem' as bem;
6@use 'iro-sass/src/props'; 6@use 'iro-sass/src/props';
7@use '../props' as *; 7@use '../props' as *;
8 8
@@ -45,7 +45,7 @@
45 } 45 }
46 } 46 }
47 47
48 @include iro.bem-modifier('quiet') { 48 @include bem.modifier('quiet') {
49 color: props.get($theme, list.join($key, --quiet --disabled --label-color)...); 49 color: props.get($theme, list.join($key, --quiet --disabled --label-color)...);
50 background-color: transparent; 50 background-color: transparent;
51 border-color: transparent; 51 border-color: transparent;
@@ -72,7 +72,7 @@
72 } 72 }
73 } 73 }
74 74
75 @include iro.bem-is('selected') { 75 @include bem.is('selected') {
76 color: props.get($theme, list.join($key, --selected --disabled --label-color)...); 76 color: props.get($theme, list.join($key, --selected --disabled --label-color)...);
77 background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...); 77 background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...);
78 border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...); 78 border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...);
@@ -103,7 +103,7 @@
103@mixin styles { 103@mixin styles {
104 @include materialize-at-root(meta.module-variables('vars')); 104 @include materialize-at-root(meta.module-variables('vars'));
105 105
106 @include iro.bem-object('action-button') { 106 @include bem.object('action-button') {
107 position: relative; 107 position: relative;
108 display: inline-block; 108 display: inline-block;
109 padding-block: props.get(vars.$pad-b); 109 padding-block: props.get(vars.$pad-b);
@@ -140,12 +140,12 @@
140 @include -apply-theme(vars.$default-theme); 140 @include -apply-theme(vars.$default-theme);
141 141
142 @each $theme in map.keys(props.get(vars.$themes)) { 142 @each $theme in map.keys(props.get(vars.$themes)) {
143 @include iro.bem-modifier(string.slice($theme, 3)) { 143 @include bem.modifier(string.slice($theme, 3)) {
144 @include -apply-theme(vars.$themes, $theme); 144 @include -apply-theme(vars.$themes, $theme);
145 } 145 }
146 } 146 }
147 147
148 @include iro.bem-modifier('pill') { 148 @include bem.modifier('pill') {
149 padding-inline: props.get(vars.$pad-i-pill); 149 padding-inline: props.get(vars.$pad-i-pill);
150 border-radius: 100em; 150 border-radius: 100em;
151 151
@@ -155,23 +155,23 @@
155 } 155 }
156 156
157 @each $mod, $pad-i, $pad-i-pill, $pad-b, $font-size in vars.$fixed-sizes { 157 @each $mod, $pad-i, $pad-i-pill, $pad-b, $font-size in vars.$fixed-sizes {
158 @include iro.bem-modifier($mod) { 158 @include bem.modifier($mod) {
159 padding-block: props.get($pad-b); 159 padding-block: props.get($pad-b);
160 padding-inline: props.get($pad-i); 160 padding-inline: props.get($pad-i);
161 font-size: props.get($font-size); 161 font-size: props.get($font-size);
162 162
163 @include iro.bem-modifier('pill') { 163 @include bem.modifier('pill') {
164 padding-inline: props.get($pad-i-pill); 164 padding-inline: props.get($pad-i-pill);
165 } 165 }
166 } 166 }
167 } 167 }
168 168
169 @include iro.bem-modifier('icon') { 169 @include bem.modifier('icon') {
170 inline-size: calc(1em * props.get(vars.$line-height) + 2 * props.get(vars.$pad-b)); 170 inline-size: calc(1em * props.get(vars.$line-height) + 2 * props.get(vars.$pad-b));
171 padding-inline: 0; 171 padding-inline: 0;
172 172
173 @each $mod, $pad-i, $pad-i-pill, $pad-b, $font-size in vars.$fixed-sizes { 173 @each $mod, $pad-i, $pad-i-pill, $pad-b, $font-size in vars.$fixed-sizes {
174 @include iro.bem-modifier($mod) { 174 @include bem.modifier($mod) {
175 inline-size: calc(1em * props.get(vars.$line-height) + 2 * props.get($pad-b)); 175 inline-size: calc(1em * props.get(vars.$line-height) + 2 * props.get($pad-b));
176 padding-inline: 0; 176 padding-inline: 0;
177 } 177 }