Как выбрать изменение цвета материала для моделирования углового компонента - PullRequest
Новая
       5

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

0 голосов
/ 26 октября 2019

Есть ли способ определить, какой вариант палитры будет использоваться при установке цвета на акцент (или основной)?

Например, я хочу установить цвет фона для моей панели инструментов на A100, но Angular Materialпо умолчанию выберет 300.

Я определил пользовательскую тему: 

@include mat-core();
$my-app-primary: mat-palette($mat-light-blue);
$my-app-accent: mat-palette($mat-grey, 300, 200, A100);
$my-app-warn: mat-palette($mat-deep-orange);

$my-app-theme: mat-light-theme($my-app-primary, $my-app-accent, $my-app-warn);

@include angular-material-theme($my-app-theme);

И я хочу установить цвет фона панели инструментов на один из вариантов выбранной палитры: 

<mat-toolbar color="accent"> <!-- how to set accent variation -->
    <span>My Application</span>
</mat-toolbar>

Я знаю, что могу перезаписать CSS. Если это так, как я могу использовать переменные, определенные в _theming.scss, чтобы не отклоняться от цветов палитры?

1 Ответ

0 голосов
/ 28 октября 2019

Вы можете просто импортировать свои переменные стиля и затем использовать их. 

@import "../../_theming.scss"; // <-- set your path to '_theming.scss'

mat-toolbar {
    background-color: $my-app-primary;
}
...