Commit ebea0d1789d for woocommerce
commit ebea0d1789d2f1ed86e0081fdc57f98bb4d4893f
Author: Aarón Fas <yo@aaron.com.es>
Date: Fri Jul 3 10:31:17 2026 +0200
Scope order attribution install banner button styles to the banner (#66206)
Scope order attribution banner button styles to the banner
The trailing .components-button block in the banner stylesheet was
unscoped, so its rules applied to every @wordpress/components Button on
any admin page where the wc-admin (or embed) stylesheet loads:
- .components-button.small: full width + centered content
- .components-button.has-icon.has-text: justify-content center,
overriding the component library's own justify-content: start on the
exact same selector (equal specificity, later load order)
Both rules were only ever meant for the banner's own CTA button (which
originally rendered with an external icon + text). Scope them under
.woocommerce-order-attribution-install-banner.
Claude-Session: https://claude.ai/code/session_01Wz2QbkfnHaJ7VtUqAxAdTi
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
diff --git a/plugins/woocommerce/changelog/fix-order-attribution-banner-unscoped-button-styles b/plugins/woocommerce/changelog/fix-order-attribution-banner-unscoped-button-styles
new file mode 100644
index 00000000000..bb6ea9ca867
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-order-attribution-banner-unscoped-button-styles
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Scope the order attribution install banner button styles to the banner, so they no longer center the content of every icon+text components button rendered on WooCommerce admin pages.
diff --git a/plugins/woocommerce/client/admin/client/order-attribution-install-banner/style.scss b/plugins/woocommerce/client/admin/client/order-attribution-install-banner/style.scss
index da8d05ea11c..4f35f4a888c 100644
--- a/plugins/woocommerce/client/admin/client/order-attribution-install-banner/style.scss
+++ b/plugins/woocommerce/client/admin/client/order-attribution-install-banner/style.scss
@@ -95,7 +95,7 @@
}
}
-.components-button {
+.woocommerce-order-attribution-install-banner .components-button {
&.small {
width: 100%;
display: flex;