I'd advise you increase the transition time on the button to 0.5s
or 500ms
for a smoother flow.
Secondly, the hover state has an outline caused by the box shadow
you added.
button:hover, button:focus {
background-color: hsl(var(--clr-green));
color: hsl(var(--clr-grey));
outline: none;
box-shadow: 0 0 0 0.1875rem rgba(255, 255, 255, 0.75);
}
In my opinion, you can remove the box-shaow
property.
@medic-code
Posted
Thanks for your feedback
I'll make the change for transition time, the box shadow was just me doing a little styling, its probably unnecessary.
@Marvie-03