JSFiddle - React, Tailwind, and code Playground
by Praveen Kumar Purushothaman
HTML
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos fugiat <i class="emoticon_like emoticon"></i> vitae assumenda molestias magnam eos cupiditate! Quod error repellat voluptates dolores nesciunt <i class="emoticon emoticon_tongue"></i> aliquid dicta obcaecati odit quo et. Error dolores!</p>CSS
.emoticon{width:16px;height:16px;display:inline-block;vertical-align:top}
.emoticon_text{display:none}
.emoticons_off .emoticon{display:none}
.emoticons_off .emoticon_text{display:inline}
.emoticon_smile{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-153px -903px}
.emoticon_frown{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-238px -886px}
.emoticon_tongue{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-204px -903px}
.emoticon_grin{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-289px -886px}
.emoticon_gasp{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-255px -886px}
.emoticon_wink{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-255px -903px}
.emoticon_glasses{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-272px -886px}
.emoticon_sunglasses{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-187px -903px}
.emoticon_grumpy{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:0 -903px}
.emoticon_unsure{background-image:url("http://praveen-kumar.ptrl/images/sprite.png");background-repeat:no-repeat;background-size:auto;background-position:-221px...