Josh Javier• 790
@joshjavier
Posted
Hello Anthony! I got curious myself and I found this: Solving Sticky Hover States with @media (hover: hover)
tl;dr You have to move the hover style in a media query so it will only get applied to devices that have hover capability.
To preserve the glow effect when we actually tap the button on mobile, we need to add a rule that applies the same style to the :active state:
.btn:active {
box-shadow: 0 0 25px 1px var(--neon-green);
}
@media (hover: hover) {
.btn:hover {
box-shadow: 0 0 25px 1px var(--neon-green);
}
}
Hope it helps :)
Marked as helpful
1
Anthony Nanfito• 120
@ananfito
Posted
@joshjavier brilliant! That works! Thanks so much for the help and for the article with the description. I bookmarked that for future reference.
1
