Merge remote-tracking branch 'upstream/trunk' into fix-62287

Author: dmsnell

package.json

@@ -7,7 +7,7 @@
 		"url": "https://develop.svn.wordpress.org/trunk"
 	},
 	"gutenberg": {
-		"ref": "23b566c72e9c4a36219ef5d6e62890f05551f6cb"
+		"ref": "022d8dd3d461f91b15c1f0410649d3ebb027207f"
 	},
 	"engines": {
 		"node": ">=20.10.0",

src/js/media/views/attachments/browser.js

@@ -193,37 +193,49 @@ AttachmentsBrowser = View.extend(/** @lends wp.media.view.AttachmentsBrowser.pro
 				priority:   -100,
 				text:       l10n.filterAttachments,
 				level:      'h2',
-				className:  'media-attachments-filter-heading'
+				className:  'media-attachments-filter-heading screen-reader-text'
 			}).render() );
 		}
 
 		if ( showFilterByType ) {
 			// "Filters" is a <select>, a visually hidden label element needs to be rendered before.
-			this.toolbar.set( 'filtersLabel', new wp.media.view.Label({
+			var filtersLabel = new wp.media.view.Label({
 				value: l10n.filterByType,
 				attributes: {
 					'for':  'media-attachment-filters'
 				},
 				priority:   -80
-			}).render() );
+			});
 
 			if ( 'uploaded' === this.options.filters ) {
-				this.toolbar.set( 'filters', new wp.media.view.AttachmentFilters.Uploaded({
+				Filters = new wp.media.view.AttachmentFilters.Uploaded({
 					controller: this.controller,
 					model:      this.collection.props,
-					priority:   -80
-				}).render() );
+				});
 			} else {
 				Filters = new wp.media.view.AttachmentFilters.All({
 					controller: this.controller,
 					model:      this.collection.props,
-					priority:   -80
 				});
-
-				this.toolbar.set( 'filters', Filters.render() );
 			}
-		}
 
+			var filterContainer = wp.media.View.extend({
+				tagname: 'div',
+				className: 'media-filter-container type-filter',
+
+				initialize: function() {
+					this.views.add( [ filtersLabel, Filters ] );
+				}
+			});
+
+			this.toolbar.set( 'filters', new filterContainer({
+				controller: this.controller,
+				model:      this.controller.props,
+				priority:   -80
+			}).render() );
+		}
+		
+		var dateFilter, dateFilterLabel, dateFilterContainer;
 		/*
 		 * Feels odd to bring the global media library switcher into the Attachment browser view.
 		 * Is this a use case for doAction( 'add:toolbar-items:attachments-browser', this.toolbar );
@@ -241,17 +253,30 @@ AttachmentsBrowser = View.extend(/** @lends wp.media.view.AttachmentsBrowser.pro
 			}).render() );
 
 			// DateFilter is a <select>, a visually hidden label element needs to be rendered before.
-			this.toolbar.set( 'dateFilterLabel', new wp.media.view.Label({
+			dateFilterLabel = new wp.media.view.Label({
 				value: l10n.filterByDate,
 				attributes: {
 					'for': 'media-attachment-date-filters'
 				},
-				priority: -75
-			}).render() );
-			this.toolbar.set( 'dateFilter', new wp.media.view.DateFilter({
+			});
+			dateFilter = new wp.media.view.DateFilter({
+				controller: this.controller,
+				model:      this.collection.props,
+			});
+
+			dateFilterContainer = wp.media.View.extend({
+				tagname: 'div',
+				className: 'media-filter-container date-filter',
+
+				initialize: function() {
+					this.views.add( [ dateFilterLabel, dateFilter ] );
+				}
+			});
+
+			this.toolbar.set( 'dateFilters', new dateFilterContainer({
 				controller: this.controller,
 				model:      this.collection.props,
-				priority: -75
+				priority:   -75
 			}).render() );
 
 			// BulkSelection is a <div> with subviews, including screen reader text.
@@ -363,17 +388,30 @@ AttachmentsBrowser = View.extend(/** @lends wp.media.view.AttachmentsBrowser.pro
 
 		} else if ( this.options.date ) {
 			// DateFilter is a <select>, a visually hidden label element needs to be rendered before.
-			this.toolbar.set( 'dateFilterLabel', new wp.media.view.Label({
+			dateFilterLabel = new wp.media.view.Label({
 				value: l10n.filterByDate,
 				attributes: {
 					'for': 'media-attachment-date-filters'
 				},
-				priority: -75
-			}).render() );
-			this.toolbar.set( 'dateFilter', new wp.media.view.DateFilter({
+			});
+			dateFilter = new wp.media.view.DateFilter({
+				controller: this.controller,
+				model:      this.collection.props,
+			});
+
+			dateFilterContainer = wp.media.View.extend({
+				tagname: 'div',
+				className: 'media-filter-container date-filter',
+
+				initialize: function() {
+					this.views.add( [ dateFilterLabel, dateFilter ] );
+				}
+			});
+
+			this.toolbar.set( 'dateFilters', new dateFilterContainer({
 				controller: this.controller,
 				model:      this.collection.props,
-				priority: -75
+				priority:   -75
 			}).render() );
 		}
 

src/js/media/views/label.js

@@ -10,7 +10,6 @@
  */
 var Label = wp.media.View.extend(/** @lends wp.media.view.Label.prototype */{
 	tagName: 'label',
-	className: 'screen-reader-text',
 
 	initialize: function() {
 		this.value = this.options.value;

src/js/media/views/uploader/inline.js

@@ -115,7 +115,7 @@ UploaderInline = View.extend(/** @lends wp.media.view.UploaderInline.prototype *
 
 			$browser.detach().text( $placeholder.text() );
 			$browser[0].className = $placeholder[0].className;
-			$browser[0].setAttribute( 'aria-labelledby', $browser[0].id + ' ' + $placeholder[0].getAttribute('aria-labelledby') );
+			$browser[0].setAttribute( 'aria-describedby', $placeholder[0].getAttribute('aria-describedby') );
 			$placeholder.replaceWith( $browser.show() );
 		}
 

src/wp-admin/css/common.css

@@ -1575,11 +1575,11 @@ div.error.notice-alt {
 
 .notice-info {
 	border-left-color: #3858e9;
-	background-color: transparent;
+	background-color: #fff;
 }
 
 .notice-info.notice-alt {
-	background-color: transparent;
+	background-color: #fff;
 }
 
 #plugin-information-footer .update-now:not(.button-disabled):before {

src/wp-admin/css/dashboard.css

@@ -40,7 +40,7 @@
 
 #dashboard-widgets-wrap {
 	overflow: hidden;
-	margin: 0 -4px;
+	margin: 0 -8px;
 }
 
 #dashboard-widgets .postbox {
@@ -59,8 +59,8 @@
 	display: flow-root; /* avoid margin collapsing between parent and first/last child elements */
 	/* Required min-height to make the jQuery UI Sortable drop zone work. */
 	min-height: 0;
-	margin-right: 8px;
-	padding: 4px;
+	margin: 0 8px 20px;
+	padding: 0;
 }
 
 #dashboard-widgets .meta-box-sortables:not(:empty) {
@@ -140,7 +140,7 @@
 	position: relative;
 	overflow: auto;
 	margin: 16px 0;
-	background-color: #151515;
+	background-color: #c3c4c7;
 	border: 1px solid rgb(0, 0, 0, 0.1);
 	border-radius: 8px;
 	font-size: 14px;
@@ -499,9 +499,7 @@
 }
 
 .community-events .spinner {
-	float: none;
-	margin: 5px 2px 0;
-	vertical-align: top;
+	margin: 0 2px 0;
 }
 
 .community-events-errors[aria-hidden="true"],
@@ -520,13 +518,15 @@
 
 .community-events-form {
 	margin: 15px 0 5px;
+	display: flex;
+    gap: 5px;
+    align-items: center;
+    flex-wrap: wrap;
 }
 
 .community-events-form .regular-text {
 	width: 40%;
-	height: 29px;
 	margin: 0;
-	vertical-align: top;
 }
 
 .community-events li.event-none {
@@ -538,10 +538,7 @@
 }
 
 .community-events-form label {
-	display: inline-block;
-	vertical-align: top;
 	line-height: 2.15384615;
-	height: 28px;
 }
 
 .community-events .activity-block > p {
@@ -553,17 +550,8 @@
 	vertical-align: middle;
 }
 
-#community-events-submit {
-	margin-left: 3px;
-	margin-right: 3px;
-}
-
 /* Needs higher specificity than #dashboard-widgets .button-link */
 #dashboard-widgets .community-events-cancel.button-link {
-	vertical-align: top;
-	/* Same properties as the submit button for cross-browsers alignment. */
-	line-height: 2;
-	height: 28px;
 	text-decoration: underline;
 }
 
@@ -1454,29 +1442,18 @@ a.rsswidget {
 		vertical-align: baseline;
 	}
 
-	.community-events-form .regular-text {
-		height: 32px;
-	}
-
 	#community-events-submit {
 		margin-bottom: 0;
-		/* Override .wp-core-ui .button */
-		vertical-align: top;
 	}
 
 	.community-events-form label,
 	#dashboard-widgets .community-events-cancel.button-link {
 		/* Same properties as the submit button for cross-browsers alignment. */
 		font-size: 14px;
 		line-height: normal;
-		height: auto;
 		padding: 6px 0;
 		border: 1px solid transparent;
 	}
