From 7df69541ba3ada38c997b294fc35c81a06dcfc92 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Tue, 24 Feb 2026 09:55:44 +0100
Subject: Add gap util

---
 src/_utils.scss | 42 ++++++++++++++++++++++++------------------
 1 file changed, 24 insertions(+), 18 deletions(-)

diff --git a/src/_utils.scss b/src/_utils.scss
index 3dae3b6..dc0fb32 100644
--- a/src/_utils.scss
+++ b/src/_utils.scss
@@ -171,7 +171,7 @@ $-font-sizes: (
 
 		@each $theme in map.keys(props.get(vars.$transparent-colors)) {
 			$theme-name: static-#{string.slice($theme, 3)};
-    
+
 			@include bem.at-theme($theme-name) {
 				color: props.get(vars.$transparent-colors, $theme, --900);
 			}
@@ -183,7 +183,7 @@ $-font-sizes: (
 
 		@each $theme in map.keys(props.get(vars.$transparent-colors)) {
 			$theme-name: static-#{string.slice($theme, 3)};
-    
+
 			@include bem.at-theme($theme-name) {
 				color: props.get(vars.$transparent-colors, $theme, --800);
 			}
@@ -195,7 +195,7 @@ $-font-sizes: (
 
 		@each $theme in map.keys(props.get(vars.$transparent-colors)) {
 			$theme-name: static-#{string.slice($theme, 3)};
-    
+
 			@include bem.at-theme($theme-name) {
 				color: props.get(vars.$transparent-colors, $theme, --700);
 			}
@@ -207,7 +207,7 @@ $-font-sizes: (
 
 		@each $theme in map.keys(props.get(vars.$transparent-colors)) {
 			$theme-name: static-#{string.slice($theme, 3)};
-    
+
 			@include bem.at-theme($theme-name) {
 				color: props.get(vars.$transparent-colors, $theme, --600);
 			}
@@ -224,23 +224,23 @@ $-font-sizes: (
 		@include bem.utility('#{$dir}-100') {
 			#{$prop}: 100%;
 		}
-        
+
 		@include bem.utility('#{$dir}-75') {
 			#{$prop}: 75%;
 		}
-        
+
 		@include bem.utility('#{$dir}-50') {
 			#{$prop}: 50%;
 		}
-        
+
 		@include bem.utility('#{$dir}-25') {
 			#{$prop}: 25%;
 		}
-        
+
 		@include bem.utility('#{$dir}-1px') {
 			#{$prop}: 1px;
 		}
-        
+
 		@include bem.utility('#{$dir}-0') {
 			#{$prop}: 0;
 		}
@@ -290,11 +290,17 @@ $-font-sizes: (
 		border-radius: props.get(vars.$rounding--sm);
 	}
 
+	@each $mod, $size in $-sizes {
+		@include bem.utility('g-#{$mod}') {
+			gap: props.get($size);
+		}
+	}
+
 	@each $dir, $suffix in $-dirs {
 		@include bem.utility('m#{$dir}-auto') {
 			margin#{$suffix}: auto;
 		}
-        
+
 		@include bem.utility('p#{$dir}-auto') {
 			padding#{$suffix}: auto;
 		}
@@ -303,12 +309,12 @@ $-font-sizes: (
 			@include bem.utility('m#{$dir}-#{$mod}') {
 				margin#{$suffix}: props.get($size);
 			}
-            
+
 			@include bem.utility('p#{$dir}-#{$mod}') {
 				padding#{$suffix}: props.get($size);
 			}
 		}
-        
+
 		@include bem.utility('b#{$dir}-0') {
 			border#{$suffix}: 0;
 
@@ -317,14 +323,14 @@ $-font-sizes: (
 					border#{$suffix}: 0;
 				}
 			}
-        
+
 			@include bem.suffix('dark') {
 				@media (prefers-color-scheme: dark) {
 					border#{$suffix}: 0;
 				}
 			}
 		}
-        
+
 		@include bem.utility('b#{$dir}-1') {
 			border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border);
 
@@ -333,14 +339,14 @@ $-font-sizes: (
 					border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border);
 				}
 			}
-        
+
 			@include bem.suffix('dark') {
 				@media (prefers-color-scheme: dark) {
 					border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border);
 				}
 			}
 		}
-        
+
 		@include bem.utility('b#{$dir}-1-mute') {
 			border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border-mute);
 
@@ -349,7 +355,7 @@ $-font-sizes: (
 					border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border-mute);
 				}
 			}
-        
+
 			@include bem.suffix('dark') {
 				@media (prefers-color-scheme: dark) {
 					border#{$suffix}: props.get(vars.$border-width--thin) solid props.get(vars.$theme, --border-mute);
@@ -365,7 +371,7 @@ $-font-sizes: (
 			content:       '';
 		}
 	}
-    
+
 	@include bem.utility('sr-only') {
 		position:    absolute;
 		width:       1px;
-- 
cgit v1.2.3-70-g09d2