summaryrefslogtreecommitdiffstats
path: root/src/layouts/_button-group.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2025-08-06 16:40:56 +0200
committerVolpeon <git@volpeon.ink>2025-08-06 16:40:56 +0200
commit41b0d0497988274057fc2512c822a6bc9d2d3ebd (patch)
tree015a95ede42b799ac1fd049baa8b0a853b6d3bb3 /src/layouts/_button-group.scss
parentFix button font size (diff)
downloadiro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.tar.gz
iro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.tar.bz2
iro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.zip
Switch to tab indentationHEADmaster
Diffstat (limited to 'src/layouts/_button-group.scss')
-rw-r--r--src/layouts/_button-group.scss62
1 files changed, 31 insertions, 31 deletions
diff --git a/src/layouts/_button-group.scss b/src/layouts/_button-group.scss
index 6c874e1..44719be 100644
--- a/src/layouts/_button-group.scss
+++ b/src/layouts/_button-group.scss
@@ -8,43 +8,43 @@
8@use '../objects/button.vars' as button; 8@use '../objects/button.vars' as button;
9 9
10@mixin styles { 10@mixin styles {
11 @include materialize-at-root(meta.module-variables('vars')); 11 @include materialize-at-root(meta.module-variables('vars'));
12 12
13 @include bem.layout('button-group') { 13 @include bem.layout('button-group') {
14 display: inline-flex; 14 display: inline-flex;
15 flex-wrap: wrap; 15 flex-wrap: wrap;
16 gap: props.get(vars.$gap); 16 gap: props.get(vars.$gap);
17 17
18 @each $mod, $size in vars.$sizes { 18 @each $mod, $size in vars.$sizes {
19 @include bem.modifier($mod) { 19 @include bem.modifier($mod) {
20 gap: props.get($size); 20 gap: props.get($size);
21 } 21 }
22 } 22 }
23 23
24 @include bem.modifier('align-block') { 24 @include bem.modifier('align-block') {
25 margin-inline: calc(-1 * props.get(button.$pad-i) - props.get(button.$border-width)); 25 margin-inline: calc(-1 * props.get(button.$pad-i) - props.get(button.$border-width));
26 26
27 @include bem.modifier('pill') { 27 @include bem.modifier('pill') {
28 margin-inline: calc(-1 * props.get(button.$pad-i-pill) - props.get(button.$border-width)); 28 margin-inline: calc(-1 * props.get(button.$pad-i-pill) - props.get(button.$border-width));
29 } 29 }
30 30
31 @include bem.modifier('icon') { 31 @include bem.modifier('icon') {
32 margin-inline: calc(-1 * props.get(button.$pad-b) - props.get(button.$border-width) - .5em * (props.get(button.$line-height) - 1)); 32 margin-inline: calc(-1 * props.get(button.$pad-b) - props.get(button.$border-width) - .5em * (props.get(button.$line-height) - 1));
33 } 33 }
34 34
35 @each $mod, $pad-i, $pad-i-label, $pad-i-pill, $pad-b, $font-size in button.$fixed-sizes { 35 @each $mod, $pad-i, $pad-i-label, $pad-i-pill, $pad-b, $font-size in button.$fixed-sizes {
36 @include bem.modifier('action-#{$mod}') { 36 @include bem.modifier('action-#{$mod}') {
37 margin-inline: calc(-1 * props.get($pad-i) - props.get(button.$border-width)); 37 margin-inline: calc(-1 * props.get($pad-i) - props.get(button.$border-width));
38 38
39 @include bem.modifier('pill') { 39 @include bem.modifier('pill') {
40 margin-inline: calc(-1 * props.get($pad-i-pill) - props.get(button.$border-width)); 40 margin-inline: calc(-1 * props.get($pad-i-pill) - props.get(button.$border-width));
41 } 41 }
42 42
43 @include bem.modifier('icon') { 43 @include bem.modifier('icon') {
44 margin-inline: calc(-1 * props.get($pad-b) - props.get(button.$border-width) - .5em * (props.get(button.$line-height) - 1)); 44 margin-inline: calc(-1 * props.get($pad-b) - props.get(button.$border-width) - .5em * (props.get(button.$line-height) - 1));
45 } 45 }
46 } 46 }
47 } 47 }
48 } 48 }
49 } 49 }
50} 50}