Make Active filters texts bigger (woocommerce#7087)

senadir · Nov 12, 2022 · b0955d5 · b0955d5
1 parent 1a071c1
commit b0955d5
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 9 deletions.
diff --git a/assets/js/base/components/chip/style.scss b/assets/js/base/components/chip/style.scss
@@ -28,29 +28,27 @@
 	&.wc-block-components-chip--radius-large {
 		border-radius: 2em;
 		padding-left: 0.75em;
-		padding-right: 0.75em;
+		padding-right: 0.25em;
 	}
 	.wc-block-components-chip__text {
-		@include font-size(smaller);
 		flex-grow: 1;
 	}
 	&.is-removable .wc-block-components-chip__text {
-		padding-right: 0.25em;
+		padding-right: 0.5em;
 	}
 	.wc-block-components-chip__remove {
-		@include font-size(smaller);
 		background: $gray-200;
 		border: 0;
 		border-radius: 25px;
 		appearance: none;
 		padding: 0;
 		height: 16px;
 		width: 16px;
+		line-height: 16px;
 		margin: 0;
 	}
 
 	.wc-block-components-chip__remove-icon {
-		vertical-align: middle;
 		fill: $gray-900;
 	}
 }

diff --git a/assets/js/blocks/active-filters/style.scss b/assets/js/blocks/active-filters/style.scss
@@ -14,7 +14,7 @@
 	overflow: hidden;
 
 	.wc-block-active-filters__clear-all {
-		@include font-size(smaller);
+		@include font-size(small);
 		border: none;
 		margin-top: 15px;
 		padding: 0;
@@ -73,7 +73,6 @@
 	}
 
 	.wc-block-active-filters__list-item-name {
-		@include font-size(smaller);
 		display: flex;
 		align-items: center;
 		position: relative;
@@ -86,8 +85,9 @@
 		appearance: none;
 		height: 16px;
 		width: 16px;
+		line-height: 16px;
 		padding: 0;
-		margin: 0 16px 0 0;
+		margin: 0 0.5em 0 0;
 		color: currentColor;
 
 		&:hover {
@@ -111,7 +111,6 @@
 		}
 
 		.wc-block-components-chip {
-			@include font-size(small);
 			margin-top: em($gap-small * 0.25);
 			margin-bottom: em($gap-small * 0.25);
 		}