Added larger badge variant

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 @@
                 --pad-x: fn.px-to-em(6px),
                 --pad-y: fn.px-to-em(2px),
             ),
+            --300: (
+                --pad-x: fn.px-to-em(10px),
+                --pad-y: fn.px-to-em(6px),
+            ),
 
             --pill: (
                 --pad-x: fn.px-to-em(9px),
@@ -21,6 +25,9 @@
                 --200: (
                     --pad-x: fn.px-to-em(10px),
                 ),
+                --300: (
+                    --pad-x: fn.px-to-em(16px),
+                ),
             ),
         ),
     ), 'dims');
@@ -136,12 +143,14 @@
             border-radius: 10em;
         }
     
-        @include iro.bem-modifier('200') {
-            padding: fn.dim(--200 --pad-y) fn.dim(--200 --pad-x);
-    
-            @include iro.bem-modifier('pill') {
-                padding-right: fn.dim(--pill --200 --pad-x);
-                padding-left:  fn.dim(--pill --200 --pad-x);
+        @each $size in '200' '300' {
+            @include iro.bem-modifier($size) {
+                padding: fn.dim(--#{$size} --pad-y) fn.dim(--#{$size} --pad-x);
+        
+                @include iro.bem-modifier('pill') {
+                    padding-right: fn.dim(--pill --#{$size} --pad-x);
+                    padding-left:  fn.dim(--pill --#{$size} --pad-x);
+                }
             }
         }