NO BUG: Theme buttons hover style

Browser: Chrome 110
OS: Windows

I’m setting the Primary button styles on theme default (ELEMENT - BUTTON).
On ‘normal’ state my button has a shadow (X, Y, BLUR, SPREAD and custom shadow color).
I see that on hover state I cant only decrease shadow opacity, leaving X Y Blur & spread blank.
These values must be declared again also for hover state, they are not inherited from the normal state. Without re-declare them, hover shadow color doesn’t change.

Hi Dee,
Thanks so much for your report!

This is correct because the box-shadow property consists of several components (offset-x, offset-y, blur, spread, color) and you cannot overwrite only one component.

Something like box-shadow-offset-x does not exist and therefore you have to set all components again.

1: CSS Backgrounds and Borders Module Level 3
2: box-shadow - CSS: Cascading Style Sheets | MDN

Best regards,
timmse

1 Like