-
Notifications
You must be signed in to change notification settings - Fork 6.8k
bug(mat-slider): when mat-slider has parent with .mat-accent it will not show the primary color #21271
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Comments
While I agree that this is kind of weird, I don't think we will do anything to change it. It's somewhat unexpected to put a slider inside of another form control that supports the |
This can happen if a slider is put inside a tab group with an explicit color. Reopening. |
Thank you @crisbeto, I can confirm, it will happen with a tab with color accent. It will also happen with a slider inside a toolbar. |
… component with theme The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes angular#21271.
… component with theme The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes angular#21271.
… component with theme The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes angular#21271.
… component with theme (#21334) The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes #21271.
… component with theme (#21334) The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes #21271. (cherry picked from commit b851456)
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
… component with theme (angular#21334) The slider theme selectors were a bit too broad which meant that it would automatically inherit the colors from a parent component, if the Material theming classes were used somewhere up the chain (e.g. a slider inside a tab group). These changes use more specific selectors to avoid the issue. Fixes angular#21271.
Reproduction
Steps to reproduce:
https://stackblitz.com/edit/angular-ma9v9u?file=src%2Fapp%2Flist-single-selection-example.html
Expected Behavior
mat-slider with color=primary should display primary color, nomatter where its used.
Actual Behavior
If parent has class mat-accent it will make the slider accent color.
Solution
The solution is obvious:
components/src/material/slider/_slider-theme.scss
Line 54 in d4f2fa6
this here wins over mat-primary ... Im asking if other components are programmed in this same "general selector fashion"
Environment
latest stackblitz from docs (see date of this post)
The text was updated successfully, but these errors were encountered: