yyzone
Version:
yyzone vue components and utils
64 lines (61 loc) • 1.68 kB
text/less
@prefixMessageCls: ~'@{yy-css-prefix}message';
@message-width: 320px;
@message-padding: 8px 14px;
.@{prefixMessageCls} {
.vertical(fixed);
top: 24px;
width: @message-width;
&-item {
padding: @message-padding;
border-radius: 4px;
box-shadow: @yy-shadow-base;
font-size: @yy-font-size-small;
color: @yy-text-primary-color;
margin-bottom: 20px;
display: flex;
&-success {
background-color: @yy-message-success-bg;
border: 1px solid @yy-message-success-border;
}
&-error {
background-color: @yy-message-error-bg;
border: 1px solid @yy-message-error-border;
}
&-warning {
background-color: @yy-message-warning-bg;
border: 1px solid @yy-message-warning-border;
}
&-icon {
display: inline-block;
.square(16px);
margin-right: 6px;
svg {
.square(100%);
}
}
&-text {
line-height: 16px;
flex: 1;
}
&-close {
.square(16px);
display: inline-block;
line-height: 16px;
margin-right: -10px;
margin-left: 4px;
color: @yy-text-info-color;
.cursor();
}
&-multi-line {
.@{prefixMessageCls}-item-icon {
margin-top: 2px;
}
.@{prefixMessageCls}-item-text {
line-height: 18px;
}
.@{prefixMessageCls}-close {
margin-top: 2px;
}
}
}
}