Site logo

Archived topic

Gutenberg & Buttons

12 replies · Started by Ash on June 11, 2020

Viewing posts 1–13 of 13

Just a quick question gutenberg shouldn't it inherit the theme settings, like font/size/colour? Seems so but the woocommerce blocks don't?

Also do you have a code that will cover most buttons site wide, found some on the forum but nothing is working. They change on inspection tool but once added to additional css they dont work, even with '!important' something seems to be overiding it.

Hi there,

unfortunately different plugins use different CSS Classes and their own Custom CSS for button styling. So there isn't a one size fits all solution.

Which ones you have issues with ? If you can link me to where i can see one.

Woocommerce ones mainly

Any of the standard woocommerce ones ie. not from a plugin should attract styles from:

Customizer > Typography > Buttons

and specifically:

Customizer > Colors > Woocommerce - where there are several button options.

If you can point me to any page where a plugin is used that isn't using those styles i can take a look

I would like to change border radius on them. As I say I found several codes on the forum, one by Tom which covers most of the buttons but none work.

Even a simple one like this won't work

.woocommerce div.product form.cart .button {
	border-radius: 5px;
}

Sorted found a rogue curly brace in css.

Regarding the gutenberg I need to add custom css for woocommmerce blocks then? It's not inheriting font/size/colour.

Glad you found the issue.

Just checked the latest version of the Woo Block buttons and they do inherit colors / fonts etc from the theme. For border radius you can remove like so:

.wp-block-button__link {
    border-radius: 0;
}

Sorry we have crossed wires somewhere. Gutenberg issue is with product titles, price etc font size and colour is not inherited from the theme, I thought they should be.

My bad - i misread that.

Unfortunately not - Woo ( and other core block developers ) have this annoying habit of changing the markup and CSS of their blocks. We're waiting for that to stabilise before we review any integrations.

But Woo Shortcodes DO inherit the styles and layout from the customizer.

Ok thanks.

Regarding Update Basket button, due to the colour of my buttons it looks blank. Rather it just look like it does when you hover over it.

The Update Button in the Cart is a 'ghosted' when there is nothing to update. If you make a change to the cart eg. item qty you will see the colors.

I know I looked at the demos sites but due to the colour I use for buttons it just looks completely blank

Sorry is this issue resolved? It's marked as resolved.

If not what is the current issue and where can I see it?

Thanks!

This archived topic is closed to new replies.