Angular 6 Темы: Как установить цвет фона и использовать во всем приложении - PullRequest
0 голосов
/ 28 ноября 2018

У меня есть файл theme.scss, в котором я установил цвета, как показано ниже:

/* mat-palette accepts $palette-name, main, lighter and darker variants */

@import '~@angular/material/theming';
@include mat-core();

$gims-app-primary: mat-palette($mat-blue,500,900,A100);
$gims-app-accent:  mat-palette($mat-yellow, 500, A200, A100);
$gims-app-warn:    mat-palette($mat-red,500,900,A100);

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

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

Мне нужно объявить цвет фона здесь и использовать его во всем приложении.Так как я буду реализовывать светлую и темную тему, цвет фона должен быть настраиваемым.Есть идеи, как этого добиться?

1 Ответ

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

Помимо основной, акцентной и предупреждающей палитр, темы материала также имеют палитры переднего и заднего плана (как указано в документации ).Тем не менее, в официальных документах нет примеров.

Существует обсуждение на Github относительно добавления этих документов, и я думаю, что следующий комментарий , который также имеет ссылку на пример из стекаблита, может помочь вам в этом.

Еще один способ определения цвета один раз и использования его по ссылке во всем приложении - использование CSS-переменных, как описано здесь .В этом случае вы можете включить переменные в файл styles.css, используя: корневой селектор:

:root {
  --blue-1: #0055AA;
}
...