From f26d4d37351a55fd1fc5dad0f5fef8f0f964908c Mon Sep 17 00:00:00 2001 From: Sergey Biryukov Date: Tue, 11 Feb 2020 15:24:47 +0000 Subject: [PATCH] Widgets: Prevent currently active wide widget controls from being partially covered by another widget's controls. The currently active widget controls should always be displayed on top. Props audrasjb, fervillz, rinkuyadav999, jaydeep23290, ashokrd2013, melchoyce, pento, westonruter, SergeyBiryukov. Fixes #42001. git-svn-id: https://develop.svn.wordpress.org/trunk@47263 602fd350-edb4-49c9-b593-d223f7449a82 --- src/js/_enqueues/admin/widgets.js | 5 ++--- src/wp-admin/css/widgets.css | 7 +++++++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/js/_enqueues/admin/widgets.js b/src/js/_enqueues/admin/widgets.js index 3d72db74e2..a0cb25efb6 100644 --- a/src/js/_enqueues/admin/widgets.js +++ b/src/js/_enqueues/admin/widgets.js @@ -127,8 +127,7 @@ window.wpWidgets = { }); $(document.body).bind('click.widgets-toggle', function(e) { - var target = $(e.target), - css = { 'z-index': 100 }, + var target = $(e.target), css = {}, widget, inside, targetWidth, widgetWidth, margin, saveButton, widgetId, toggleBtn = target.closest( '.widget' ).find( '.widget-top button.widget-action' ); @@ -212,7 +211,7 @@ window.wpWidgets = { handle: '> .widget-top > .widget-title', distance: 2, helper: 'clone', - zIndex: 100, + zIndex: 101, containment: '#wpwrap', refreshPositions: true, start: function( event, ui ) { diff --git a/src/wp-admin/css/widgets.css b/src/wp-admin/css/widgets.css index 387b357d60..5c12e1ac33 100644 --- a/src/wp-admin/css/widgets.css +++ b/src/wp-admin/css/widgets.css @@ -6,6 +6,13 @@ box-sizing: border-box; } +.widget.open { + z-index: 99; +} +.widget.open:focus-within { + z-index: 100; +} + .widget-top { font-size: 13px; font-weight: 600;