bug(dialog): The margin in v15.0 is broken

[zijianhuang]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

14,13,12

Description

The margins of content are too narrow to the borders. I have tried 4 prebuilt themes, the results are the same.

Reproduction

Steps to reproduce:

1. Go to https://material.angular.io/components/dialog/overview, and click any dialog example

Expected Behavior

go to https://material.angular.io/components/dialog/overview then switch to v14, v13 etc.

Actual Behavior

Ugly dialog with too narrow margins of content to the borders.

Environment

• Angular: 15.0 or 15.0.1
• CDK/Material: 15.0
• Browser(s): Chrome and Firefox
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[geromegrignon]

Hi @zijianhuang, that's more likely due to MDC migration.
However, the current behavior matches Material Design specs: https://m2.material.io/components/dialogs#theming

[RobinKamps]

The design spec changed the padding for the dialog-action (8px padding instead of 24px).
The action-padding (or action button alignment) can be overwritten in global styles easily,to fit the projects needs - e.g. :

.mat-mdc-dialog-actions {
  justify-content: center !important;
}

However @zijianhuang has a point: the dialog content does not match the material design spec, because the inner div boxing size is not correct (exceeding to the right, not matching the material design padding right), at least for mat-form-fields without additional wrapper divs or styling:

[amysorto]

The MDC based dialog follows the material spec as pointed out by @geromegrignon. So I'll be closing this issue.

@RobinKamps thanks for pointing out that example! The width was set to 250px in the demo, the default width does not cut off the form-field. I removed it in #26157.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}