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.
Built from https://develop.svn.wordpress.org/trunk@47263


git-svn-id: http://core.svn.wordpress.org/trunk@47063 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/widgets-rtl.css

@@ -7,6 +7,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;

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;

wp-admin/js/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 ) {

wp-includes/version.php

@@ -13,7 +13,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '5.4-alpha-47262';
+$wp_version = '5.4-alpha-47263';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.