@clayui/css 3.60.1 → 3.62.0

package/src/scss/mixins/_panels.scss

@@ -56,306 +56,317 @@
 /// - Add @link to documentation
 
 @mixin clay-panel-variant($map) {
-	$enabled: setter(map-get($map, enabled), true);
+	@if (type-of($map) == 'map') {
+		$enabled: setter(map-get($map, enabled), true);
 
-	$base: map-merge(
-		$map,
-		(
-			background-color:
-				setter(map-get($map, bg), map-get($map, background-color)),
-		)
-	);
+		$base: map-merge(
+			$map,
+			(
+				background-color:
+					setter(map-get($map, bg), map-get($map, background-color)),
+			)
+		);
 
-	$header: setter(map-get($map, header), ());
-	$header: map-merge(
-		$header,
-		(
-			background-color:
-				setter(
-					map-get($map, header-bg),
-					map-get($header, background-color)
-				),
-			border-color:
-				setter(
-					map-get($map, header-border-color),
-					map-get($header, border-color)
-				),
-			border-style:
-				setter(
-					map-get($map, header-border-style),
-					map-get($header, border-style)
-				),
-			border-width:
-				setter(
-					map-get($map, header-border-width),
-					map-get($header, border-width)
-				),
-			color: setter(map-get($map, header-color), map-get($header, color)),
-			margin-bottom:
-				setter(
-					map-get($map, header-margin-bottom),
-					map-get($header, margin-bottom)
-				),
-			margin-left:
-				setter(
-					map-get($map, header-margin-left),
-					map-get($header, margin-left)
-				),
-			margin-right:
-				setter(
-					map-get($map, header-margin-right),
-					map-get($header, margin-right)
-				),
-			margin-top:
-				setter(
-					map-get($map, header-margin-top),
-					map-get($header, margin-top)
-				),
-			padding-bottom:
-				setter(
-					map-get($map, header-padding-bottom),
-					map-get($header, padding-bottom)
-				),
-			padding-left:
-				setter(
-					map-get($map, header-padding-left),
-					map-get($header, padding-left)
-				),
-			padding-right:
-				setter(
-					map-get($map, header-padding-right),
-					map-get($header, padding-right)
-				),
-			padding-top:
-				setter(
-					map-get($map, header-padding-top),
-					map-get($header, padding-top)
-				),
-			transition:
-				setter(
-					map-get($map, header-transition),
-					map-get($header, transition)
-				),
-		)
-	);
+		$header: setter(map-get($map, header), ());
+		$header: map-merge(
+			$header,
+			(
+				background-color:
+					setter(
+						map-get($map, header-bg),
+						map-get($header, background-color)
+					),
+				border-color:
+					setter(
+						map-get($map, header-border-color),
+						map-get($header, border-color)
+					),
+				border-style:
+					setter(
+						map-get($map, header-border-style),
+						map-get($header, border-style)
+					),
+				border-width:
+					setter(
+						map-get($map, header-border-width),
+						map-get($header, border-width)
+					),
+				color:
+					setter(
+						map-get($map, header-color),
+						map-get($header, color)
+					),
+				margin-bottom:
+					setter(
+						map-get($map, header-margin-bottom),
+						map-get($header, margin-bottom)
+					),
+				margin-left:
+					setter(
+						map-get($map, header-margin-left),
+						map-get($header, margin-left)
+					),
+				margin-right:
+					setter(
+						map-get($map, header-margin-right),
+						map-get($header, margin-right)
+					),
+				margin-top:
+					setter(
+						map-get($map, header-margin-top),
+						map-get($header, margin-top)
+					),
+				padding-bottom:
+					setter(
+						map-get($map, header-padding-bottom),
+						map-get($header, padding-bottom)
+					),
+				padding-left:
+					setter(
+						map-get($map, header-padding-left),
+						map-get($header, padding-left)
+					),
+				padding-right:
+					setter(
+						map-get($map, header-padding-right),
+						map-get($header, padding-right)
+					),
+				padding-top:
+					setter(
+						map-get($map, header-padding-top),
+						map-get($header, padding-top)
+					),
+				transition:
+					setter(
+						map-get($map, header-transition),
+						map-get($header, transition)
+					),
+			)
+		);
 
-	$old-header-collapsed: setter(map-get($map, header-collapsed), ());
-	$header-collapsed: setter(map-get($header, collapsed), ());
-	$header-collapsed: map-merge($header-collapsed, $old-header-collapsed);
-	$header-collapsed: map-merge(
-		$header-collapsed,
-		(
-			border-color:
-				setter(
-					map-get($map, header-collapsed-border-color),
-					map-get($header-collapsed, border-color)
-				),
-		)
-	);
+		$old-header-collapsed: setter(map-get($map, header-collapsed), ());
+		$header-collapsed: setter(map-get($header, collapsed), ());
+		$header-collapsed: map-merge($header-collapsed, $old-header-collapsed);
+		$header-collapsed: map-merge(
+			$header-collapsed,
+			(
+				border-color:
+					setter(
+						map-get($map, header-collapsed-border-color),
+						map-get($header-collapsed, border-color)
+					),
+			)
+		);
 
-	$old-header-c-inner: setter(map-get($map, header-c-inner), ());
-	$header-c-inner: setter(map-get($header, c-inner), ());
-	$header-c-inner: map-merge(
-		(
-			enabled:
-				setter(
+		$old-header-c-inner: setter(map-get($map, header-c-inner), ());
+		$header-c-inner: setter(map-get($header, c-inner), ());
+		$header-c-inner: map-merge(
+			(
+				enabled:
 					if(
 						variable-exists(enable-c-inner),
 						$enable-c-inner,
-						$cadmin-enable-c-inner
-					),
-					true
-				),
-			margin-bottom: math-sign(map-get($header, padding-bottom)),
-			margin-left: math-sign(map-get($header, padding-left)),
-			margin-right: math-sign(map-get($header, padding-right)),
-			margin-top: math-sign(map-get($header, padding-top)),
-		),
-		$header-c-inner
-	);
+						if(
+							variable-exists(cadmin-enable-c-inner),
+							$cadmin-enable-c-inner,
+							null
+						)
+					),
+				margin-bottom: math-sign(map-get($header, padding-bottom)),
+				margin-left: math-sign(map-get($header, padding-left)),
+				margin-right: math-sign(map-get($header, padding-right)),
+				margin-top: math-sign(map-get($header, padding-top)),
+			),
+			$header-c-inner
+		);
 
-	$old-header-link: setter(map-get($map, header-link), ());
-	$header-link: setter(map-get($header, link), ());
-	$header-link: map-deep-merge($header-link, $old-header-link);
+		$old-header-link: setter(map-get($map, header-link), ());
+		$header-link: setter(map-get($header, link), ());
+		$header-link: map-deep-merge($header-link, $old-header-link);
 
-	$title: setter(map-get($map, title), ());
-	$title: map-merge(
-		$title,
-		(
-			font-size:
-				setter(
-					map-get($map, title-font-size),
-					map-get($title, font-size)
-				),
-			font-weight:
-				setter(
-					map-get($map, title-font-weight),
-					map-get($title, font-weight)
-				),
-			text-transform:
-				setter(
-					map-get($map, title-text-transform),
-					map-get($title, text-transform)
-				),
-		)
-	);
+		$title: setter(map-get($map, title), ());
+		$title: map-merge(
+			$title,
+			(
+				font-size:
+					setter(
+						map-get($map, title-font-size),
+						map-get($title, font-size)
+					),
+				font-weight:
+					setter(
+						map-get($map, title-font-weight),
+						map-get($title, font-weight)
+					),
+				text-transform:
+					setter(
+						map-get($map, title-text-transform),
+						map-get($title, text-transform)
+					),
+			)
+		);
 
-	$collapse-icon: setter(map-get($map, collapse-icon), ());
-	$collapse-icon: map-merge(
-		$collapse-icon,
-		(
-			bottom:
-				setter(
-					map-get($map, collapse-icon-bottom),
-					map-get($collapse-icon, bottom)
-				),
-			font-size:
-				setter(
-					map-get($map, collapse-icon-font-size),
-					map-get($collapse-icon, font-size)
-				),
-			left:
-				setter(
-					map-get($map, collapse-icon-left),
-					map-get($collapse-icon, left)
-				),
-			right:
-				setter(
-					map-get($map, collapse-icon-right),
-					map-get($collapse-icon, right)
-				),
-			top:
-				setter(
-					map-get($map, collapse-icon-top),
-					map-get($collapse-icon, top)
-				),
-		)
-	);
+		$collapse-icon: setter(map-get($map, collapse-icon), ());
+		$collapse-icon: map-merge(
+			$collapse-icon,
+			(
+				bottom:
+					setter(
+						map-get($map, collapse-icon-bottom),
+						map-get($collapse-icon, bottom)
+					),
+				font-size:
+					setter(
+						map-get($map, collapse-icon-font-size),
+						map-get($collapse-icon, font-size)
+					),
+				left:
+					setter(
+						map-get($map, collapse-icon-left),
+						map-get($collapse-icon, left)
+					),
+				right:
+					setter(
+						map-get($map, collapse-icon-right),
+						map-get($collapse-icon, right)
+					),
+				top:
+					setter(
+						map-get($map, collapse-icon-top),
+						map-get($collapse-icon, top)
+					),
+			)
+		);
 
-	$body: setter(map-get($map, body), ());
-	$body: map-merge(
-		$body,
-		(
-			margin-bottom:
-				setter(
-					map-get($map, body-margin-bottom),
-					map-get($body, margin-bottom)
-				),
-			margin-left:
-				setter(
-					map-get($map, body-margin-left),
-					map-get($body, margin-left)
-				),
-			margin-right:
-				setter(
-					map-get($map, body-margin-right),
-					map-get($body, margin-right)
-				),
-			margin-top:
-				setter(
-					map-get($map, body-margin-top),
-					map-get($body, margin-top)
-				),
-			padding-bottom:
-				setter(
-					map-get($map, body-padding-bottom),
-					map-get($body, padding-bottom)
-				),
-			padding-left:
-				setter(
-					map-get($map, body-padding-left),
-					map-get($body, padding-left)
-				),
-			padding-right:
-				setter(
-					map-get($map, body-padding-right),
-					map-get($body, padding-right)
-				),
-			padding-top:
-				setter(
-					map-get($map, body-padding-top),
-					map-get($body, padding-top)
-				),
-		)
-	);
+		$body: setter(map-get($map, body), ());
+		$body: map-merge(
+			$body,
+			(
+				margin-bottom:
+					setter(
+						map-get($map, body-margin-bottom),
+						map-get($body, margin-bottom)
+					),
+				margin-left:
+					setter(
+						map-get($map, body-margin-left),
+						map-get($body, margin-left)
+					),
+				margin-right:
+					setter(
+						map-get($map, body-margin-right),
+						map-get($body, margin-right)
+					),
+				margin-top:
+					setter(
+						map-get($map, body-margin-top),
+						map-get($body, margin-top)
+					),
+				padding-bottom:
+					setter(
+						map-get($map, body-padding-bottom),
+						map-get($body, padding-bottom)
+					),
+				padding-left:
+					setter(
+						map-get($map, body-padding-left),
+						map-get($body, padding-left)
+					),
+				padding-right:
+					setter(
+						map-get($map, body-padding-right),
+						map-get($body, padding-right)
+					),
+				padding-top:
+					setter(
+						map-get($map, body-padding-top),
+						map-get($body, padding-top)
+					),
+			)
+		);
 
-	$footer: setter(map-get($map, footer), ());
-	$footer: map-merge(
-		$footer,
-		(
-			background-color:
-				setter(
-					map-get($map, footer-bg),
-					map-get($footer, background-color)
-				),
-			border-color:
-				setter(
-					map-get($map, footer-border-color),
-					map-get($footer, border-color)
-				),
-			color: setter(map-get($map, footer-color), map-get($footer, color)),
-		)
-	);
+		$footer: setter(map-get($map, footer), ());
+		$footer: map-merge(
+			$footer,
+			(
+				background-color:
+					setter(
+						map-get($map, footer-bg),
+						map-get($footer, background-color)
+					),
+				border-color:
+					setter(
+						map-get($map, footer-border-color),
+						map-get($footer, border-color)
+					),
+				color:
+					setter(
+						map-get($map, footer-color),
+						map-get($footer, color)
+					),
+			)
+		);
 
-	@if ($enabled) {
-		@include clay-css($base);
+		@if ($enabled) {
+			@include clay-css($base);
 
-		.panel-header {
-			@include clay-css($header);
+			.panel-header {
+				@include clay-css($header);
 
-			@if (map-get($header-c-inner, enabled)) {
-				.c-inner {
-					@include clay-css($header-c-inner);
+				@if (map-get($header-c-inner, enabled)) {
+					.c-inner {
+						@include clay-css($header-c-inner);
+					}
 				}
-			}
 
-			&.collapsed {
-				@include clay-css($header-collapsed);
-			}
+				&.collapsed {
+					@include clay-css($header-collapsed);
+				}
 
-			&.panel-header-link {
-				@include clay-link($header-link);
-			}
+				&.panel-header-link {
+					@include clay-link($header-link);
+				}
 
-			&:not(.collapse-icon-middle) {
-				.collapse-icon-closed,
-				.collapse-icon-open {
-					@include clay-css($collapse-icon);
+				&:not(.collapse-icon-middle) {
+					.collapse-icon-closed,
+					.collapse-icon-open {
+						@include clay-css($collapse-icon);
+					}
 				}
-			}
 
-			.panel-group & {
-				+ .panel-collapse > .panel-body {
-					border-color: map-get($base, border-color);
+				.panel-group & {
+					+ .panel-collapse > .panel-body {
+						border-color: map-get($base, border-color);
+					}
 				}
 			}
-		}
 
-		.panel-title {
-			@include clay-css($title);
-		}
+			.panel-title {
+				@include clay-css($title);
+			}
 
-		.panel-body {
-			@include clay-css($body);
-		}
+			.panel-body {
+				@include clay-css($body);
+			}
 
-		.panel-footer {
-			@include clay-css($footer);
-		}
+			.panel-footer {
+				@include clay-css($footer);
+			}
 
-		// For Focus Box Shadow
+			// For Focus Box Shadow
 
-		@at-root {
-			.panel-group.panel-group-flush & {
-				.panel-header-link {
-					&,
-					&.collapsed {
-						border-radius: map-get($header-link, border-radius);
+			@at-root {
+				.panel-group.panel-group-flush & {
+					.panel-header-link {
+						&,
+						&.collapsed {
+							border-radius: map-get($header-link, border-radius);
+						}
 					}
 				}
 			}
-		}
 
-		@content;
+			@content;
+		}
 	}
 }

package/src/scss/mixins/_scale-component.scss

@@ -11,7 +11,11 @@
 		if(
 			variable-exists(scaling-breakpoint-down),
 			$scaling-breakpoint-down,
-			$cadmin-scaling-breakpoint-down
+			if(
+				variable-exists(cadmin-scaling-breakpoint-down),
+				$cadmin-scaling-breakpoint-down,
+				sm
+			)
 		)
 	);
 
@@ -20,7 +24,11 @@
 		if(
 			variable-exists(enable-scaling-components),
 			$enable-scaling-components,
-			$cadmin-enable-scaling-components
+			if(
+				variable-exists(cadmin-enable-scaling-components),
+				$cadmin-enable-scaling-components,
+				true
+			)
 		)
 	);