114 lines
2.3 KiB
CSS
114 lines
2.3 KiB
CSS
.lsx-emojipicker-emoji span {
|
|
display: inline-block;
|
|
font-size: 24px;
|
|
width: 33px;
|
|
height: 35px;
|
|
cursor: pointer;
|
|
}
|
|
.lsx-emojipicker-appender {
|
|
position: relative;
|
|
}
|
|
.lsx-emojipicker-container {
|
|
background: #ffffff;
|
|
border-radius: 3px;
|
|
z-index: 2;
|
|
position: absolute;
|
|
top: 13px;
|
|
left: -40px;
|
|
box-shadow: 0.5px 0.5px 3px rgba(0,0,0,0.26);
|
|
transition: all 0.5s ease-in-out;
|
|
-webkit-transition: all 0.5s ease-in-out;
|
|
display: none;
|
|
font-family:"apple color emoji","segoe ui emoji",notocoloremoji,"segoe ui symbol","android emoji",emojisymbols,"emojione mozilla";
|
|
}
|
|
ul.lsx-emojipicker-tabs {
|
|
margin: 0;
|
|
list-style: none;
|
|
text-align: center;
|
|
border-top-left-radius: 3px;
|
|
border-top-right-radius: 3px;
|
|
}
|
|
ul.lsx-emojipicker-tabs li {
|
|
display: inline-block;
|
|
text-align: left;
|
|
font-size: 15px;
|
|
padding: 6px;
|
|
cursor: pointer;
|
|
transition: 0.15s ease-out;
|
|
border-bottom: 0px solid #189EFC;
|
|
}
|
|
ul.lsx-emojipicker-tabs li.selected,
|
|
ul.lsx-emojipicker-tabs li:HOVER {
|
|
border-bottom: 3px solid #189EFC;
|
|
}
|
|
.lsx-emojipicker-tabs img.emoji {
|
|
margin: 5px 10px;
|
|
cursor: pointer;
|
|
}
|
|
.lsx-emojipicker-tabs img.emoji:HOVER,
|
|
.lsx-emojipicker-tabs li.selected img.emoji {
|
|
opacity: 1;
|
|
}
|
|
.lsx-emojipicker-emoji span img.emoji {
|
|
margin: 5px 4px;
|
|
cursor: pointer;
|
|
transition: all 0.1s ease-in-out;
|
|
-webkit-transition: all 0.1s ease-in-out;
|
|
}
|
|
.lsx-emojipicker-emoji.lsx-emoji-tab {
|
|
width: 220px;
|
|
padding: 8px;
|
|
height: 200px;
|
|
border-radius: 4px;
|
|
overflow: auto;
|
|
}
|
|
.lsx-emojipicker-emoji span:HOVER,
|
|
.lsx-emojipicker-emoji span img.emoji:HOVER {
|
|
transform: scale(1.1);
|
|
-webkit-transform: scale(1.1);
|
|
-ms-transform: scale(1.1);
|
|
}
|
|
.lsx-emojipicker-container .loader {
|
|
border: 6px solid #ececec;
|
|
border-top: 6px solid #d8d8d8;
|
|
border-radius: 50%;
|
|
width: 40px;
|
|
height: 40px;
|
|
animation: spin 1.2s linear infinite;
|
|
margin: 0 auto;
|
|
}
|
|
@keyframes spin {
|
|
0% { transform: rotate(0deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
.lsx-emojipicker-wrapper {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
.lsx-emojipicker-wrapper .spinner-container {
|
|
position: absolute;
|
|
background: #ffffffbd;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 10;
|
|
border-radius: 4px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.lsx-emojipicker-container:before {
|
|
display: block;
|
|
content: "";
|
|
z-index: -1;
|
|
width: 20px;
|
|
height: 20px;
|
|
position: absolute;
|
|
transform: rotate(45deg);
|
|
top: -5px;
|
|
left: 8px;
|
|
background-color: #fff;
|
|
}
|
|
.lsx-emojipicker-emoji.lsx-emoji-tab.hidden {
|
|
display: none;
|
|
}
|