Overlay on top of the modal when it is opened for the first time

Created on 25 May 2022, over 2 years ago
Updated 15 February 2023, almost 2 years ago

Problem/Motivation

The first time a modal is opened with a link like this:
<a href="/node/13" class="btn btn-info use-ajax" data-dialog-type="modal">Open modal</a>
the overlay is on top of the modal. Therefore, the "X" button is not clickable. The only way to close it is by pressing the "Esc" key. After closing the modal by pressing "X" and reopening the modal, the problem dissapears.

Steps to reproduce

Open any drupal node using a link like this: <a href="/node/13" class="btn btn-info use-ajax" data-dialog-type="modal">Open modal</a>
Using a different theme (like "Batik"), the modal works as expected.

Proposed resolution

Checking the difference in the divs's attributes when it works and when it does not, I've noticed that the first time the modal is opened the z-index is NOT being assigned neither to the <div... role="dialog"> nor to the <div class="class="ui-widget-overlay ui-front"></div>. Next times, both divs have z-index assigned: <div class="class="ui-widget-overlay ui-front" style="z-index: 100;"></div> and a <div... role="dialog" ... style="z-index: 101">
I don't know how, but it should be fixed to assign those values the first time the modal is opened.

Remaining tasks

User interface changes

API changes

Data model changes

πŸ› Bug report
Status

Fixed

Version

3.24

Component

User interface

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024