Page MenuHomePhabricator

Search icons in Vector use different colors in non-JS/JS-mode
Closed, ResolvedPublic

Description

There are two ways to notice that the color of the search icon in Vector skin (the magnifying glass on the right in the search field on the top of every page) is slightly different depending on whether JS is active or not:

Either you open a page with JS enabled, and a second time with JS disabled and switch between the two tabs. You'll notice that the non-JS version is a bit darker.

Or you watch the icon while loading the page. The icon is initially shown in the non-JS version and gets a bit lighter when JS has finished loading, causing a little flash.

That flash is the reason why the icon should have the same color both in the JS- and in the non-JS-version.

Event Timeline

It seems to be the same image, but without JS there are two buttons with this icon positioned above each other, causing a darker display.

Change 311334 had a related patch set uploaded (by Bartosz Dziewoński):
search.less: Use only one background-image for overlaid buttons

https://gerrit.wikimedia.org/r/311334

Change 311334 merged by jenkins-bot:
search.less: Use only one background-image for overlaid buttons

https://gerrit.wikimedia.org/r/311334

Thanks for raising this and thanks for the quick fix!