Angular Material 2 mat-palette() 使用更浅和更深的选项

Question

基于theming guide您可以为我们的示例定义自定义主题 accent。第二个参数将覆盖 $mat-pink 默认为 A200，但是第三个 ($lighter) 和第四个 ($darker)参数有效？

$candy-app-accent: mat-palette($mat-pink, A200, A100, A400);

From @angular/material/_theming.scss

@function mat-palette($base-palette, $default: 500, $lighter: 100, $darker: 700) {
   .....
}

Answer 1

这些不同的色调被一些组件使用，比如进度条。但如果您将它们用作自己样式的混入，它会更有用。 This answer on a GH issue gives a good explanation .