question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MdSlider doesn't work with dark themes

See original GitHub issue

Bug, feature request, or proposal:

Bug

What is the expected behavior?

If I use multiple themes I expect it that the accent color should change if I change the theme like other components do, for instance the md-raised-button.

What is the current behavior?

The accent color does not change even if the special color is specified.

AFAIK this issue only exists since the beta.3 release.

What are the steps to reproduce?

I just took the example code from the “Multiple themes”-Guide an tried it with a md-slider. The toggleTheme function controls a HostBinding which controls the .unicorn-dark-theme class.

@import '~@angular/material/theming';

@include mat-core();

// Define the default theme (same as the example above).
$candy-app-primary: mat-palette($mat-indigo);
$candy-app-accent:  mat-palette($mat-pink, A200, A100, A400);
$candy-app-theme:   mat-light-theme($candy-app-primary, $candy-app-accent);

// Include the default theme styles.
@include angular-material-theme($candy-app-theme);

// Define an alternate dark theme.
$dark-primary: mat-palette($mat-blue-grey);
$dark-accent:  mat-palette($mat-amber, A200, A100, A400);
$dark-warn:    mat-palette($mat-deep-orange);
$dark-theme:   mat-dark-theme($dark-primary, $dark-accent, $dark-warn);

.unicorn-dark-theme {
  @include angular-material-theme($dark-theme);
}
<md-slider color="accent"></md-slider>
<button md-raised-button color="primary" (click)="toggleTheme()">Toggle</button>

I cannot provide a plunker because they seem not to have beta.3 release.

What is the use-case or motivation for changing an existing behavior?

It’s a bug. The motivation should be clear.

Which versions of Angular, Material, OS, browsers are affected?

  • Angular 4.0.0 resp. 4.0.3
  • Angular Material 2.0.0-beta.3

Is there anything else we should know?

No

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
mmalerbacommented, May 11, 2017

Ah I think I see what you meant here, the track color doesn’t change. This isn’t related to multiple themes, but I’ll re-open this to track the issue

0reactions
angular-automatic-lock-bot[bot]commented, Sep 7, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

Read more comments on GitHub >

github_iconTop Results From Across the Web

MdSlider doesn't work with dark themes · Issue #4249 - GitHub
I just took the example code from the "Multiple themes"-Guide an tried it with a md-slider. The toggleTheme function controls a HostBinding ...
Read more >
Change default background color of md-slider of Angular ...
It seems though that it does not work if you concatenate more classes. ... ::ng-deep .mat-accent .mat-slider-thumb { background-color: black ...
Read more >
Slider - KivyMD 1.1.1 documentation
Sliders allow users to make selections from a range of values. https://github.com/HeaTTheatR/KivyMD-data/raw/. API - kivymd.uix.slider.slider #.
Read more >
Dark theme - Android Developers
Dark theme applies to both the Android system UI and apps running on the device. There are three ways to enable Dark theme...
Read more >
Can not edit slider? | Mega Drupal
If you are having some problems with our module MD Slider including: cannot edit, cannot add object, cannot add new slides or delete...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found