Components: Confirmative dialog buttons should be placed on the right side

[Maximaximum]

Bug, feature request, or proposal:

In all the material samples of the https://material.angular.io/components/dialog section, the confirmative dialog buttons should be placed on the right side of the dialogs, as per Material design guidelines: https://material.io/guidelines/components/dialogs.html#dialogs-specs

What is the expected behavior?

All the confirmative buttons (like OK, Install etc) should be placed on the right, whereas the Dismissive actions (like No thanks etc) should go to the left.

What is the current behavior?

Currently, all the confirmative buttons are placed on the left, whereas the dismissive ones are placed on the right.

What are the steps to reproduce?

Open https://material.angular.io/components/dialog/overview and https://material.angular.io/components/dialog/examples pages and try open the sample dialogs

What is the use-case or motivation for changing an existing behavior?

The samples should conform to the official Material design Guidelines

[Maximaximum]

There's still a problem with this. According to the spec, "Dismissive actions are placed directly to the left of affirmative actions and return the user to the originating screen or step in the process".

So, generally speaking, the dialog action buttons should be aligned to the right. However, currently they are aligned to the left.

[ewaschenko]

This issue should be re-opened. As @Maximaximum said, according to the Material Dialog Specs actions should be right aligned not left aligned as they currently are.

To test, open the Material Dialog in stackblitz and increase the Dialog width to 400px

[Maximaximum]

@josephperrott could you please reopen this issue?

[ewaschenko]

@Maximaximum Looking at the Material Demo Page

you can set the actions to the right with [attr.align]="'end'"

[Maximaximum]

@ewaschenko yeah, thank you. But I thought it would be logical if Angular Material enforces a default layout to right, to be in line with official Material spec

[angular-automatic-lock-bot[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._}