Remove clickable link image opacity change in Simple theme?

Solved
Excursionist
14 1 1

How can I get rid of the opacity change when hovering over images that are clickable links in Simple theme?

0 Likes
Shopify Expert
164 34 56

Can you please share url so I can send you code for the solution. 

Thank you

Problem Solved? ✔️Accept the solution so you can help others.
* Email: fayyazraza@gmail.com * Skype: fayyaz_raza
0 Likes
Shopify Expert
164 34 56

in theme.scss.css file remove 

a:hover, a:focus { opacity: 0.7;
Problem Solved? ✔️Accept the solution so you can help others.
* Email: fayyazraza@gmail.com * Skype: fayyaz_raza
0 Likes
Highlighted
Excursionist
14 1 1

Hi Fayyaz,

 

I'm not finding that particular string in the theme.scss.liquid file for Simple. This is the closest I can find: 

a:active,
a:hover {
  outline: 0;
}

 

0 Likes
Shopify Expert
164 34 56

ok change this css to 

a:active,
a:hover {
  outline: 0;
opacity:1
}
Problem Solved? ✔️Accept the solution so you can help others.
* Email: fayyazraza@gmail.com * Skype: fayyaz_raza
0 Likes
Excursionist
14 1 1

Hmm, that doesn't seem to be working, either. I added the opacity line, but hovering over image links still reduced the opacity.

0 Likes

Success.

Pathfinder
98 12 29

Don't remove CSS.... Add overrides at the bottom of the theme.scss.liquid file so that you can always go back to default, the code below will fix it, also way easier than trying to find 1 line of CSS in a sea of CSS and SCSS 

/* THEME MODIFICATIONS */

a:hover { opacity: 1; }
1 Like
Excursionist
14 1 1

Thank you, that worked perfectly!

0 Likes