Remove border on hover in product grid - Stiletto theme

Store Design
, , , , ,
1

Want to remove the border that appears on hover when in collection page view - I have identified the div class and have tried many different codes but nothing is working so far! Any help appreciated.

site: https://afca7f-2.myshopify.com/collections/all

2

Hi @blakelyhi

You can do that by removing this CSS code in your theme.css file

.product-item--border-on-hover .product-item__inner .product-item__hover-container{
      border:1px solid var(--color-text);
}

Screenshot_4.jpg
Screenshot_4.jpg1843×862 119 KB

3

Hey @blakelyhi

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1698153848164.png
Moeed_0-1698153848164.png1487×794 77.2 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

4

Thank you so much!!

5

Got it fixed, thank you so much!

6

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

7

You are very welcome, @blakelyhi