Theme Details dialog hides admin sidebar sub-menu navigation

[codexdemon]

Hello Team

As this is really awesome as working with the community of wordpress CMS.

While reviewing themes of WordPress Me and my colleague @amolebonde face issue about accessing sub-menu navigation when we are theme detail page WordPress Admin > Appearance > Themes > Theme Details.

Once we are on Theme Detail page then in case if the user wants to access any Sub Menu Navigation it not shows well, which goes behind the popup theme detail page.

For Ref. Screen Shot Attach

Wordpress Version 4.8
Browser Check: SAFARI 10.1.1, Google Chrome 58.0

[adamsilverstein]

The css that causes this in theme.css has an inline comment indicating it was added to keep the overlay over 'WP Pointers':

z-index: 10000; /* Over WP Pointers. */

This was added in r33068, and at the time the issue with the submenus going under the overlay was noted and an attempt to resolve was made in r33111.

These z-index conflicts are very difficult to resolve, maybe we should go back to @obenland's original suggestion to not show pointers when the modal is open?

[yahil]

@adamsilverstein if increased #adminmenuwrap selectors z-index 9990 to 10001 we can solve this issue.

[Girishpanchal]

Hi, @adamsilverstein, Updated theme.css for appearing admin sidebar submenu. Also, Decreased the width of theme overlay for a perfect view of the submenu.

[Girishpanchal]

Hi, @adamsilverstein

For standard view desktop (1920x1080) Reduced the theme overlay width. I saw that the media is working for (min-width: 1680px).

This change is made in regard to standard desktop view.

[chintanmachhi207]

I have add the solution of this issue.

[mp518]

Need to just decrease z-index.i have added :)

[mp518]

z-index decreased

[mp518]

after change screenshot

[chintanmachhi207]

#41155.3 added to fixed this issue.

[subrataemfluence]

Thank you for the patch! I tested it (on 4.8.1) and it is working perfectly.
Also big thanks to @codexdemon for pointing out the issue!

Replying to chintanmachhi207:

#41155.3 added to fixed this issue.

[janak007]

Added refreshed patch

[DrewAPicture]

Assigning to mark the good-first-bug as "claimed".

[worldweb]

Change z-index from 10000 to 9. Tested and works for me.

[worldweb]

Screenshot

[swissspidy]

@worldweb Why did you close this ticket? There was no fix committed here.

[worldweb]

Seems to be done by mistake. Thank you.
Replying to swissspidy:

@worldweb Why did you close this ticket? There was no fix committed here.

[SergeyBiryukov]

Related: [33068] / [33111] for #31544.

[SergeyBiryukov]

#36989 was marked as a duplicate.

[SergeyBiryukov]

#48484 was marked as a duplicate.

[sabernhardt]

#51464 was marked as a duplicate.

[desrosj]

#42595 was marked as a duplicate.

[desrosj]

#51464 was marked as a duplicate.

[ralessio]

Hi, this is my first contribution to WordPress, sorry if I made some mistakes.
Instead, to change the value of the z-index in those classes, I tried a different implementation: I removed the z-index properties because I didn’t see any value in having them.
As you can see, I attached two videos with the current behavior and the fixed behavior.

[sabernhardt]

Related: #58164

[sabernhardt]

In addition to a z-index change, 58164-2.patch included a min-height to increase the overlay backdrop's height.

[sabernhardt]

increases z-index for admin menu only on Themes screen; sets min-height directly on the overlay backdrop

[sabernhardt]

#61334 was marked as a duplicate.

[boogah]

The patch (41155.6.diff) from @sabernhardt works well in Chrome, Safari, and Firefox — all on desktop.

[huzaifaalmesbah]

Test Report

Description

Patch tested: 41155.6.diff​

Environment

• WordPress: 6.7-alpha-58576-src
• PHP: 8.1.29
• Server: nginx/1.27.1
• Database: mysqli (Server: 9.0.1 / Client: mysqlnd 8.1.29)
• Browser: Chrome 129.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Four 1.2
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.1.0

Actual Results

1. ✅ Issue resolved with patch.

Screenshots

Before Apply Patch	After Apply Patch ✅

[lakshmananphp]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/41155/41155.6.diff

Environment

• WordPress: 6.6.2
• PHP: 8.3.3
• Server: nginx/1.25.4
• Database: mysqli (Server: 8.0.33 / Client: mysqlnd 8.3.3)
• Browser: Chrome 129.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Four 1.2
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.1.0
  • WordPress Beta Tester 3.6.0

