mirror of
https://github.com/woocommerce/storefront.git
synced 2025-08-21 04:11:59 +08:00
Add accent color to WC Blocks price slider (#1508)
* Add accent color to WC Blocks price slider * Add IE11 styles * Fix WC Blocks styles not visible in the editor
This commit is contained in:
parent
76dbf005a3
commit
85402b4cbc
1 changed files with 44 additions and 32 deletions
|
@ -870,38 +870,6 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
|
|||
color: ' . $storefront_theme_mods['hero_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link) {
|
||||
background-color: ' . $storefront_theme_mods['button_alt_background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link):hover,
|
||||
.wc-block-components-button:not(.is-link):focus,
|
||||
.wc-block-components-button:not(.is-link):active {
|
||||
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['button_alt_background_color'], $darken_factor ) . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link):disabled {
|
||||
background-color: ' . $storefront_theme_mods['button_alt_background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-cart__submit-container {
|
||||
background-color: ' . $storefront_theme_mods['background_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-cart__submit-container::before {
|
||||
color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], is_color_light( $storefront_theme_mods['background_color'] ) ? -35 : 70, 0.5 ) . ';
|
||||
}
|
||||
|
||||
.wc-block-components-order-summary-item__quantity {
|
||||
background-color: ' . $storefront_theme_mods['background_color'] . ';
|
||||
border-color: ' . $storefront_theme_mods['text_color'] . ';
|
||||
box-shadow: 0 0 0 2px ' . $storefront_theme_mods['background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['text_color'] . ';
|
||||
}
|
||||
|
||||
@media screen and ( min-width: 768px ) {
|
||||
.secondary-navigation ul.menu a:hover {
|
||||
color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['header_text_color'], $brighten_factor ) . ';
|
||||
|
@ -1007,6 +975,50 @@ if ( ! class_exists( 'Storefront_Customizer' ) ) :
|
|||
.wp-block-cover .wp-block-cover__inner-container h6:not(.has-text-color) {
|
||||
color: ' . $storefront_theme_mods['hero_heading_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-price-slider__range-input-progress,
|
||||
.rtl .wc-block-components-price-slider__range-input-progress {
|
||||
--range-color: ' . $storefront_theme_mods['accent_color'] . ';
|
||||
}
|
||||
|
||||
/* Target only IE11 */
|
||||
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
|
||||
.wc-block-components-price-slider__range-input-progress {
|
||||
background: ' . $storefront_theme_mods['accent_color'] . ';
|
||||
}
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link) {
|
||||
background-color: ' . $storefront_theme_mods['button_alt_background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link):hover,
|
||||
.wc-block-components-button:not(.is-link):focus,
|
||||
.wc-block-components-button:not(.is-link):active {
|
||||
background-color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['button_alt_background_color'], $darken_factor ) . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-components-button:not(.is-link):disabled {
|
||||
background-color: ' . $storefront_theme_mods['button_alt_background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['button_alt_text_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-cart__submit-container {
|
||||
background-color: ' . $storefront_theme_mods['background_color'] . ';
|
||||
}
|
||||
|
||||
.wc-block-cart__submit-container::before {
|
||||
color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['background_color'], is_color_light( $storefront_theme_mods['background_color'] ) ? -35 : 70, 0.5 ) . ';
|
||||
}
|
||||
|
||||
.wc-block-components-order-summary-item__quantity {
|
||||
background-color: ' . $storefront_theme_mods['background_color'] . ';
|
||||
border-color: ' . $storefront_theme_mods['text_color'] . ';
|
||||
box-shadow: 0 0 0 2px ' . $storefront_theme_mods['background_color'] . ';
|
||||
color: ' . $storefront_theme_mods['text_color'] . ';
|
||||
}
|
||||
';
|
||||
|
||||
return apply_filters( 'storefront_gutenberg_customizer_css', $styles );
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue