61 lines
1.0 KiB
SCSS
61 lines
1.0 KiB
SCSS
$tablet-l-width: 1024px;
|
|
$tablet-s-width: 768px;
|
|
|
|
::ng-deep .sticker-selector {
|
|
height: 210px;
|
|
border-top: 1px solid #cccccc;
|
|
.mat-tab-header {
|
|
.mat-tab-label {
|
|
padding: 0 10px;
|
|
}
|
|
}
|
|
.mat-tab-body-wrapper {
|
|
height: 150px;
|
|
overflow: auto;
|
|
}
|
|
@media screen and (max-width: #{$tablet-s-width}) {
|
|
height: 180px;
|
|
.mat-tab-body-wrapper {
|
|
height: 130px;
|
|
}
|
|
}
|
|
}
|
|
.sticker-item-box {
|
|
flex-wrap: wrap;
|
|
padding: 10px 20px 0;
|
|
overflow: auto;
|
|
|
|
.sticker-item {
|
|
width: 60px;
|
|
margin-bottom: 10px;
|
|
display: inline-flex;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: #{$tablet-s-width}) {
|
|
.sticker-item-box {
|
|
.sticker-item {
|
|
width: 50px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.selected-sticker {
|
|
position: relative;
|
|
padding: 10px 20px;
|
|
text-align: right;
|
|
background-color: rgba(45, 58, 74, 0.8);
|
|
img {
|
|
margin-right: 40px;
|
|
}
|
|
.btn-close {
|
|
position: absolute;
|
|
top: 2px;
|
|
right: 10px;
|
|
width: 40px;
|
|
height: 40px;
|
|
color: #ffffff;
|
|
}
|
|
}
|