77 lines
1.5 KiB
SCSS
77 lines
1.5 KiB
SCSS
.emoji-menu {
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 1;
|
|
position: fixed;
|
|
overflow: auto;
|
|
background-color: rgb(0,0,0);
|
|
background-color: rgba(0,0,0,0.4);
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
|
|
.devider {
|
|
margin: .5em 0;
|
|
}
|
|
}
|
|
|
|
.emoji-menu-tabs {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
|
|
.emoji-menu-tab {
|
|
width: 24px;
|
|
height: 29px;
|
|
background: url('/assets/emoji/IconsetSmiles.png') no-repeat;
|
|
background-size: 42px 350px;
|
|
border: 0;
|
|
}
|
|
|
|
.icon-smile { background-position: -9px -34px; }
|
|
.icon-smile-selected { background-position: -9px -5px; }
|
|
|
|
.icon-flower { background-position: -9px -145px; }
|
|
.icon-flower-selected { background-position: -9px -118px; }
|
|
|
|
.icon-bell { background-position: -9px -89px; }
|
|
.icon-bell-selected { background-position: -9px -61px; }
|
|
|
|
.icon-car { background-position: -9px -196px; }
|
|
.icon-car-selected { background-position: -9px -170px; }
|
|
|
|
.icon-grid { background-position: -9px -248px; }
|
|
.icon-grid-selected { background-position: -9px -222px; }
|
|
|
|
.icon-car,
|
|
.icon-bell,
|
|
.icon-grid,
|
|
.icon-smile,
|
|
.icon-flower {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.icon-car:hover,
|
|
.icon-bell:hover,
|
|
.icon-grid:hover,
|
|
.icon-smile:hover,
|
|
.icon-flower:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.emoji-items-wrap {
|
|
max-height: 30vh;
|
|
min-height: 30vh;
|
|
overflow: scroll;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-content: flex-start;
|
|
}
|
|
|
|
.emoji-item {
|
|
padding: 3px;
|
|
}
|