How can I change the icon color to black when hovering over the header?

Store Design
, , ,
1

The hovering function is applied to text, but the hovering function is not applied to the search icon and cart icon.
How can I change the color of both icons to black when hovering over the header?

lgbtqstyles.com // mohtse

2

Hi @swoo0105 ,

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/base.css->paste below code at the bottom of the file:

.header:hover .header__icon .icon {
    color: black;
}

Hope my answer will help you!

3

Hello @swoo0105 ,

You can follow these steps:

  1. Go to Online Store->Theme->Edit code

GemPages_0-1676428104528.png
GemPages_0-1676428104528.png400×193 29.2 KB

  1. Open your theme.liquid file, paste the below code before

GemPages_1-1676428148194.png
GemPages_1-1676428148194.png1699×859 66.6 KB

I hope the above is useful to you.

Kind & Best regards,
GemPages Support Team