1mpacto-react-ui 2.0.14 → 2.0.16

package/dist/assets/_mixins.scss

@@ -1,71 +1,73 @@
-@use 'sass:map';
-@use 'sass:list';
-
-@mixin ring($width: 1px, $color: 'transparent', $inset: 0, $important: 0) {
-    $ring-style: 0 0 0 $width $color;
-    $shadow: if($inset==1, inset $ring-style, $ring-style);
-
-    box-shadow: if($important==1, $shadow !important, $shadow);
-}
-
-@mixin ring-left($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
-    $ring-style: (-$width) 0 0 $color;
-    $shadow: if($inset==1, inset $ring-style, $ring-style);
-
-    box-shadow: if($important==1, $shadow !important, $shadow);
-}
-
-@mixin ring-top($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
-    $ring-style: 0 (-$width) 0 $color;
-    $shadow: if($inset==1, inset $ring-style, $ring-style);
-
-    box-shadow: if($important==1, $shadow !important, $shadow);
-}
-
-@mixin ring-right($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
-    $ring-style: $width 0 0 $color;
-    $shadow: if($inset==1, inset $ring-style, $ring-style);
-
-    box-shadow: if($important==1, $shadow !important, $shadow);
-}
-
-@mixin ring-bottom($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
-    $ring-style: 0 $width 0 $color;
-    $shadow: if($inset==1, inset $ring-style, $ring-style);
-
-    box-shadow: if($important==1, $shadow !important, $shadow);
-}
-
-@function getColor($color-map, $color) {
-    @if map.has-key($color-map, $color) {
-        @return map.get($color-map, $color);
-    }
-
-    @return $color;
-}
-
-@mixin getTypography($typo-map, $name, $important: false) {
-    @if map.has-key($typo-map, $name) {
-        $values: map.get($typo-map, $name);
-        $font-size: list.nth($values, 1);
-        $props: list.nth($values, 2);
-        $line-height: map.get($props, 'line-height');
-        $font-weight: map.get($props, 'font-weight');
-
-        @if $important {
-            font-size: $font-size !important;
-            line-height: $line-height !important;
-            font-weight: $font-weight !important;
-        }
-
-        @else {
-            font-size: $font-size;
-            line-height: $line-height;
-            font-weight: $font-weight;
-        }
-    }
-
-    @else {
-        @warn 'Typography "#{$name}" not found in the typography map.';
-    }
+@use 'sass:map';
+@use 'sass:list';
+
+@mixin ring($width: 1px, $color: 'transparent', $inset: 0, $important: 0) {
+    $ring-style: 0 0 0 $width $color;
+    $shadow: if($inset==1, inset $ring-style, $ring-style);
+
+    box-shadow: if($important==1, $shadow !important, $shadow);
+}
+
+@mixin ring-left($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
+    $ring-style: (-$width) 0 0 $color;
+    $shadow: if($inset==1, inset $ring-style, $ring-style);
+
+    box-shadow: if($important==1, $shadow !important, $shadow);
+}
+
+@mixin ring-top($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
+    $ring-style: 0 (-$width) 0 $color;
+    $shadow: if($inset==1, inset $ring-style, $ring-style);
+
+    box-shadow: if($important==1, $shadow !important, $shadow);
+}
+
+@mixin ring-right($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
+    $ring-style: $width 0 0 $color;
+    $shadow: if($inset==1, inset $ring-style, $ring-style);
+
+    box-shadow: if($important==1, $shadow !important, $shadow);
+}
+
+@mixin ring-bottom($width: 1px, $color: 'currentColor', $inset: 0, $important: 0) {
+    $ring-style: 0 $width 0 $color;
+    $shadow: if($inset==1, inset $ring-style, $ring-style);
+
+    box-shadow: if($important==1, $shadow !important, $shadow);
+}
+
+@function getColor($color-map, $color) {
+    @if map.has-key($color-map, $color) {
+        @return map.get($color-map, $color);
+    }
+
+    @return $color;
+}
+
+@mixin getTypography($typo-map, $name, $important: false) {
+    @if map.has-key($typo-map, $name) {
+        & {
+            $values: map.get($typo-map, $name);
+            $font-size: list.nth($values, 1);
+            $props: list.nth($values, 2);
+            $line-height: map.get($props, 'line-height');
+            $font-weight: map.get($props, 'font-weight');
+
+            @if $important {
+                font-size: $font-size !important;
+                line-height: $line-height !important;
+                font-weight: $font-weight !important;
+            }
+
+            @else {
+                font-size: $font-size;
+                line-height: $line-height;
+                font-weight: $font-weight;
+            }
+        }
+    }
+
+    @else {
+        @warn 'Typography "#{$name}" not found in the typography map.';
+    }
 }