Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hey guys, I want to remove the hover effect from my store so that when I hover over any container—whether it's in the login section, contact section, or newsletter—nothing happens.
Right now, the borders highlight when I hover over them, but I don't want that. I just want them to black color without any effects.
You can check it out here: https://1049xn-ya.myshopify.com/pages/contact
Thanks a lot,
Tim
Hello @CreatorTim
.footer .field::after{
box-shadow: unset !important;
}
.footer .field::before{
border-radius: unset !important;
box-shadow: unset !important;
}
.footer .field__input:focus-visible{
box-shadow: unset !important;
border-radius: unset !important;
}
Go to Theme > Customization > Theme Setting > CSS
If its helpful , please Like & Accept as solution Thanks
Hey, I don't want to remove the borders. I want to remove the hover effect so that when I hover over the container, the borders don’t get highlighted.
Hello @CreatorTim
.footer .field:hover.field:after {
box-shadow: 0 0 0 var(--inputs-border-width) rgba(var(--color-foreground), var(--inputs-border-opacity)) !important;
}
Check the update code.
please Like & Accept as solution Thanks