summaryrefslogtreecommitdiffstats
path: root/src/objects/_badge.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_badge.scss')
-rw-r--r--src/objects/_badge.scss21
1 files changed, 15 insertions, 6 deletions
diff --git a/src/objects/_badge.scss b/src/objects/_badge.scss
index f24d2f8..0f73382 100644
--- a/src/objects/_badge.scss
+++ b/src/objects/_badge.scss
@@ -14,6 +14,10 @@
14 --pad-x: fn.px-to-em(6px), 14 --pad-x: fn.px-to-em(6px),
15 --pad-y: fn.px-to-em(2px), 15 --pad-y: fn.px-to-em(2px),
16 ), 16 ),
17 --300: (
18 --pad-x: fn.px-to-em(10px),
19 --pad-y: fn.px-to-em(6px),
20 ),
17 21
18 --pill: ( 22 --pill: (
19 --pad-x: fn.px-to-em(9px), 23 --pad-x: fn.px-to-em(9px),
@@ -21,6 +25,9 @@
21 --200: ( 25 --200: (
22 --pad-x: fn.px-to-em(10px), 26 --pad-x: fn.px-to-em(10px),
23 ), 27 ),
28 --300: (
29 --pad-x: fn.px-to-em(16px),
30 ),
24 ), 31 ),
25 ), 32 ),
26 ), 'dims'); 33 ), 'dims');
@@ -136,12 +143,14 @@
136 border-radius: 10em; 143 border-radius: 10em;
137 } 144 }
138 145
139 @include iro.bem-modifier('200') { 146 @each $size in '200' '300' {
140 padding: fn.dim(--200 --pad-y) fn.dim(--200 --pad-x); 147 @include iro.bem-modifier($size) {
141 148 padding: fn.dim(--#{$size} --pad-y) fn.dim(--#{$size} --pad-x);
142 @include iro.bem-modifier('pill') { 149
143 padding-right: fn.dim(--pill --200 --pad-x); 150 @include iro.bem-modifier('pill') {
144 padding-left: fn.dim(--pill --200 --pad-x); 151 padding-right: fn.dim(--pill --#{$size} --pad-x);
152 padding-left: fn.dim(--pill --#{$size} --pad-x);
153 }
145 } 154 }
146 } 155 }
147 156