mat-dialog 在 Angular Material 15 中意外更改了 css

Question

从 Angular Material 15 开始，mat-dialog 的内容有一些奇怪的 css：

.mat-mdc-dialog-container .mdc-dialog__content {
    color: var(--mdc-dialog-supporting-text-color, black);
}

.mat-mdc-dialog-container .mdc-dialog__content {
    font-family: var(--mdc-dialog-supporting-text-font, "Arial");
    line-height: var(--mdc-dialog-supporting-text-line-height, 14px);
    font-size: var(--mdc-dialog-supporting-text-size, 14px);
    font-weight: var(--mdc-dialog-supporting-text-weight, 500);
    letter-spacing: var(--mdc-dialog-supporting-text-tracking, 1px);
}

此 CSS 将使每个基本文本的显示方式与应用程序的其余部分完全不同。对我来说，不清楚这种行为是设计使然、错误还是我在应用程序中做错了什么？

Answer 1

这是我当前使用的解决方法，以防止对话框覆盖默认样式：

.mat-mdc-dialog-container .mdc-dialog__content {
  color: inherit !important;
}

.mat-mdc-dialog-container .mdc-dialog__content {
  line-height: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
}