Angular 6 Material - Оттенки и как изменить цвет переключателя мата - PullRequest
Новая
       36

Angular 6 Material - Оттенки и как изменить цвет переключателя мата

0 голосов
/ 28 сентября 2018

Как я могу изменить цвет с помощью CSS?

Увидел в другом посте, что если я буду использовать следующий код, он изменит его, но мне пока не повезло с этим.

.mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {
    background-color:rgb(255, 37, 37);
  }

.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
    border-color: rgb(66, 134, 244);
}

.mat-radio-button.mat-accent .mat-radio-inner-circle {
    background-color: rgb(66, 134, 244);
}

Кроме того, как я могу использовать остальные цветовые оттенки?

<mat-radio-button color="accent">Hello, World</mat-radio-button>

Скажем, я хочу использовать цвет Accent, оттенок 300 или A100, как бы я это сделал?

Я пытался использовать accent-100 и accent hue-100, но это не работает

1 Ответ

0 голосов
/ 28 сентября 2018

добавить этот CSS в ваш style.css/style.scss

Stackblitz

style.css / style.scss 

.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{
  border-color:rgb(66, 134, 244); 
}

.mat-radio-button.mat-accent .mat-radio-inner-circle{
  color:rgb(66, 134, 244);
  background-color:rgb(66, 134, 244) ;
}

.mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {
    background-color:rgb(255, 37, 37,.26)
}
...