Commit 91cf0002145 for woocommerce
commit 91cf000214534086fa00f487db31ab9199743df2
Author: Jorge A. Torres <jorge.torres@automattic.com>
Date: Tue Apr 7 10:59:50 2026 +0100
Fix WP 7.0 styling of dismiss notice and select2 tablenav outside orders/products (#63987)
diff --git a/plugins/woocommerce/changelog/fix-select2-wp-7.0-less-specific b/plugins/woocommerce/changelog/fix-select2-wp-7.0-less-specific
new file mode 100644
index 00000000000..0ade801e4df
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-select2-wp-7.0-less-specific
@@ -0,0 +1,5 @@
+Significance: patch
+Type: tweak
+Comment: Already covered by other WP 7.0 UI changes.
+
+
diff --git a/plugins/woocommerce/client/legacy/css/activation.scss b/plugins/woocommerce/client/legacy/css/activation.scss
index 1f1fe290b67..a18bda8ab9e 100644
--- a/plugins/woocommerce/client/legacy/css/activation.scss
+++ b/plugins/woocommerce/client/legacy/css/activation.scss
@@ -53,3 +53,16 @@ p.woocommerce-actions,
.woocommerce-about-text {
margin-bottom: 1em !important;
}
+
+// WP 7.0 changed .notice-dismiss to display:flex, width:24px, height:24px.
+// Reset these so the floated .woocommerce-message-close layout still works and the X icon aligns.
+.wc-wp-version-gte-70 .woocommerce-message a.woocommerce-message-close {
+ display: inline;
+ width: auto;
+ height: auto;
+ color: #1e1e1e;
+
+ &::before {
+ top: 18px;
+ }
+}
diff --git a/plugins/woocommerce/client/legacy/css/admin.scss b/plugins/woocommerce/client/legacy/css/admin.scss
index 10cad0457cf..bf28ee4dbad 100644
--- a/plugins/woocommerce/client/legacy/css/admin.scss
+++ b/plugins/woocommerce/client/legacy/css/admin.scss
@@ -8502,35 +8502,32 @@ table.bar_chart {
}
}
- // Tablenav: WP 7.0 tablenav uses compact 32px sizing for native selects.
- // Match Select2 to 32px here (not the global 40px).
+ // Current page in pagination gets smaller than surrounding buttons at 782px breakpoint.
&.woocommerce_page_wc-customer-stock-notifications .tablenav,
&.woocommerce_page_wc-orders .tablenav,
&.post-type-product .tablenav,
&.post-type-shop_order .tablenav {
- .select2-container {
- margin-top: 0; // Align with other tablenav elements.
- }
-
- .select2-container .select2-selection--single {
- height: 32px; // WP 7.0 tablenav uses compact 32px, not 40px.
-
- .select2-selection__rendered {
- line-height: 30px;
- }
-
- .select2-selection__arrow {
- height: 30px;
- }
- }
-
- // Current page in pagination gets smaller than surrounding buttons at 782px breakpoint.
@media screen and (max-width: 782px) {
#current-page-selector {
height: 44px;
}
}
}
+
+ // .woocommerce-embed-page sets notice padding to 1px 12px, which is too small for WP 7.0's dismiss button positioning.
+ // Restore WP 7.0's padding so the dismiss button aligns correctly.
+ &.woocommerce-embed-page .notice {
+ padding: 8px 12px;
+ }
+
+ // WP 7.0 sets display:flex, width:24px, height:24px on .notice-dismiss.
+ // Reset these so the floated .woocommerce-message-close layout still works.
+ .woocommerce-message a.woocommerce-message-close {
+ display: inline;
+ width: auto;
+ height: auto;
+ color: #1e1e1e;
+ }
}
/**
@@ -8595,6 +8592,26 @@ table.bar_chart {
}
}
+// Tablenav: WP 7.0 tablenav uses compact 32px sizing for native selects.
+// Match Select2 to 32px here (not the global 40px).
+.wc-wp-version-gte-70 .tablenav {
+ .select2-container {
+ margin-top: 0; // Align with other tablenav elements.
+ }
+
+ .select2-container .select2-selection--single {
+ height: 32px; // WP 7.0 tablenav uses compact 32px, not 40px.
+
+ .select2-selection__rendered {
+ line-height: 30px;
+ }
+
+ .select2-selection__arrow {
+ height: 30px;
+ }
+ }
+}
+
.woocommerce-progress-form-wrapper,
.woocommerce-exporter-wrapper,
.woocommerce-importer-wrapper {
diff --git a/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php b/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php
index 4aebddcc0ef..d1a65b8dfe4 100644
--- a/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php
+++ b/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php
@@ -708,7 +708,7 @@ class CustomOrdersTableController {
);
$sync_message[] = sprintf(
- '<a href="%1$s" class="button button-link">%2$s</a>',
+ '<a href="%1$s" class="button-link">%2$s</a>',
esc_url( $stop_sync_url ),
__( 'Stop sync', 'woocommerce' )
);
@@ -731,7 +731,7 @@ class CustomOrdersTableController {
}
$sync_message[] = sprintf(
- '<a href="%1$s" class="button button-link">%2$s</a>',
+ '<a href="%1$s" class="button-link">%2$s</a>',
esc_url( $sync_now_url ),
__( 'Sync orders now', 'woocommerce' )
);