我在 angular 2 Material 中改变前景的颜色有困难。例如在工具栏中,文本是黑色的。我试图用以下样式改变它
@import '~@angular/material/theming';
$primary: mat-palette($mat-cyan, 300);
$accent : mat-palette($mat-yellow, 500);;
$warn : mat-palette($mat-red, 600);
$theme-foreground: (
base: gray,
divider: $white-12-opacity,
dividers: $white-12-opacity,
disabled: rgba(200, 200, 200, 0.38),
disabled-button: rgba(200, 200, 200, 0.38),
disabled-text: rgba(200, 200, 200, 0.38),
hint-text: rgba(200, 200, 200, 0.38),
secondary-text: rgba(200, 200, 200, 0.54),
icon: rgba(200, 200, 200, 0.54),
icons: rgba(200, 200 , 200, 0.54),
text: rgba(200, 200, 200, 0.87),
slider-min: rgba(200, 200, 200, 0.87),
slider-off: rgba(200, 200, 200, 0.26),
slider-off-active: rgba(200, 200, 200, 0.38),
);
$theme-background: (
status-bar: map_get($mat-grey, 300),
app-bar: map_get($mat-grey, 100),
background: map_get($mat-grey, 50),
hover: rgba(200, 200, 200, 0.04), // TODO(kara): check style with Material Design UX
card: white,
dialog: white,
disabled-button: $black-12-opacity,
raised-button: white,
focused-button: $black-6-opacity,
selected-button: map_get($mat-grey, 300),
selected-disabled-button: map_get($mat-grey, 400),
disabled-button-toggle: map_get($mat-grey, 200),
unselected-chip: map_get($mat-grey, 300),
);
$theme: (
primary: $primary,
accent: $accent,
warn: $warn,
is-dark: true,
foreground: $theme-foreground,
background: $theme-background
);
@include mat-core();
@include angular-material-theme($theme);
主色和强调色发生了变化,但前端没有变化。
我该如何解决?
我也尝试设置工具栏主题,但没有任何区别。
最佳答案
尝试定义您自己的主题,您还可以定义前景色,如下所述:
How can I use custom theme palettes in Angular?
关于Angular 2 Material 前景,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45382529/