Angular Material dialog panelClass doesn't show up

I'm trying to make my dialog box responsive using Tailwind classes and the panelClass property of MatDialogConfig but the value I place in panelClass isn't showing up anywhere. Here's my code:

let config = new MatDialogConfig();
config.data = {
title: 'Please confirm',
panelClass : 'xxxxxxxxxxxxxxxxxxxx',
message: `<p>Lorem ipsum dolor sit amet</p>`,
confirmButtonText: 'Yes',
cancelButtonText: 'No'
};

this.modal.open(ConfirmModalComponent, config).afterClosed().subscribe((result) => {
if(result) {
// Do something here
}
});


Given the value of panelClass, I expect to find the value "xxxxxxxxxxxxxxxxxxxx" somewhere in the screenshot below. I expanded every node and this very conspicuous value doesn't show up anywhere.

I could override the main classes, but I want the option to change it for different types of modals, so just updating the styles isn't an option.



Continue reading...