oak-general-business/lib/miniprogram_npm/tdesign/toast/toast.less

104 lines
1.6 KiB
Plaintext

@import '../common/style/index.less';
.@{prefix}-toast {
&__bg {
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0);
z-index: 12000;
}
&__content {
position: fixed;
right: -50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: rgba(0, 0, 0, 0.6);
align-items: center;
border-radius: 8rpx;
font-size: 28rpx;
color: white;
max-width: 374rpx;
width: fit-content;
line-height: 44rpx;
box-sizing: border-box;
z-index: 12001;
}
&__row {
display: flex;
text-align: left;
padding: 28rpx 44rpx;
&-text {
margin-left: 12rpx;
}
&-icon {
display: flex;
}
}
&__column {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 48rpx;
min-width: 260rpx;
min-height: 260rpx;
border-radius: 16rpx;
&-text {
margin-top: 24rpx;
}
}
&__text {
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 3;
display: -webkit-box;
-webkit-box-orient: vertical;
}
&--enter {
animation: fade-enter 0.5s;
}
&--leave {
animation: fade-leave 0.5s;
}
}
@keyframes fade-enter {
from {
opacity: 0;
}
}
@keyframes fade-leave {
to {
opacity: 0;
}
}
@keyframes scale-enter {
from {
opacity: 0;
transform: translate3d(-50%, -50%, 0) scale(0.9);
}
}
@keyframes scale-leave {
to {
opacity: 0;
transform: translate3d(-50%, -50%, 0) scale(0.9);
}
}