Using the :active pseudo works fine for desktop, but mobile is a
completely different beast, especially with the quirks of each
platform. By intentionally not using any :active selectors and manually
adding/removing a .active class, it gives us a precise control on how
the active state works for ALL platforms. Additionally, this places
less selectors in the css, and reduces the possibility of unnecessary
repaints. Currently this method of using .active instead of :active is
being applied to .button and .item elements.
Currently there is no gap between the `.placeholder-icon` and the placeholder text, sometimes its fixed by using an ` `, I think add padding is a better solution.
I hope I did the sass selector correctly, you may check it twice.