Adding search icon in search input field

[Rena-Ryumae]

Currently, there is no visual indication
for when the user is searching for an
emoji nor is there an easy way to clear
the input field after the user's search

Our change proposes to add a small magnifying
glass icon to the right hand side of the
search input bar which becomes an x delete
icon when the user types in the search input
bar.

The x delete icon is tabbable and will clear
the search input field with the return (enter)
key, spacebar, and mouse click. The
magnifying glass icon is not tabbable.

[cosmocoder]

@Rena-Ryumae and @EtienneLem there are a couple of small issues with this commit:

1. The search icon is not vertically centered. Using top: 50%; transform: translateY(-50%) fixes that issue.

2. The button element does not have the type='button' attribute, this causes a full page reload when it is used inside a form element, while clicking the close button.