@base-border-color: #dcdfe6;
@base-border: 0.5px solid @base-border-color;
@light-border: 0.5px solid lighten(@base-border-color, 2%);
@lighter-border: 0.5px solid lighten(@base-border-color, 4%);
@extra-light-border: 0.5px solid lighten(@base-border-color, 6%);
@drank-border: 0.5px solid darken(@base-border-color, 40%);
.border(@width) {
border: @drank-border;
border-width: @width;
}
.drank-border-bottom(@width) {
border-bottom: @drank-border;
border-bottom-width: @width;
}
.ellipsis(@n: 2) {
display: -webkit-box;
-webkit-line-clamp: @n;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
}
.visible(@origin) {
&-enter,
&-leave {
&-active {
transition: transform 0.3s;
@origin();
}
}
&-enter {
&-from {
transform: scale(0);
}
&-to {
transform: scale(1);
}
}
&-leave {
&-from {
transform: scale(1);
}
&-to {
transform: scale(0);
}
}
}