This repository was archived by the owner on Jan 13, 2025. It is now read-only.
This repository was archived by the owner on Jan 13, 2025. It is now read-only.
Flat button hover background ignores CSS variables #818
Closed
Description
What MDC-Web Version are you using?
0.13.0, served from jsdelivr
What browser(s) is this bug affecting?
Chromium 58.0.3029.81
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.81 Safari/537.36
Firefox Nightly 56.0a1
Mozilla/5.0 (X11; Linux x86_64; rv:56.0) Gecko/20100101 Firefox/56.0
What OS are you using?
Arch Linux x86_64 (last updated May 3rd)
What are the steps to reproduce the bug?
- Create a flat button with accent or primary coloring (class="mdc-button mdc-button--accent")
- Hover over it, or click on it (Chrome devtools "Force element state" is useful here)
What is the expected behavior?
The flat button background is based on the relevant CSS variables.
What is the actual behavior?
The flat button background is always indigo or pink.
Any other information you believe would be useful?
The offending CSS rule is under the selector .mdc-button.mdc-button--primary::before
. This can probably be fixed by using smaller opacity values and switching background-color to the (opaque) variable value.
Metadata
Metadata
Assignees
Labels
No labels