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
I use dawn theme, my store is womber.fr and the password is PROPAGANDAAA
Thanks!
Regards,
Topic summary
Goal: Add a hover effect so product card borders darken in a Shopify Dawn theme, similar to a referenced site.
What was done:
- Instruction provided to edit Online Store → Theme → Edit code → theme.liquid and insert CSS before to darken product borders on hover across collection product cards.
- Result confirmed working by the requester.
Follow‑ups:
- Request to make borders more rounded (“round angle”) to match existing design elements. Updated CSS was supplied; screenshot showed the rounded hover border working.
- New request to remove borders (or corner outlines) when not hovering on all product previews, effectively showing borders only on hover. A reply was posted but the code block appears empty/malformed, so no usable implementation was provided.
Notes:
- The solution hinges on CSS inserted in theme.liquid; exact code and screenshots are central to understanding the changes.
Status:
- Partially resolved. Hover darkening and rounded corners achieved.
- The final request (no border at rest, border only on hover) remains unresolved due to missing/incomplete code in the last reply.
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the tag
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
1 Like
Thanks, friend, it’s working. Can you edit the code to make it with a more round angle so it fits this little line?
Replace the code with that below.
Result:
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
1 Like
Thanks. Can you help me delete all these corners when you do not cover them in every product preview?
