Not working with Media Overlay [#2122585]

Problem/Motivation

When enabled, references_dialog.module visually breaks Media Overlay.

Proposed resolution

media.module media.css adds a CSS rule fix to make it compatible with CTools modal.

references_dialog.module references-dialog-admin.css overrides this rule, and essentially breaks it.

Remaining tasks

n/a

User interface changes

Fixes UI.

API changes

n/a

Data model changes

n/a

Original report by tchopshop

I have added en entity reference field to an image file field, through file entity. The autocomplete works when I access it on the file page itself. But accessed through the Media > Edit button in the Media overlay, the autocomplete keeps spinning.

Not sure if this is a media issue or not, but I thought I'd note the incompatibility and see if anyone had any suggestions.

thanks!

Comment	File	Size	Author
#1	references_dialog-media-overlay-compatibility-2122585-1.patch	1.13 KB	scottrigby
#1	7.x-1.x: PHP 5.3 & MySQL 5.5, D7 No tests found

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Comment #1

scottrigby

he/him

English

Brooklyn, NY

CreditAttribution: scottrigby at NBCUniversal commented 27 December 2017 at 19:06

Issue summary:

View changes

File	Size
references_dialog-media-overlay-compatibility-2122585-1.patch	1.13 KB
7.x-1.x: PHP 5.3 & MySQL 5.5, D7 No tests found

This patch fixes the issue. See CSS comments:

 /**
  * Deal with shortcuts bar/navbar and other similar toolbars.
+ *
+ * Note that to be compatible with media.module, the z-index must be >= 10001.
+ * For reference, media.css sets the following rule, with this comment:
+ * > Workaround for Modal dialog underneith the Ctools modal dialog with jQuery
+ * > 1.10.
+ * > @TODO Remove this if ever ctools issue #1397370 ever gets fixed.
+ * @code
+ * .ui-front.media-wrapper {
+ *  z-index: 10001 !important;
+ * }
+ * @endcode
  */