Angular Material Dialog sizes

I want to create a large modal for presenting specific information. So i setup my parameters below.

experimentTest() {
this.dialog.open(LargeDialogComponent, {
data: { dataSet: this.dataSet},
minWidth: '90vw',
minHeight: '90vh',
});
}


However while that does take up right size, for some reason mat content is only about 4/5ths of the modal, and there is a huge amount of space between the mat actions and the bottom of the modal as per the image.



My html component is simple

<h2 mat-dialog-title>Large Dialog</h2>
<mat-dialog-content>
//content
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close type="button">Close</button>
</mat-dialog-actions>


There is no additional styles being applied.

Continue reading...