Fixes issues with modals in Joomla 4
As described here: https://lab.civicrm.org/dev/joomla/-/issues/19 - J4 Civi modals had a number of issues making them unusable. For admin/backend Civi pages, this puts the tinted overlay behind the modal and brings the modal in front of the menubar. It makes the modal clickable, removes the narrow width and ensures scrolling.
body.admin.com_civicrm.layout-default .crm-container .crm-dashlet {
max-width: 50vw; /* fixes over-wide news dashlet */
}
+
+/* J4 Modals */
+
+body.admin.com_civicrm.layout-default .crm-container.ui-dialog.ui-resizable {
+ z-index: 1021;
+}
+
+body.admin.com_civicrm.layout-default .ui-widget-overlay {
+ z-index: 1;
+}
+
+body.admin.com_civicrm.layout-default .crm-container .modal-dialog {
+ max-width: inherit;
+ padding: 0;
+ margin: 0;
+ overflow: scroll;
+ pointer-events: all;
+}
+