From 46dece0b564a893950932ffd21105d6444a9262d Mon Sep 17 00:00:00 2001
From: Jon Robson <jdlrobson@gmail.com>
Date: Mon, 24 Jul 2023 10:35:25 -0700
Subject: [PATCH] Limit button only icon resizing to Vector header button icons

Bug: T342190
Change-Id: I5ccc1e83b28a6ffa63d351900eba02343fc48659
---
 resources/skins.vector.styles/components/Button.less      | 7 ++++++-
 resources/skins.vector.styles/components/PageToolbar.less | 7 -------
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/resources/skins.vector.styles/components/Button.less b/resources/skins.vector.styles/components/Button.less
index aa78cb615..f8689e3c5 100644
--- a/resources/skins.vector.styles/components/Button.less
+++ b/resources/skins.vector.styles/components/Button.less
@@ -13,7 +13,12 @@
 	justify-content: center;
 }
 
-.cdx-button.cdx-button--icon-only {
+// These rules are scoped to Vector headers due to T342190 as otherwise where buttons are used alongside
+// input elements the display can look "off".
+// Any other instances outside headers should be targeted directly by a rule on the element itself.
+#p-lang-btn-label.cdx-button--icon-only,
+#vector-page-titlebar-toc-label,
+.vector-header .cdx-button.cdx-button--icon-only {
 	// Increase padding on small viewports
 	// FIXME: Replace with Codex solution i.e. `.cdx-button--size-large`
 	@media ( max-width: @max-width-tablet ) {
diff --git a/resources/skins.vector.styles/components/PageToolbar.less b/resources/skins.vector.styles/components/PageToolbar.less
index b88c87c65..33a753a8c 100644
--- a/resources/skins.vector.styles/components/PageToolbar.less
+++ b/resources/skins.vector.styles/components/PageToolbar.less
@@ -27,13 +27,6 @@
 		.cdx-mixin-css-icon-size( @size-icon-small );
 		.cdx-mixin-css-icon-alignment( );
 	}
-
-	// Prevent icon buttons in the page toolbar from automatically increasing padding on small viewports
-	.cdx-button--icon-only {
-		// !important needed to override 'responsive' button styles on smaller viewports defined in Button.less
-		min-width: @min-size-interactive-pointer !important; /* stylelint-disable-line declaration-no-important */
-		min-height: @min-size-interactive-pointer !important; /* stylelint-disable-line declaration-no-important */
-	}
 }
 
 // ID Selectors outside of .vector-page-toolbar-container to avoid over-specificity.