layer.css
10 KB
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
.layui-m-layer{position:relative;z-index:19891014}.layui-m-layer *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.layui-m-layermain,.layui-m-layershade{position:fixed;left:0;top:0;width:100%;height:100%}.layui-m-layershade{background-color:rgba(0,0,0,.7);pointer-events:auto}.layui-m-layermain{display:table;font-family:Helvetica,arial,sans-serif;pointer-events:none}.layui-m-layermain .layui-m-layersection{display:table-cell;vertical-align:middle;text-align:center}.layui-m-layerchild{position:relative;display:inline-block;text-align:left;background-color:#fff;font-size:14px;border-radius:5px;box-shadow:0 0 8px rgba(0,0,0,.1);pointer-events:auto;-webkit-overflow-scrolling:touch;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@-webkit-keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.layui-m-anim-scale{animation-name:layui-m-anim-scale;-webkit-animation-name:layui-m-anim-scale}@-webkit-keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.layui-m-anim-up{-webkit-animation-name:layui-m-anim-up;animation-name:layui-m-anim-up}.layui-m-layer0 .layui-m-layerchild{width:80%;max-width:640px}.layui-m-layer1 .layui-m-layerchild{border:none;border-radius:0}.layui-m-layer2 .layui-m-layerchild{width:auto;max-width:260px;min-width:40px;border:none;background:0 0;box-shadow:none;color:#fff}.layui-m-layerchild h3{padding:0 10px;height:60px;line-height:60px;font-size:16px;font-weight:400;border-radius:5px 5px 0 0;text-align:center}.layui-m-layerbtn span,.layui-m-layerchild h3{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.layui-m-layercont{padding:30px 30px;line-height:22px;text-align:center;word-break:break-all;}.layui-m-layer1 .layui-m-layercont{padding:0;text-align:left}.layui-m-layer2 .layui-m-layercont{text-align:center;padding:0;line-height:0}.layui-m-layer2 .layui-m-layercont i{width:18px;height:18px;margin-left:8px;display:inline-block;background-color:#fff;border-radius:100%;-webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out;animation:layui-m-anim-loading 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.layui-m-layerbtn,.layui-m-layerbtn span{position:relative;text-align:center;border-radius:0 0 5px 5px}.layui-m-layer2 .layui-m-layercont p{margin-top:20px;color: inherit;}@-webkit-keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.layui-m-layer2 .layui-m-layercont i:first-child{margin-left:0;-webkit-animation-delay:-.32s;animation-delay:-.32s}.layui-m-layer2 .layui-m-layercont i.layui-m-layerload{-webkit-animation-delay:-.16s;animation-delay:-.16s}.layui-m-layer2 .layui-m-layercont>div{line-height:22px;padding-top:7px;margin-bottom:20px;font-size:14px}.layui-m-layerbtn{display:box;display:-moz-box;display:-webkit-box;width:100%;height:50px;line-height:50px;font-size:0;border-top:1px solid #D0D0D0;background-color:#F2F2F2}.layui-m-layerbtn span{display:block;-moz-box-flex:1;box-flex:1;-webkit-box-flex:1;font-size:14px;cursor:pointer}.layui-m-layerbtn span[yes]{color:#40AFFE}.layui-m-layerbtn span[no]{border-right:1px solid #D0D0D0;border-radius:0 0 0 5px}.layui-m-layerbtn span:active{background-color:#F6F6F6}.layui-m-layerend{position:absolute;right:7px;top:10px;width:30px;height:30px;border:0;font-weight:400;background:0 0;cursor:pointer;-webkit-appearance:none;font-size:30px}.layui-m-layerend::after,.layui-m-layerend::before{position:absolute;left:5px;top:15px;content:'';width:18px;height:1px;background-color:#999;transform:rotate(45deg);-webkit-transform:rotate(45deg);border-radius:3px}.layui-m-layerend::after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}body .layui-m-layer .layui-m-layer-footer{position:fixed;width:95%;max-width:100%;margin:0 auto;left:0;right:0;bottom:10px;background:0 0}.layui-m-layer-footer .layui-m-layercont{padding:20px;border-radius:5px 5px 0 0;background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn{display:block;height:auto;background:0 0;border-top:none}.layui-m-layer-footer .layui-m-layerbtn span{background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn span[no]{color:#FD482C;border-top:1px solid #c2c2c2;border-radius:0 0 5px 5px}.layui-m-layer-footer .layui-m-layerbtn span[yes]{margin-top:10px;border-radius:5px}body .layui-m-layer .layui-m-layer-msg{width:auto;max-width:90%;margin:0 auto;bottom:-150px;background-color:rgba(0,0,0,.7);color:#fff}.layui-m-layer-msg .layui-m-layercont{padding:10px 20px}
.layui-m-layermain .layui-m-layersection.layersection-bottom {
vertical-align: bottom;
}
body .layui-m-layer.layer-fadeout .layui-m-layer-msg {
animation: layer-fadeout .3s ease-out;
animation-fill-mode: both;
}
body .layui-m-layer .layui-m-layer-msg {
bottom: 80px;
background-color: rgba(0,0,0,.65);
opacity: 1;
}
.layui-m-anim-up {
animation-duration: .35s;
animation-timing-function: cubic-bezier(0.49, 0.48, 0.45, 1.29);
}
.layui-m-layer2 .layui-m-layershade {
background-color: rgba(0,0,0,.35);
}
.layui-m-layer2 .layui-m-layerchild {
background-color: rgba(0,0,0,0.65);
padding: 18px;
width: 56%;
}
.layui-m-layer2 .layui-m-layercont {
line-height: 1;
text-align: left;
}
.layui-m-layer2 .layui-m-layercont i.layui-m-layerload {
width: 34px;
height: 34px;
border: 2px solid #777;
background-color: transparent;
transform-origin: 50% 50% 0px;
border-bottom-color: transparent;
vertical-align: middle;
margin-right: 0;
animation: layer-loading 1.2s infinite cubic-bezier(0.5, 0.5, 0.5, 0.5);
animation-fill-mode: both;
animation-delay: 0s;
}
.layui-m-layer2 .layui-m-layercont span {
font-size: 16px;
display: inline-block;
vertical-align: middle;
color: #f9f9f9;
padding-left: 1em;
}
.layui-m-layer2 .layui-m-anim-scale .layui-m-layercont span {
width: 70%;
line-height: 110%;
padding-left: 16px;
}
@keyframes layui-m-anim-up {
0% {
opacity:0;
transform:translateY(124px)
}
100%{
opacity:1;
transform:translateY(0)
}
}
@keyframes layer-fadeout {
0% { opacity: 1;}
100% { opacity: 0;}
}
@keyframes layer-loading {
0% {
border-bottom-color: #444;
transform: rotate(0deg);
}
75% {
border-bottom-color: transparent;
}
100% {
border-bottom-color: #444;
transform: rotate(360deg);
}
}
.layui-m-layer-footer.wev-footer-menu .layui-m-layercont {
border-radius: 5px;
padding: 0 5px;
max-height: calc(80vh - 100px);
overflow-x: hidden;
overflow-y: auto;
background-color: #fff;
}
.wev-footer-menu .layui-m-layercont > ul {
margin: 0;
padding: 0;
overflow: hidden;
}
.wev-footer-menu .layui-m-layercont > ul > li{
height: 46px;
font-size: 16px;
font-weight: 300;
line-height: 46px;
text-align: left;
color: #000;
background-color: #fff;
padding-left: 10px;
position: relative;
}
.wev-footer-menu .layui-m-layercont > ul > li.left{
border-bottom: 1px solid rgb(228, 228, 228);
}
.wev-footer-menu .layui-m-layercont > ul > li > a{
display: inline-block;
height: 46px;
width: 100%;
color: #000;
}
.wev-footer-menu .layui-m-layercont > ul > li .m-text{
box-sizing:border-box;
padding-left: 8px;
height: 46px;
overflow: hidden;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
}
.wev-footer-menu .layui-m-layercont > ul > li.left .m-text{
display: inline-block;
width: calc(100% - 57px);
}
.wev-footer-menu .layui-m-layercont > ul > li.left.no-icon .m-text{
width: calc(100% - 33px);
}
.wev-footer-menu .layui-m-layercont > ul > li.left.no-badge .m-text{
width: calc(100% - 24px);
}
.wev-footer-menu .layui-m-layercont > ul > li.left.no-icon.no-badge .m-text{
width: 100%;
}
.wev-footer-menu .layui-m-layercont > ul > li.right .m-text{
padding-right: 78px;
border-bottom: 1px solid rgb(228, 228, 228);
}
.wev-footer-menu .layui-m-layercont > ul > li.right.no-icon .m-text{
padding-right: 48px;
}
.wev-footer-menu .layui-m-layercont > ul > li.right.no-badge .m-text{
padding-right: 42px;
}
.wev-footer-menu .layui-m-layercont > ul > li.right.no-icon.no-badge .m-text{
padding-right: 0;
}
.wev-footer-menu .layui-m-layercont > ul > li:last-child {
border-bottom: none;
}
.wev-footer-menu .layui-m-layercont > ul > li:last-child .m-text {
border-bottom: none;
}
.wev-footer-menu .layui-m-layercont > ul > li .m-icon{
width: 24px;
height: 24px;
}
.wev-footer-menu .layui-m-layercont > ul > li.left .m-icon{
vertical-align: top;
padding-top: 11px;
}
.wev-footer-menu .layui-m-layercont > ul > li.right .m-icon{
position: absolute;
top: 11px;
right: 18px;
}
.wev-footer-menu .layui-m-layercont > ul > li span.wev-badge{
position: absolute;
top: 14px;
left: calc(100% - 33px);
}
.wev-footer-menu .layui-m-layercont > ul > li.right span.wev-badge{
left: calc(100% - 78px);
}
.wev-footer-menu .layui-m-layercont > ul > li.right.no-icon span.wev-badge{
left: calc(100% - 48px);
}
.layui-m-layer-footer.wev-footer-menu .layui-m-layerbtn span{
background-color: #fff;
color: #017afd;
font-size: 20px;
font-weight: 700;
}
input.layer-content-prompt-input {
width: calc(100% - 18px);
height: 24px;
padding: 4px 8px;
border: 1px solid #d9d9d9;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
font-size: 14px;
}