Bug with PrimeNg Dialog when no header/footer are used

[Nargzul]

Hi,

I wanted to use a PrimeNG Dialog in order to build a busy indicator. I've the following code:

Code: Select all

<p-dialog [(visible)]="isBusy" [showHeader]="false" [resizable]="false" [modal]="true">
  <div class="flex flex-column justify-content-center align-items-center m-4">
    <p-progressSpinner></p-progressSpinner>
    <div class="m-3">{{ message }}</div>
  </div>
</p-dialog>

Functionally, it works, but when the dialog is shown, the dialog has not rounded border.

From what I've found, the issue is that the div.p-dialog has correctly rounded corner, but the div.p-dialog-content has not and takes the full space. So basically, the div.p-dialog-content hides the corner.
It doesn't happen when using header/footer, because then the header/footer has margins.

Adding this in the global styles works as workaround:

Code: Select all

.p-dialog-content {
  border-radius: 6px;
}

[Nargzul]

Actually my solution isn't working either, since when there are header/footer, the border radius is shown

[Nargzul]

Hi

Is there a way for you to fix this?