Auto-gen padding and margin utilities

1 files changed, 34 insertions, 8 deletions

diff --git a/src/_utils.scss b/src/_utils.scss
index 3c8b1c3..99c751c 100644
--- a/src/_utils.scss
+++ b/src/_utils.scss
@@ -1,6 +1,14 @@
 @use 'iro-sass/src/index' as iro;
 @use 'functions' as fn;
 
+$dirs: (
+    '': '',
+    't': '-top',
+    'r': '-right',
+    'b': '-bottom',
+    'l': '-left',
+);
+
 @include iro.bem-utility('d-block') {
     display: block;
 }
@@ -26,16 +34,34 @@
     position: relative;
 }
 
-@include iro.bem-utility('mt-0') {
-    margin-top: 0;
-}
+@each $dir, $suffix in $dirs {
+    @include iro.bem-utility('m#{$dir}-auto') {
+        margin#{$suffix}: auto;
+    }
+
+    @include iro.bem-utility('m#{$dir}-0') {
+        margin#{$suffix}: 0;
+    }
 
-@include iro.bem-utility('ml-auto') {
-    margin-left: auto;
+    @each $size in ('xxs' 'xs' 'sm' 'md' 'lg' 'xl') {
+        @include iro.bem-utility('m#{$dir}-#{$size}') {
+            margin#{$suffix}: fn.global-dim(--spacing --#{$size});
+        }
+    }
 }
 
-@each $size in ('xxs' 'xs' 'sm' 'md' 'lg' 'xl') {
-    @include iro.bem-utility('p-#{$size}') {
-        padding: fn.global-dim(--spacing --#{$size});
+@each $dir, $suffix in $dirs {
+    @include iro.bem-utility('p#{$dir}-auto') {
+        padding#{$suffix}: auto;
+    }
+
+    @include iro.bem-utility('p#{$dir}-0') {
+        padding#{$suffix}: 0;
+    }
+
+    @each $size in ('xxs' 'xs' 'sm' 'md' 'lg' 'xl') {
+        @include iro.bem-utility('p#{$dir}-#{$size}') {
+            padding#{$suffix}: fn.global-dim(--spacing --#{$size});
+        }
     }
 }