Closed MrSimmmons closed 4 years ago
I think the catalog usage needs to be updated, here the demo of latest checkbox with custom theme: https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/07/08/19_30_20_273/spec/mdc-checkbox/mixins/container-colors.html?utm_source=golden_json
Here is the usage: https://github.com/material-components/material-components-web/blob/master/test/screenshot/spec/mdc-checkbox/fixture.scss
I'm transferring this issue to catalog repo.
Actually theme demo already removed, but problem was in the way of styling components in demo:
.theme-demo {
$mdc-theme-primary: #fcb8ab;
$mdc-theme-secondary: #feeae6;
@import "@material/checkbox/mdc-checkbox";
}
<div class="theme-demo">
<div className='mdc-checkbox'>...</div>
</div>
In this case because of this condition wrong class for checkbox animation was generated .theme-demo.mdc-checkbox--anim-unchecked-checked ....
(without space after .theme-demo
).
Two components mdc-top-app-bar
and mdc-checkbox
are affected by this problem.
Including whole components style inside parent selector is considered as a bad practice, so no fixes on components side required. Since this code already removed from material-components-web-catalog
no additional actions required.
Closing this issue.
Bug report
When the theme of a checkbox has been changed, clicking on the checkbox flashes the secondary color at the start and end of the aniamtion.
Steps to reproduce
Actual behavior
The secondary color flashes
Expected behavior
The primary color should flash, not the secondary color
Screenshots