docs(material/datepicker): fix up dialog example (#31674)

The example that shows a datepicker inside a dialog looked weird. These changes fix it up.

(cherry picked from commit e478208)

Author: crisbeto

src/components-examples/material/datepicker/datepicker-dialog/datepicker-dialog-example-dialog.html

@@ -1,13 +1,13 @@
 <h2 mat-dialog-title>Datepicker in a Dialog</h2>
-<mat-dialog-content align="center">
-  <mat-form-field>
+<mat-dialog-content>
+  <mat-form-field subscriptSizing="dynamic">
     <mat-label>Select a date</mat-label>
     <input matInput [matDatepicker]="picker" [formControl]="date">
     <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
     <mat-datepicker #picker></mat-datepicker>
   </mat-form-field>
 </mat-dialog-content>
-<mat-dialog-actions>
-  <button matButton mat-dialog-close>Clear</button>
-  <button matButton [mat-dialog-close]="date.value" cdkFocusInitial>Ok</button>
+<mat-dialog-actions align="end">
+  <button matButton mat-dialog-close>CANCEL</button>
+  <button matButton [mat-dialog-close]="date.value" cdkFocusInitial>OK</button>
 </mat-dialog-actions>

src/components-examples/material/datepicker/datepicker-dialog/datepicker-dialog-example.html

@@ -1,2 +1,2 @@
 <p>Selected date: {{selectedDate()}}</p>
-<button matButton="filled"  color="primary" (click)="openDialog()">Open Dialog</button>
+<button matButton="filled" color="primary" (click)="openDialog()">Open Dialog</button>

src/components-examples/material/datepicker/datepicker-dialog/datepicker-dialog-example.ts

@@ -29,7 +29,6 @@ export class DatepickerDialogExample {
 
   openDialog() {
     const dialogRef = this.dialog.open(DatepickerDialogExampleDialog, {
-      minWidth: '500px',
       data: {selectedDate: this.selectedDate()},
     });