how do i change woocommerce cart icon to text with css?-CodePudding

Good day!

I have successfully changed WooCommerce cart icon to text, but cannot seem to add the brackets () around the cart quantity, e.g. (0) Bag.

Before the Elementor Pro and WooCommerce updates, the brackets were showing and working perfectly.

My website is www.byzastra.com

This is the CSS code I used to change the icon to text, but with no luck so var the brackets still does not want to show up on the front end nor back end.

How do I make it so that the brackets show up on website?

.eicon-cart-light::before {
    display: none;
}

.eicon-cart-light::after {
    content: "Bag";
    font-family: 'Good Sans';
    font-size: 12px;
    letter-spacing: 0px;
    
}

.elementor-button-icon::before {
    font-family: 'Good Sans';
    font-size: 12px;
    letter-spacing: 0px;
}

.elementor-button-icon[data-counter]::before {
    content: "(" attr(data-counter) ")";
}

CodePudding user response：

Like this:

.elementor-button-icon-qty:before {
  content: "(";
}

.elementor-button-icon-qty:after {
  content: ")";
}

<span >
                    <span  data-counter="0">0</span>
<i ></i> <span >Cart</span>
</span>