Настраиваемая тема применяется к цвету переднего плана пользовательского компонента не применяется

Попытка применить пользовательскую тему (цвет) для пользовательского компонента, но не применяет что-то, что я пропустил здесь, может подсказать мне, что я пропустил.

Цвет фона работает, но цвет текста не влияет.

в theme.scss

@import '~@angular/material/_theming.scss';

@include mat-core();
$mat-theme1: (
  0: #ffffff,
  50: #fafafa,
  100: #f5f5f5,
  200: #eeeeee,
  300: #e0e0e0,
  400: #bdbdbd,
  500: #ff0000,
  600: #bdbdbd,
  700: #bdbdbd,  

  contrast: (
    0: $black-87-opacity,
    50: $black-87-opacity,
    100: $black-87-opacity,
    200: $black-87-opacity,
    300: $black-87-opacity,
    400: $black-87-opacity,
    500: $black-87-opacity,
    600: $white-87-opacity,
    700: $white-87-opacity

  )
);



    $mat-theme2: (
  0: #ffffff,
  50: #fafafa,
  100: #f5f5f5,
  200: #eeeeee,
  300: #e0e0e0,
  400: #bdbdbd,
  500: #530202,
  600: #bdbdbd,
  700: #bdbdbd,  

  contrast: (
    0: $black-87-opacity,
    50: $black-87-opacity,
    100: $black-87-opacity,
    200: $black-87-opacity,
    300: $black-87-opacity,
    400: $black-87-opacity,
    500: $white-87-opacity,
    600: $white-87-opacity,
    700: $white-87-opacity

  )
);

$customTheme-primary: mat-palette($mat-theme1);
$customTheme-accent: mat-palette($mat-brown, A200, A100, A400);
$customTheme-warn: mat-palette($mat-cyan);


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



@mixin custom-theme($theme) {
  @include customComponent($theme);
}

@include angular-material-theme($light-theme);
@include custom-theme($light-theme);

в style.scss

@mixin customComponent($theme) {


    $primary: map-get($theme, primary);
  $warn: map-get($theme, warn);
  $foreground: map-get($theme, foreground);
  $background: map-get($theme, background);

    .box {
       background-color: mat-color($warn);
       color: mat-color($foreground, text);
    } 
  }

Кое-что, что я привожу пользовательскую тему для пользовательского компонента, она работает нормально, но основной цвет не берет.

0 ответов

Другие вопросы по тегам