@clayui/css 3.61.0 → 3.62.0

package/src/scss/functions/_global-functions.scss

@@ -95,20 +95,11 @@
 /// @param {Any} $num - The variable
 
 @function math-sign($num) {
-	@if not(type-of($num) == 'number') and not
-		(type-of($num) == 'string') and not
-		($num == null)
-	{
-		@warn 'The value `#{$num}` is of type `#{type-of($num)}`. It must be a `number`, `string`, or `null`. This function has returned a value of `null`.';
-	}
-
 	@if (type-of($num) == 'number') {
 		@return -($num);
 	} @else if (type-of($num) == 'string') {
 		@if (starts-with($num, 'var(--')) {
 			@return calc(#{$num} * -1);
-		} @else {
-			@return $num;
 		}
 	}
 
@@ -212,13 +203,14 @@
 /// @param {Bool} $custom-gradient[false] - Pass in `true` as the second parameter to this function if using a custom gradient.
 
 @function clay-enable-gradients($gradient, $custom-gradient: false) {
-	$enable: setter(
+	$enable: if(
+		variable-exists(enable-gradients),
+		$enable-gradients,
 		if(
-			variable-exists(enable-gradients),
-			$enable-gradients,
-			$cadmin-enable-gradients
-		),
-		false
+			variable-exists(cadmin-enable-gradients),
+			$cadmin-enable-gradients,
+			false
+		)
 	);
 
 	@if ($enable and $gradient) {
@@ -240,13 +232,10 @@
 /// @param {Number} $radius - The border radius.
 
 @function clay-enable-rounded($radius, $enable: null) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if(variable-exists(cadmin-enable-rounded), $cadmin-enable-rounded, true)
 	);
 
 	@if ($enable) {
@@ -265,13 +254,10 @@
 	$length: length($shadows);
 	$separator: list-separator($shadows);
 
-	$enable: setter(
-		if(
-			variable-exists(enable-shadows),
-			$enable-shadows,
-			$cadmin-enable-shadows
-		),
-		true
+	$enable: if(
+		variable-exists(enable-shadows),
+		$enable-shadows,
+		if(variable-exists(cadmin-enable-shadows), $cadmin-enable-shadows, true)
 	);
 
 	@if ($length == 2 and $separator == 'comma') {
@@ -293,13 +279,14 @@
 /// @param {List} $transitions - The transitions.
 
 @function clay-enable-transitions($transitions) {
-	$enable: setter(
+	$enable: if(
+		variable-exists(enable-transitions),
+		$enable-transitions,
 		if(
-			variable-exists(enable-transitions),
-			$enable-transitions,
-			$cadmin-enable-transitions
-		),
-		true
+			variable-exists(cadmin-enable-transitions),
+			$cadmin-enable-transitions,
+			true
+		)
 	);
 
 	@if ($enable) {
@@ -397,7 +384,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -427,7 +424,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -453,7 +460,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -476,7 +493,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 	$next: breakpoint-next($name, $breakpoints);
@@ -497,7 +524,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -532,7 +569,11 @@
 		if(
 			variable-exists(yiq-text-dark),
 			$yiq-text-dark,
-			$cadmin-yiq-text-dark
+			if(
+				variable-exists(cadmin-yiq-text-dark),
+				$cadmin-yiq-text-dark,
+				#000
+			)
 		)
 	);
 
@@ -541,7 +582,11 @@
 		if(
 			variable-exists(yiq-text-light),
 			$yiq-text-light,
-			$cadmin-yiq-text-light
+			if(
+				variable-exists(cadmin-yiq-text-light),
+				$cadmin-yiq-text-light,
+				#fff
+			)
 		)
 	);
 
@@ -550,7 +595,11 @@
 		if(
 			variable-exists(yiq-contrasted-threshold),
 			$yiq-contrasted-threshold,
-			$cadmin-yiq-contrasted-threshold
+			if(
+				variable-exists(cadmin-yiq-contrasted-threshold),
+				$cadmin-yiq-contrasted-threshold,
+				150
+			)
 		)
 	);
 
@@ -578,7 +627,7 @@
 		$colors: if(
 			variable-exists(theme-colors),
 			$theme-colors,
-			$cadmin-theme-colors
+			if(variable-exists(cadmin-theme-colors), $cadmin-theme-colors, ())
 		);
 	}
 
@@ -603,21 +652,33 @@
 	$level: 0,
 	$color-interval: null
 ) {
-	$black: setter(if(variable-exists('black'), $black, $cadmin-black), #000);
+	$black: if(
+		variable-exists('black'),
+		$black,
+		if(variable-exists(cadmin-black), $cadmin-black, #000)
+	);
 
-	$white: setter(if(variable-exists('white'), $white, $cadmin-white), #fff);
+	$white: if(
+		variable-exists('white'),
+		$white,
+		if(variable-exists(cadmin-white), $cadmin-white, #fff)
+	);
 
 	$color: theme-color($color-name);
 	$color-base: if($level > 0, $black, $white);
 	$level: abs($level);
 
 	$color-interval: setter(
+		$color-interval,
 		if(
 			variable-exists(theme-color-interval),
 			$theme-color-interval,
-			$cadmin-theme-color-interval
-		),
-		$color-interval
+			if(
+				variable-exists(cadmin-theme-color-interval),
+				$cadmin-theme-color-interval,
+				8%
+			)
+		)
 	);
 
 	@return clay-mix($color-base, $color, $level * $color-interval);
@@ -836,7 +897,11 @@
 		$escaped: if(
 			variable-exists(escaped-characters),
 			$escaped-characters,
-			$cadmin-escaped-characters
+			if(
+				variable-exists(cadmin-escaped-characters),
+				$cadmin-escaped-characters,
+				(('<', '%3c'), ('>', '%3e'), ('#', '%23'))
+			)
 		);
 	}
 

package/src/scss/mixins/_badges.scss

@@ -149,13 +149,15 @@
 	$c-inner: map-merge(
 		(
 			enabled:
-				setter(
-					if(
-						variable-exists(enable-c-inner),
-						$enable-c-inner,
-						$cadmin-enable-c-inner
-					),
-					true
+				if(
+					variable-exists(enable-c-inner),
+					$enable-c-inner,
+					if
+						(
+							variable-exists(cadmin-enable-c-inner),
+							$cadmin-enable-c-inner,
+							true
+						)
 				),
 		),
 		$c-inner

package/src/scss/mixins/_border-radius.scss

@@ -3,17 +3,24 @@
 		if(
 			variable-exists(border-radius),
 			$border-radius,
-			$cadmin-border-radius
+			if
+				(
+					variable-exists(cadmin-border-radius),
+					$cadmin-border-radius,
+					0.25rem
+				)
 		),
 	$fallback-border-radius: false
 ) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -24,13 +31,15 @@
 }
 
 @mixin border-top-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -40,13 +49,15 @@
 }
 
 @mixin border-right-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -56,13 +67,15 @@
 }
 
 @mixin border-bottom-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -72,13 +85,15 @@
 }
 
 @mixin border-left-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -88,13 +103,15 @@
 }
 
 @mixin border-top-left-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -118,13 +135,15 @@
 }
 
 @mixin border-bottom-right-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {
@@ -133,13 +152,15 @@
 }
 
 @mixin border-bottom-left-radius($radius) {
-	$enable: setter(
-		if(
-			variable-exists(enable-rounded),
-			$enable-rounded,
-			$cadmin-enable-rounded
-		),
-		true
+	$enable: if(
+		variable-exists(enable-rounded),
+		$enable-rounded,
+		if
+			(
+				variable-exists(cadmin-enable-rounded),
+				$cadmin-enable-rounded,
+				true
+			)
 	);
 
 	@if ($enable) {

package/src/scss/mixins/_box-shadow.scss

@@ -6,13 +6,15 @@
 /// @param {Arglist} $shadow
 
 @mixin box-shadow($shadow...) {
-	$enable: setter(
-		if(
-			variable-exists(enable-shadows),
-			$enable-shadows,
-			$cadmin-enable-shadows
-		),
-		true
+	$enable: if(
+		variable-exists(enable-shadows),
+		$enable-shadows,
+		if
+			(
+				variable-exists(cadmin-enable-shadows),
+				$cadmin-enable-shadows,
+				true
+			)
 	);
 
 	@if ($enable) {

package/src/scss/mixins/_breakpoints.scss

@@ -12,7 +12,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -37,7 +47,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -63,7 +83,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 
@@ -95,7 +125,17 @@
 		if(
 			variable-exists(grid-breakpoints),
 			$grid-breakpoints,
-			$cadmin-grid-breakpoints
+			if(
+				variable-exists(cadmin-grid-breakpoints),
+				$cadmin-grid-breakpoints,
+				(
+					xs: 0,
+					sm: 576px,
+					md: 768px,
+					lg: 992px,
+					xl: 1280px,
+				)
+			)
 		)
 	);
 

package/src/scss/mixins/_buttons.scss

@@ -553,13 +553,16 @@
 		$mobile-c-inner: map-merge(
 			(
 				enabled:
-					setter(
-						if(
-							variable-exists(enable-c-inner),
-							$enable-c-inner,
-							$cadmin-enable-c-inner
-						),
-						true
+					if(
+						variable-exists(enable-c-inner),
+						$enable-c-inner,
+						$cadmin-enable-c-inner
+							if
+							(
+								variable-exists(cadmin-enable-c-inner),
+								$cadmin-enable-c-inner,
+								true
+							)
 					),
 				margin-bottom: math-sign(map-get($mobile, padding-bottom)),
 				margin-left: math-sign(map-get($mobile, padding-left)),
@@ -569,28 +572,24 @@
 			$mobile-c-inner
 		);
 
-		$unset: setter(
-			if(
-				variable-exists(clay-unset-placeholder),
-				$clay-unset-placeholder,
-				$cadmin-clay-unset-placeholder
-			),
+		$loading-animation: setter(
+			map-get($map, loading-animation),
 			clay-unset-placeholder
 		);
 
-		$loading-animation: setter(map-get($map, loading-animation), $unset);
-
 		$c-inner: setter(map-get($map, c-inner), ());
 		$c-inner: map-merge(
 			(
 				enabled:
-					setter(
-						if(
-							variable-exists(enable-c-inner),
-							$enable-c-inner,
-							$cadmin-enable-c-inner
-						),
-						true
+					if(
+						variable-exists(enable-c-inner),
+						$enable-c-inner,
+						if
+							(
+								variable-exists(cadmin-enable-c-inner),
+								$cadmin-enable-c-inner,
+								true
+							)
 					),
 				margin-bottom: math-sign(map-get($map, padding-bottom)),
 				margin-left: math-sign(map-get($map, padding-left)),

package/src/scss/mixins/_cards.scss

@@ -1059,7 +1059,12 @@
 					if(
 						variable-exists(card-border-color),
 						$card-border-color,
-						$cadmin-card-border-color
+						if
+							(
+								variable-exists(cadmin-card-border-color),
+								$cadmin-card-border-color,
+								null
+							)
 					)
 				),
 			border-style:
@@ -1144,7 +1149,12 @@
 					if(
 						variable-exists(link-cursor),
 						$link-cursor,
-						$cadmin-link-cursor
+						if
+							(
+								variable-exists(cadmin-link-cursor),
+								$cadmin-link-cursor,
+								null
+							)
 					)
 				),
 		)