@clayui/css 3.42.0 → 3.44.2

package/src/scss/mixins/_labels.scss

@@ -323,358 +323,382 @@
 /// link-hover: {Map | Null}, // deprecated after 3.38.0
 
 @mixin clay-label-variant($map) {
-	$enabled: setter(map-get($map, enabled), true);
-
-	$base: setter($map, ());
-	$base: map-merge(
-		$base,
-		(
-			background-color:
-				setter(map-get($map, bg), map-get($base, background-color)),
-			padding-bottom:
-				setter(map-get($map, padding-y), map-get($base, padding-bottom)),
-			padding-left:
-				setter(map-get($map, padding-x), map-get($base, padding-left)),
-			padding-right:
-				setter(map-get($map, padding-x), map-get($base, padding-right)),
-			padding-top:
-				setter(map-get($map, padding-y), map-get($base, padding-top)),
-		)
-	);
+	@if (type-of($map) == 'map') {
+		$enabled: setter(map-get($map, enabled), true);
 
-	$disabled: setter(map-get($map, disabled), ());
-	$disabled: map-merge(
-		$disabled,
-		(
-			background-color:
-				setter(
-					map-get($map, disabled-bg),
-					map-get($disabled, background-color)
-				),
-			border-color:
-				setter(
-					map-get($map, disabled-border-color),
-					map-get($disabled, border-color)
-				),
-			box-shadow:
-				setter(
-					map-get($map, disabled-box-shadow),
-					map-get($disabled, box-shadow)
-				),
-			color:
-				setter(map-get($map, disabled-color), map-get($disabled, color)),
-		)
-	);
-
-	$href: setter(map-get($map, href), ());
-	$href: map-deep-merge(
-		$href,
-		(
-			hover: (
+		$base: setter($map, ());
+		$base: map-merge(
+			$base,
+			(
 				background-color:
+					setter(map-get($map, bg), map-get($base, background-color)),
+				padding-bottom:
 					setter(
-						map-get($map, hover-bg),
-						map-deep-get($map, hover, background-color),
-						map-deep-get($href, hover, background-color)
+						map-get($map, padding-y),
+						map-get($base, padding-bottom)
 					),
-				border-color:
+				padding-left:
 					setter(
-						map-get($map, hover-border-color),
-						map-deep-get($map, hover, border-color),
-						map-deep-get($href, hover, border-color)
+						map-get($map, padding-x),
+						map-get($base, padding-left)
 					),
-				color:
+				padding-right:
 					setter(
-						map-get($map, hover-color),
-						map-deep-get($map, hover, color),
-						map-deep-get($href, hover, color)
+						map-get($map, padding-x),
+						map-get($base, padding-right)
 					),
-				text-decoration:
+				padding-top:
 					setter(
-						map-get($map, hover-text-decoration),
-						map-deep-get($map, hover, text-decoration),
-						map-deep-get($href, hover, text-decoration)
+						map-get($map, padding-y),
+						map-get($base, padding-top)
 					),
-			),
-			focus: (
+			)
+		);
+
+		$disabled: setter(map-get($map, disabled), ());
+		$disabled: map-merge(
+			$disabled,
+			(
 				background-color:
 					setter(
-						map-get($map, focus-bg),
-						map-deep-get($map, focus, background-color),
-						map-deep-get($href, focus, background-color)
+						map-get($map, disabled-bg),
+						map-get($disabled, background-color)
 					),
 				border-color:
 					setter(
-						map-get($map, focus-border-color),
-						map-deep-get($map, focus, border-color),
-						map-deep-get($href, focus, border-color)
+						map-get($map, disabled-border-color),
+						map-get($disabled, border-color)
 					),
 				box-shadow:
 					setter(
-						map-get($map, focus-box-shadow),
-						map-deep-get($map, focus, box-shadow),
-						map-deep-get($href, focus, box-shadow)
+						map-get($map, disabled-box-shadow),
+						map-get($disabled, box-shadow)
 					),
 				color:
 					setter(
-						map-get($map, focus-color),
-						map-deep-get($map, focus, color),
-						map-deep-get($href, focus, color)
+						map-get($map, disabled-color),
+						map-get($disabled, color)
 					),
-				outline:
-					setter(
-						map-get($map, focus-outline),
-						map-deep-get($map, focus, outline),
-						map-deep-get($href, focus, outline)
-					),
-				text-decoration:
-					setter(
-						map-get($map, focus-text-decoration),
-						map-deep-get($map, focus, text-decoration),
-						map-deep-get($href, focus, text-decoration)
-					),
-			),
-		)
-	);
-
-	$lexicon-icon: setter(map-get($map, lexicon-icon), ());
-	$lexicon-icon: map-merge(
-		$lexicon-icon,
-		(
-			height:
-				setter(
-					map-get($map, lexicon-icon-height),
-					map-get($lexicon-icon, height),
-					map-get($lexicon-icon, width)
-				),
-			margin-top:
-				setter(
-					map-get($map, lexicon-icon-margin-top),
-					map-get($lexicon-icon, margin-top)
-				),
-			width:
-				setter(
-					map-get($map, lexicon-icon-width),
-					map-get($lexicon-icon, width)
-				),
-		)
-	);
-
-	$label-item: setter(map-get($map, label-item), ());
-	$label-item: map-merge(
-		$label-item,
-		(
-			margin-bottom:
-				setter(
-					map-get($map, item-spacer-y),
-					map-get($label-item, margin-bottom)
-				),
-			margin-top:
-				setter(
-					map-get($map, item-spacer-y),
-					map-get($label-item, margin-top)
-				),
-			lexicon-icon: (
+			)
+		);
+
+		$href: setter(map-get($map, href), ());
+		$href: map-deep-merge(
+			$href,
+			(
+				hover: (
+					background-color:
+						setter(
+							map-get($map, hover-bg),
+							map-deep-get($map, hover, background-color),
+							map-deep-get($href, hover, background-color)
+						),
+					border-color:
+						setter(
+							map-get($map, hover-border-color),
+							map-deep-get($map, hover, border-color),
+							map-deep-get($href, hover, border-color)
+						),
+					color:
+						setter(
+							map-get($map, hover-color),
+							map-deep-get($map, hover, color),
+							map-deep-get($href, hover, color)
+						),
+					text-decoration:
+						setter(
+							map-get($map, hover-text-decoration),
+							map-deep-get($map, hover, text-decoration),
+							map-deep-get($href, hover, text-decoration)
+						),
+				),
+				focus: (
+					background-color:
+						setter(
+							map-get($map, focus-bg),
+							map-deep-get($map, focus, background-color),
+							map-deep-get($href, focus, background-color)
+						),
+					border-color:
+						setter(
+							map-get($map, focus-border-color),
+							map-deep-get($map, focus, border-color),
+							map-deep-get($href, focus, border-color)
+						),
+					box-shadow:
+						setter(
+							map-get($map, focus-box-shadow),
+							map-deep-get($map, focus, box-shadow),
+							map-deep-get($href, focus, box-shadow)
+						),
+					color:
+						setter(
+							map-get($map, focus-color),
+							map-deep-get($map, focus, color),
+							map-deep-get($href, focus, color)
+						),
+					outline:
+						setter(
+							map-get($map, focus-outline),
+							map-deep-get($map, focus, outline),
+							map-deep-get($href, focus, outline)
+						),
+					text-decoration:
+						setter(
+							map-get($map, focus-text-decoration),
+							map-deep-get($map, focus, text-decoration),
+							map-deep-get($href, focus, text-decoration)
+						),
+				),
+			)
+		);
+
+		$lexicon-icon: setter(map-get($map, lexicon-icon), ());
+		$lexicon-icon: map-merge(
+			$lexicon-icon,
+			(
 				height:
 					setter(
 						map-get($map, lexicon-icon-height),
 						map-get($lexicon-icon, height),
-						map-get($lexicon-icon, width),
-						map-deep-get($label-item, lexicon-icon, height),
-						map-deep-get($label-item, lexicon-icon, width)
+						map-get($lexicon-icon, width)
 					),
 				margin-top:
 					setter(
 						map-get($map, lexicon-icon-margin-top),
-						map-get($lexicon-icon, margin-top),
-						map-deep-get($label-item, lexicon-icon, margin-top)
+						map-get($lexicon-icon, margin-top)
 					),
 				width:
 					setter(
 						map-get($map, lexicon-icon-width),
-						map-get($lexicon-icon, width),
-						map-deep-get($label-item, lexicon-icon, width)
+						map-get($lexicon-icon, width)
 					),
-			),
-		)
-	);
-
-	$label-item-before: setter(map-get($map, label-item-before), ());
-	$label-item-before: map-merge(
-		$label-item-before,
-		(
-			margin-right:
-				setter(
-					map-get($map, item-spacer-x),
-					map-get($label-item-before, margin-right)
-				),
-		)
-	);
-
-	$label-item-after: setter(map-get($map, label-item-after), ());
-	$label-item-after: map-merge(
-		$label-item-after,
-		(
-			margin-left:
-				setter(
-					map-get($map, item-spacer-x),
-					map-get($label-item-after, margin-left)
-				),
-		)
-	);
-
-	$link: setter(map-get($map, link), ());
-	$link: map-deep-merge(
-		$link,
-		(
-			color: setter(map-get($map, link-color), map-get($link, color)),
-			text-decoration:
-				setter(
-					map-get($map, link-text-decoration),
-					map-get($link, text-decoration)
-				),
-			hover: (
-				color:
+			)
+		);
+
+		$label-item: setter(map-get($map, label-item), ());
+		$label-item: map-merge(
+			$label-item,
+			(
+				margin-bottom:
+					setter(
+						map-get($map, item-spacer-y),
+						map-get($label-item, margin-bottom)
+					),
+				margin-top:
 					setter(
-						map-get($map, link-hover-color),
-						map-deep-get($link, hover, color)
+						map-get($map, item-spacer-y),
+						map-get($label-item, margin-top)
 					),
+				lexicon-icon: (
+					height:
+						setter(
+							map-get($map, lexicon-icon-height),
+							map-get($lexicon-icon, height),
+							map-get($lexicon-icon, width),
+							map-deep-get($label-item, lexicon-icon, height),
+							map-deep-get($label-item, lexicon-icon, width)
+						),
+					margin-top:
+						setter(
+							map-get($map, lexicon-icon-margin-top),
+							map-get($lexicon-icon, margin-top),
+							map-deep-get($label-item, lexicon-icon, margin-top)
+						),
+					width:
+						setter(
+							map-get($map, lexicon-icon-width),
+							map-get($lexicon-icon, width),
+							map-deep-get($label-item, lexicon-icon, width)
+						),
+				),
+			)
+		);
+
+		$label-item-before: setter(map-get($map, label-item-before), ());
+		$label-item-before: map-merge(
+			$label-item-before,
+			(
+				margin-right:
+					setter(
+						map-get($map, item-spacer-x),
+						map-get($label-item-before, margin-right)
+					),
+			)
+		);
+
+		$label-item-after: setter(map-get($map, label-item-after), ());
+		$label-item-after: map-merge(
+			$label-item-after,
+			(
+				margin-left:
+					setter(
+						map-get($map, item-spacer-x),
+						map-get($label-item-after, margin-left)
+					),
+			)
+		);
+
+		$link: setter(map-get($map, link), ());
+		$link: map-deep-merge(
+			$link,
+			(
+				color: setter(map-get($map, link-color), map-get($link, color)),
 				text-decoration:
 					setter(
-						map-get($map, link-hover-text-decoration),
-						map-deep-get($link, hover, text-decoration)
+						map-get($map, link-text-decoration),
+						map-get($link, text-decoration)
 					),
-			),
-		)
-	);
-
-	$close: setter(map-get($map, close), ());
-
-	$sticker: setter(map-get($map, sticker), ());
-	$sticker: map-merge(
-		$sticker,
-		(
-			border-radius:
-				setter(
-					map-get($map, sticker-border-radius),
-					map-get($sticker, border-radius)
-				),
-			height:
-				setter(map-get($map, sticker-size), map-get($sticker, height)),
-			line-height:
-				setter(
-					map-get($map, sticker-size),
-					map-get($sticker, line-height)
-				),
-			width: setter(map-get($map, sticker-size), map-get($sticker, width)),
-		)
-	);
-
-	$sticker-overlay: setter(map-get($map, sticker-overlay), ());
-	$sticker-overlay: map-merge(
-		$sticker-overlay,
-		(
-			border-radius:
-				setter(
-					map-get($sticker-overlay, border-radius),
-					map-get($sticker, border-radius)
-				),
-		)
-	);
-
-	$c-inner: setter(map-get($map, c-inner), ());
-	$c-inner: map-deep-merge(
-		$c-inner,
-		(
-			enabled:
-				setter(
-					if(
-						variable-exists(enable-c-inner),
-						$enable-c-inner,
+				hover: (
+					color:
+						setter(
+							map-get($map, link-hover-color),
+							map-deep-get($link, hover, color)
+						),
+					text-decoration:
+						setter(
+							map-get($map, link-hover-text-decoration),
+							map-deep-get($link, hover, text-decoration)
+						),
+				),
+			)
+		);
+
+		$close: setter(map-get($map, close), ());
+
+		$sticker: setter(map-get($map, sticker), ());
+		$sticker: map-merge(
+			$sticker,
+			(
+				border-radius:
+					setter(
+						map-get($map, sticker-border-radius),
+						map-get($sticker, border-radius)
+					),
+				height:
+					setter(
+						map-get($map, sticker-size),
+						map-get($sticker, height)
+					),
+				line-height:
+					setter(
+						map-get($map, sticker-size),
+						map-get($sticker, line-height)
+					),
+				width:
+					setter(
+						map-get($map, sticker-size),
+						map-get($sticker, width)
+					),
+			)
+		);
+
+		$sticker-overlay: setter(map-get($map, sticker-overlay), ());
+		$sticker-overlay: map-merge(
+			$sticker-overlay,
+			(
+				border-radius:
+					setter(
+						map-get($sticker-overlay, border-radius),
+						map-get($sticker, border-radius)
+					),
+			)
+		);
+
+		$c-inner: setter(map-get($map, c-inner), ());
+		$c-inner: map-deep-merge(
+			$c-inner,
+			(
+				enabled:
+					setter(
 						if(
-							variable-exists(cadmin-enable-c-inner),
-							$cadmin-enable-c-inner,
-							true
+							variable-exists(enable-c-inner),
+							$enable-c-inner,
+							if(
+								variable-exists(cadmin-enable-c-inner),
+								$cadmin-enable-c-inner,
+								true
+							)
 						)
-					)
-				),
-			margin-bottom:
-				setter(
-					map-get($c-inner, margin-bottom),
-					math-sign(map-get($base, padding-bottom))
-				),
-			margin-left:
-				setter(
-					map-get($c-inner, margin-left),
-					math-sign(map-get($base, padding-left))
-				),
-			margin-right:
-				setter(
-					map-get($c-inner, margin-right),
-					math-sign(map-get($base, padding-right))
-				),
-			margin-top:
-				setter(
-					map-get($c-inner, margin-top),
-					math-sign(map-get($base, padding-top))
-				),
-		)
-	);
-
-	@if ($enabled) {
-		@include clay-css($base);
-
-		&:disabled,
-		&.disabled {
-			@include clay-css($disabled);
-		}
+					),
+				margin-bottom:
+					setter(
+						map-get($c-inner, margin-bottom),
+						math-sign(map-get($base, padding-bottom))
+					),
+				margin-left:
+					setter(
+						map-get($c-inner, margin-left),
+						math-sign(map-get($base, padding-left))
+					),
+				margin-right:
+					setter(
+						map-get($c-inner, margin-right),
+						math-sign(map-get($base, padding-right))
+					),
+				margin-top:
+					setter(
+						map-get($c-inner, margin-top),
+						math-sign(map-get($base, padding-top))
+					),
+			)
+		);
 
-		&[href],
-		&[type],
-		&[tabindex] {
-			@include clay-link($href);
-		}
+		@if ($enabled) {
+			@include clay-css($base);
 
-		.lexicon-icon {
-			@include clay-css($lexicon-icon);
-		}
+			&:disabled,
+			&.disabled {
+				@include clay-css($disabled);
+			}
 
-		.label-item {
-			@include clay-css($label-item);
+			&[href],
+			&[type],
+			&[tabindex] {
+				@include clay-link($href);
+			}
 
 			.lexicon-icon {
 				@include clay-css($lexicon-icon);
 			}
-		}
 
-		.label-item-before {
-			@include clay-css($label-item-before);
-		}
+			.label-item {
+				@include clay-css($label-item);
 
-		.label-item-after {
-			@include clay-css($label-item-after);
-		}
+				.lexicon-icon {
+					@include clay-css($lexicon-icon);
+				}
+			}
 
-		a,
-		.btn-unstyled {
-			@include clay-link($link);
-		}
+			.label-item-before {
+				@include clay-css($label-item-before);
+			}
 
-		.close {
-			@include clay-close($close);
-		}
+			.label-item-after {
+				@include clay-css($label-item-after);
+			}
 
-		.sticker {
-			@include clay-css($sticker);
-		}
+			a,
+			.btn-unstyled {
+				@include clay-link($link);
+			}
 
-		.sticker-overlay {
-			@include clay-css($sticker-overlay);
-		}
+			.close {
+				@include clay-close($close);
+			}
 
-		@if (map-get($c-inner, enabled)) {
-			> .c-inner {
-				@include clay-css($c-inner);
+			.sticker {
+				@include clay-css($sticker);
+			}
+
+			.sticker-overlay {
+				@include clay-css($sticker-overlay);
+			}
+
+			@if (map-get($c-inner, enabled)) {
+				> .c-inner {
+					@include clay-css($c-inner);
+				}
 			}
 		}
 	}