.ajax-progress--fullscreen z-index should be higher than .ui-dialog when triggered in a modal.

Created on 9 March 2020, over 4 years ago
Updated 24 April 2023, over 1 year ago

OS: Ubuntu 18.04.4 LTS
PHP Version: 7
Drupal Version: 8.8.x

Problem/Motivation

- The .ajax-progress--fullscreen z-index is set to 1000 in '/claro/css/components/ajax-progress.module.css', line 141.
- The .ui-dialog z-index is set to 1260 in '/claro/css/components/ajax-progress.module.css?', line 14.
- For people opening a single dialog, this is fine, as the .ajax-progress--fullscreen is replaced by the .ui-widget-overlay and the dialog itself. However, when the .ajax-progress--fullscreen is triggered from an already open dialog, the current dialog remains exposed for accidental multiple submissions at z-index 1260 (until it is replaced by the new dialog) as the loader is running behind it at index 1000.

Proposed resolution

Increase the z-index of the .ajax-progress--fullscreen class above that of the .ui-dialog class.

From #31
Setting the z-index for .ajax-progress--fullscreen class to 1300 because the z-index for .ui-dialog class is 1260 and any thing which is above 1260 shall work.You can find the z-indexes in drupal for reference.

From #34
Based on this rationale, the z-index should be 1261 then as we want to avoid z-index creep. Either the z-index or the explanation should be modified.

🐛 Bug report
Status

Fixed

Version

10.1

Component
Claro 

Last updated 4 days ago

Created by

Live updates comments and jobs are added and updated live.
  • Field UX

    Usability improvements related to the Field UI

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