How can I have the product borders darken when you hover over them

[lukafernada]

I want to have my borders darken when you hover over them like it does in this website here: 

https://www.towerhousewares.co.uk/cooking-appliances
Whereas currently it is like this:

[Made4uo-Ribe · Accepted solution]

Hi @lukafernada 

Sorry, I misunderstood. Check this code instead

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.card-wrapper.product-card-wrapper:hover .card__inner {
    border-color: black;
}

• And Save.
• Result:

[iMHussainDogar]

Hi,  adding dark border when hover over the products is possible using CSS custom code, 

You have to target the product item div and add css like this

.product item:hover {border: 1px solid black }

Hope this will help you, if you still need you can contact me

We can sort this problem.

[jehan70]

Where to add this exactly?

[lukafernada]

i dont understand sorry, it is not working

[Made4uo-Ribe]

Hi @lukafernada 

Try this one. 

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.underline-links-hover:hover a {
        text-decoration-thickness: 1.5px;
    }

• And Save.
• Result:
• 

Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! 

[lukafernada]

this wasn't what i was asking for unfortunately, if you could see the example site referenced

[Made4uo-Ribe · Accepted solution]

Hi @lukafernada 

Sorry, I misunderstood. Check this code instead

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.card-wrapper.product-card-wrapper:hover .card__inner {
    border-color: black;
}

• And Save.
• Result:

[PAUL8]

Hello, can you help me to have the same effect but on my store?
It's womber.fr and the password is PROPAGANDAAA
Because your code didn't work for my store... I use dawn theme.
Thanks!

[lukafernada · Accepted solution]

That didn't work but this did:

Edit Code > Assets >  Bottom of base.css

.card-wrapper.collection-card-wrapper:hover .card__inner {
     border: solid 1px #252268;
    transition: all 0.8s;
  }