Minor: how to access button.wp-block-button__link in /wp-includes/themes/classic-themes.css

Support
#1

Hello Themeco-Team,

Unfortunately, we ran into a font issue.

In plugins\woocommerce\packages\woocommerce-blocks\wc-blocks-style.css there is a class definition that uses the WooCommerce font-family:
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.added:after {
content: “”;
font-family: WooCommerce;
…
}

The css class is used in the WooCommerce hand-picked product block. On https://efit.eftch.de this creates a rectangle on the button, after clicking the button. We changed the after element in the global css by overwriting the content and font-family:

.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.added:after {
content:“X”;
font-family:inherit;
}
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link.loading:after {
content:"*";
font-family:inherit;
}

Two questions:

  • Could this issue somehow be related to Pro CSS conflicting with WooCommerce CSS?
  • Is there a Font Awesome solution possible instead of using “X” and “*”?

Thanks for taking a look at it.

Best
Hendrik

#2

Hello Hendrik,

Be advised that Custom CSS Coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

It is best that you contact the creators of WooCommerce or ask for further assistance in the WooCommerce support community.

Thank you for your understanding.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.