Fix UI misalignment of Filter by Price in TT1 theme (https://github.com/woocommerce/woocommerce-blocks/pull/10732)
* Fix UI misalignment of Filter by Price in TT1 theme * Fix frontend Firefox styles * Simplify the styles and fix them in Editor (Firefox/Safari) * Align the background color and sizing in Firefox
This commit is contained in:
parent
95fb51be4d
commit
dad3a41caa
|
@ -331,11 +331,10 @@
|
|||
}
|
||||
.wc-block-components-price-slider__range-input-progress {
|
||||
--range-color: currentColor;
|
||||
margin: -$border-width;
|
||||
}
|
||||
.wc-block-price-filter__range-input {
|
||||
background: transparent;
|
||||
margin: -$border-width;
|
||||
height: 0;
|
||||
width: calc(100% + #{$border-width * 2});
|
||||
&:hover,
|
||||
&:focus {
|
||||
|
@ -350,13 +349,24 @@
|
|||
}
|
||||
}
|
||||
&::-webkit-slider-thumb {
|
||||
margin-top: -9px;
|
||||
background: $white;
|
||||
margin-top: -6px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
&.wc-block-components-price-slider__range-input--max::-moz-range-thumb {
|
||||
transform: translate(2px, 1px);
|
||||
background: $white;
|
||||
transform: translate(2px, 2px);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
&.wc-block-components-price-slider__range-input--min::-moz-range-thumb {
|
||||
transform: translate(-2px, 1px);
|
||||
background: $white;
|
||||
transform: translate(-2px, 2px);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
&::-ms-track {
|
||||
border-color: transparent !important;
|
||||
|
|
Loading…
Reference in New Issue