@nuvoui/core 1.5.1 → 1.5.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuvoui/core",
-  "version": "1.5.1",
+  "version": "1.5.3",
   "description": "NuvoUI is a human-friendly SCSS framework designed for simplicity, and modern responsive designs.",
   "author": {
     "name": "AALA IT Solutions",
@@ -76,15 +76,15 @@
     "not dead"
   ],
   "devDependencies": {
-    "cssnano": "^7.0.6",
-    "postcss": "^8.5.3",
+    "cssnano": "^7.1.2",
+    "postcss": "^8.5.6",
     "postcss-cli": "^11.0.1",
-    "postcss-import": "^16.1.0",
+    "postcss-import": "^16.1.1",
     "postcss-nested": "^7.0.2",
-    "prettier": "^3.5.3",
-    "sass": "^1.85.1",
-    "stylelint": "^16.16.0",
-    "stylelint-config-standard-scss": "^13.1.0"
+    "prettier": "^3.7.4",
+    "sass": "^1.97.0",
+    "stylelint": "^16.26.1",
+    "stylelint-config-standard-scss": "^16.0.0"
   },
   "peerDependencies": {
     "sass": "^1.x"

package/src/styles/base/_base.scss

@@ -195,7 +195,7 @@
         padding: 0 !important;
         margin: -1px !important;
         overflow: hidden !important;
-        clip: rect(0, 0, 0, 0) !important;
+        clip-path: inset(50%) !important;
         white-space: nowrap !important;
         border: 0 !important;
     }

package/src/styles/components/_tooltips.scss

@@ -2,19 +2,19 @@
 @use "../functions/feature-flags" as fn-flags;
 @mixin tooltip-variables {
     // Tooltip core variables
-    --tooltip-bg: rgba(17 17 17 / 90%);
+    --tooltip-bg: rgb(17 17 17 / 90%);
     --tooltip-shadow-color: rgb(0 0 0 / 20%);
     --tooltip-text-color: #fff;
 
     // Animation variables
-    --microtip-transition-duration: 0.18s;
-    --microtip-transition-easing: ease-in-out;
-    --microtip-transition-delay: 0s;
+    --tooltip-transition-duration: 0.18s;
+    --tooltip-transition-easing: ease-in-out;
+    --tooltip-transition-delay: 0s;
 
-    // config-typo variables
-    --microtip-font-size: 13px;
-    --microtip-font-weight: normal;
-    --microtip-text-transform: none;
+    // Typography variables
+    --tooltip-font-size: 13px;
+    --tooltip-font-weight: normal;
+    --tooltip-text-transform: none;
 
     // Sizing variables
     --tooltip-small-width: 80px;
@@ -47,8 +47,8 @@
                 opacity: 0;
                 pointer-events: none;
                 transition:
-                    opacity var(--microtip-transition-duration) var(--microtip-transition-easing) var(--microtip-transition-delay),
-                    transform var(--microtip-transition-duration) var(--microtip-transition-easing) var(--microtip-transition-delay);
+                    opacity var(--tooltip-transition-duration) var(--tooltip-transition-easing) var(--tooltip-transition-delay),
+                    transform var(--tooltip-transition-duration) var(--tooltip-transition-easing) var(--tooltip-transition-delay);
                 position: absolute;
                 box-sizing: border-box;
                 z-index: 10;
@@ -66,9 +66,9 @@
                 border-radius: var(--tooltip-border-radius);
                 color: var(--tooltip-text-color);
                 content: attr(data-tooltip);
-                font-size: var(--microtip-font-size);
-                font-weight: var(--microtip-font-weight);
-                text-transform: var(--microtip-text-transform);
+                font-size: var(--tooltip-font-size);
+                font-weight: var(--tooltip-font-weight);
+                text-transform: var(--tooltip-text-transform);
                 padding: 0.5em 1em;
                 white-space: nowrap;
                 box-sizing: content-box;
@@ -84,7 +84,7 @@
         }
 
         // Top position tooltips
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position|="top"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position|="top"] {
             &::before {
                 border-left: 9px solid transparent;
                 border-right: 9px solid transparent;
@@ -114,7 +114,7 @@
             }
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="top-left"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="top-left"] {
             &::after {
                 transform: translate3d(calc(-100% + 16px), 0, 0);
                 bottom: 100%;
@@ -125,7 +125,7 @@
             }
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="top-right"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="top-right"] {
             &::after {
                 transform: translate3d(calc(0% + -16px), 0, 0);
                 bottom: 100%;
@@ -137,7 +137,7 @@
         }
 
         // Bottom position tooltips
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position|="bottom"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position|="bottom"] {
             &::before {
                 border-left: 9px solid transparent;
                 border-right: 9px solid transparent;
@@ -169,7 +169,7 @@
             }
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="bottom-left"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="bottom-left"] {
             &::after {
                 transform: translate3d(calc(-100% + 16px), -10px, 0);
                 top: 100%;
@@ -180,7 +180,7 @@
             }
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="bottom-right"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="bottom-right"] {
             &::after {
                 transform: translate3d(calc(0% + -16px), -10px, 0);
                 top: 100%;
@@ -192,7 +192,7 @@
         }
 
         // Left position tooltips
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="left"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="left"] {
             &::before,
             &::after {
                 inset: auto auto auto 100%;
@@ -224,7 +224,7 @@
         }
 
         // Right position tooltips
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-position="right"] {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-position="right"] {
             &::before,
             &::after {
                 bottom: auto;
@@ -255,17 +255,17 @@
         }
 
         // Tooltip sizes
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-size="small"]::after {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-size="small"]::after {
             white-space: initial;
             width: var(--tooltip-small-width);
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-size="medium"]::after {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-size="medium"]::after {
             white-space: initial;
             width: var(--tooltip-medium-width);
         }
 
-        #{config-flags.$parent-selector} [role~="tooltip"][data-microtip-size="large"]::after {
+        #{config-flags.$parent-selector} [role~="tooltip"][data-tooltip-size="large"]::after {
             white-space: initial;
             width: var(--tooltip-large-width);
         }

package/src/styles/functions/_colors.scss

@@ -83,7 +83,10 @@
     $b: "";
     $a: "";
     $has-alpha: $length == 5 or $length == 9;
-    $component-size: if($length < 6, 1, 2);
+    $component-size: 2;
+    @if $length < 6 {
+        $component-size: 1;
+    }
 
     // Validate and extract color components
     @for $i from 2 through $length {
@@ -255,9 +258,23 @@ $color-cache: (); // to store the generated colors
     $green: math.div(color.channel($color, "green"), 255);
     $blue: math.div(color.channel($color, "blue"), 255);
 
-    $red: if($red <= 0.0393, math.div($red, 12.92), math.pow((math.div($red + 0.055, 1.055)), 2.4));
-    $green: if($green <= 0.0393, math.div($green, 12.92), math.pow((math.div($green + 0.055, 1.055)), 2.4));
-    $blue: if($blue <= 0.0393, math.div($blue, 12.92), math.pow((math.div($blue + 0.055, 1.055)), 2.4));
+    @if $red <= 0.0393 {
+        $red: math.div($red, 12.92);
+    } @else {
+        $red: math.pow(math.div($red + 0.055, 1.055), 2.4);
+    }
+
+    @if $green <= 0.0393 {
+        $green: math.div($green, 12.92);
+    } @else {
+        $green: math.pow(math.div($green + 0.055, 1.055), 2.4);
+    }
+
+    @if $blue <= 0.0393 {
+        $blue: math.div($blue, 12.92);
+    } @else {
+        $blue: math.pow(math.div($blue + 0.055, 1.055), 2.4);
+    }
 
     @return 0.2126 * $red + 0.7152 * $green + 0.0722 * $blue;
 }
@@ -274,7 +291,11 @@ $color-cache: (); // to store the generated colors
     @if map.has-key(config-theme.$light-theme, "text-inverted") {
         $light-color: map.get(config-theme.$light-theme, "text-inverted");
     }
