Dialog over dialog results in double overlay

If I open a dialog from within another dialog, its gets overlayed over the top. This means double the overlay (so it gets a lot darker) and the original dialog is visible underneath:

image

It would be preferable that only a single overlay is shown and when multiple dialogs are open, only the top most is visible.

If this something that can be achieved with a custom renderer for aurelia-dialog?

It would be great if the DialogRenderer was exported so it could be extended…

@bigopon pointed out this can be achieved simply through css:

ux-dialog-overlay {
  display: none;
}

ux-dialog-overlay:first-of-type {
  display: flex;
  background-color: black;
  &.active {
    opacity: .75 !important;
  }
}

ux-dialog-container {
  display: none;
}

ux-dialog-container:last-of-type {
  display: flex;
  justify-content: center;
  align-items: center;
}
3 Likes