1

我试图为我的角度材质主题添加更多颜色,我通过 map.deep-merge 功能在我的 style.scss 中添加了成功颜色

// Custom Theming for Angular Material
// For more information: https://material.angular.io/guide/theming
@use '@angular/material' as material;
@use "sass:map";

@include material.core();

$custom-primary: material.define-palette(material.$light-blue-palette);
$custom-accent: material.define-palette(material.$blue-palette, A200, A100, A400);
$custom-warn: material.define-palette(material.$red-palette);
// extra Colors
$custom-success: material.define-palette(material.$green-palette);
$custom-danger: material.define-palette(material.$orange-palette);



$custom-theme: material.define-light-theme((
  color: (
    primary: $custom-primary,
    accent: $custom-accent,
    warn: $custom-warn,
  )
));


$custom-theme: map.deep-merge(
  $custom-theme,(
    success: $custom-success,
    danger: $custom-danger,
    color:(
      success: $custom-success,
      danger: $custom-danger
    )
  )
    );

@include material.all-component-themes($custom-theme);

一切都正确编译但是当我尝试将颜色应用于按钮时它看起来像这样 在此处输入图像描述

而且不知道为什么。

<button mat-raised-button color="success">Success</button>
<button mat-raised-button color="danger">Danger</button>

目前我正在使用“@angular/material”:“^13.2.4”,

4

0 回答 0