From ef700c4a6a8842a1135930b4f6a9e088163981ec Mon Sep 17 00:00:00 2001 From: Nicholas Ray Date: Fri, 18 Dec 2020 12:42:04 -0700 Subject: [PATCH] Set Vector search variables relative to @font-size-base factor and increase max-width T270202 shows the correct dimensions of the search component having a max-width of 500px and min-width of 350px but since we set the font size of `#p-search` to `@font-size-base` [1], I suspect the search related variables need to account for this factor as well. This increases the max-width of search to 500px per the spec. [1] https://github.com/wikimedia/Vector/blob/30eb683a709f8b4dc06c64571ce3c39a3c885e01/resources/skins.vector.styles/VueEnhancedSearchBox.less#L23 Bug: T270202 Change-Id: I13ad550734e8a5347ed70e4b3c33102b4a13bde7 --- resources/skins.vector.styles/layout.less | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/resources/skins.vector.styles/layout.less b/resources/skins.vector.styles/layout.less index 6bcbf32..ccf70be 100644 --- a/resources/skins.vector.styles/layout.less +++ b/resources/skins.vector.styles/layout.less @@ -27,10 +27,11 @@ // This assumes the presence of variables inside layout.less. DO NOT import it separately. // Assumes various variables defined there. -@min-width-search: unit( 150px / @font-size-browser, em ); -@min-width-search-tablet: unit( 350px / @font-size-browser, em ); -@max-width-search: unit( 450px / @font-size-browser, em ); -@margin-horizontal-search: unit( 40px / @font-size-browser, em ); +// canonical version of spec: T270202 +@min-width-search: unit( 150px / @font-size-browser / @font-size-base, em ); +@min-width-search-tablet: unit( 350px / @font-size-browser / @font-size-base, em ); +@max-width-search: unit( 500px / @font-size-browser / @font-size-base, em ); +@margin-horizontal-search: unit( 40px / @font-size-browser / @font-size-base, em ); // The logo is variable width but typically consists of: // - a icon (50x50)