Actual Results

1. ✅ Issue resolved with patch.

Additional Notes

• Tested with Chrome, Firefox and Safari on Desktop

Supplemental Artifacts

Before Patch

After Patch

[amin7]

Test Report

Patch tested: https://core.trac.wordpress.org/attachment/ticket/41155/41155.6.diff

Environment

WordPress: 6.7-beta3
PHP: 8.1.23
Database: MySQL 8.0.16
Browser: Chrome 129.0.0.0
OS: Windows 11
Theme: Twenty Twenty-Four 1.2
MU Plugins: None activated

---

Before patch

Check the screencast: ​https://d.pr/v/SA7UN5

---

After patch
Check the screenshot ​https://d.pr/i/NFmarV

---

Results
✅ Issue is resolved with the patch.

[desrosj]

Thanks all for the great testing. Unfortunately, time ran out for this one with RC1 due out any moment. I'm going to punt this, but only to 6.7.1 because it seems like we're close.

[desrosj]

Thanks all for the great collaboration and testing!

Because of a few bug reports opened since 6.7 was released, the Core team is evaluating the need for a short 6.7.1 cycle (possibly next week).

This issue was not introduced in 6.7, so it now falls outside of the focus for 6.7.1 as currently defined. To help prepare for this scenario in case it's decided to move forward, I'm going to punt this to the 6.7.2 milestone.

[sabernhardt]

This is not urgent. (But if it is clearly ready before 6.8, feel free to set the milestone to the next minor.)

[imranhasanraaz]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/41155/41155.6.diff

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.26
• Server: nginx/1.27.2
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.26)
• Browser: Chrome 131.0.0.0​https://prnt.sc/qJNtXMYuUT2t
• OS: Windows 10/11
• Theme: Twenty Thirteen 4.3
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.1.0

Actual Results

1. ✅ Issue resolved with patch.

Before Patch : ​https://prnt.sc/qJNtXMYuUT2t
After patch: ​https://prnt.sc/qCx6Fzl_MwAW

Additional Notes

• Testest chrome and edge

[mdibrahimk48]

Test Report

Description

---

This report confirms if the specified patch functions as intended.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/41155/41155.6.diff

Environment

---

WordPress: 6.8-alpha-59274-src
PHP: 8.3.0
Server: nginx/1.27.2
Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.3.0)
Browser: Chrome 131.0.6778.109
OS: Windows 10/11
Theme: Twenty Thirteen 4.3
MU Plugins: None activated

Plugins:

---

Test Reports 1.2.0

Actual Results
✅ Issue resolved with this patch.

Before Patch: ​https://prnt.sc/ev5LcBDO-f7e
After patch: ​https://prnt.sc/p4RP4MECu_ZG

Additional Notes

---

Tested with Chrome and Edge browsers

[sabernhardt]

#62911 was marked as a duplicate.

[mikinc860]

For the latest code, I believe the min-height is unnecessary. I'm removing it and uploading the new diff.

[mikinc860]

For the latest code, I believe the min-height is unnecessary. I'm removing it and uploading the updated diff. Please disregard the previously uploaded file.

[sabernhardt]

The min-height is necessary, though the issue is unrelated to the sub-menu usability.

@orestissam (who I neglected to mention earlier) made 58164-2.patch to make sure the backdrop covers the full height when page content is shorter than the viewport height. You may need to remove themes temporarily to experience that.

41155.6.diff could address both issues. I preferred targeting .themes-php #adminmenuwrap, which would only increase the z-index on the Themes page, where we know it needs to be higher. If the z-index increases for #adminmenuwrap in admin-menu.css instead, all the admin pages would need testing.

[joedolson]

In 59821:

Themes: Allow use of sidebar submenus when theme details open.

Increase the z-index of sidebar submenus in the theme browser screens so that submenus are not placed behind the theme details overlay. Also set a min-height to ensure the overlay covers the entire screen if content is short.

Props codexdemon, amolebonde, yahil, girishpanchal, chintanmachhi207, mp518, janak007, worldweb, ralessio, sabernhardt, boogah, mikinc860, adamsilverstein, subrataemfluence, huzaifaalmesbah, lakshmananphp, amin7, imranhasanraaz, mdibrahimk48.
Fixes #41155.