初始提交

bklLiudl

2024-05-25 484e5129e4c9a671c5660a556a24bd306f1fdd9b

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
@message-prefix-cls: ~"@{css-prefix}message";
@icon-prefix-cls: ~"@{css-prefix}icon";
 
.@{message-prefix-cls} {
    font-size: @font-size-base;
    position: fixed;
    z-index: @zindex-message;
    width: 100%;
    top: 16px;
    left: 0;
    pointer-events: none;
 
    &-notice {
        padding: 8px;
        text-align: center;
        transition: height @animation-time @ease-in-out, padding @animation-time @ease-in-out;
 
        &:first-child {
          margin-top: -8px;
        }
 
        &-close {
            position: absolute;
            right: 4px;
            top: 10px;
            color: #999;
            outline: none;
 
            i.@{icon-prefix-cls}{
                .close-base(-3px);
            }
        }
    }
 
    &-notice-content {
        display: inline-block;
        pointer-events: all;
        padding: 8px 16px;
        //border: 1px solid @border-color-split;
        border-radius: @border-radius-small;
        box-shadow: @shadow-base;
        background: #fff;
        position: relative;
        &-text{
            display: inline-block;
        }
    }
 
    &-notice-closable{
        .@{message-prefix-cls}-notice-content-text{
            padding-right: 32px;
        }
    }
 
    &-success .@{icon-prefix-cls} {
        color: @success-color;
    }
 
    &-error .@{icon-prefix-cls} {
        color: @error-color;
    }
 
    &-warning .@{icon-prefix-cls} {
        color: @warning-color;
    }
 
    &-info .@{icon-prefix-cls},
    &-loading .@{icon-prefix-cls} {
        color: @primary-color;
    }
 
    .@{icon-prefix-cls} {
        margin-right: 4px;
        font-size: @font-size-large;
        vertical-align: middle;
    }
    &-custom-content{
        span{
            vertical-align: middle;
        }
    }
 
    &-notice-with-background{
        .@{message-prefix-cls}-notice-content{
            &-background{
                box-shadow: none;
            }
            &-info{
                background: ~`colorPalette("@{primary-color}", 1)`;
                color: ~`colorPalette("@{primary-color}", 6)`;
                border: 1px solid ~`colorPalette("@{primary-color}", 2)`;
            }
            &-success{
                background: ~`colorPalette("@{success-color}", 1)`;
                color: ~`colorPalette("@{success-color}", 6)`;
                border: 1px solid ~`colorPalette("@{success-color}", 2)`;
            }
            &-warning{
                background: ~`colorPalette("@{warning-color}", 1)`;
                color: ~`colorPalette("@{warning-color}", 6)`;
                border: 1px solid ~`colorPalette("@{warning-color}", 2)`;
            }
            &-error{
                background: ~`colorPalette("@{error-color}", 1)`;
                color: ~`colorPalette("@{error-color}", 6)`;
                border: 1px solid ~`colorPalette("@{error-color}", 2)`;
            }
        }
    }
}