tomusborne / generateblocks

GenerateBlocks is a small collection of lightweight WordPress blocks that can accomplish nearly anything.
https://generateblocks.com
193 stars 19 forks source link

Button Icon Color #659

Open diggeddy opened 1 year ago

diggeddy commented 1 year ago

Description

Add Icon color options for Buttons

SchneiderSam commented 1 year ago

Yes please. This would be a great thing, especially for the Accordion Block/ Tab Block.

franciscogaray commented 1 year ago

+1 https://generate.support/topic/button-icon/#post-28261

How do you change the icon color on a button that is different from the text button color? https://postimg.cc/DJcH6fpb

franciscogaray commented 1 year ago

+1 https://generate.support/topic/button-icon/#post-28585

Hi Francisco – Please upvote this feature from me too. Anytime you can move CSS like this to the editor makes sense – especially when using Global Styles.

To link the color to the GP color palette, give this CSS a whirl. The variable color can be linked to whatever palette color desired, and it now has more global styling capabilities.

/* CSS to change the fill color */
.custom-color > .gb-icon > svg > path { 
  fill: var(--primary-accent); /* Replace 'primary-accent' with your desired palette color */
}

/* CSS for hover effect */
.custom-color:hover > .gb-icon > svg > path { 
  fill: var(--secondary-accent); /* Replace 'secondary-accent' with your desired palette color */
}

Thanks, David