UNPKG

react-jwchat

Version:

This is an easy-to-use web chat component, based on react.

56 lines (55 loc) 1.05 kB
.content { position: relative; } .emoji_wrapper { position: absolute; bottom: -90px; left: 30px; display: flex; flex-wrap: wrap; width: 288px; background-color: white; border: solid 1px #aaaaaa; border-radius: 5px; padding: 3px; } .emoji_wrapper::before { content: ''; border: solid 8px transparent; border-right: solid 8px #aaaaaa; position: absolute; top: 50%; left: -16px; } .emoji_wrapper::after { content: ''; border: solid 8px transparent; border-right: solid 8px white; position: absolute; top: 50%; left: -14.5px; } .emoji_item { box-sizing: border-box; padding: 0px 7px 0px 3px; } .emoji_item:hover { background-color: #f1f1f1; border-radius: 50%; cursor: pointer; } .tool_icon { height: 20px; width: 20px; background-size: 100%; background-repeat: no-repeat; background-position: center; margin-right: 10px; } .emoji { background-image: url('../../image/emoji_black.png'); } .emoji:hover { cursor: pointer; background-image: url('../../image/emoji_light.png'); }