mddanishyusuf / dailyhack

🐱‍💻 Tiny Tiny Hacks we use in our daily life.
https://dailyhack.now.sh/
149 stars 15 forks source link

Design an input box with search emoji #65

Open mddanishyusuf opened 5 years ago

mddanishyusuf commented 5 years ago

Recently I add search input box into dailyhack.xyz and without search icon the input doesn't feel good according to UX. So, to add a icon inside input box need more element and CSS. Nowadays I'm using lots of emoji and I think why not use a little hack to design this search input box without any extra element and CSS. Here is the hack.

<input type="text" placeholder="🔍 Let's find some tricks from past"/>

input-with-emoji

So, I'm adding a search emoji into placeholder of the input box.

What you think? is this cool hack?

KNTH01 commented 5 years ago

The hack is super cool! I also noticed the power of emojis in my last project instead of using any icons.

Booligoosh commented 5 years ago

I actually have a hack to use a search icon from font awesome etc. as part of a the placeholder attribute for an input without creating any additional elements. I should add it!

mddanishyusuf commented 5 years ago

@Booligoosh Go ahead. love to hear that.

akash-joshi commented 5 years ago

@mddanishyusuf this is actually pretty cool

mddanishyusuf commented 5 years ago

Thanks, @akash-joshi

If you have any tricks then it's easy to contribute. Just make new issues and submit.