Shopify themes, liquid, logos, and UX
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
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025