英文:
How to change text color in Angular Material 15?
问题
I am using Angular Material 15, and defined a theme like so:
$blue-palette: (
50: #e3f2fd,
100: #bbdefb,
200: #90caf9,
300: #64b5f6,
400: #42a5f5,
500: #2196f3,
600: #1e88e5,
700: #1976d2,
800: #1565c0,
900: #0d47a1,
A100: #82b1ff,
A200: #448aff,
A400: #2979ff,
A700: #2962ff,
contrast: (
50: $dark-primary-text,
100: $dark-primary-text,
200: $dark-primary-text,
300: $dark-primary-text,
400: $dark-primary-text,
500: $light-primary-text,
600: $light-primary-text,
700: $light-primary-text,
800: $light-primary-text,
900: $light-primary-text,
A100: $dark-primary-text,
A200: $light-primary-text,
A400: $light-primary-text,
A700: $light-primary-text,
)
);
$my-palette: mat.define-palette($blue-palette, 500);
$my-theme: mat.define-light-theme($palette);
@include mat.all-component-themes($my-theme);
But I would like to change the font color. It seems like Angular Material automatically defines the font color, black or white, according to my primary color. How do I change the font color?
英文:
I am using Angular Material 15, and defined a theme like so :
$blue-palette: (
50: #e3f2fd,
100: #bbdefb,
200: #90caf9,
300: #64b5f6,
400: #42a5f5,
500: #2196f3,
600: #1e88e5,
700: #1976d2,
800: #1565c0,
900: #0d47a1,
A100: #82b1ff,
A200: #448aff,
A400: #2979ff,
A700: #2962ff,
contrast: (
50: $dark-primary-text,
100: $dark-primary-text,
200: $dark-primary-text,
300: $dark-primary-text,
400: $dark-primary-text,
500: $light-primary-text,
600: $light-primary-text,
700: $light-primary-text,
800: $light-primary-text,
900: $light-primary-text,
A100: $dark-primary-text,
A200: $light-primary-text,
A400: $light-primary-text,
A700: $light-primary-text,
)
);
$my-palette: mat.define-palette($blue-palette, 500);
$my-theme: mat.define-light-theme($palette);
@include mat.all-component-themes($my-theme);
But I would like to change the font color. It seems like Angular Material automatically defines the font color, black or white, according to my primary color. How do I change the font color ?
答案1
得分: 4
这是关于Angular Material本身的问题,您可以在此线程上进行跟进,一旦问题解决,您的代码将正常工作:https://github.com/angular/components/issues/26056
英文:
This is an issue in angular material itself, you can follow-up on this thread, once it's resolved, you will have your code working: https://github.com/angular/components/issues/26056
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论