-    @return if($luminance > 0.55, $dark-color, $light-color);
+    @if $luminance > 0.55 {
+        @return $dark-color;
+    } @else {
+        @return $light-color;
+    }
 }
 
 @function is-valid-shade($shade) {

package/src/styles/functions/_math.scss

@@ -6,67 +6,85 @@
 @use "../config/constants" as config-constants;
 @use "./strings" as fn-strings;
 
-@function to-number($value) {
+// Module-level constant - created once, not per function call
+$digit-map: (
+    "0": 0,
+    "1": 1,
+    "2": 2,
+    "3": 3,
+    "4": 4,
+    "5": 5,
+    "6": 6,
+    "7": 7,
+    "8": 8,
+    "9": 9,
+);
+
+// Raw number parsing - returns (number, remaining-string) tuple
+@function to-number-raw($value) {
     @if meta.type-of($value) == "number" {
-        @return $value;
+        @return ($value, "");
     } @else if meta.type-of($value) != "string" {
-        @error "Value for `number` should be a number or a string.";
-        @return $value;
+        @error "Value for `to-number-raw` should be a number or a string.";
+        @return null;
     }
 
     $val: string.unquote(fn-strings.strip-quotes($value));
 
     $result: 0;
     $digits: 0;
-    $minus: string.slice($value, 1, 1) == "-";
-    $numbers: (
-        "0": 0,
-        "1": 1,
-        "2": 2,
-        "3": 3,
-        "4": 4,
-        "5": 5,
-        "6": 6,
-        "7": 7,
-        "8": 8,
-        "9": 9,
-    );
-    $number-chars-end: 0;
+    $minus: string.slice($val, 1, 1) == "-";
+    $sign: if($minus, -1, 1);
+    $start-index: if($minus, 2, 1);
 
-    @for $i from if($minus, 2, 1) through string.length($val) {
+    @for $i from $start-index through string.length($val) {
         $character: string.slice($val, $i, $i);
 
-        @if list.index(map.keys($numbers), $character) or $character == "." {
-            $number-chars-end: $i;
-
+        @if list.index(map.keys($digit-map), $character) or $character == "." {
             @if $character == "." {
                 $digits: 1;
             } @else if $digits == 0 {
-                $result: $result * 10 + map.get($numbers, $character);
+                $result: $result * 10 + map.get($digit-map, $character);
             } @else {
                 $digits: $digits * 10;
-                $result: $result + math.div(map.get($numbers, $character), $digits);
+                $result: $result + math.div(map.get($digit-map, $character), $digits);
             }
         } @else {
-            // Non-numeric character found - check for unit
-            $rest: string.slice($val, $i);
-
-            // Look for valid unit
-            @each $unit in config-constants.$units {
-                @if $rest == $unit {
-                    @return if($minus, -$result, $result) + string.unquote($unit);
-                }
+            @if $i == $start-index {
+                @return null;
             }
+            @return (($sign * $result), string.slice($val, $i));
+        }
+    }
 
-            // No valid unit - return null for non-numeric strings
-            @if $i == if($minus, 2, 1) {
-                @return null; // First char is non-numeric
-            }
+    @return (($sign * $result), "");
+}
+
+// Full conversion with unit handling - calls to-number-raw internally
+@function to-number($value, $append-unit: null) {
+    $parsed: to-number-raw($value);
+    @if not $parsed {
+        @return null;
+    }
+
+    $number: list.nth($parsed, 1);
+
+    @if $append-unit {
+        @return $number + $append-unit;
+    }
+
+    $rest: list.nth($parsed, 2);
+    @if $rest == "" {
+        @return $number;
+    }
 
-            // Otherwise return just the parsed number
-            @return if($minus, -$result, $result);
+    // Check if remaining string is a valid unit
+    @each $unit in config-constants.$units {
+        @if $rest == $unit {
+            @return $number + string.unquote($unit);
         }
     }
 
-    @return if($minus, -$result, $result);
+    // No valid unit found, return just the number
+    @return $number;
 }

package/src/styles/functions/_units.scss

@@ -29,27 +29,26 @@
 // Ensures a value has a unit, adding $default-unit if none exists
 // @param {Number|String} $val - The value to check
 // @return {String} - The value with units
-// todo improve this when we can
 @function fix-units($val, $unit: config-flags.$default-unit, $debug: null) {
+    // Numbers first (hot path for utility generation)
+    @if meta.type-of($val) == "number" {
+        @if math.is-unitless($val) {
+            @return $val + $unit;
+        }
+        @return $val;
+    }
+
     // Handle null values
     @if not $val {
         @return null;
     }
 
-    // Check type
-    @if meta.type-of($val) != "number" and meta.type-of($val) != "string" {
+    // Type validation
+    @if meta.type-of($val) != "string" {
         @error "fix-units() requires a number or string value";
         @return null;
     }
 
-    // Handle number type
-    @if meta.type-of($val) == "number" {
-        @if math.is-unitless($val) {
-            @return $val + $unit;
-        }
-        @return $val;
-    }
-
     // String handling - strip quotes first
     $val: fn-string.strip-quotes($val);
 
@@ -61,21 +60,21 @@
     // Check if string already has units
     @each $u in config-constants.$units {
         @if string.slice($val, -1 * string.length($u)) == $u {
-            // Try to convert numeric strings with units (like "20px") to actual numbers
             $number-part: string.slice($val, 1, string.length($val) - string.length($u));
 
-            @if string.index($number-part, ".") or fn-math.to-number($number-part) {
-                @return fn-math.to-number($number-part) + string.unquote($u);
+            $parsed: fn-math.to-number($number-part, string.unquote($u));
+            @if $parsed {
+                @return $parsed;
             }
 
             @return $val;
         }
     }
 
-    // Try to convert to number if possible
-    @if string.index($val, ".") or fn-math.to-number($val) {
-        $number-val: fn-math.to-number($val);
-        @return $number-val + $unit;
+    // Try to convert to number if possible (unitless case - skip unit detection)
+    $parsed: fn-math.to-number-raw($val);
+    @if $parsed {
+        @return list.nth($parsed, 1) + $unit;
     }
 
     // Default: just add the unit

package/src/styles/layouts/_container.scss

@@ -11,10 +11,8 @@
 }
 
 @mixin container-padding($padding) {
-    & {
-        padding-top: $padding;
-        padding-bottom: $padding;
-    }
+    padding-top: $padding;
+    padding-bottom: $padding;
 }
 
 // Responsive container mixin

package/src/styles/mixins-map.scss

@@ -1 +1 @@
-@use 'base/base' as *; @use 'base/reset' as *; @use 'components/tooltips' as *; @use 'config/borders' as *; @use 'config/breakpoints' as *; @use 'config/colors' as *; @use 'config/constants' as *; @use 'config/container-queries' as *; @use 'config/feature-flags' as *; @use 'config/layouts' as *; @use 'config/shadows' as *; @use 'config/spacing' as *; @use 'config/theme-validation' as *; @use 'config/typography' as *; @use 'functions/breakpoints' as *; @use 'functions/colors' as *; @use 'functions/css-vars' as *; @use 'functions/feature-flags' as *; @use 'functions/math' as *; @use 'functions/strings' as *; @use 'functions/types' as *; @use 'functions/units' as *; @use 'layouts/container' as *; @use 'layouts/flex' as *; @use 'layouts/grid' as *; @use 'themes/theme' as *; @use 'tools/accessibility' as *; @use 'tools/container-queries' as *; @use 'tools/feature-support' as *; @use 'tools/media-queries' as *; @use 'tools/modern-layout' as *; @use 'utilities/alignment' as *; @use 'utilities/animations' as *; @use 'utilities/backdrop-filters' as *; @use 'utilities/borders' as *; @use 'utilities/colors' as *; @use 'utilities/cursor' as *; @use 'utilities/display' as *; @use 'utilities/helpers' as *; @use 'utilities/opacity' as *; @use 'utilities/position' as *; @use 'utilities/shadows' as *; @use 'utilities/sizing' as *; @use 'utilities/spacing' as *; @use 'utilities/transforms' as *; @use 'utilities/transitions' as *; @use 'utilities/typography' as *; @use 'utilities/z-index' as *; @use 'sass:string' as str; @use 'sass:map'; @use 'sass:list'; @mixin apply($mixins...) { @each $mixin in $mixins { $ms: #{$mixin}; @if str.index($ms, '(') { $opening: str.index($ms, '('); $closing: null; $depth: 1; $break: 0; @for $i from $opening + 1 through str.length($ms) { @if $break == 0 { $char: str.slice($ms, $i, $i); @if $char == '(' { $depth: $depth + 1; } @else if $char == ')' { $depth: $depth - 1; @if $depth == 0 { $closing: $i; $break: 1; } } } } @if $closing { $mixin-name: str.slice($ms, 1, $opening - 1); $mixin-params: split(str.slice($ms, $opening + 1, $closing - 1), ','); $full-mixin-call: str.slice($ms, 1, $closing); $modifiers_text: ""; @if str.length($ms) > $closing { $modifiers_text: str.slice($ms, $closing + 1); @while str.slice($modifiers_text, 1, 1) == ' ' { $modifiers_text: str.slice($modifiers_text, 2); } } $breakpoint: null; $state: null; @if $modifiers_text != "" { $modifier-list: str.split($modifiers_text, ' '); @each $mod in $modifier-list { @if map.has-key($breakpoints, $mod) { $breakpoint: $mod; } @else { $state: $mod; } } } @if $state and $breakpoint { @include media-up($breakpoint) { &:#{$state} { @include apply-mixin($full-mixin-call, $mixin-params); } } } @else if $state { &:#{$state} { @include apply-mixin($full-mixin-call, $mixin-params); } } @else if $breakpoint { @include media-up($breakpoint) { @include apply-mixin($full-mixin-call, $mixin-params); } } @else { @include apply-mixin($full-mixin-call, $mixin-params); } } } @else { $parts: str.split($ms, ' '); $base-mixin: list.nth($parts, 1); $breakpoint: null; $state: null; @if list.length($parts) > 1 { @for $i from 2 through list.length($parts) { $mod: list.nth($parts, $i); @if map.has-key($breakpoints, $mod) { $breakpoint: $mod; } @else { $state: $mod; } } } @if $state and $breakpoint { @include media-up($breakpoint) { &:#{$state} { @include apply-mixin($base-mixin); } } } @else if $state { &:#{$state} { @include apply-mixin($base-mixin); } } @else if $breakpoint { @include media-up($breakpoint) { @include apply-mixin($base-mixin); } } @else { @include apply-mixin($base-mixin); } } } } @mixin apply-mixin($ms, $params: null) { @if $ms == 'tooltip-variables' { @include tooltip-variables; } @else if $ms == 'validate-tokens' { @include validate-tokens; } @else if $ms == 'container-base' { @include container-base; } @else if str.index($ms, 'container-padding(') == 1 { $param1: list.nth($params, 1); @include container-padding($param1); } @else if str.index($ms, 'container(') == 1 { $param1: list.nth($params, 1); @include container($param1); } @else if $ms == 'row' { @include row; } @else if $ms == 'row-reverse' { @include row-reverse; } @else if $ms == 'col' { @include col; } @else if $ms == 'col-reverse' { @include col-reverse; } @else if $ms == 'wrap' { @include wrap; } @else if $ms == 'nowrap' { @include nowrap; } @else if $ms == 'wrap-reverse' { @include wrap-reverse; } @else if $ms == 'start' { @include start; } @else if $ms == 'end' { @include end; } @else if $ms == 'center' { @include center; } @else if $ms == 'stretch' { @include stretch; } @else if $ms == 'between' { @include between; } @else if $ms == 'around' { @include around; } @else if $ms == 'evenly' { @include evenly; } @else if $ms == 'x-start' { @include x-start; } @else if $ms == 'x-end' { @include x-end; } @else if $ms == 'x-center' { @include x-center; } @else if $ms == 'x-stretch' { @include x-stretch; } @else if $ms == 'x-baseline' { @include x-baseline; } @else if $ms == 'x-content-start' { @include x-content-start; } @else if $ms == 'x-content-end' { @include x-content-end; } @else if $ms == 'x-content-center' { @include x-content-center; } @else if $ms == 'x-content-between' { @include x-content-between; } @else if $ms == 'x-content-around' { @include x-content-around; } @else if $ms == 'x-content-evenly' { @include x-content-evenly; } @else if $ms == 'x-content-stretch' { @include x-content-stretch; } @else if $ms == 'self-auto' { @include self-auto; } @else if $ms == 'self-start' { @include self-start; } @else if $ms == 'self-end' { @include self-end; } @else if $ms == 'self-center' { @include self-center; } @else if $ms == 'self-stretch' { @include self-stretch; } @else if $ms == 'self-baseline' { @include self-baseline; } @else if $ms == 'shrink' { @include shrink; } @else if $ms == 'no-shrink' { @include no-shrink; } @else if $ms == 'shrink-twice' { @include shrink-twice; } @else if $ms == 'fill-full' { @include fill-full; } @else if $ms == 'fill-auto' { @include fill-auto; } @else if $ms == 'grow' { @include grow; } @else if $ms == 'no-grow' { @include no-grow; } @else if $ms == 'grow-only' { @include grow-only; } @else if str.index($ms, 'fill(') == 1 { $param1: list.nth($params, 1); @include fill($param1); } @else if str.index($ms, 'cols(') == 1 { $param1: list.nth($params, 1); @include cols($param1); } @else if str.index($ms, 'rows(') == 1 { $param1: list.nth($params, 1); @include rows($param1); } @else if str.index($ms, 'cols-custom(') == 1 { $param1: list.nth($params, 1); @include cols-custom($param1); } @else if str.index($ms, 'auto-fit(') == 1 { $param1: list.nth($params, 1); @include auto-fit($param1); } @else if str.index($ms, 'auto-fill(') == 1 { $param1: list.nth($params, 1); @include auto-fill($param1); } @else if $ms == 'flow-in-row' { @include flow-in-row; } @else if $ms == 'flow-in-col' { @include flow-in-col; } @else if $ms == 'flow-dense-items' { @include flow-dense-items; } @else if str.index($ms, 'justify(') == 1 { $param1: list.nth($params, 1); @include justify($param1); } @else if str.index($ms, 'align(') == 1 { $param1: list.nth($params, 1); @include align($param1); } @else if str.index($ms, 'place(') == 1 { $param1: list.nth($params, 1); @include place($param1); } @else if str.index($ms, 'col-span(') == 1 { $param1: list.nth($params, 1); @include col-span($param1); } @else if str.index($ms, 'row-span(') == 1 { $param1: list.nth($params, 1); @include row-span($param1); } @else if str.index($ms, 'col-start(') == 1 { $param1: list.nth($params, 1); @include col-start($param1); } @else if str.index($ms, 'col-end(') == 1 { $param1: list.nth($params, 1); @include col-end($param1); } @else if str.index($ms, 'row-start(') == 1 { $param1: list.nth($params, 1); @include row-start($param1); } @else if str.index($ms, 'row-end(') == 1 { $param1: list.nth($params, 1); @include row-end($param1); } @else if str.index($ms, 'grid-position(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include grid-position($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include grid-position($param1, $param2); } } @else if str.index($ms, 'position-col(') == 1 { $param1: list.nth($params, 1); @include position-col($param1); } @else if str.index($ms, 'position-row(') == 1 { $param1: list.nth($params, 1); @include position-row($param1); } @else if $ms == 'dark-theme' { @include dark-theme; } @else if $ms == 'prefers-dark' { @include prefers-dark; } @else if $ms == 'dark-mode' { @include dark-mode; } @else if $ms == 'reduced-motion' { @include reduced-motion; } @else if $ms == 'high-contrast' { @include high-contrast; } @else if str.index($ms, 'container-up(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-up($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-up($param1, $param2); } } @else if str.index($ms, 'container-down(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-down($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-down($param1, $param2); } } @else if str.index($ms, 'container-between(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-between($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-between($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include container-between($param1, $param2, $param3); } } @else if str.index($ms, 'container-only(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-only($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-only($param1, $param2); } } @else if str.index($ms, 'container-query(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-query($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-query($param1, $param2); } } @else if str.index($ms, 'container-type(') == 1 { $param1: list.nth($params, 1); @include container-type($param1); } @else if str.index($ms, 'container-name(') == 1 { $param1: list.nth($params, 1); @include container-name($param1); } @else if $ms == 'touch' { @include touch; } @else if $ms == 'fine-pointer' { @include fine-pointer; } @else if $ms == 'landscape' { @include landscape; } @else if $ms == 'portrait' { @include portrait; } @else if str.index($ms, 'display-mode(') == 1 { $param1: list.nth($params, 1); @include display-mode($param1); } @else if str.index($ms, 'media-up(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include media-up($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include media-up($param1, $param2); } } @else if str.index($ms, 'media-down(') == 1 { $param1: list.nth($params, 1); @include media-down($param1); } @else if str.index($ms, 'media-between(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include media-between($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include media-between($param1, $param2); } } @else if str.index($ms, 'media-only(') == 1 { $param1: list.nth($params, 1); @include media-only($param1); } @else if str.index($ms, 'aspect-ratio(') == 1 { $param1: list.nth($params, 1); @include aspect-ratio($param1); } @else if $ms == 'dvh' { @include dvh; } @else if str.index($ms, 'safe-area-inset(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include safe-area-inset($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include safe-area-inset($param1, $param2); } } @else if $ms == 'print' { @include print; } @else if str.index($ms, 'supports(') == 1 { $param1: list.nth($params, 1); @include supports($param1); } @else if $ms == 'align-baseline' { @include align-baseline; } @else if $ms == 'align-top' { @include align-top; } @else if $ms == 'align-middle' { @include align-middle; } @else if $ms == 'align-bottom' { @include align-bottom; } @else if str.index($ms, 'ensure-keyframes(') == 1 { $param1: list.nth($params, 1); @include ensure-keyframes($param1); } @else if str.index($ms, 'animate-bounce(') == 1 { $param1: list.nth($params, 1); @include animate-bounce($param1); } @else if $ms == 'hover-ready' { @include hover-ready; } @else if str.index($ms, 'animate-pulse(') == 1 { $param1: list.nth($params, 1); @include animate-pulse($param1); } @else if str.index($ms, 'animate-spin(') == 1 { $param1: list.nth($params, 1); @include animate-spin($param1); } @else if str.index($ms, 'animate-ping(') == 1 { $param1: list.nth($params, 1); @include animate-ping($param1); } @else if str.index($ms, 'animate-fade(') == 1 { $param1: list.nth($params, 1); @include animate-fade($param1); } @else if str.index($ms, 'animate-shake(') == 1 { $param1: list.nth($params, 1); @include animate-shake($param1); } @else if str.index($ms, 'backdrop-filter(') == 1 { $param1: list.nth($params, 1); @include backdrop-filter($param1); } @else if $ms == 'backdrop-layer' { @include backdrop-layer; } @else if str.index($ms, 'backdrop-blur(') == 1 { $param1: list.nth($params, 1); @include backdrop-blur($param1); } @else if str.index($ms, 'backdrop-brightness(') == 1 { $param1: list.nth($params, 1); @include backdrop-brightness($param1); } @else if str.index($ms, 'backdrop-contrast(') == 1 { $param1: list.nth($params, 1); @include backdrop-contrast($param1); } @else if str.index($ms, 'backdrop-grayscale(') == 1 { $param1: list.nth($params, 1); @include backdrop-grayscale($param1); } @else if str.index($ms, 'backdrop-hue-rotate(') == 1 { $param1: list.nth($params, 1); @include backdrop-hue-rotate($param1); } @else if str.index($ms, 'backdrop-invert(') == 1 { $param1: list.nth($params, 1); @include backdrop-invert($param1); } @else if str.index($ms, 'backdrop-saturate(') == 1 { $param1: list.nth($params, 1); @include backdrop-saturate($param1); } @else if str.index($ms, 'backdrop-sepia(') == 1 { $param1: list.nth($params, 1); @include backdrop-sepia($param1); } @else if $ms == 'backdrop-frosted' { @include backdrop-frosted; } @else if $ms == 'backdrop-glass' { @include backdrop-glass; } @else if $ms == 'backdrop-dark-glass' { @include backdrop-dark-glass; } @else if $ms == 'backdrop-crystal' { @include backdrop-crystal; } @else if $ms == 'backdrop-matte' { @include backdrop-matte; } @else if $ms == 'backdrop-none' { @include backdrop-none; } @else if str.index($ms, 'generate-backdrop-filter-utilities(') == 1 { $param1: list.nth($params, 1); @include generate-backdrop-filter-utilities($param1); } @else if str.index($ms, 'border(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include border($param1, $param2, $param3); } } @else if str.index($ms, 'border-top(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-top($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-top($param1, $param2); } } @else if str.index($ms, 'border-right(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-right($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-right($param1, $param2); } } @else if str.index($ms, 'border-bottom(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-bottom($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-bottom($param1, $param2); } } @else if str.index($ms, 'border-left(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-left($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-left($param1, $param2); } } @else if str.index($ms, 'rounded(') == 1 { $param1: list.nth($params, 1); @include rounded($param1); } @else if str.index($ms, 'rounded-t(') == 1 { $param1: list.nth($params, 1); @include rounded-t($param1); } @else if str.index($ms, 'rounded-r(') == 1 { $param1: list.nth($params, 1); @include rounded-r($param1); } @else if str.index($ms, 'rounded-b(') == 1 { $param1: list.nth($params, 1); @include rounded-b($param1); } @else if str.index($ms, 'rounded-l(') == 1 { $param1: list.nth($params, 1); @include rounded-l($param1); } @else if str.index($ms, 'rounded-tl(') == 1 { $param1: list.nth($params, 1); @include rounded-tl($param1); } @else if str.index($ms, 'rounded-tr(') == 1 { $param1: list.nth($params, 1); @include rounded-tr($param1); } @else if str.index($ms, 'rounded-br(') == 1 { $param1: list.nth($params, 1); @include rounded-br($param1); } @else if str.index($ms, 'rounded-bl(') == 1 { $param1: list.nth($params, 1); @include rounded-bl($param1); } @else if str.index($ms, 'border-style(') == 1 { $param1: list.nth($params, 1); @include border-style($param1); } @else if str.index($ms, 'border-color(') == 1 { $param1: list.nth($params, 1); @include border-color($param1); } @else if str.index($ms, 'border-all(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-all($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-all($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include border-all($param1, $param2, $param3); } } @else if $ms == 'pill' { @include pill; } @else if str.index($ms, 'adaptive-contrast(') == 1 { $param1: list.nth($params, 1); @include adaptive-contrast($param1); } @else if str.index($ms, 'bg(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include bg($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include bg($param1, $param2); } } @else if str.index($ms, 'text-color(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include text-color($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include text-color($param1, $param2); } } @else if str.index($ms, 'text-on-color(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include text-on-color($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include text-on-color($param1, $param2); } } @else if str.index($ms, 'gradient(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include gradient($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include gradient($param1, $param2); } } @else if str.index($ms, 'cursor(') == 1 { $param1: list.nth($params, 1); @include cursor($param1); } @else if $ms == 'hide' { @include hide; } @else if $ms == 'block' { @include block; } @else if $ms == 'inline' { @include inline; } @else if $ms == 'inline-block' { @include inline-block; } @else if $ms == 'show' { @include show; } @else if $ms == 'grid' { @include grid; } @else if $ms == 'grid-inline' { @include grid-inline; } @else if $ms == 'flex' { @include flex; } @else if $ms == 'flex-inline' { @include flex-inline; } @else if $ms == 'd-tbl' { @include d-tbl; } @else if $ms == 'd-tbl-row' { @include d-tbl-row; } @else if $ms == 'd-tbl-cell' { @include d-tbl-cell; } @else if $ms == 'visible' { @include visible; } @else if $ms == 'invisible' { @include invisible; } @else if $ms == 'collapse' { @include collapse; } @else if $ms == 'contents' { @include contents; } @else if $ms == 'overflow-hidden' { @include overflow-hidden; } @else if $ms == 'overflow-visible' { @include overflow-visible; } @else if $ms == 'overflow-scroll' { @include overflow-scroll; } @else if $ms == 'overflow-auto' { @include overflow-auto; } @else if $ms == 'overflow-x-hidden' { @include overflow-x-hidden; } @else if $ms == 'overflow-y-hidden' { @include overflow-y-hidden; } @else if $ms == 'overflow-x-scroll' { @include overflow-x-scroll; } @else if $ms == 'overflow-y-scroll' { @include overflow-y-scroll; } @else if $ms == 'overflow-x-auto' { @include overflow-x-auto; } @else if $ms == 'overflow-y-auto' { @include overflow-y-auto; } @else if str.index($ms, 'opacity(') == 1 { $param1: list.nth($params, 1); @include opacity($param1); } @else if $ms == 'static' { @include static; } @else if $ms == 'relative' { @include relative; } @else if $ms == 'absolute' { @include absolute; } @else if $ms == 'fixed' { @include fixed; } @else if $ms == 'sticky' { @include sticky; } @else if str.index($ms, 'top(') == 1 { $param1: list.nth($params, 1); @include top($param1); } @else if str.index($ms, 'right(') == 1 { $param1: list.nth($params, 1); @include right($param1); } @else if str.index($ms, 'bottom(') == 1 { $param1: list.nth($params, 1); @include bottom($param1); } @else if str.index($ms, 'left(') == 1 { $param1: list.nth($params, 1); @include left($param1); } @else if $ms == 'absolute-center' { @include absolute-center; } @else if str.index($ms, 'shadow-base(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow-base($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow-base($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include shadow-base($param1, $param2, $param3); } @else if (list.length($params) == 4) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); $param4: list.nth($params, 4); @include shadow-base($param1, $param2, $param3, $param4); } @else if (list.length($params) == 5) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); $param4: list.nth($params, 4); $param5: list.nth($params, 5); @include shadow-base($param1, $param2, $param3, $param4, $param5); } } @else if str.index($ms, 'shadow(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow($param1, $param2); } } @else if str.index($ms, 'shadow-inset(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow-inset($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow-inset($param1, $param2); } } @else if str.index($ms, 'elevation(') == 1 { $param1: list.nth($params, 1); @include elevation($param1); } @else if str.index($ms, 'width(') == 1 { $param1: list.nth($params, 1); @include width($param1); } @else if str.index($ms, 'height(') == 1 { $param1: list.nth($params, 1); @include height($param1); } @else if str.index($ms, 'min-width(') == 1 { $param1: list.nth($params, 1); @include min-width($param1); } @else if str.index($ms, 'min-height(') == 1 { $param1: list.nth($params, 1); @include min-height($param1); } @else if str.index($ms, 'max-width(') == 1 { $param1: list.nth($params, 1); @include max-width($param1); } @else if str.index($ms, 'max-height(') == 1 { $param1: list.nth($params, 1); @include max-height($param1); } @else if str.index($ms, 'width-percent(') == 1 { $param1: list.nth($params, 1); @include width-percent($param1); } @else if str.index($ms, 'height-percent(') == 1 { $param1: list.nth($params, 1); @include height-percent($param1); } @else if str.index($ms, 'min-width-percent(') == 1 { $param1: list.nth($params, 1); @include min-width-percent($param1); } @else if str.index($ms, 'min-height-percent(') == 1 { $param1: list.nth($params, 1); @include min-height-percent($param1); } @else if str.index($ms, 'max-width-percent(') == 1 { $param1: list.nth($params, 1); @include max-width-percent($param1); } @else if str.index($ms, 'max-height-percent(') == 1 { $param1: list.nth($params, 1); @include max-height-percent($param1); } @else if $ms == 'w-auto' { @include w-auto; } @else if $ms == 'w-full' { @include w-full; } @else if $ms == 'h-auto' { @include h-auto; } @else if $ms == 'h-full' { @include h-full; } @else if $ms == 'w-max' { @include w-max; } @else if $ms == 'h-max' { @include h-max; } @else if $ms == 'w-min' { @include w-min; } @else if $ms == 'h-min' { @include h-min; } @else if $ms == 'w-fit' { @include w-fit; } @else if $ms == 'h-fit' { @include h-fit; } @else if $ms == 'min-w-full' { @include min-w-full; } @else if $ms == 'max-w-full' { @include max-w-full; } @else if $ms == 'min-h-full' { @include min-h-full; } @else if $ms == 'max-h-full' { @include max-h-full; } @else if $ms == 'w-screen' { @include w-screen; } @else if $ms == 'h-screen' { @include h-screen; } @else if str.index($ms, 'p(') == 1 { $param1: list.nth($params, 1); @include p($param1); } @else if str.index($ms, 'px(') == 1 { $param1: list.nth($params, 1); @include px($param1); } @else if str.index($ms, 'py(') == 1 { $param1: list.nth($params, 1); @include py($param1); } @else if str.index($ms, 'pt(') == 1 { $param1: list.nth($params, 1); @include pt($param1); } @else if str.index($ms, 'pr(') == 1 { $param1: list.nth($params, 1); @include pr($param1); } @else if str.index($ms, 'pb(') == 1 { $param1: list.nth($params, 1); @include pb($param1); } @else if str.index($ms, 'pl(') == 1 { $param1: list.nth($params, 1); @include pl($param1); } @else if str.index($ms, 'm(') == 1 { $param1: list.nth($params, 1); @include m($param1); } @else if str.index($ms, 'mx(') == 1 { $param1: list.nth($params, 1); @include mx($param1); } @else if str.index($ms, 'my(') == 1 { $param1: list.nth($params, 1); @include my($param1); } @else if str.index($ms, 'mt(') == 1 { $param1: list.nth($params, 1); @include mt($param1); } @else if str.index($ms, 'mr(') == 1 { $param1: list.nth($params, 1); @include mr($param1); } @else if str.index($ms, 'mb(') == 1 { $param1: list.nth($params, 1); @include mb($param1); } @else if str.index($ms, 'ml(') == 1 { $param1: list.nth($params, 1); @include ml($param1); } @else if $ms == 'ml-auto' { @include ml-auto; } @else if $ms == 'mr-auto' { @include mr-auto; } @else if $ms == 'mx-auto' { @include mx-auto; } @else if str.index($ms, 'inset(') == 1 { $param1: list.nth($params, 1); @include inset($param1); } @else if str.index($ms, 'inset-x(') == 1 { $param1: list.nth($params, 1); @include inset-x($param1); } @else if str.index($ms, 'inset-y(') == 1 { $param1: list.nth($params, 1); @include inset-y($param1); } @else if $ms == 'inset-auto' { @include inset-auto; } @else if $ms == 'inset-x-auto' { @include inset-x-auto; } @else if $ms == 'inset-y-auto' { @include inset-y-auto; } @else if str.index($ms, 'space-y(') == 1 { $param1: list.nth($params, 1); @include space-y($param1); } @else if str.index($ms, 'space-x(') == 1 { $param1: list.nth($params, 1); @include space-x($param1); } @else if str.index($ms, 'gap(') == 1 { $param1: list.nth($params, 1); @include gap($param1); } @else if str.index($ms, 'gap-x(') == 1 { $param1: list.nth($params, 1); @include gap-x($param1); } @else if str.index($ms, 'gap-y(') == 1 { $param1: list.nth($params, 1); @include gap-y($param1); } @else if $ms == 'apply-transform' { @include apply-transform; } @else if str.index($ms, 'translate-x(') == 1 { $param1: list.nth($params, 1); @include translate-x($param1); } @else if str.index($ms, 'translate-y(') == 1 { $param1: list.nth($params, 1); @include translate-y($param1); } @else if str.index($ms, 'translate-z(') == 1 { $param1: list.nth($params, 1); @include translate-z($param1); } @else if str.index($ms, 'translate(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include translate($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include translate($param1, $param2); } } @else if str.index($ms, 'scale-x(') == 1 { $param1: list.nth($params, 1); @include scale-x($param1); } @else if str.index($ms, 'scale-y(') == 1 { $param1: list.nth($params, 1); @include scale-y($param1); } @else if str.index($ms, 'scale(') == 1 { $param1: list.nth($params, 1); @include scale($param1); } @else if str.index($ms, 'rotate(') == 1 { $param1: list.nth($params, 1); @include rotate($param1); } @else if str.index($ms, 'skew-x(') == 1 { $param1: list.nth($params, 1); @include skew-x($param1); } @else if str.index($ms, 'skew-y(') == 1 { $param1: list.nth($params, 1); @include skew-y($param1); } @else if str.index($ms, 'origin(') == 1 { $param1: list.nth($params, 1); @include origin($param1); } @else if $ms == 'transition-none' { @include transition-none; } @else if $ms == 'transition' { @include transition; } @else if $ms == 'transition-colors' { @include transition-colors; } @else if $ms == 'transition-opacity' { @include transition-opacity; } @else if $ms == 'transition-shadow' { @include transition-shadow; } @else if $ms == 'transition-transform' { @include transition-transform; } @else if str.index($ms, 'duration(') == 1 { $param1: list.nth($params, 1); @include duration($param1); } @else if $ms == 'ease-linear' { @include ease-linear; } @else if $ms == 'ease-in' { @include ease-in; } @else if $ms == 'ease-out' { @include ease-out; } @else if $ms == 'ease-in-out' { @include ease-in-out; } @else if str.index($ms, 'delay(') == 1 { $param1: list.nth($params, 1); @include delay($param1); } @else if str.index($ms, 'text-size(') == 1 { $param1: list.nth($params, 1); @include text-size($param1); } @else if str.index($ms, 'font-size(') == 1 { $param1: list.nth($params, 1); @include font-size($param1); } @else if str.index($ms, 'font(') == 1 { $param1: list.nth($params, 1); @include font($param1); } @else if str.index($ms, 'leading(') == 1 { $param1: list.nth($params, 1); @include leading($param1); } @else if $ms == 'leading-none' { @include leading-none; } @else if $ms == 'leading-tight' { @include leading-tight; } @else if $ms == 'leading-snug' { @include leading-snug; } @else if $ms == 'leading-normal' { @include leading-normal; } @else if $ms == 'leading-relaxed' { @include leading-relaxed; } @else if $ms == 'leading-loose' { @include leading-loose; } @else if $ms == 'text-left' { @include text-left; } @else if $ms == 'text-center' { @include text-center; } @else if $ms == 'text-right' { @include text-right; } @else if $ms == 'text-justify' { @include text-justify; } @else if $ms == 'uppercase' { @include uppercase; } @else if $ms == 'lowercase' { @include lowercase; } @else if $ms == 'capitalize' { @include capitalize; } @else if $ms == 'normal-case' { @include normal-case; } @else if $ms == 'italic' { @include italic; } @else if $ms == 'not-italic' { @include not-italic; } @else if $ms == 'underline' { @include underline; } @else if $ms == 'line-through' { @include line-through; } @else if $ms == 'no-underline' { @include no-underline; } @else if $ms == 'truncate' { @include truncate; } @else if $ms == 'overflow-label' { @include overflow-label; } @else if str.index($ms, 'truncate-lines(') == 1 { $param1: list.nth($params, 1); @include truncate-lines($param1); } @else if $ms == 'break-normal' { @include break-normal; } @else if $ms == 'break-words' { @include break-words; } @else if $ms == 'break-all' { @include break-all; } @else if $ms == 'whitespace-normal' { @include whitespace-normal; } @else if $ms == 'whitespace-nowrap' { @include whitespace-nowrap; } @else if $ms == 'whitespace-pre' { @include whitespace-pre; } @else if $ms == 'whitespace-pre-line' { @include whitespace-pre-line; } @else if $ms == 'whitespace-pre-wrap' { @include whitespace-pre-wrap; } @else if str.index($ms, 'tracking(') == 1 { $param1: list.nth($params, 1); @include tracking($param1); } @else if $ms == 'tracking-tighter' { @include tracking-tighter; } @else if $ms == 'tracking-tight' { @include tracking-tight; } @else if $ms == 'tracking-normal' { @include tracking-normal; } @else if $ms == 'tracking-wide' { @include tracking-wide; } @else if $ms == 'tracking-wider' { @include tracking-wider; } @else if $ms == 'tracking-widest' { @include tracking-widest; } @else if str.index($ms, 'responsive-config-typo(') == 1 { $param1: list.nth($params, 1); @include responsive-config-typo($param1); } @else if str.index($ms, 'z-index(') == 1 { $param1: list.nth($params, 1); @include z-index($param1); } @else if str.index($ms, 'z-index-utilities(') == 1 { $param1: list.nth($params, 1); @include z-index-utilities($param1); } @else if $ms == 'z-base' { @include z-base; } @else if $ms == 'z-hover' { @include z-hover; } @else if $ms == 'z-dropdown' { @include z-dropdown; } @else if $ms == 'z-sticky' { @include z-sticky; } @else if $ms == 'z-fixed' { @include z-fixed; } @else if $ms == 'z-drawer' { @include z-drawer; } @else if $ms == 'z-modal' { @include z-modal; } @else if $ms == 'z-popover' { @include z-popover; } @else if $ms == 'z-tooltip' { @include z-tooltip; } @else if $ms == 'z-overlay' { @include z-overlay; } @else if $ms == 'z-toast' { @include z-toast; } @else if $ms == 'z-max' { @include z-max; } @else if $ms == 'z-auto' { @include z-auto; } @else { @debug 'Mixin not found: ' + $ms; } }
+@use 'base/base' as *; @use 'base/reset' as *; @use 'components/tooltips' as *; @use 'config/borders' as *; @use 'config/breakpoints' as *; @use 'config/colors' as *; @use 'config/constants' as *; @use 'config/container-queries' as *; @use 'config/feature-flags' as *; @use 'config/layouts' as *; @use 'config/shadows' as *; @use 'config/spacing' as *; @use 'config/theme-validation' as *; @use 'config/typography' as *; @use 'functions/breakpoints' as *; @use 'functions/colors' as *; @use 'functions/css-vars' as *; @use 'functions/feature-flags' as *; @use 'functions/math' as *; @use 'functions/strings' as *; @use 'functions/types' as *; @use 'functions/units' as *; @use 'layouts/container' as *; @use 'layouts/flex' as *; @use 'layouts/grid' as *; @use 'themes/theme' as *; @use 'tools/accessibility' as *; @use 'tools/container-queries' as *; @use 'tools/feature-support' as *; @use 'tools/media-queries' as *; @use 'tools/modern-layout' as *; @use 'utilities/alignment' as *; @use 'utilities/animations' as *; @use 'utilities/backdrop-filters' as *; @use 'utilities/borders' as *; @use 'utilities/colors' as *; @use 'utilities/cursor' as *; @use 'utilities/display' as *; @use 'utilities/helpers' as *; @use 'utilities/opacity' as *; @use 'utilities/position' as *; @use 'utilities/shadows' as *; @use 'utilities/sizing' as *; @use 'utilities/spacing' as *; @use 'utilities/transforms' as *; @use 'utilities/transitions' as *; @use 'utilities/typography' as *; @use 'utilities/z-index' as *; @use 'sass:string' as str; @use 'sass:map'; @use 'sass:list'; @mixin apply($mixins...) { @each $mixin in $mixins { $ms: #{$mixin}; @if str.index($ms, '(') { $opening: str.index($ms, '('); $closing: null; $depth: 1; $break: 0; @for $i from $opening + 1 through str.length($ms) { @if $break == 0 { $char: str.slice($ms, $i, $i); @if $char == '(' { $depth: $depth + 1; } @else if $char == ')' { $depth: $depth - 1; @if $depth == 0 { $closing: $i; $break: 1; } } } } @if $closing { $mixin-name: str.slice($ms, 1, $opening - 1); $mixin-params: split(str.slice($ms, $opening + 1, $closing - 1), ','); $full-mixin-call: str.slice($ms, 1, $closing); $modifiers_text: ""; @if str.length($ms) > $closing { $modifiers_text: str.slice($ms, $closing + 1); @while str.slice($modifiers_text, 1, 1) == ' ' { $modifiers_text: str.slice($modifiers_text, 2); } } $breakpoint: null; $state: null; @if $modifiers_text != "" { $modifier-list: str.split($modifiers_text, ' '); @each $mod in $modifier-list { @if map.has-key($breakpoints, $mod) { $breakpoint: $mod; } @else { $state: $mod; } } } @if $state and $breakpoint { @include media-up($breakpoint) { &:#{$state} { @include apply-mixin($full-mixin-call, $mixin-params); } } } @else if $state { &:#{$state} { @include apply-mixin($full-mixin-call, $mixin-params); } } @else if $breakpoint { @include media-up($breakpoint) { @include apply-mixin($full-mixin-call, $mixin-params); } } @else { @include apply-mixin($full-mixin-call, $mixin-params); } } } @else { $parts: str.split($ms, ' '); $base-mixin: list.nth($parts, 1); $breakpoint: null; $state: null; @if list.length($parts) > 1 { @for $i from 2 through list.length($parts) { $mod: list.nth($parts, $i); @if map.has-key($breakpoints, $mod) { $breakpoint: $mod; } @else { $state: $mod; } } } @if $state and $breakpoint { @include media-up($breakpoint) { &:#{$state} { @include apply-mixin($base-mixin); } } } @else if $state { &:#{$state} { @include apply-mixin($base-mixin); } } @else if $breakpoint { @include media-up($breakpoint) { @include apply-mixin($base-mixin); } } @else { @include apply-mixin($base-mixin); } } } } @mixin apply-mixin($ms, $params: null) { $fc: str.slice($ms, 1, 1); @if $fc == 'b' { @if $ms == 'block' { @include block; } @else if $ms == 'between' { @include between; } @else if str.index($ms, 'bg(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include bg($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include bg($param1, $param2); } } @else if str.index($ms, 'border(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include border($param1, $param2, $param3); } } @else if str.index($ms, 'bottom(') == 1 { $param1: list.nth($params, 1); @include bottom($param1); } @else if $ms == 'break-all' { @include break-all; } @else if str.index($ms, 'border-top(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-top($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-top($param1, $param2); } } @else if str.index($ms, 'border-all(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-all($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-all($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include border-all($param1, $param2, $param3); } } @else if str.index($ms, 'border-left(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-left($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-left($param1, $param2); } } @else if $ms == 'break-words' { @include break-words; } @else if str.index($ms, 'border-right(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-right($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-right($param1, $param2); } } @else if str.index($ms, 'border-style(') == 1 { $param1: list.nth($params, 1); @include border-style($param1); } @else if str.index($ms, 'border-color(') == 1 { $param1: list.nth($params, 1); @include border-color($param1); } @else if $ms == 'break-normal' { @include break-normal; } @else if str.index($ms, 'backdrop-blur(') == 1 { $param1: list.nth($params, 1); @include backdrop-blur($param1); } @else if $ms == 'backdrop-none' { @include backdrop-none; } @else if str.index($ms, 'border-bottom(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include border-bottom($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include border-bottom($param1, $param2); } } @else if $ms == 'backdrop-layer' { @include backdrop-layer; } @else if str.index($ms, 'backdrop-sepia(') == 1 { $param1: list.nth($params, 1); @include backdrop-sepia($param1); } @else if $ms == 'backdrop-glass' { @include backdrop-glass; } @else if $ms == 'backdrop-matte' { @include backdrop-matte; } @else if str.index($ms, 'backdrop-filter(') == 1 { $param1: list.nth($params, 1); @include backdrop-filter($param1); } @else if str.index($ms, 'backdrop-invert(') == 1 { $param1: list.nth($params, 1); @include backdrop-invert($param1); } @else if $ms == 'backdrop-frosted' { @include backdrop-frosted; } @else if $ms == 'backdrop-crystal' { @include backdrop-crystal; } @else if str.index($ms, 'backdrop-contrast(') == 1 { $param1: list.nth($params, 1); @include backdrop-contrast($param1); } @else if str.index($ms, 'backdrop-saturate(') == 1 { $param1: list.nth($params, 1); @include backdrop-saturate($param1); } @else if str.index($ms, 'backdrop-grayscale(') == 1 { $param1: list.nth($params, 1); @include backdrop-grayscale($param1); } @else if str.index($ms, 'backdrop-brightness(') == 1 { $param1: list.nth($params, 1); @include backdrop-brightness($param1); } @else if str.index($ms, 'backdrop-hue-rotate(') == 1 { $param1: list.nth($params, 1); @include backdrop-hue-rotate($param1); } @else if $ms == 'backdrop-dark-glass' { @include backdrop-dark-glass; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 't' { @if str.index($ms, 'text-color(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include text-color($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include text-color($param1, $param2); } } @else if str.index($ms, 'top(') == 1 { $param1: list.nth($params, 1); @include top($param1); } @else if $ms == 'transition' { @include transition; } @else if $ms == 'truncate' { @include truncate; } @else if $ms == 'touch' { @include touch; } @else if str.index($ms, 'tracking(') == 1 { $param1: list.nth($params, 1); @include tracking($param1); } @else if str.index($ms, 'translate(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include translate($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include translate($param1, $param2); } } @else if str.index($ms, 'text-size(') == 1 { $param1: list.nth($params, 1); @include text-size($param1); } @else if $ms == 'text-left' { @include text-left; } @else if $ms == 'text-right' { @include text-right; } @else if str.index($ms, 'translate-x(') == 1 { $param1: list.nth($params, 1); @include translate-x($param1); } @else if str.index($ms, 'translate-y(') == 1 { $param1: list.nth($params, 1); @include translate-y($param1); } @else if str.index($ms, 'translate-z(') == 1 { $param1: list.nth($params, 1); @include translate-z($param1); } @else if $ms == 'text-center' { @include text-center; } @else if $ms == 'text-justify' { @include text-justify; } @else if str.index($ms, 'text-on-color(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include text-on-color($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include text-on-color($param1, $param2); } } @else if $ms == 'tracking-wide' { @include tracking-wide; } @else if str.index($ms, 'truncate-lines(') == 1 { $param1: list.nth($params, 1); @include truncate-lines($param1); } @else if $ms == 'tracking-tight' { @include tracking-tight; } @else if $ms == 'tracking-wider' { @include tracking-wider; } @else if $ms == 'transition-none' { @include transition-none; } @else if $ms == 'tracking-normal' { @include tracking-normal; } @else if $ms == 'tracking-widest' { @include tracking-widest; } @else if $ms == 'tracking-tighter' { @include tracking-tighter; } @else if $ms == 'tooltip-variables' { @include tooltip-variables; } @else if $ms == 'transition-colors' { @include transition-colors; } @else if $ms == 'transition-shadow' { @include transition-shadow; } @else if $ms == 'transition-opacity' { @include transition-opacity; } @else if $ms == 'transition-transform' { @include transition-transform; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'm' { @if str.index($ms, 'm(') == 1 { $param1: list.nth($params, 1); @include m($param1); } @else if str.index($ms, 'mx(') == 1 { $param1: list.nth($params, 1); @include mx($param1); } @else if str.index($ms, 'my(') == 1 { $param1: list.nth($params, 1); @include my($param1); } @else if str.index($ms, 'mt(') == 1 { $param1: list.nth($params, 1); @include mt($param1); } @else if str.index($ms, 'mr(') == 1 { $param1: list.nth($params, 1); @include mr($param1); } @else if str.index($ms, 'mb(') == 1 { $param1: list.nth($params, 1); @include mb($param1); } @else if str.index($ms, 'ml(') == 1 { $param1: list.nth($params, 1); @include ml($param1); } @else if $ms == 'ml-auto' { @include ml-auto; } @else if $ms == 'mr-auto' { @include mr-auto; } @else if $ms == 'mx-auto' { @include mx-auto; } @else if str.index($ms, 'media-up(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include media-up($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include media-up($param1, $param2); } } @else if str.index($ms, 'min-width(') == 1 { $param1: list.nth($params, 1); @include min-width($param1); } @else if str.index($ms, 'max-width(') == 1 { $param1: list.nth($params, 1); @include max-width($param1); } @else if str.index($ms, 'media-down(') == 1 { $param1: list.nth($params, 1); @include media-down($param1); } @else if str.index($ms, 'media-only(') == 1 { $param1: list.nth($params, 1); @include media-only($param1); } @else if str.index($ms, 'min-height(') == 1 { $param1: list.nth($params, 1); @include min-height($param1); } @else if str.index($ms, 'max-height(') == 1 { $param1: list.nth($params, 1); @include max-height($param1); } @else if $ms == 'min-w-full' { @include min-w-full; } @else if $ms == 'max-w-full' { @include max-w-full; } @else if $ms == 'min-h-full' { @include min-h-full; } @else if $ms == 'max-h-full' { @include max-h-full; } @else if str.index($ms, 'media-between(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include media-between($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include media-between($param1, $param2); } } @else if str.index($ms, 'min-width-percent(') == 1 { $param1: list.nth($params, 1); @include min-width-percent($param1); } @else if str.index($ms, 'max-width-percent(') == 1 { $param1: list.nth($params, 1); @include max-width-percent($param1); } @else if str.index($ms, 'min-height-percent(') == 1 { $param1: list.nth($params, 1); @include min-height-percent($param1); } @else if str.index($ms, 'max-height-percent(') == 1 { $param1: list.nth($params, 1); @include max-height-percent($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 's' { @if $ms == 'show' { @include show; } @else if $ms == 'start' { @include start; } @else if $ms == 'stretch' { @include stretch; } @else if $ms == 'sticky' { @include sticky; } @else if str.index($ms, 'shadow(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow($param1, $param2); } } @else if str.index($ms, 'scale(') == 1 { $param1: list.nth($params, 1); @include scale($param1); } @else if $ms == 'shrink' { @include shrink; } @else if $ms == 'static' { @include static; } @else if str.index($ms, 'skew-x(') == 1 { $param1: list.nth($params, 1); @include skew-x($param1); } @else if str.index($ms, 'skew-y(') == 1 { $param1: list.nth($params, 1); @include skew-y($param1); } @else if str.index($ms, 'space-y(') == 1 { $param1: list.nth($params, 1); @include space-y($param1); } @else if str.index($ms, 'space-x(') == 1 { $param1: list.nth($params, 1); @include space-x($param1); } @else if str.index($ms, 'scale-x(') == 1 { $param1: list.nth($params, 1); @include scale-x($param1); } @else if str.index($ms, 'scale-y(') == 1 { $param1: list.nth($params, 1); @include scale-y($param1); } @else if $ms == 'self-end' { @include self-end; } @else if str.index($ms, 'supports(') == 1 { $param1: list.nth($params, 1); @include supports($param1); } @else if $ms == 'self-auto' { @include self-auto; } @else if $ms == 'self-start' { @include self-start; } @else if $ms == 'self-center' { @include self-center; } @else if str.index($ms, 'shadow-base(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow-base($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow-base($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include shadow-base($param1, $param2, $param3); } @else if (list.length($params) == 4) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); $param4: list.nth($params, 4); @include shadow-base($param1, $param2, $param3, $param4); } @else if (list.length($params) == 5) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); $param4: list.nth($params, 4); $param5: list.nth($params, 5); @include shadow-base($param1, $param2, $param3, $param4, $param5); } } @else if $ms == 'self-stretch' { @include self-stretch; } @else if $ms == 'shrink-twice' { @include shrink-twice; } @else if str.index($ms, 'shadow-inset(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include shadow-inset($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include shadow-inset($param1, $param2); } } @else if $ms == 'self-baseline' { @include self-baseline; } @else if str.index($ms, 'safe-area-inset(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include safe-area-inset($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include safe-area-inset($param1, $param2); } } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'c' { @if $ms == 'col' { @include col; } @else if $ms == 'center' { @include center; } @else if str.index($ms, 'cursor(') == 1 { $param1: list.nth($params, 1); @include cursor($param1); } @else if str.index($ms, 'cols(') == 1 { $param1: list.nth($params, 1); @include cols($param1); } @else if str.index($ms, 'col-end(') == 1 { $param1: list.nth($params, 1); @include col-end($param1); } @else if str.index($ms, 'col-span(') == 1 { $param1: list.nth($params, 1); @include col-span($param1); } @else if $ms == 'collapse' { @include collapse; } @else if $ms == 'contents' { @include contents; } @else if str.index($ms, 'container(') == 1 { $param1: list.nth($params, 1); @include container($param1); } @else if str.index($ms, 'col-start(') == 1 { $param1: list.nth($params, 1); @include col-start($param1); } @else if $ms == 'capitalize' { @include capitalize; } @else if $ms == 'col-reverse' { @include col-reverse; } @else if str.index($ms, 'cols-custom(') == 1 { $param1: list.nth($params, 1); @include cols-custom($param1); } @else if str.index($ms, 'container-up(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-up($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-up($param1, $param2); } } @else if $ms == 'container-base' { @include container-base; } @else if str.index($ms, 'container-down(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-down($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-down($param1, $param2); } } @else if str.index($ms, 'container-only(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-only($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-only($param1, $param2); } } @else if str.index($ms, 'container-type(') == 1 { $param1: list.nth($params, 1); @include container-type($param1); } @else if str.index($ms, 'container-name(') == 1 { $param1: list.nth($params, 1); @include container-name($param1); } @else if str.index($ms, 'container-query(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-query($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-query($param1, $param2); } } @else if str.index($ms, 'container-padding(') == 1 { $param1: list.nth($params, 1); @include container-padding($param1); } @else if str.index($ms, 'container-between(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include container-between($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include container-between($param1, $param2); } @else if (list.length($params) == 3) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); $param3: list.nth($params, 3); @include container-between($param1, $param2, $param3); } } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'r' { @if $ms == 'row' { @include row; } @else if str.index($ms, 'rounded(') == 1 { $param1: list.nth($params, 1); @include rounded($param1); } @else if $ms == 'relative' { @include relative; } @else if str.index($ms, 'right(') == 1 { $param1: list.nth($params, 1); @include right($param1); } @else if str.index($ms, 'rows(') == 1 { $param1: list.nth($params, 1); @include rows($param1); } @else if str.index($ms, 'rotate(') == 1 { $param1: list.nth($params, 1); @include rotate($param1); } @else if str.index($ms, 'row-end(') == 1 { $param1: list.nth($params, 1); @include row-end($param1); } @else if str.index($ms, 'row-span(') == 1 { $param1: list.nth($params, 1); @include row-span($param1); } @else if str.index($ms, 'row-start(') == 1 { $param1: list.nth($params, 1); @include row-start($param1); } @else if str.index($ms, 'rounded-t(') == 1 { $param1: list.nth($params, 1); @include rounded-t($param1); } @else if str.index($ms, 'rounded-r(') == 1 { $param1: list.nth($params, 1); @include rounded-r($param1); } @else if str.index($ms, 'rounded-b(') == 1 { $param1: list.nth($params, 1); @include rounded-b($param1); } @else if str.index($ms, 'rounded-l(') == 1 { $param1: list.nth($params, 1); @include rounded-l($param1); } @else if str.index($ms, 'rounded-tl(') == 1 { $param1: list.nth($params, 1); @include rounded-tl($param1); } @else if str.index($ms, 'rounded-tr(') == 1 { $param1: list.nth($params, 1); @include rounded-tr($param1); } @else if str.index($ms, 'rounded-br(') == 1 { $param1: list.nth($params, 1); @include rounded-br($param1); } @else if str.index($ms, 'rounded-bl(') == 1 { $param1: list.nth($params, 1); @include rounded-bl($param1); } @else if $ms == 'row-reverse' { @include row-reverse; } @else if $ms == 'reduced-motion' { @include reduced-motion; } @else if str.index($ms, 'responsive-config-typo(') == 1 { $param1: list.nth($params, 1); @include responsive-config-typo($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'a' { @if $ms == 'around' { @include around; } @else if $ms == 'absolute' { @include absolute; } @else if str.index($ms, 'align(') == 1 { $param1: list.nth($params, 1); @include align($param1); } @else if str.index($ms, 'auto-fit(') == 1 { $param1: list.nth($params, 1); @include auto-fit($param1); } @else if str.index($ms, 'auto-fill(') == 1 { $param1: list.nth($params, 1); @include auto-fill($param1); } @else if $ms == 'align-top' { @include align-top; } @else if str.index($ms, 'aspect-ratio(') == 1 { $param1: list.nth($params, 1); @include aspect-ratio($param1); } @else if $ms == 'align-middle' { @include align-middle; } @else if $ms == 'align-bottom' { @include align-bottom; } @else if str.index($ms, 'animate-spin(') == 1 { $param1: list.nth($params, 1); @include animate-spin($param1); } @else if str.index($ms, 'animate-ping(') == 1 { $param1: list.nth($params, 1); @include animate-ping($param1); } @else if str.index($ms, 'animate-fade(') == 1 { $param1: list.nth($params, 1); @include animate-fade($param1); } @else if str.index($ms, 'animate-pulse(') == 1 { $param1: list.nth($params, 1); @include animate-pulse($param1); } @else if str.index($ms, 'animate-shake(') == 1 { $param1: list.nth($params, 1); @include animate-shake($param1); } @else if $ms == 'align-baseline' { @include align-baseline; } @else if str.index($ms, 'animate-bounce(') == 1 { $param1: list.nth($params, 1); @include animate-bounce($param1); } @else if $ms == 'absolute-center' { @include absolute-center; } @else if $ms == 'apply-transform' { @include apply-transform; } @else if str.index($ms, 'adaptive-contrast(') == 1 { $param1: list.nth($params, 1); @include adaptive-contrast($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'w' { @if $ms == 'wrap' { @include wrap; } @else if str.index($ms, 'width(') == 1 { $param1: list.nth($params, 1); @include width($param1); } @else if $ms == 'w-full' { @include w-full; } @else if $ms == 'w-max' { @include w-max; } @else if $ms == 'w-min' { @include w-min; } @else if $ms == 'w-fit' { @include w-fit; } @else if $ms == 'w-auto' { @include w-auto; } @else if $ms == 'w-screen' { @include w-screen; } @else if $ms == 'wrap-reverse' { @include wrap-reverse; } @else if str.index($ms, 'width-percent(') == 1 { $param1: list.nth($params, 1); @include width-percent($param1); } @else if $ms == 'whitespace-pre' { @include whitespace-pre; } @else if $ms == 'whitespace-normal' { @include whitespace-normal; } @else if $ms == 'whitespace-nowrap' { @include whitespace-nowrap; } @else if $ms == 'whitespace-pre-line' { @include whitespace-pre-line; } @else if $ms == 'whitespace-pre-wrap' { @include whitespace-pre-wrap; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'z' { @if str.index($ms, 'z-index(') == 1 { $param1: list.nth($params, 1); @include z-index($param1); } @else if $ms == 'z-max' { @include z-max; } @else if $ms == 'z-base' { @include z-base; } @else if $ms == 'z-auto' { @include z-auto; } @else if $ms == 'z-hover' { @include z-hover; } @else if $ms == 'z-fixed' { @include z-fixed; } @else if $ms == 'z-modal' { @include z-modal; } @else if $ms == 'z-toast' { @include z-toast; } @else if $ms == 'z-sticky' { @include z-sticky; } @else if $ms == 'z-drawer' { @include z-drawer; } @else if $ms == 'z-popover' { @include z-popover; } @else if $ms == 'z-tooltip' { @include z-tooltip; } @else if $ms == 'z-overlay' { @include z-overlay; } @else if $ms == 'z-dropdown' { @include z-dropdown; } @else if str.index($ms, 'z-index-utilities(') == 1 { $param1: list.nth($params, 1); @include z-index-utilities($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'p' { @if str.index($ms, 'p(') == 1 { $param1: list.nth($params, 1); @include p($param1); } @else if str.index($ms, 'px(') == 1 { $param1: list.nth($params, 1); @include px($param1); } @else if str.index($ms, 'py(') == 1 { $param1: list.nth($params, 1); @include py($param1); } @else if str.index($ms, 'pt(') == 1 { $param1: list.nth($params, 1); @include pt($param1); } @else if str.index($ms, 'pr(') == 1 { $param1: list.nth($params, 1); @include pr($param1); } @else if str.index($ms, 'pb(') == 1 { $param1: list.nth($params, 1); @include pb($param1); } @else if str.index($ms, 'pl(') == 1 { $param1: list.nth($params, 1); @include pl($param1); } @else if $ms == 'pill' { @include pill; } @else if str.index($ms, 'place(') == 1 { $param1: list.nth($params, 1); @include place($param1); } @else if $ms == 'print' { @include print; } @else if $ms == 'portrait' { @include portrait; } @else if str.index($ms, 'position-col(') == 1 { $param1: list.nth($params, 1); @include position-col($param1); } @else if str.index($ms, 'position-row(') == 1 { $param1: list.nth($params, 1); @include position-row($param1); } @else if $ms == 'prefers-dark' { @include prefers-dark; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'o' { @if str.index($ms, 'opacity(') == 1 { $param1: list.nth($params, 1); @include opacity($param1); } @else if $ms == 'overflow-hidden' { @include overflow-hidden; } @else if str.index($ms, 'origin(') == 1 { $param1: list.nth($params, 1); @include origin($param1); } @else if $ms == 'overflow-auto' { @include overflow-auto; } @else if $ms == 'overflow-label' { @include overflow-label; } @else if $ms == 'overflow-scroll' { @include overflow-scroll; } @else if $ms == 'overflow-x-auto' { @include overflow-x-auto; } @else if $ms == 'overflow-y-auto' { @include overflow-y-auto; } @else if $ms == 'overflow-visible' { @include overflow-visible; } @else if $ms == 'overflow-x-hidden' { @include overflow-x-hidden; } @else if $ms == 'overflow-y-hidden' { @include overflow-y-hidden; } @else if $ms == 'overflow-x-scroll' { @include overflow-x-scroll; } @else if $ms == 'overflow-y-scroll' { @include overflow-y-scroll; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'x' { @if $ms == 'x-center' { @include x-center; } @else if $ms == 'x-start' { @include x-start; } @else if $ms == 'x-end' { @include x-end; } @else if $ms == 'x-stretch' { @include x-stretch; } @else if $ms == 'x-baseline' { @include x-baseline; } @else if $ms == 'x-content-end' { @include x-content-end; } @else if $ms == 'x-content-start' { @include x-content-start; } @else if $ms == 'x-content-center' { @include x-content-center; } @else if $ms == 'x-content-around' { @include x-content-around; } @else if $ms == 'x-content-evenly' { @include x-content-evenly; } @else if $ms == 'x-content-between' { @include x-content-between; } @else if $ms == 'x-content-stretch' { @include x-content-stretch; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'f' { @if $ms == 'flex' { @include flex; } @else if $ms == 'fixed' { @include fixed; } @else if str.index($ms, 'fill(') == 1 { $param1: list.nth($params, 1); @include fill($param1); } @else if str.index($ms, 'font(') == 1 { $param1: list.nth($params, 1); @include font($param1); } @else if $ms == 'fill-full' { @include fill-full; } @else if $ms == 'fill-auto' { @include fill-auto; } @else if str.index($ms, 'font-size(') == 1 { $param1: list.nth($params, 1); @include font-size($param1); } @else if $ms == 'flow-in-row' { @include flow-in-row; } @else if $ms == 'flow-in-col' { @include flow-in-col; } @else if $ms == 'flex-inline' { @include flex-inline; } @else if $ms == 'fine-pointer' { @include fine-pointer; } @else if $ms == 'flow-dense-items' { @include flow-dense-items; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'h' { @if $ms == 'hide' { @include hide; } @else if str.index($ms, 'height(') == 1 { $param1: list.nth($params, 1); @include height($param1); } @else if $ms == 'h-full' { @include h-full; } @else if $ms == 'h-max' { @include h-max; } @else if $ms == 'h-min' { @include h-min; } @else if $ms == 'h-fit' { @include h-fit; } @else if $ms == 'h-auto' { @include h-auto; } @else if $ms == 'h-screen' { @include h-screen; } @else if $ms == 'hover-ready' { @include hover-ready; } @else if $ms == 'high-contrast' { @include high-contrast; } @else if str.index($ms, 'height-percent(') == 1 { $param1: list.nth($params, 1); @include height-percent($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'l' { @if str.index($ms, 'left(') == 1 { $param1: list.nth($params, 1); @include left($param1); } @else if str.index($ms, 'leading(') == 1 { $param1: list.nth($params, 1); @include leading($param1); } @else if $ms == 'landscape' { @include landscape; } @else if $ms == 'lowercase' { @include lowercase; } @else if $ms == 'leading-none' { @include leading-none; } @else if $ms == 'leading-snug' { @include leading-snug; } @else if $ms == 'line-through' { @include line-through; } @else if $ms == 'leading-tight' { @include leading-tight; } @else if $ms == 'leading-loose' { @include leading-loose; } @else if $ms == 'leading-normal' { @include leading-normal; } @else if $ms == 'leading-relaxed' { @include leading-relaxed; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'g' { @if str.index($ms, 'gap(') == 1 { $param1: list.nth($params, 1); @include gap($param1); } @else if str.index($ms, 'gap-x(') == 1 { $param1: list.nth($params, 1); @include gap-x($param1); } @else if str.index($ms, 'gap-y(') == 1 { $param1: list.nth($params, 1); @include gap-y($param1); } @else if $ms == 'grid' { @include grid; } @else if str.index($ms, 'gradient(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include gradient($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include gradient($param1, $param2); } } @else if $ms == 'grow' { @include grow; } @else if $ms == 'grow-only' { @include grow-only; } @else if $ms == 'grid-inline' { @include grid-inline; } @else if str.index($ms, 'grid-position(') == 1 { @if (list.length($params) == 1) { $param1: list.nth($params, 1); @include grid-position($param1); } @else if (list.length($params) == 2) { $param1: list.nth($params, 1); $param2: list.nth($params, 2); @include grid-position($param1, $param2); } } @else if str.index($ms, 'generate-backdrop-filter-utilities(') == 1 { $param1: list.nth($params, 1); @include generate-backdrop-filter-utilities($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'e' { @if $ms == 'evenly' { @include evenly; } @else if $ms == 'end' { @include end; } @else if $ms == 'ease-in' { @include ease-in; } @else if $ms == 'ease-out' { @include ease-out; } @else if str.index($ms, 'elevation(') == 1 { $param1: list.nth($params, 1); @include elevation($param1); } @else if $ms == 'ease-linear' { @include ease-linear; } @else if $ms == 'ease-in-out' { @include ease-in-out; } @else if str.index($ms, 'ensure-keyframes(') == 1 { $param1: list.nth($params, 1); @include ensure-keyframes($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'n' { @if $ms == 'nowrap' { @include nowrap; } @else if $ms == 'no-grow' { @include no-grow; } @else if $ms == 'no-shrink' { @include no-shrink; } @else if $ms == 'not-italic' { @include not-italic; } @else if $ms == 'normal-case' { @include normal-case; } @else if $ms == 'no-underline' { @include no-underline; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'i' { @if str.index($ms, 'inset(') == 1 { $param1: list.nth($params, 1); @include inset($param1); } @else if $ms == 'inline' { @include inline; } @else if $ms == 'italic' { @include italic; } @else if str.index($ms, 'inset-x(') == 1 { $param1: list.nth($params, 1); @include inset-x($param1); } @else if str.index($ms, 'inset-y(') == 1 { $param1: list.nth($params, 1); @include inset-y($param1); } @else if $ms == 'invisible' { @include invisible; } @else if $ms == 'inset-auto' { @include inset-auto; } @else if $ms == 'inline-block' { @include inline-block; } @else if $ms == 'inset-x-auto' { @include inset-x-auto; } @else if $ms == 'inset-y-auto' { @include inset-y-auto; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'd' { @if $ms == 'dvh' { @include dvh; } @else if $ms == 'd-tbl' { @include d-tbl; } @else if str.index($ms, 'delay(') == 1 { $param1: list.nth($params, 1); @include delay($param1); } @else if str.index($ms, 'duration(') == 1 { $param1: list.nth($params, 1); @include duration($param1); } @else if $ms == 'dark-mode' { @include dark-mode; } @else if $ms == 'd-tbl-row' { @include d-tbl-row; } @else if $ms == 'dark-theme' { @include dark-theme; } @else if $ms == 'd-tbl-cell' { @include d-tbl-cell; } @else if str.index($ms, 'display-mode(') == 1 { $param1: list.nth($params, 1); @include display-mode($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'v' { @if $ms == 'visible' { @include visible; } @else if $ms == 'validate-tokens' { @include validate-tokens; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'u' { @if $ms == 'uppercase' { @include uppercase; } @else if $ms == 'underline' { @include underline; } @else { @debug 'Mixin not found: ' + $ms; } } @else if $fc == 'j' { @if str.index($ms, 'justify(') == 1 { $param1: list.nth($params, 1); @include justify($param1); } @else { @debug 'Mixin not found: ' + $ms; } } @else { @debug 'Mixin not found: ' + $ms; } }