Make search boxes consistent throughout GitLab

mentioned in merge request gitlab-foss!8281 (merged)

I really like this idea!

Sounds great @tauriedavis! I just created a quick MR to document this in the UX guide (https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/8429/diffs). Let me know if that makes sense. We should definitely go ahead and do this work. Thanks!

added ~~123454 gitlab-foss~~217506 labels

changed milestone to %Backlog in gitlab-foss

added search in GitLab FOSS label

mentioned in issue gitlab-foss#26259 (closed)

changed milestone to %8.17 in gitlab-foss

added Stretch in GitLab FOSS label

removed Stretch in GitLab FOSS label

changed milestone to %Backlog in gitlab-foss

added ~1434245 label

removed ~19492 label

added ~974571 label

added Deliverable in GitLab FOSS label

changed milestone to %9.4 in gitlab-foss

changed the description

created branch 26303-make-search-boxes-consistent-throughout-gitlab

mentioned in merge request gitlab-foss!12221 (merged)

closed via merge request gitlab-foss!12221 (merged)

reopened

created branch 26303-make-search-boxes-consistent-throughout-gitlab

mentioned in merge request gitlab-foss!12222

@tauriedavis I identified one problem with changing the current solution , as the 3rd input box is a search which is going back to the server the magnifying glass is also the submit button :

So what should I implement ? I can do the unified approach and you can only submit through return ? Show both Icons ?

@timzallmann I think the unified approach makes sense, since that is what we have moved towards with the rest of our search boxes.

However, I think it does make sense for all of our search boxes to keep the mag glass icon in order to submit. @sarrahvesselov The main problem to fix here in this issue is consistency. But what are your thoughts on keeping the search icon on search fields so users can submit via the icon if they prefer? We should still have a close icon appear next to the submit field in order to keep that functionality. This may be out of scope for this issue. I could create a new one if we want to do that approach instead and it is out of scope here.

But what are your thoughts on keeping the search icon on search fields so users can submit via the icon if they prefer?

I strongly feel we should have a search icon in all search boxes. The icon is the quickest way to differentiate a search box from an input field. We also have a very low-contrast interface overall, the small addition of an icon can make the search that much easier to see.

Here is some research done on the use of a search icon. Spoiler alert! It say's they can be helpful

https://www.nngroup.com/articles/magnifying-glass-icon/

We should still have a close icon appear next to the submit field in order to keep that functionality. This may be out of scope for this issue. I could create a new one if we want to do that approach instead and it is out of scope here.

I agree, no need to start another issue. I think that falls within the realm of consistency.

I'm not sure the clear icon is even really necessary, actually. We could keep it, but it'll just be more visual bloat. I think the search icon is more important.