-
-	.community-events .spinner {
-		margin-top: 7px;
-	}
 }
 
 /* Smartphone */

src/wp-admin/css/edit.css

@@ -76,10 +76,16 @@
 	pointer-events: none;
 }
 
+#titlewrap .skiplink {
+	background: #fff;
+	line-height: 2.30769231; /* 30px for 32px min-height */
+	min-height: 32px;
+	right: 4px;
+}
+
 #titlewrap .skiplink:focus {
 	clip: inherit;
 	clip-path: inherit;
-	right: 4px;
 	top: 4px;
 	width: auto;
 }
@@ -822,7 +828,7 @@ form#tags-filter {
 
 .privacy-settings-tab.active,
 .health-check-tab.active {
-	box-shadow: inset 0 -3px #3582c4;
+	box-shadow: inset 0 -3px var(--wp-admin-theme-color);
 	font-weight: 600;
 }
 
@@ -896,7 +902,7 @@ form#tags-filter {
 	border: none;
 	box-shadow: none;
 	outline-offset: -1px;
-	outline: 2px solid #2271b1;
+	outline: 2px solid var(--wp-admin-theme-color);
 	background-color: #f6f7f7;
 }
 
@@ -1061,10 +1067,6 @@ form#tags-filter {
 	#edit-slug-box {
 		padding: 0;
 	}
