From 05456bf555d7fb860caf24c81069b4f716ba905f Mon Sep 17 00:00:00 2001
From: Colin Stewart <costdev@git.wordpress.org>
Date: Wed, 21 Feb 2024 17:32:41 +0000
Subject: [PATCH] Plugins: Output plugin card elements in the order they're
 displayed.

Previously, the notice for listing dependencies in a plugin card was styled with the CSS `order` properties. This created a mismatch between the visual order and DOM order of elements in the plugin card.

For accessibility, visual order and DOM order must always match when they affect meaning and functionality.

This removes the CSS `order` properties and outputs the dependencies notice later, making the visual and DOM order match. Some unused/empty CSS is also removed.

Follow-up to [57545].

Props afercia, afragen, bosskhj, huzaifaalmesbah, mukesh27, costdev.
Fixes #60488.

git-svn-id: https://develop.svn.wordpress.org/trunk@57679 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/list-tables.css                       | 10 ----------
 .../includes/class-wp-plugin-install-list-table.php    |  3 +--
 2 files changed, 1 insertion(+), 12 deletions(-)

diff --git a/src/wp-admin/css/list-tables.css b/src/wp-admin/css/list-tables.css
index 50c74b3a7e..ca71d36f49 100644
--- a/src/wp-admin/css/list-tables.css
+++ b/src/wp-admin/css/list-tables.css
@@ -1591,14 +1591,6 @@ div.action-links,
 	margin-top: 0;
 }
 
-.plugin-card .column-description .authors {
-	order: 1;
-}
-
-.plugin-card .column-description .plugin-dependencies {
-	order: 2;
-}
-
 .plugin-card .column-description p:empty {
 	display: none;
 }
@@ -1644,8 +1636,6 @@ div.action-links,
 	.plugin-card .plugin-dependency-name {
 		flex-basis: 69%;
 	}
-	.plugin-card .plugin-dependency .more-details-link {
-	}
 }
 
 .plugins #the-list .required-by,
diff --git a/src/wp-admin/includes/class-wp-plugin-install-list-table.php b/src/wp-admin/includes/class-wp-plugin-install-list-table.php
index 132af29452..f6e8c5a7ed 100644
--- a/src/wp-admin/includes/class-wp-plugin-install-list-table.php
+++ b/src/wp-admin/includes/class-wp-plugin-install-list-table.php
@@ -525,8 +525,6 @@ class WP_Plugin_Install_List_Table extends WP_List_Table {
 			// Remove any HTML from the description.
 			$description = strip_tags( $plugin['short_description'] );
 
-			$description .= $this->get_dependencies_notice( $plugin );
-
 			/**
 			 * Filters the plugin card description on the Add Plugins screen.
 			 *
@@ -675,6 +673,7 @@ class WP_Plugin_Install_List_Table extends WP_List_Table {
 					<p><?php echo $description; ?></p>
 					<p class="authors"><?php echo $author; ?></p>
 				</div>
+				<?php echo $this->get_dependencies_notice( $plugin ); ?>
 			</div>
 			<div class="plugin-card-bottom">
 				<div class="vers column-rating">