use-on-demand
Version:
67 lines (59 loc) • 1.48 kB
text/less
.fixTotalScale() {
// 【位置】调整
transform : scale(0.7);
transform-origin : 50% 100%;
// 【整体透明度】调整
opacity : 0.8 ;
}
.fixDialogTransparent() {
// 【外部透明度】
opacity : 0.6;
}
//
//
//
//
//
#live2d-widget {
.fixTotalScale;
}
.live2d-widget-dialog-container {
width : 300px;
height : 120px;
position : absolute;
bottom : 65%;
right : 0px;
transform-origin : right;
padding : 12px;
box-sizing : border-box;
-webkit-font-smoothing : antialiased;
.fixDialogTransparent;
}
.live2d-widget-dialog {
width : 100%;
height : 100%;
color : #917159;
font-size : 16px;
padding : 12px;
border : 2px solid rgb(236, 203, 180);
background : rgb(252, 248, 244);
box-sizing : border-box;
border-radius : 10px;
transform : rotate(-2deg);
opacity : 0;
transition : 200ms opacity;
box-shadow : rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
animation : live2d-widget-dialog-tingle 4s ease-in-out 0s infinite alternate;
}
@keyframes live2d-widget-dialog-tingle {
0% { transform : translate(-1px, 1.5px) rotate(-2deg); }
100% { transform : translate(1px, -1.5px) rotate(2deg); }
}
//
//
//
//
//
//
//
//