角度材质主题/更改边框半径

Question

我正在使用带有主题的 Angular Material。

$my-theme-redish: (...
$my-theme-red: (...
$my-theme-celeste: (...

$my-theme-primary: mat-palette($my-theme-redish);
$my-theme-accent:  mat-palette($my-theme-celeste);
$my-theme-warn:    mat-palette($my-theme-red);

$my-app-theme: mat-light-theme((
  color: (
    primary: $my-app-primary,
    accent: $my-app-accent,
    warn: $my-app-warn,
  )
));

现在我也想主题/更改border-radius. 我可以在主题中做到这一点吗？我没有找到任何关于此的文档。

我尝试通过使用::ng-deep或直接寻址某些组件来进行主题化：

$my-theme-redish: (...
$my-theme-red: (...
$my-theme-celeste: (...

$my-theme-primary: mat-palette($my-theme-redish);
$my-theme-accent:  mat-palette($my-theme-celeste);
$my-theme-warn:    mat-palette($my-theme-red);

$my-app-theme: mat-light-theme((
  color: (
    primary: $my-app-primary,
    accent: $my-app-accent,
    warn: $my-app-warn,
  )
));

但没有任何效果。

Answer 1

演示您是否尝试添加

.mat-dialog-container {
  border-radius: 20px !important;
}

全局内部styles.css

或者如果您只想要此对话框，请提供带有panelClass选项的自定义类，如下例所示

this.dialog.open(dialogComponent, { panelClass: 'custom-container' });

和

.custom-container .mat-dialog-container {
   border-radius: 20px !important;
}

全局内部styles.css