How to remove the hover effect from the icons

Store Design
, , , , , , , , , , , ,
1

Hi, when I hover over the icons for the magnifying glass, login, and cart in the header they slightly enlarge. How can I remove this?

CreatorTim_0-1737155380019.png
CreatorTim_0-1737155380019.png1848×611 75.3 KB

Here’s my store: https://1049xn-ya.myshopify.com/

Thanks,
Tim

2

Hi CreatorTim

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file

.header__icon:hover {
   scale: 0.94 !important;
}

Best,
Esther

3

Hi @CreatorTim

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
.header__icon:hover .icon, .modal__close-button:hover .icon {
    transform: scale(1) !important;
}

I hope this helps

Best,

Daisy

4

Thank you man!

5

Thank you!

6

hey, what if you want to add the hover effect to a custom cart icon? is it doable?