-
-	#titlewrap .skiplink:focus {
-		top: 5px;
-	}
 }
 
 @media only screen and (max-width: 1004px) {

src/wp-admin/css/list-tables.css

@@ -1452,6 +1452,14 @@ ul.cat-checklist input[name="post_category[]"]:indeterminate::before {
 	content: "\f147" / '';
 }
 
+.plugin-card .updated-message:before,
+.plugin-card .updating-message:before {
+	line-height: 1;
+	position: relative;
+	top: -2px;
+	vertical-align: middle;
+}
+
 .plugin-install-php #the-list {
 	display: flex;
 	flex-wrap: wrap;

src/wp-admin/css/login.css

@@ -49,7 +49,7 @@ p {
 	margin-top: 0;
 	margin-left: 0;
 	margin-bottom: 20px;
-	background-color: transparent;
+	background-color: #fff;
 	word-wrap: break-word;
 }
 
@@ -66,10 +66,6 @@ p {
 	background-color: #eff9f1;
 }
 
-.login .notice {
-	background-color: #fff;
-}
-
 /* Match border color from common.css */
 .login .notice-error {
 	border-left-color: #cc1818;

src/wp-admin/css/media.css

@@ -555,6 +555,10 @@ border color while dragging a file over the uploader drop area */
 	height: auto;
 }
 
+.media-frame.mode-grid .media-toolbar label {
+	display: block;
+}
+
 .media-frame.mode-grid .media-toolbar select {
 	margin: 0 10px 0 0;
 	min-height: 32px;
@@ -572,11 +576,12 @@ border color while dragging a file over the uploader drop area */
 	min-height: 32px;
 	line-height: 2.30769231; /* 30px for 32px height with 13px font */
 	padding: 0 12px;
+	align-self: end;
 }
 
 .media-frame.mode-grid.mode-edit .media-toolbar-secondary > .select-mode-toggle-button {
 	margin: 0 8px 0 0;
-	vertical-align: middle;
+	height: 100%;
 }
 
 .media-frame.mode-grid .attachments-browser .bulk-select {