diff --git a/assets/js/base/components/chip/style.scss b/assets/js/base/components/chip/style.scss index 3dff3d1aed4..58a3ebf0cd5 100644 --- a/assets/js/base/components/chip/style.scss +++ b/assets/js/base/components/chip/style.scss @@ -28,17 +28,15 @@ &.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; @@ -46,11 +44,11 @@ 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 index 0ccd641ee74..e23057b7408 100644 --- 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); }