@zat-design/sisyphus-react 3.4.0-beta.1 → 3.4.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.css +73 -62
- package/es/ProForm/components/combination/ProNumberRange/style/index.less +20 -19
- package/es/ProLayout/components/ProCollapse/style/index.less +17 -7
- package/es/ProLayout/components/ProHeader/style/index.less +109 -101
- package/lib/ProForm/components/combination/ProNumberRange/style/index.less +20 -19
- package/lib/ProLayout/components/ProCollapse/style/index.less +17 -7
- package/lib/ProLayout/components/ProHeader/style/index.less +109 -101
- package/package.json +1 -1
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
@import '../components/ProBackBtn/style/index';
|
|
4
4
|
|
|
5
5
|
.pro-header {
|
|
6
|
+
padding: 16px 0 0 0 !important;
|
|
6
7
|
background-color: var(--zaui-base-bg, #ffffff);
|
|
7
|
-
padding : 16px 0 0 0 !important;
|
|
8
8
|
|
|
9
9
|
&.pro-header-no-back.pro-header-has-describe {
|
|
10
10
|
.pro-header-top {
|
|
@@ -21,45 +21,47 @@
|
|
|
21
21
|
&.pro-header-left-space {
|
|
22
22
|
margin-left: 0 !important;
|
|
23
23
|
}
|
|
24
|
-
|
|
25
24
|
}
|
|
26
25
|
}
|
|
27
26
|
|
|
28
27
|
&.pro-header-no-describe {
|
|
29
|
-
box-shadow : none;
|
|
30
28
|
margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
|
|
29
|
+
box-shadow: none;
|
|
31
30
|
|
|
32
31
|
.pro-header-title,
|
|
33
32
|
.pro-header-top {
|
|
33
|
+
margin: 0;
|
|
34
34
|
padding: 0;
|
|
35
|
-
margin : 0;
|
|
36
35
|
}
|
|
37
36
|
}
|
|
38
37
|
|
|
39
38
|
&.pro-header-fixed.pro-header-no-describe {
|
|
40
39
|
.pro-header-top {
|
|
41
|
-
padding-bottom: calc(
|
|
40
|
+
padding-bottom: calc(
|
|
41
|
+
var(--zaui-space-size-md; 16px) * var(--zaui-size; 1) - var(--zaui-space-size-xs; 4px) *
|
|
42
|
+
var(--zaui-size; 1)
|
|
43
|
+
);
|
|
42
44
|
}
|
|
43
45
|
}
|
|
44
46
|
|
|
45
47
|
.pro-header-describe {
|
|
46
48
|
a {
|
|
47
|
-
color: var(--zaui-link, #
|
|
49
|
+
color: var(--zaui-link, #006aff);
|
|
48
50
|
}
|
|
49
51
|
}
|
|
50
52
|
|
|
51
53
|
.pro-header-copy {
|
|
54
|
+
display: flex;
|
|
55
|
+
align-items: center;
|
|
56
|
+
width: 16px;
|
|
52
57
|
margin-bottom: 0;
|
|
53
|
-
width : 14px;
|
|
54
|
-
display : flex;
|
|
55
|
-
align-items : center;
|
|
56
58
|
|
|
57
59
|
.@{ant-prefix}-typography-copy-success {
|
|
58
60
|
svg {
|
|
59
|
-
width : 14px;
|
|
60
|
-
height : 14px;
|
|
61
|
-
fill : var(--zaui-success, #00AE4D);
|
|
62
61
|
display: inline-block;
|
|
62
|
+
width: 16px;
|
|
63
|
+
height: 16px;
|
|
64
|
+
fill: var(--zaui-success, #00ae4d);
|
|
63
65
|
}
|
|
64
66
|
}
|
|
65
67
|
|
|
@@ -69,36 +71,36 @@
|
|
|
69
71
|
}
|
|
70
72
|
|
|
71
73
|
svg {
|
|
72
|
-
width : 14px;
|
|
73
|
-
height : 14px;
|
|
74
|
-
fill : #3F3F3F;
|
|
75
74
|
display: inline-block;
|
|
75
|
+
width: 16px;
|
|
76
|
+
height: 16px;
|
|
77
|
+
fill: var(--zaui-brand, #006aff);
|
|
76
78
|
}
|
|
77
79
|
}
|
|
78
80
|
}
|
|
79
81
|
|
|
80
82
|
.pro-header-tag {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
83
|
+
display: inline-block;
|
|
84
|
+
padding: 4px 8px;
|
|
85
|
+
color: var(--zaui-brand, #006aff);
|
|
86
|
+
font-weight: normal;
|
|
87
|
+
font-size: var(--zaui-font-size-sm, 12px);
|
|
88
|
+
line-height: 16px;
|
|
89
|
+
white-space: pre;
|
|
90
|
+
background: var(--ant-primary-1, #e6f4ff);
|
|
84
91
|
border-radius: var(--zaui-border-radius-card, 2px);
|
|
85
|
-
font-size : var(--zaui-font-size-sm, 12px);
|
|
86
|
-
font-weight : normal;
|
|
87
|
-
line-height : 16px;
|
|
88
|
-
display : inline-block;
|
|
89
|
-
white-space : pre;
|
|
90
92
|
}
|
|
91
93
|
|
|
92
94
|
.pro-header-title {
|
|
95
|
+
padding: 0 var(--zaui-space-size-md, 16px);
|
|
93
96
|
font-weight: 500;
|
|
94
|
-
font-size
|
|
95
|
-
padding : 0 var(--zaui-space-size-md, 16px);
|
|
97
|
+
font-size: var(--zaui-font-size-xl, 18px);
|
|
96
98
|
line-height: 22px;
|
|
97
99
|
}
|
|
98
100
|
|
|
99
101
|
&.pro-header-fixed {
|
|
100
|
-
position
|
|
101
|
-
z-index
|
|
102
|
+
position: sticky;
|
|
103
|
+
z-index: 101;
|
|
102
104
|
box-shadow: 0px 1px 2px 0px rgba(0, 55, 93, 0.1);
|
|
103
105
|
}
|
|
104
106
|
|
|
@@ -108,33 +110,33 @@
|
|
|
108
110
|
|
|
109
111
|
.@{ant-prefix}-breadcrumb {
|
|
110
112
|
li {
|
|
113
|
+
color: #1d2129;
|
|
111
114
|
font-weight: 500;
|
|
112
|
-
color : #1D2129;
|
|
113
115
|
}
|
|
114
116
|
|
|
115
117
|
.@{ant-prefix}-breadcrumb-link {
|
|
118
|
+
display: inline-flex;
|
|
116
119
|
font-size: var(--zaui-font-size-xl, 18px);
|
|
117
|
-
display : inline-flex;
|
|
118
120
|
}
|
|
119
121
|
|
|
120
122
|
.@{ant-prefix}-breadcrumb-separator {
|
|
123
|
+
margin: 0 var(--zaui-space-size-xs, 4px);
|
|
124
|
+
color: #1d2129;
|
|
121
125
|
font-weight: 500;
|
|
122
|
-
|
|
123
|
-
font-size : var(--zaui-font-size-xl, 18px);
|
|
124
|
-
margin : 0 var(--zaui-space-size-xs, 4px);
|
|
126
|
+
font-size: var(--zaui-font-size-xl, 18px);
|
|
125
127
|
}
|
|
126
128
|
}
|
|
127
129
|
|
|
128
130
|
.pro-header-top {
|
|
129
|
-
display
|
|
131
|
+
display: flex;
|
|
132
|
+
align-items: center;
|
|
130
133
|
justify-content: space-between;
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
padding : 0 var(--zaui-space-size-md, 16px);
|
|
134
|
+
margin-bottom: calc(var(--zaui-space-size-sm; 8px) * var(--zaui-size; 1));
|
|
135
|
+
padding: 0 var(--zaui-space-size-md, 16px);
|
|
134
136
|
|
|
135
137
|
.pro-header-left {
|
|
136
|
-
display
|
|
137
|
-
align-items
|
|
138
|
+
display: flex;
|
|
139
|
+
align-items: center;
|
|
138
140
|
margin-right: var(--zaui-space-size-md, 16px);
|
|
139
141
|
|
|
140
142
|
&.pro-header-left-space {
|
|
@@ -142,26 +144,26 @@
|
|
|
142
144
|
}
|
|
143
145
|
|
|
144
146
|
ul {
|
|
145
|
-
display
|
|
147
|
+
display: flex;
|
|
146
148
|
align-items: center;
|
|
147
149
|
|
|
148
150
|
li {
|
|
149
|
-
|
|
150
|
-
|
|
151
|
+
display: flex;
|
|
152
|
+
color: #1d2129;
|
|
151
153
|
font-weight: 500;
|
|
152
|
-
|
|
154
|
+
font-size: var(--zaui-font-size-xl, 18px);
|
|
153
155
|
|
|
154
156
|
.breadcrumb-value {
|
|
155
157
|
display: inline-block;
|
|
156
158
|
}
|
|
157
159
|
|
|
158
|
-
|
|
160
|
+
& > span {
|
|
159
161
|
display: flex;
|
|
160
162
|
}
|
|
161
163
|
|
|
162
164
|
.omit {
|
|
163
|
-
overflow
|
|
164
|
-
white-space
|
|
165
|
+
overflow: hidden;
|
|
166
|
+
white-space: nowrap;
|
|
165
167
|
text-overflow: ellipsis;
|
|
166
168
|
}
|
|
167
169
|
|
|
@@ -170,19 +172,19 @@
|
|
|
170
172
|
}
|
|
171
173
|
|
|
172
174
|
.@{ant-prefix}-typography {
|
|
173
|
-
display
|
|
175
|
+
display: flex;
|
|
174
176
|
margin-bottom: 0;
|
|
175
177
|
}
|
|
176
178
|
|
|
177
179
|
&.version {
|
|
178
|
-
|
|
180
|
+
height: 24px;
|
|
181
|
+
padding: 0 var(--zaui-space-size-sm, 8px);
|
|
182
|
+
color: var(--zaui-brand, #006aff);
|
|
183
|
+
font-size: var(--zaui-font-size-sm, 12px);
|
|
184
|
+
font-style: initial;
|
|
185
|
+
line-height: 24px;
|
|
186
|
+
background: var(--ant-primary-1, #e6f4ff);
|
|
179
187
|
border-radius: var(--zaui-border-radius, 4px);
|
|
180
|
-
color : var(--zaui-brand, #006AFF);
|
|
181
|
-
font-style : initial;
|
|
182
|
-
padding : 0 var(--zaui-space-size-sm, 8px);
|
|
183
|
-
font-size : var(--zaui-font-size-sm, 12px);
|
|
184
|
-
height : 24px;
|
|
185
|
-
line-height : 24px;
|
|
186
188
|
}
|
|
187
189
|
|
|
188
190
|
&.hidden {
|
|
@@ -190,7 +192,6 @@
|
|
|
190
192
|
}
|
|
191
193
|
}
|
|
192
194
|
}
|
|
193
|
-
|
|
194
195
|
}
|
|
195
196
|
|
|
196
197
|
.pro-header-right {
|
|
@@ -210,14 +211,13 @@
|
|
|
210
211
|
margin: 0;
|
|
211
212
|
}
|
|
212
213
|
}
|
|
213
|
-
|
|
214
214
|
}
|
|
215
215
|
|
|
216
216
|
.pro-header-nav {
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
217
|
+
position: relative;
|
|
218
|
+
display: flex;
|
|
219
|
+
background: #f7f9fc;
|
|
220
|
+
border-top: 1px solid #f2f2f2;
|
|
221
221
|
|
|
222
222
|
&.pro-header-nav-open {
|
|
223
223
|
.pro-header-fold {
|
|
@@ -225,63 +225,68 @@
|
|
|
225
225
|
transform: rotate(180deg);
|
|
226
226
|
}
|
|
227
227
|
}
|
|
228
|
-
|
|
229
228
|
}
|
|
230
229
|
|
|
231
230
|
&.pro-header-nav-hidden {
|
|
232
231
|
padding: 0;
|
|
233
|
-
border
|
|
232
|
+
border: none;
|
|
234
233
|
|
|
235
234
|
ul {
|
|
236
|
-
height
|
|
237
|
-
overflow
|
|
235
|
+
height: 0;
|
|
236
|
+
overflow: hidden;
|
|
238
237
|
}
|
|
239
238
|
}
|
|
240
239
|
|
|
241
240
|
.pro-header-fold {
|
|
242
|
-
position
|
|
243
|
-
bottom
|
|
244
|
-
left
|
|
241
|
+
position: absolute;
|
|
242
|
+
bottom: -13px;
|
|
243
|
+
left: 50%;
|
|
245
244
|
transform: translateX(-50%);
|
|
246
|
-
cursor
|
|
245
|
+
cursor: pointer;
|
|
247
246
|
|
|
248
247
|
.pro-header-fold-bg {
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
transform
|
|
248
|
+
position: relative;
|
|
249
|
+
z-index: 2;
|
|
250
|
+
height: 26px;
|
|
251
|
+
background: #fff;
|
|
252
|
+
transform: rotate(0deg);
|
|
254
253
|
transform-origin: center;
|
|
255
254
|
}
|
|
256
255
|
|
|
257
256
|
&::before {
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
257
|
+
position: absolute;
|
|
258
|
+
bottom: 13px;
|
|
259
|
+
left: 50%;
|
|
260
|
+
z-index: 1;
|
|
261
|
+
width: 140px;
|
|
262
|
+
height: 1px;
|
|
263
|
+
background: linear-gradient(
|
|
264
|
+
90deg,
|
|
265
|
+
rgba(238, 238, 238, 0) 0%,
|
|
266
|
+
var(--zaui-brand, #006aff) 37%,
|
|
267
|
+
var(--zaui-brand, #006aff) 57%,
|
|
268
|
+
rgba(216, 216, 216, 0) 100%
|
|
269
|
+
);
|
|
270
|
+
transform: translateX(-50%);
|
|
271
|
+
content: '';
|
|
267
272
|
}
|
|
268
273
|
|
|
269
274
|
svg {
|
|
270
|
-
fill: var(--zaui-brand, #
|
|
275
|
+
fill: var(--zaui-brand, #006aff);
|
|
271
276
|
}
|
|
272
277
|
}
|
|
273
278
|
|
|
274
279
|
ul {
|
|
275
|
-
display
|
|
276
|
-
flex-wrap
|
|
277
|
-
|
|
280
|
+
display: flex;
|
|
281
|
+
flex-wrap: wrap;
|
|
282
|
+
height: 60px;
|
|
283
|
+
padding: 0 16px;
|
|
284
|
+
overflow: hidden;
|
|
278
285
|
transition: height 0.2s ease-in-out;
|
|
279
|
-
height : 60px;
|
|
280
|
-
overflow : hidden;
|
|
281
286
|
|
|
282
287
|
li {
|
|
283
|
-
margin-
|
|
284
|
-
margin-
|
|
288
|
+
margin-top: 4px;
|
|
289
|
+
margin-right: 52px;
|
|
285
290
|
margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
|
|
286
291
|
|
|
287
292
|
&:last-child {
|
|
@@ -290,20 +295,20 @@
|
|
|
290
295
|
|
|
291
296
|
span {
|
|
292
297
|
font-weight: 400;
|
|
293
|
-
font-size
|
|
298
|
+
font-size: var(--zaui-font-size, 14px);
|
|
294
299
|
|
|
295
300
|
&:first-child {
|
|
296
|
-
display
|
|
301
|
+
display: block;
|
|
297
302
|
font-weight: 500;
|
|
298
303
|
}
|
|
299
304
|
}
|
|
300
305
|
|
|
301
306
|
.describe-value {
|
|
302
|
-
color
|
|
307
|
+
color: var(--zaui-text, #343434);
|
|
303
308
|
font-weight: 400;
|
|
304
309
|
|
|
305
|
-
|
|
306
|
-
color
|
|
310
|
+
& > * {
|
|
311
|
+
color: var(--zaui-text, #343434);
|
|
307
312
|
font-weight: 400 !important;
|
|
308
313
|
}
|
|
309
314
|
}
|
|
@@ -318,11 +323,14 @@
|
|
|
318
323
|
}
|
|
319
324
|
|
|
320
325
|
.pro-header-describe {
|
|
321
|
-
display
|
|
322
|
-
flex-wrap
|
|
323
|
-
|
|
324
|
-
padding
|
|
325
|
-
|
|
326
|
+
display: flex;
|
|
327
|
+
flex-wrap: wrap;
|
|
328
|
+
padding: 0 var(--zaui-space-size-md, 16px);
|
|
329
|
+
padding-bottom: calc(
|
|
330
|
+
var(--zaui-space-size-md; 16px) * var(--zaui-size; 1) - var(--zaui-space-size-xs; 4px) *
|
|
331
|
+
var(--zaui-size; 1)
|
|
332
|
+
);
|
|
333
|
+
font-size: var(--zaui-font-size, 14px);
|
|
326
334
|
|
|
327
335
|
li {
|
|
328
336
|
margin-left: var(--zaui-space-card, 32px);
|
|
@@ -340,16 +348,16 @@
|
|
|
340
348
|
}
|
|
341
349
|
|
|
342
350
|
span {
|
|
351
|
+
color: #0a0a0a;
|
|
343
352
|
font-weight: 400;
|
|
344
|
-
color : #0A0A0A;
|
|
345
353
|
|
|
346
354
|
&:first-child {
|
|
347
355
|
margin-right: 12px;
|
|
348
356
|
}
|
|
349
357
|
|
|
350
358
|
&:last-child {
|
|
359
|
+
display: inline-grid;
|
|
351
360
|
font-weight: 600;
|
|
352
|
-
display : inline-grid;
|
|
353
361
|
|
|
354
362
|
.pro-header-tag {
|
|
355
363
|
margin-left: 4px;
|