feat(clay-css): Label adds .c-inner pattern for .label, `.label-l…

…g`, and `.label-item` feat(clay-css): Mixins `label-size` add `.c-inner` pattern issue #2763
liferay · Feb 17, 2020 · bbde2ec · bbde2ec
1 parent 01b7aee
commit bbde2ec
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/packages/clay-css/src/scss/components/_labels.scss b/packages/clay-css/src/scss/components/_labels.scss
@@ -37,6 +37,20 @@
 		}
 	}
 
+	@if ($enable-c-inner) {
+		> .c-inner {
+			display: inline-flex;
+			margin-bottom: math-sign($label-padding-y);
+			margin-left: math-sign($label-padding-x);
+			margin-right: math-sign($label-padding-x);
+			margin-top: math-sign($label-padding-y);
+			padding-bottom: $label-padding-y;
+			padding-left: $label-padding-x;
+			padding-right: $label-padding-x;
+			padding-top: $label-padding-y;
+		}
+	}
+
 	// Inline Item in Labels are deprecated in v2.0.0-rc.11 use .label-item
 	// pattern instead
 	.inline-item {
@@ -126,6 +140,14 @@ button.label {
 		display: inline-flex;
 	}
 
+	@if ($enable-c-inner) {
+		.c-inner {
+			.lexicon-icon {
+				display: block;
+			}
+		}
+	}
+
 	.close {
 		@include clay-close($label-close);
 	}

diff --git a/packages/clay-css/src/scss/mixins/_labels.scss b/packages/clay-css/src/scss/mixins/_labels.scss
@@ -115,6 +115,19 @@
 	.sticker-overlay {
 		border-radius: $sticker-border-radius;
 	}
+
+	@if ($enable-c-inner) {
+		> .c-inner {
+			margin-bottom: math-sign($padding-y);
+			margin-left: math-sign($padding-x);
+			margin-right: math-sign($padding-x);
+			margin-top: math-sign($padding-y);
+			padding-bottom: $padding-y;
+			padding-left: $padding-x;
+			padding-right: $padding-x;
+			padding-top: $padding-y;
+		}
+	}
 }
 
 /// A mixin for creating `.label` color variants.