golem
/
VectorGOLEM
9
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

Correct positioning of search icon before WVUI loads 

WVUI sets the icon as `left: -11px` [1]. Vector should do the same to
ensure the icon doesn't move when WVUI loads. Also set top and bottom
properties to zero so that the height of the icon's container is the
same as in WVUI (32 px).

[1] https://phabricator.wikimedia.org/F34622194

Change-Id: I73fa55f9013dc1bdd51581d357109d4817638d91
This commit is contained in:
Nicholas Ray 2021-08-27 11:23:25 -06:00
parent a068d6125d
commit a35b21d2cf
1 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
resources/skins.vector.styles/components/VueEnhancedSearchBox.less
View File

@ -78,6 +78,8 @@
pointer-events: none;
// Override the default right & left position of the icon.
right: auto;
top: 0;
bottom: 0;
// Accounts for the 1px input border. Derived from
// https://gerrit.wikimedia.org/g/wvui/+/refs/changes/93/650593/10/src/components/input/Input.vue#163
left: 1px;
@ -108,10 +110,9 @@
#searchInput:focus ~ #mw-searchButton {
// Derived from
// https://gerrit.wikimedia.org/g/wvui/+/refs/changes/93/650593/10/src/components/typeahead-search/TypeaheadSearch.vue#655
// (-11px) minus 1px input border.
left: -12px;
// minus the 1px border
top: -1px;
// (12px of space between the border and the icon) with 1px to account for the focused input border.
@space-icon-start: 12px;
left: -@size-search-expand + @space-icon-start + @border-width-base;
}
// Update search loader to match width and position of WVUI expanding input.