zartui 3.1.13 → 3.1.15
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/es/cell/index.css +1 -1
- package/es/dropdown-item/DropdownItem.d.ts +7 -0
- package/es/dropdown-item/DropdownItem.mjs +39 -25
- package/es/dropdown-item/index.css +1 -1
- package/es/dropdown-item/index.d.ts +4 -0
- package/es/dropdown-item/style/index.mjs +1 -0
- package/es/dropdown-item/types.d.ts +2 -1
- package/es/dropdown-menu/index.css +1 -1
- package/es/field/index.css +1 -1
- package/es/form/index.css +1 -0
- package/es/form/style/index.mjs +1 -0
- package/es/icon/config.mjs +3 -1
- package/es/icon/index.css +1 -1
- package/es/image-preview/ImagePreview.d.ts +1 -1
- package/es/image-preview/index.d.ts +1 -1
- package/es/index.d.ts +2 -1
- package/es/index.mjs +4 -1
- package/es/media-picker/MediaPicker.mjs +12 -2
- package/es/media-picker/type.d.ts +3 -0
- package/es/multiple-picker/MultiplePicker.d.ts +44 -3
- package/es/multiple-picker/MultiplePicker.mjs +45 -18
- package/es/multiple-picker/MultiplePickerOptions.mjs +5 -2
- package/es/multiple-picker/index.css +1 -1
- package/es/multiple-picker/index.d.ts +31 -3
- package/es/picker/Picker.d.ts +30 -4
- package/es/picker/Picker.mjs +69 -16
- package/es/picker/PickerOptions.d.ts +75 -0
- package/es/picker/PickerOptions.mjs +93 -0
- package/es/picker/index.css +1 -1
- package/es/picker/index.d.ts +21 -3
- package/es/picker/types.d.ts +5 -1
- package/es/popup/Popup.mjs +3 -3
- package/es/radio-picker/RadioPicker.d.ts +11 -11
- package/es/radio-picker/index.d.ts +9 -9
- package/es/radio-picker/style/index.mjs +1 -1
- package/es/skeleton/index.css +1 -1
- package/es/slider/Slider.d.ts +139 -0
- package/es/slider/Slider.mjs +335 -0
- package/es/slider/index.css +1 -0
- package/es/slider/index.d.ts +103 -0
- package/es/slider/index.mjs +10 -0
- package/es/slider/style/index.d.ts +1 -0
- package/es/slider/style/index.mjs +2 -0
- package/es/slider/types.d.ts +11 -0
- package/es/slider/types.mjs +0 -0
- package/es/style/base.css +1 -1
- package/es/style/css-variables.css +1 -1
- package/es/tabbar-item/index.css +1 -1
- package/es/utils/mount-component.mjs +1 -1
- package/lib/cell/index.css +1 -1
- package/lib/dropdown-item/DropdownItem.d.ts +7 -0
- package/lib/dropdown-item/DropdownItem.js +37 -23
- package/lib/dropdown-item/index.css +1 -1
- package/lib/dropdown-item/index.d.ts +4 -0
- package/lib/dropdown-item/style/index.js +1 -0
- package/lib/dropdown-item/types.d.ts +2 -1
- package/lib/dropdown-menu/index.css +1 -1
- package/lib/field/index.css +1 -1
- package/lib/form/index.css +1 -0
- package/lib/form/style/index.js +1 -0
- package/lib/icon/config.js +3 -1
- package/lib/icon/index.css +1 -1
- package/lib/image-preview/ImagePreview.d.ts +1 -1
- package/lib/image-preview/index.d.ts +1 -1
- package/lib/index.css +1 -1
- package/lib/index.d.ts +2 -1
- package/lib/index.js +4 -1
- package/lib/media-picker/MediaPicker.js +12 -2
- package/lib/media-picker/type.d.ts +3 -0
- package/lib/multiple-picker/MultiplePicker.d.ts +44 -3
- package/lib/multiple-picker/MultiplePicker.js +45 -18
- package/lib/multiple-picker/MultiplePickerOptions.js +5 -2
- package/lib/multiple-picker/index.css +1 -1
- package/lib/multiple-picker/index.d.ts +31 -3
- package/lib/picker/Picker.d.ts +30 -4
- package/lib/picker/Picker.js +68 -15
- package/lib/picker/PickerOptions.d.ts +75 -0
- package/lib/picker/PickerOptions.js +112 -0
- package/lib/picker/index.css +1 -1
- package/lib/picker/index.d.ts +21 -3
- package/lib/picker/types.d.ts +5 -1
- package/lib/popup/Popup.js +3 -3
- package/lib/radio-picker/RadioPicker.d.ts +11 -11
- package/lib/radio-picker/index.d.ts +9 -9
- package/lib/radio-picker/style/index.js +1 -1
- package/lib/skeleton/index.css +1 -1
- package/lib/slider/Slider.d.ts +139 -0
- package/lib/slider/Slider.js +354 -0
- package/lib/slider/index.css +1 -0
- package/lib/slider/index.d.ts +103 -0
- package/lib/slider/index.js +39 -0
- package/lib/slider/style/index.d.ts +1 -0
- package/lib/slider/style/index.js +2 -0
- package/lib/slider/types.d.ts +11 -0
- package/lib/slider/types.js +15 -0
- package/lib/style/base.css +1 -1
- package/lib/style/css-variables.css +1 -1
- package/lib/tabbar-item/index.css +1 -1
- package/lib/utils/mount-component.js +1 -1
- package/lib/web-types.json +1 -1
- package/lib/zartui.cjs.js +1440 -919
- package/lib/zartui.es.js +1440 -919
- package/lib/zartui.js +1440 -919
- package/lib/zartui.min.js +1 -1
- package/package.json +7 -7
- package/README.md +0 -23
|
@@ -0,0 +1,354 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name2 in all)
|
|
7
|
+
__defProp(target, name2, { get: all[name2], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var stdin_exports = {};
|
|
19
|
+
__export(stdin_exports, {
|
|
20
|
+
default: () => stdin_default,
|
|
21
|
+
sliderProps: () => sliderProps
|
|
22
|
+
});
|
|
23
|
+
module.exports = __toCommonJS(stdin_exports);
|
|
24
|
+
var import_vue = require("vue");
|
|
25
|
+
var import_vue2 = require("vue");
|
|
26
|
+
var import_utils = require("../utils");
|
|
27
|
+
var import_use = require("@zartui/use");
|
|
28
|
+
var import_use_touch = require("../composables/use-touch");
|
|
29
|
+
const [name, bem] = (0, import_utils.createNamespace)("slider");
|
|
30
|
+
const sliderProps = {
|
|
31
|
+
min: (0, import_utils.makeNumericProp)(0),
|
|
32
|
+
max: (0, import_utils.makeNumericProp)(100),
|
|
33
|
+
step: (0, import_utils.makeNumericProp)(1),
|
|
34
|
+
range: Boolean,
|
|
35
|
+
reverse: Boolean,
|
|
36
|
+
disabled: Boolean,
|
|
37
|
+
readonly: import_utils.truthProp,
|
|
38
|
+
vertical: Boolean,
|
|
39
|
+
barHeight: import_utils.numericProp,
|
|
40
|
+
buttonSize: import_utils.numericProp,
|
|
41
|
+
activeColor: String,
|
|
42
|
+
inactiveColor: String,
|
|
43
|
+
modelValue: {
|
|
44
|
+
type: [Number, Array],
|
|
45
|
+
default: 0
|
|
46
|
+
},
|
|
47
|
+
title: String,
|
|
48
|
+
// 标题跟进度与主体进度条的排列方式
|
|
49
|
+
direction: (0, import_utils.makeStringProp)("horizontal"),
|
|
50
|
+
showPercent: import_utils.truthProp
|
|
51
|
+
};
|
|
52
|
+
var stdin_default = (0, import_vue2.defineComponent)({
|
|
53
|
+
name,
|
|
54
|
+
props: sliderProps,
|
|
55
|
+
emits: ["change", "dragEnd", "dragStart", "update:modelValue"],
|
|
56
|
+
setup(props, {
|
|
57
|
+
emit,
|
|
58
|
+
slots
|
|
59
|
+
}) {
|
|
60
|
+
let buttonIndex;
|
|
61
|
+
let current;
|
|
62
|
+
let startValue;
|
|
63
|
+
const root = (0, import_vue2.ref)();
|
|
64
|
+
const slider = [(0, import_vue2.ref)(), (0, import_vue2.ref)()];
|
|
65
|
+
const dragStatus = (0, import_vue2.ref)();
|
|
66
|
+
const touch = (0, import_use_touch.useTouch)();
|
|
67
|
+
const scope = (0, import_vue2.computed)(() => Number(props.max) - Number(props.min));
|
|
68
|
+
const wrapperStyle = (0, import_vue2.computed)(() => {
|
|
69
|
+
const crossAxis = props.vertical ? "width" : "height";
|
|
70
|
+
return {
|
|
71
|
+
background: props.inactiveColor,
|
|
72
|
+
[crossAxis]: (0, import_utils.addUnit)(props.barHeight)
|
|
73
|
+
};
|
|
74
|
+
});
|
|
75
|
+
const isRange = (val) => props.range && Array.isArray(val);
|
|
76
|
+
const calcMainAxis = () => {
|
|
77
|
+
const {
|
|
78
|
+
modelValue,
|
|
79
|
+
min
|
|
80
|
+
} = props;
|
|
81
|
+
if (isRange(modelValue)) {
|
|
82
|
+
return `${(modelValue[1] - modelValue[0]) * 100 / scope.value}%`;
|
|
83
|
+
}
|
|
84
|
+
return `${(modelValue - Number(min)) * 100 / scope.value}%`;
|
|
85
|
+
};
|
|
86
|
+
const calcOffset = () => {
|
|
87
|
+
const {
|
|
88
|
+
modelValue,
|
|
89
|
+
min
|
|
90
|
+
} = props;
|
|
91
|
+
if (isRange(modelValue)) {
|
|
92
|
+
return `${(modelValue[0] - Number(min)) * 100 / scope.value}%`;
|
|
93
|
+
}
|
|
94
|
+
return "0%";
|
|
95
|
+
};
|
|
96
|
+
const barStyle = (0, import_vue2.computed)(() => {
|
|
97
|
+
const mainAxis = props.vertical ? "height" : "width";
|
|
98
|
+
const style = {
|
|
99
|
+
[mainAxis]: calcMainAxis(),
|
|
100
|
+
background: props.activeColor
|
|
101
|
+
};
|
|
102
|
+
if (dragStatus.value) {
|
|
103
|
+
style.transition = "none";
|
|
104
|
+
}
|
|
105
|
+
const getPositionKey = () => {
|
|
106
|
+
if (props.vertical) {
|
|
107
|
+
return props.reverse ? "bottom" : "top";
|
|
108
|
+
}
|
|
109
|
+
return props.reverse ? "right" : "left";
|
|
110
|
+
};
|
|
111
|
+
style[getPositionKey()] = calcOffset();
|
|
112
|
+
return style;
|
|
113
|
+
});
|
|
114
|
+
const format = (value) => {
|
|
115
|
+
const min = +props.min;
|
|
116
|
+
const max = +props.max;
|
|
117
|
+
const step = +props.step;
|
|
118
|
+
value = (0, import_utils.clamp)(value, min, max);
|
|
119
|
+
const diff = Math.round((value - min) / step) * step;
|
|
120
|
+
return (0, import_utils.addNumber)(min, diff);
|
|
121
|
+
};
|
|
122
|
+
const updateStartValue = () => {
|
|
123
|
+
const current2 = props.modelValue;
|
|
124
|
+
if (isRange(current2)) {
|
|
125
|
+
startValue = current2.map(format);
|
|
126
|
+
} else {
|
|
127
|
+
startValue = format(current2);
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
const handleRangeValue = (value) => {
|
|
131
|
+
var _a, _b;
|
|
132
|
+
const left = (_a = value[0]) != null ? _a : Number(props.min);
|
|
133
|
+
const right = (_b = value[1]) != null ? _b : Number(props.max);
|
|
134
|
+
return left > right ? [right, left] : [left, right];
|
|
135
|
+
};
|
|
136
|
+
const updateValue = (value, end) => {
|
|
137
|
+
if (isRange(value)) {
|
|
138
|
+
value = handleRangeValue(value).map(format);
|
|
139
|
+
} else {
|
|
140
|
+
value = format(value);
|
|
141
|
+
}
|
|
142
|
+
if (!(0, import_utils.isSameValue)(value, props.modelValue)) {
|
|
143
|
+
emit("update:modelValue", value);
|
|
144
|
+
}
|
|
145
|
+
if (end && !(0, import_utils.isSameValue)(value, startValue)) {
|
|
146
|
+
emit("change", value);
|
|
147
|
+
}
|
|
148
|
+
};
|
|
149
|
+
const onClick = (event) => {
|
|
150
|
+
event.stopPropagation();
|
|
151
|
+
if (props.disabled || props.readonly) {
|
|
152
|
+
return;
|
|
153
|
+
}
|
|
154
|
+
updateStartValue();
|
|
155
|
+
const {
|
|
156
|
+
min,
|
|
157
|
+
reverse,
|
|
158
|
+
vertical,
|
|
159
|
+
modelValue
|
|
160
|
+
} = props;
|
|
161
|
+
const rect = (0, import_use.useRect)(root);
|
|
162
|
+
const getDelta = () => {
|
|
163
|
+
if (vertical) {
|
|
164
|
+
if (reverse) {
|
|
165
|
+
return rect.bottom - event.clientY;
|
|
166
|
+
}
|
|
167
|
+
return event.clientY - rect.top;
|
|
168
|
+
}
|
|
169
|
+
if (reverse) {
|
|
170
|
+
return rect.right - event.clientX;
|
|
171
|
+
}
|
|
172
|
+
return event.clientX - rect.left;
|
|
173
|
+
};
|
|
174
|
+
const total = vertical ? rect.height : rect.width;
|
|
175
|
+
const value = Number(min) + getDelta() / total * scope.value;
|
|
176
|
+
if (isRange(modelValue)) {
|
|
177
|
+
const [left, right] = modelValue;
|
|
178
|
+
const middle = (left + right) / 2;
|
|
179
|
+
if (value <= middle) {
|
|
180
|
+
updateValue([value, right], true);
|
|
181
|
+
} else {
|
|
182
|
+
updateValue([left, value], true);
|
|
183
|
+
}
|
|
184
|
+
} else {
|
|
185
|
+
updateValue(value, true);
|
|
186
|
+
}
|
|
187
|
+
};
|
|
188
|
+
const onTouchStart = (event) => {
|
|
189
|
+
if (props.disabled || props.readonly) {
|
|
190
|
+
return;
|
|
191
|
+
}
|
|
192
|
+
touch.start(event);
|
|
193
|
+
current = props.modelValue;
|
|
194
|
+
updateStartValue();
|
|
195
|
+
dragStatus.value = "start";
|
|
196
|
+
};
|
|
197
|
+
const onTouchMove = (event) => {
|
|
198
|
+
if (props.disabled || props.readonly) {
|
|
199
|
+
return;
|
|
200
|
+
}
|
|
201
|
+
if (dragStatus.value === "start") {
|
|
202
|
+
emit("dragStart", event);
|
|
203
|
+
}
|
|
204
|
+
(0, import_utils.preventDefault)(event, true);
|
|
205
|
+
touch.move(event);
|
|
206
|
+
dragStatus.value = "dragging";
|
|
207
|
+
const rect = (0, import_use.useRect)(root);
|
|
208
|
+
const delta = props.vertical ? touch.deltaY.value : touch.deltaX.value;
|
|
209
|
+
const total = props.vertical ? rect.height : rect.width;
|
|
210
|
+
let diff = delta / total * scope.value;
|
|
211
|
+
if (props.reverse) {
|
|
212
|
+
diff = -diff;
|
|
213
|
+
}
|
|
214
|
+
if (isRange(startValue)) {
|
|
215
|
+
const index = props.reverse ? 1 - buttonIndex : buttonIndex;
|
|
216
|
+
current[index] = startValue[index] + diff;
|
|
217
|
+
} else {
|
|
218
|
+
current = startValue + diff;
|
|
219
|
+
}
|
|
220
|
+
updateValue(current);
|
|
221
|
+
};
|
|
222
|
+
const onTouchEnd = (event) => {
|
|
223
|
+
if (props.disabled || props.readonly) {
|
|
224
|
+
return;
|
|
225
|
+
}
|
|
226
|
+
if (dragStatus.value === "dragging") {
|
|
227
|
+
updateValue(current, true);
|
|
228
|
+
emit("dragEnd", event);
|
|
229
|
+
}
|
|
230
|
+
dragStatus.value = "";
|
|
231
|
+
};
|
|
232
|
+
const getButtonClassName = (index) => {
|
|
233
|
+
if (typeof index === "number") {
|
|
234
|
+
const position = ["left", "right"];
|
|
235
|
+
return bem(`button-wrapper`, position[index]);
|
|
236
|
+
}
|
|
237
|
+
return bem("button-wrapper", props.reverse ? "left" : "right");
|
|
238
|
+
};
|
|
239
|
+
const renderButtonContent = (value, index) => {
|
|
240
|
+
const dragging = dragStatus.value === "dragging";
|
|
241
|
+
if (typeof index === "number") {
|
|
242
|
+
const slot = slots[index === 0 ? "left-button" : "right-button"];
|
|
243
|
+
let dragIndex;
|
|
244
|
+
if (dragging && Array.isArray(current)) {
|
|
245
|
+
dragIndex = current[0] > current[1] ? buttonIndex ^ 1 : buttonIndex;
|
|
246
|
+
}
|
|
247
|
+
if (slot) {
|
|
248
|
+
return slot({
|
|
249
|
+
value,
|
|
250
|
+
dragging,
|
|
251
|
+
dragIndex
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
if (slots.button) {
|
|
256
|
+
return slots.button({
|
|
257
|
+
value,
|
|
258
|
+
dragging
|
|
259
|
+
});
|
|
260
|
+
}
|
|
261
|
+
return (0, import_vue.createVNode)("div", {
|
|
262
|
+
"class": bem("button"),
|
|
263
|
+
"style": (0, import_utils.getSizeStyle)(props.buttonSize)
|
|
264
|
+
}, null);
|
|
265
|
+
};
|
|
266
|
+
const renderButton = (index) => {
|
|
267
|
+
const current2 = typeof index === "number" ? props.modelValue[index] : props.modelValue;
|
|
268
|
+
return (0, import_vue.createVNode)("div", {
|
|
269
|
+
"ref": slider[index != null ? index : 0],
|
|
270
|
+
"role": "slider",
|
|
271
|
+
"class": getButtonClassName(index),
|
|
272
|
+
"tabindex": props.disabled ? void 0 : 0,
|
|
273
|
+
"aria-valuemin": props.min,
|
|
274
|
+
"aria-valuenow": current2,
|
|
275
|
+
"aria-valuemax": props.max,
|
|
276
|
+
"aria-disabled": props.disabled || void 0,
|
|
277
|
+
"aria-readonly": props.readonly || void 0,
|
|
278
|
+
"aria-orientation": props.vertical ? "vertical" : "horizontal",
|
|
279
|
+
"onTouchstartPassive": (event) => {
|
|
280
|
+
if (typeof index === "number") {
|
|
281
|
+
buttonIndex = index;
|
|
282
|
+
}
|
|
283
|
+
onTouchStart(event);
|
|
284
|
+
},
|
|
285
|
+
"onTouchend": onTouchEnd,
|
|
286
|
+
"onTouchcancel": onTouchEnd,
|
|
287
|
+
"onClick": import_utils.stopPropagation
|
|
288
|
+
}, [renderButtonContent(current2, index)]);
|
|
289
|
+
};
|
|
290
|
+
const renderTitle = () => {
|
|
291
|
+
if (!slots.title && !props.title)
|
|
292
|
+
return;
|
|
293
|
+
return (0, import_vue.createVNode)("div", {
|
|
294
|
+
"class": bem("title")
|
|
295
|
+
}, [slots.title ? slots.title() : props.title]);
|
|
296
|
+
};
|
|
297
|
+
const renderPercent = () => {
|
|
298
|
+
if (!props.showPercent)
|
|
299
|
+
return;
|
|
300
|
+
let percentText = "";
|
|
301
|
+
if (Array.isArray(props.modelValue)) {
|
|
302
|
+
percentText = props.modelValue.map((val) => `${val}%`).join(",");
|
|
303
|
+
} else {
|
|
304
|
+
percentText = `${props.modelValue}%`;
|
|
305
|
+
}
|
|
306
|
+
return (0, import_vue.createVNode)("div", {
|
|
307
|
+
"class": bem("percent")
|
|
308
|
+
}, [slots.percent ? slots.percent({
|
|
309
|
+
value: props.modelValue
|
|
310
|
+
}) : percentText]);
|
|
311
|
+
};
|
|
312
|
+
updateValue(props.modelValue);
|
|
313
|
+
(0, import_use.useCustomFieldValue)(() => props.modelValue);
|
|
314
|
+
slider.forEach((item) => {
|
|
315
|
+
(0, import_use.useEventListener)("touchmove", onTouchMove, {
|
|
316
|
+
target: item
|
|
317
|
+
});
|
|
318
|
+
});
|
|
319
|
+
const renderSliderContent = (sliderContent) => {
|
|
320
|
+
if (props.direction === "horizontal") {
|
|
321
|
+
return (0, import_vue.createVNode)(import_vue.Fragment, null, [renderTitle(), sliderContent, renderPercent()]);
|
|
322
|
+
} else {
|
|
323
|
+
return (0, import_vue.createVNode)(import_vue.Fragment, null, [(0, import_vue.createVNode)("div", {
|
|
324
|
+
"class": bem("direction-vertical-title")
|
|
325
|
+
}, [renderTitle(), renderPercent()]), sliderContent]);
|
|
326
|
+
}
|
|
327
|
+
};
|
|
328
|
+
const sliderStyle = (0, import_vue2.computed)(() => {
|
|
329
|
+
const direction = props.direction === "horizontal" ? "horizontal" : "vertical";
|
|
330
|
+
return {
|
|
331
|
+
vertical: props.vertical,
|
|
332
|
+
disabled: props.disabled,
|
|
333
|
+
[direction]: direction
|
|
334
|
+
};
|
|
335
|
+
});
|
|
336
|
+
const renderButtons = () => {
|
|
337
|
+
if (props.readonly) {
|
|
338
|
+
return;
|
|
339
|
+
}
|
|
340
|
+
return props.range ? [renderButton(0), renderButton(1)] : renderButton();
|
|
341
|
+
};
|
|
342
|
+
return () => (0, import_vue.createVNode)("div", {
|
|
343
|
+
"class": bem(sliderStyle.value)
|
|
344
|
+
}, [renderSliderContent((0, import_vue.createVNode)("div", {
|
|
345
|
+
"ref": root,
|
|
346
|
+
"class": bem("bar-wrapper"),
|
|
347
|
+
"style": wrapperStyle.value,
|
|
348
|
+
"onClick": onClick
|
|
349
|
+
}, [(0, import_vue.createVNode)("div", {
|
|
350
|
+
"class": bem("bar"),
|
|
351
|
+
"style": barStyle.value
|
|
352
|
+
}, [renderButtons()])]))]);
|
|
353
|
+
}
|
|
354
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root,:host{--zt-slider-active-background: linear-gradient(90deg, var(--zt-primary-color-light) 0%, var(--zt-primary-color) 100%);--zt-slider-inactive-background: var(--zt-gray-a04);--zt-slider-disabled-opacity: var(--zt-disabled-opacity);--zt-slider-bar-height: var(--zt-line-height-xs);--zt-slider-button-width: var(--zt-font-size-lg);--zt-slider-button-height: var(--zt-font-size-lg);--zt-slider-button-radius: 50%;--zt-slider-vertical-gap: 4px;--zt-slider-horizontal-gap: 12px;--zt-slider-button-background: linear-gradient(180deg, rgb(var(--zt-primary-color-r), calc(var(--zt-primary-color-g) + 50), var(--zt-primary-color-b)) 0%, var(--zt-primary-color) 100%);--zt-slider-button-shadow: 0 2px 4px 0 var(--zt-primary-color-a2);--zt-slider-button-border-color: var(--zt-white)}:root[zt-theme-size=large],:host[zt-theme-size=large]{--zt-slider-horizontal-gap: 16px}.zt-theme-dark{--zt-slider-inactive-background: var(--zt-background-3)}.zt-slider__bar-wrapper{position:relative;width:100%;height:var(--zt-slider-bar-height);background:var(--zt-slider-inactive-background);border-radius:var(--zt-radius-max);cursor:pointer}.zt-slider__bar-wrapper:before{position:absolute;top:calc(var(--zt-padding-xs) * -1);right:0;bottom:calc(var(--zt-padding-xs) * -1);left:0;content:""}.zt-slider__bar-wrapper .zt-slider__bar{position:absolute;width:100%;height:100%;background:var(--zt-slider-active-background);border-radius:inherit;transition:all var(--zt-duration-fast)}.zt-slider__button{width:var(--zt-slider-button-width);height:var(--zt-slider-button-height);background:var(--zt-slider-button-background);border-radius:var(--zt-slider-button-radius);box-shadow:var(--zt-slider-button-shadow);border:1px solid var(--zt-slider-button-border-color)}.zt-slider__button-wrapper{position:absolute;cursor:-webkit-grab;cursor:grab;top:50%}.zt-slider__button-wrapper--right{right:0;transform:translate3d(50%,-50%,0)}.zt-slider__button-wrapper--left{left:0;transform:translate3d(-50%,-50%,0)}.zt-slider--disabled{cursor:not-allowed;opacity:var(--zt-slider-disabled-opacity)}.zt-slider--disabled .zt-slider__button-wrapper{cursor:not-allowed}.zt-slider--horizontal{display:flex;align-items:center;gap:var(--zt-slider-horizontal-gap)}.zt-slider--horizontal .zt-slider__title,.zt-slider--horizontal .zt-slider__percent{font-size:var(--zt-font-size-md);color:var(--zt-text-color);line-height:var(--zt-line-height-md);word-break:break-all}.zt-slider--horizontal .zt-slider__title{font-weight:600;max-width:50%}.zt-slider--horizontal .zt-slider__percent{font-weight:400;max-width:20%;min-width:2em;text-align:right}.zt-slider--vertical{width:100%;display:flex;flex-direction:column;gap:var(--zt-slider-vertical-gap)}.zt-slider--vertical .zt-slider__title,.zt-slider--vertical .zt-slider__percent{opacity:.8;font-weight:400;font-size:var(--zt-font-size-sm);color:var(--zt-text-color);line-height:var(--zt-line-height-sm);word-break:break-all}.zt-slider--vertical .zt-slider__title{min-width:0;flex:1}.zt-slider--vertical .zt-slider__percent{max-width:50%}.zt-slider__title,.zt-slider__percent{flex-shrink:0}.zt-slider__direction-vertical-title{display:flex;justify-content:space-between;align-items:center;gap:var(--zt-slider-vertical-gap)}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
export declare const Slider: import("../utils").WithInstall<import("vue").DefineComponent<{
|
|
2
|
+
min: {
|
|
3
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
4
|
+
default: number;
|
|
5
|
+
};
|
|
6
|
+
max: {
|
|
7
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
8
|
+
default: number;
|
|
9
|
+
};
|
|
10
|
+
step: {
|
|
11
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
12
|
+
default: number;
|
|
13
|
+
};
|
|
14
|
+
range: BooleanConstructor;
|
|
15
|
+
reverse: BooleanConstructor;
|
|
16
|
+
disabled: BooleanConstructor;
|
|
17
|
+
readonly: {
|
|
18
|
+
type: BooleanConstructor;
|
|
19
|
+
default: true;
|
|
20
|
+
};
|
|
21
|
+
vertical: BooleanConstructor;
|
|
22
|
+
barHeight: (NumberConstructor | StringConstructor)[];
|
|
23
|
+
buttonSize: (NumberConstructor | StringConstructor)[];
|
|
24
|
+
activeColor: StringConstructor;
|
|
25
|
+
inactiveColor: StringConstructor;
|
|
26
|
+
modelValue: {
|
|
27
|
+
type: import("vue").PropType<number | [number, number]>;
|
|
28
|
+
default: number;
|
|
29
|
+
};
|
|
30
|
+
title: StringConstructor;
|
|
31
|
+
direction: {
|
|
32
|
+
type: import("vue").PropType<import("./Slider").SliderDirection>;
|
|
33
|
+
default: import("./Slider").SliderDirection;
|
|
34
|
+
};
|
|
35
|
+
showPercent: {
|
|
36
|
+
type: BooleanConstructor;
|
|
37
|
+
default: true;
|
|
38
|
+
};
|
|
39
|
+
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "dragStart" | "dragEnd")[], "update:modelValue" | "change" | "dragStart" | "dragEnd", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
40
|
+
min: {
|
|
41
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
42
|
+
default: number;
|
|
43
|
+
};
|
|
44
|
+
max: {
|
|
45
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
46
|
+
default: number;
|
|
47
|
+
};
|
|
48
|
+
step: {
|
|
49
|
+
type: (NumberConstructor | StringConstructor)[];
|
|
50
|
+
default: number;
|
|
51
|
+
};
|
|
52
|
+
range: BooleanConstructor;
|
|
53
|
+
reverse: BooleanConstructor;
|
|
54
|
+
disabled: BooleanConstructor;
|
|
55
|
+
readonly: {
|
|
56
|
+
type: BooleanConstructor;
|
|
57
|
+
default: true;
|
|
58
|
+
};
|
|
59
|
+
vertical: BooleanConstructor;
|
|
60
|
+
barHeight: (NumberConstructor | StringConstructor)[];
|
|
61
|
+
buttonSize: (NumberConstructor | StringConstructor)[];
|
|
62
|
+
activeColor: StringConstructor;
|
|
63
|
+
inactiveColor: StringConstructor;
|
|
64
|
+
modelValue: {
|
|
65
|
+
type: import("vue").PropType<number | [number, number]>;
|
|
66
|
+
default: number;
|
|
67
|
+
};
|
|
68
|
+
title: StringConstructor;
|
|
69
|
+
direction: {
|
|
70
|
+
type: import("vue").PropType<import("./Slider").SliderDirection>;
|
|
71
|
+
default: import("./Slider").SliderDirection;
|
|
72
|
+
};
|
|
73
|
+
showPercent: {
|
|
74
|
+
type: BooleanConstructor;
|
|
75
|
+
default: true;
|
|
76
|
+
};
|
|
77
|
+
}>> & {
|
|
78
|
+
onChange?: ((...args: any[]) => any) | undefined;
|
|
79
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
80
|
+
onDragStart?: ((...args: any[]) => any) | undefined;
|
|
81
|
+
onDragEnd?: ((...args: any[]) => any) | undefined;
|
|
82
|
+
}, {
|
|
83
|
+
reverse: boolean;
|
|
84
|
+
range: boolean;
|
|
85
|
+
max: string | number;
|
|
86
|
+
disabled: boolean;
|
|
87
|
+
vertical: boolean;
|
|
88
|
+
direction: import("./Slider").SliderDirection;
|
|
89
|
+
modelValue: number | [number, number];
|
|
90
|
+
readonly: boolean;
|
|
91
|
+
step: string | number;
|
|
92
|
+
min: string | number;
|
|
93
|
+
showPercent: boolean;
|
|
94
|
+
}, {}>>;
|
|
95
|
+
export default Slider;
|
|
96
|
+
export { sliderProps } from './Slider';
|
|
97
|
+
export type { SliderProps, SliderDirection } from './Slider';
|
|
98
|
+
export type { SliderThemeVars } from './types';
|
|
99
|
+
declare module 'vue' {
|
|
100
|
+
interface GlobalComponents {
|
|
101
|
+
ZtSlider: typeof Slider;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
var stdin_exports = {};
|
|
29
|
+
__export(stdin_exports, {
|
|
30
|
+
Slider: () => Slider,
|
|
31
|
+
default: () => stdin_default,
|
|
32
|
+
sliderProps: () => import_Slider2.sliderProps
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(stdin_exports);
|
|
35
|
+
var import_utils = require("../utils");
|
|
36
|
+
var import_Slider = __toESM(require("./Slider"));
|
|
37
|
+
var import_Slider2 = require("./Slider");
|
|
38
|
+
const Slider = (0, import_utils.withInstall)(import_Slider.default);
|
|
39
|
+
var stdin_default = Slider;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export type SliderThemeVars = {
|
|
2
|
+
sliderActiveBackground?: string;
|
|
3
|
+
sliderInactiveBackground?: string;
|
|
4
|
+
sliderDisabledOpacity?: number | string;
|
|
5
|
+
sliderBarHeight?: string;
|
|
6
|
+
sliderButtonWidth?: string;
|
|
7
|
+
sliderButtonHeight?: string;
|
|
8
|
+
sliderButtonRadius?: string;
|
|
9
|
+
sliderButtonBackground?: string;
|
|
10
|
+
sliderButtonShadow?: string;
|
|
11
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __copyProps = (to, from, except, desc) => {
|
|
6
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
7
|
+
for (let key of __getOwnPropNames(from))
|
|
8
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
9
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
10
|
+
}
|
|
11
|
+
return to;
|
|
12
|
+
};
|
|
13
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
14
|
+
var stdin_exports = {};
|
|
15
|
+
module.exports = __toCommonJS(stdin_exports);
|
package/lib/style/base.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--zt-green-r: 40;--zt-green-g: 205;--zt-green-b: 120;--zt-green-rgb: var(--zt-green-r), var(--zt-green-g), var(--zt-green-b);--zt-orange-r: 255;--zt-orange-g: 150;--zt-orange-b: 35;--zt-orange-rgb: var(--zt-orange-r), var(--zt-orange-g), var(--zt-orange-b);--zt-yellow-r: 255;--zt-yellow-g: 205;--zt-yellow-b: 35;--zt-yellow-rgb: var(--zt-yellow-r), var(--zt-yellow-g), var(--zt-yellow-b);--zt-blue-r: 0;--zt-blue-g: 145;--zt-blue-b: 250;--zt-blue-rgb: var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b);--zt-gray-r: 45;--zt-gray-g: 75;--zt-gray-b: 115;--zt-gray-rgb: var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b);--zt-red-r: 255;--zt-red-g: 80;--zt-red-b: 35;--zt-red-rgb: var(--zt-red-r), var(--zt-red-g), var(--zt-red-b);--zt-primary-color-r: 0;--zt-primary-color-g: 145;--zt-primary-color-b: 250;--zt-primary-color-rgb: var(--zt-primary-color-r), var(--zt-primary-color-g), var(--zt-primary-color-b);--zt-black: #000;--zt-white: #fff;--zt-gray: rgb(var(--zt-gray-rgb));--zt-gray-3: #ebedf0;--zt-gray-4: #dcdee0;--zt-gray-5: #c8c9cc;--zt-gray-6: #969799;--zt-gray-7: #646566;--zt-gray-8: #323233;--zt-gray-a04: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .04);--zt-gray-a06: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .06);--zt-gray-a08: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .08);--zt-gray-a1: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .1);--zt-gray-a2: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .2);--zt-gray-a4: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .4);--zt-gray-a6: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .6);--zt-gray-a8: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .8);--zt-red: rgb(var(--zt-red-rgb));--zt-blue: rgb(var(--zt-blue-rgb));--zt-orange: rgb(var(--zt-orange-rgb));--zt-green: rgb(var(--zt-green-rgb));--zt-yellow: rgb(var(--zt-yellow-rgb));--zt-text-color-rgb: var(--zt-gray-rgb);--zt-primary-color: rgb(var(--zt-primary-color-rgb));--zt-primary-color-light: rgb(var(--zt-primary-color-r), calc(var(--zt-primary-color-g) + 30), var(--zt-primary-color-b));--zt-primary-color-a1: rgba(var(--zt-primary-color-rgb), .1);--zt-primary-color-a2: rgba(var(--zt-primary-color-rgb), .2);--zt-primary-color-a6: rgba(var(--zt-primary-color-rgb), .6);--zt-success-color: var(--zt-green);--zt-danger-color: var(--zt-red);--zt-warning-color: var(--zt-orange);--zt-text-color: var(--zt-gray);--zt-text-color-2: var(--zt-gray-6);--zt-text-color-3: var(--zt-gray-5);--zt-placeholder-color: var(--zt-gray-a2);--zt-active-color: var(--zt-gray-a2);--zt-active-opacity: .6;--zt-disabled-opacity: .4;--zt-background: #f5faff;--zt-background-2: #edf3fa;--zt-background-popup: var(--zt-white);--zt-background-card: var(--zt-white);--zt-padding-xxs: 2px;--zt-padding-base: 4px;--zt-padding-xs: 8px;--zt-padding-sm: 12px;--zt-padding-md: 16px;--zt-padding-lg: 24px;--zt-padding-xl: 32px;--zt-font-bold: 600;--zt-font-size-xs: 10px;--zt-font-size-sm: 12px;--zt-font-size-md: 14px;--zt-font-size-lg: 16px;--zt-font-size-xl: 18px;--zt-font-size-xxl: 20px;--zt-font-size-xxxl: 22px;--zt-line-height-xs: calc(2 * var(--zt-font-size-xs) - 8px);--zt-line-height-sm: calc(2 * var(--zt-font-size-sm) - 8px);--zt-line-height-md: calc(2 * var(--zt-font-size-md) - 8px);--zt-line-height-lg: calc(2 * var(--zt-font-size-lg) - 8px);--zt-line-height-xl: calc(2 * var(--zt-font-size-xl) - 8px);--zt-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--zt-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--zt-duration-base: .3s;--zt-duration-fast: .2s;--zt-ease-out: ease-out;--zt-ease-in: ease-in;--zt-border-color: var(--zt-gray-a1);--zt-border-width: 1px;--zt-radius-sm: 2px;--zt-radius-md: 4px;--zt-radius-lg: 8px;--zt-radius-gt: 16px;--zt-radius-max: 999px}:root[zt-theme-size=large]{--zt-font-size-sm: 18px;--zt-font-size-md: 20px;--zt-font-size-lg: 22px;--zt-font-size-xl: 24px;--zt-font-size-xxl: 26px;--zt-font-size-xxxl: 28px}.zt-theme-dark{--zt-gray-r: 255;--zt-gray-g: 255;--zt-gray-b: 255;--zt-text-color-2: #707070;--zt-text-color-3: #4d4d4d;--zt-background: #0f1923;--zt-background-popup: #19232d;--zt-background-2: #19232d;--zt-background-card: var(--zt-gray-a04)}html{-webkit-tap-highlight-color:transparent}:root{margin:0;font-family:var(--zt-base-font)}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=zt-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes zt-slide-up-enter{0%{transform:translate3d(0,100%,0)}}@keyframes zt-slide-up-leave{to{transform:translate3d(0,100%,0)}}@keyframes zt-slide-down-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes zt-slide-down-leave{to{transform:translate3d(0,-100%,0)}}@keyframes zt-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes zt-slide-left-leave{to{transform:translate3d(-100%,0,0)}}@keyframes zt-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes zt-slide-right-leave{to{transform:translate3d(100%,0,0)}}@keyframes zt-fade-in{0%{opacity:0}to{opacity:1}}@keyframes zt-fade-out{0%{opacity:1}to{opacity:0}}@keyframes zt-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.zt-fade-enter-active{animation:var(--zt-duration-base) zt-fade-in both var(--zt-ease-out)}.zt-fade-leave-active{animation:var(--zt-duration-base) zt-fade-out both var(--zt-ease-in)}.zt-slide-up-enter-active{animation:zt-slide-up-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-up-leave-active{animation:zt-slide-up-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-down-enter-active{animation:zt-slide-down-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-down-leave-active{animation:zt-slide-down-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-left-enter-active{animation:zt-slide-left-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-left-leave-active{animation:zt-slide-left-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-right-enter-active{animation:zt-slide-right-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-right-leave-active{animation:zt-slide-right-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-clearfix:after{display:table;clear:both;content:""}.zt-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.zt-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.zt-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.zt-safe-area-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.zt-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.zt-haptics-feedback{cursor:pointer}.zt-haptics-feedback:active{opacity:var(--zt-active-opacity)}[class*=zt-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-hairline,.zt-hairline--top,.zt-hairline--left,.zt-hairline--right,.zt-hairline--bottom,.zt-hairline--surround,.zt-hairline--top-bottom{position:relative}.zt-hairline--top:after{border-top-width:var(--zt-border-width)}.zt-hairline--left:after{border-left-width:var(--zt-border-width)}.zt-hairline--right:after{border-right-width:var(--zt-border-width)}.zt-hairline--bottom:after{border-bottom-width:var(--zt-border-width)}.zt-hairline--top-bottom:after,.zt-hairline-unset--top-bottom:after{border-width:var(--zt-border-width) 0}.zt-hairline--surround:after{border-width:var(--zt-border-width)}
|
|
1
|
+
:root{--zt-green-r: 40;--zt-green-g: 205;--zt-green-b: 120;--zt-green-rgb: var(--zt-green-r), var(--zt-green-g), var(--zt-green-b);--zt-orange-r: 255;--zt-orange-g: 150;--zt-orange-b: 35;--zt-orange-rgb: var(--zt-orange-r), var(--zt-orange-g), var(--zt-orange-b);--zt-yellow-r: 255;--zt-yellow-g: 205;--zt-yellow-b: 35;--zt-yellow-rgb: var(--zt-yellow-r), var(--zt-yellow-g), var(--zt-yellow-b);--zt-blue-r: 0;--zt-blue-g: 145;--zt-blue-b: 250;--zt-blue-rgb: var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b);--zt-gray-r: 45;--zt-gray-g: 75;--zt-gray-b: 115;--zt-gray-rgb: var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b);--zt-red-r: 255;--zt-red-g: 80;--zt-red-b: 35;--zt-red-rgb: var(--zt-red-r), var(--zt-red-g), var(--zt-red-b);--zt-primary-color-r: 0;--zt-primary-color-g: 145;--zt-primary-color-b: 250;--zt-primary-color-rgb: var(--zt-primary-color-r), var(--zt-primary-color-g), var(--zt-primary-color-b);--zt-black: #000;--zt-white: #fff;--zt-gray: rgb(var(--zt-gray-rgb));--zt-gray-3: #ebedf0;--zt-gray-4: #dcdee0;--zt-gray-5: #c8c9cc;--zt-gray-6: #969799;--zt-gray-7: #646566;--zt-gray-8: #323233;--zt-gray-a04: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .04);--zt-gray-a06: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .06);--zt-gray-a08: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .08);--zt-gray-a1: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .1);--zt-gray-a2: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .2);--zt-gray-a4: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .4);--zt-gray-a6: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .6);--zt-gray-a8: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .8);--zt-red: rgb(var(--zt-red-rgb));--zt-blue: rgb(var(--zt-blue-rgb));--zt-blue-a6: rgb(var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b), .6);--zt-orange: rgb(var(--zt-orange-rgb));--zt-green: rgb(var(--zt-green-rgb));--zt-yellow: rgb(var(--zt-yellow-rgb));--zt-text-color-rgb: var(--zt-gray-rgb);--zt-primary-color: rgb(var(--zt-primary-color-rgb));--zt-primary-color-light: rgb(var(--zt-primary-color-r), calc(var(--zt-primary-color-g) + 30), var(--zt-primary-color-b));--zt-primary-color-a1: rgba(var(--zt-primary-color-rgb), .1);--zt-primary-color-a2: rgba(var(--zt-primary-color-rgb), .2);--zt-primary-color-a6: rgba(var(--zt-primary-color-rgb), .6);--zt-success-color: var(--zt-green);--zt-danger-color: var(--zt-red);--zt-warning-color: var(--zt-orange);--zt-text-color: var(--zt-gray);--zt-text-color-2: var(--zt-gray-6);--zt-text-color-3: var(--zt-gray-5);--zt-placeholder-color: var(--zt-gray-a2);--zt-active-color: var(--zt-gray-a2);--zt-active-opacity: .6;--zt-disabled-opacity: .4;--zt-background: #f5faff;--zt-background-2: #edf3fa;--zt-background-popup: var(--zt-white);--zt-background-card: var(--zt-white);--zt-padding-xxs: 2px;--zt-padding-base: 4px;--zt-padding-xs: 8px;--zt-padding-sm: 12px;--zt-padding-md: 16px;--zt-padding-lg: 24px;--zt-padding-xl: 32px;--zt-font-bold: 600;--zt-font-size-xs: 10px;--zt-font-size-sm: 12px;--zt-font-size-md: 14px;--zt-font-size-lg: 16px;--zt-font-size-xl: 18px;--zt-font-size-xxl: 20px;--zt-font-size-xxxl: 22px;--zt-line-height-xs: calc(2 * var(--zt-font-size-xs) - 8px);--zt-line-height-sm: calc(2 * var(--zt-font-size-sm) - 8px);--zt-line-height-md: calc(2 * var(--zt-font-size-md) - 8px);--zt-line-height-lg: calc(2 * var(--zt-font-size-lg) - 8px);--zt-line-height-xl: calc(2 * var(--zt-font-size-xl) - 8px);--zt-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--zt-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--zt-duration-base: .3s;--zt-duration-fast: .2s;--zt-ease-out: ease-out;--zt-ease-in: ease-in;--zt-border-color: var(--zt-gray-a1);--zt-border-width: 1px;--zt-radius-sm: 2px;--zt-radius-md: 4px;--zt-radius-lg: 8px;--zt-radius-gt: 16px;--zt-radius-max: 999px}:root[zt-theme-size=large]{--zt-font-size-sm: 18px;--zt-font-size-md: 20px;--zt-font-size-lg: 22px;--zt-font-size-xl: 24px;--zt-font-size-xxl: 26px;--zt-font-size-xxxl: 28px}.zt-theme-dark{--zt-gray-r: 255;--zt-gray-g: 255;--zt-gray-b: 255;--zt-text-color-2: #707070;--zt-text-color-3: #4d4d4d;--zt-background: #0f1923;--zt-background-popup: #19232d;--zt-background-2: #19232d;--zt-background-card: var(--zt-gray-a04)}html{-webkit-tap-highlight-color:transparent}:root{margin:0;font-family:var(--zt-base-font)}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=zt-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes zt-slide-up-enter{0%{transform:translate3d(0,100%,0)}}@keyframes zt-slide-up-leave{to{transform:translate3d(0,100%,0)}}@keyframes zt-slide-down-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes zt-slide-down-leave{to{transform:translate3d(0,-100%,0)}}@keyframes zt-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes zt-slide-left-leave{to{transform:translate3d(-100%,0,0)}}@keyframes zt-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes zt-slide-right-leave{to{transform:translate3d(100%,0,0)}}@keyframes zt-fade-in{0%{opacity:0}to{opacity:1}}@keyframes zt-fade-out{0%{opacity:1}to{opacity:0}}@keyframes zt-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.zt-fade-enter-active{animation:var(--zt-duration-base) zt-fade-in both var(--zt-ease-out)}.zt-fade-leave-active{animation:var(--zt-duration-base) zt-fade-out both var(--zt-ease-in)}.zt-slide-up-enter-active{animation:zt-slide-up-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-up-leave-active{animation:zt-slide-up-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-down-enter-active{animation:zt-slide-down-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-down-leave-active{animation:zt-slide-down-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-left-enter-active{animation:zt-slide-left-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-left-leave-active{animation:zt-slide-left-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-slide-right-enter-active{animation:zt-slide-right-enter var(--zt-duration-base) both var(--zt-ease-out)}.zt-slide-right-leave-active{animation:zt-slide-right-leave var(--zt-duration-base) both var(--zt-ease-in)}.zt-clearfix:after{display:table;clear:both;content:""}.zt-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.zt-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.zt-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.zt-safe-area-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.zt-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.zt-haptics-feedback{cursor:pointer}.zt-haptics-feedback:active{opacity:var(--zt-active-opacity)}[class*=zt-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-hairline,.zt-hairline--top,.zt-hairline--left,.zt-hairline--right,.zt-hairline--bottom,.zt-hairline--surround,.zt-hairline--top-bottom{position:relative}.zt-hairline--top:after{border-top-width:var(--zt-border-width)}.zt-hairline--left:after{border-left-width:var(--zt-border-width)}.zt-hairline--right:after{border-right-width:var(--zt-border-width)}.zt-hairline--bottom:after{border-bottom-width:var(--zt-border-width)}.zt-hairline--top-bottom:after,.zt-hairline-unset--top-bottom:after{border-width:var(--zt-border-width) 0}.zt-hairline--surround:after{border-width:var(--zt-border-width)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--zt-green-r: 40;--zt-green-g: 205;--zt-green-b: 120;--zt-green-rgb: var(--zt-green-r), var(--zt-green-g), var(--zt-green-b);--zt-orange-r: 255;--zt-orange-g: 150;--zt-orange-b: 35;--zt-orange-rgb: var(--zt-orange-r), var(--zt-orange-g), var(--zt-orange-b);--zt-yellow-r: 255;--zt-yellow-g: 205;--zt-yellow-b: 35;--zt-yellow-rgb: var(--zt-yellow-r), var(--zt-yellow-g), var(--zt-yellow-b);--zt-blue-r: 0;--zt-blue-g: 145;--zt-blue-b: 250;--zt-blue-rgb: var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b);--zt-gray-r: 45;--zt-gray-g: 75;--zt-gray-b: 115;--zt-gray-rgb: var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b);--zt-red-r: 255;--zt-red-g: 80;--zt-red-b: 35;--zt-red-rgb: var(--zt-red-r), var(--zt-red-g), var(--zt-red-b);--zt-primary-color-r: 0;--zt-primary-color-g: 145;--zt-primary-color-b: 250;--zt-primary-color-rgb: var(--zt-primary-color-r), var(--zt-primary-color-g), var(--zt-primary-color-b);--zt-black: #000;--zt-white: #fff;--zt-gray: rgb(var(--zt-gray-rgb));--zt-gray-3: #ebedf0;--zt-gray-4: #dcdee0;--zt-gray-5: #c8c9cc;--zt-gray-6: #969799;--zt-gray-7: #646566;--zt-gray-8: #323233;--zt-gray-a04: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .04);--zt-gray-a06: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .06);--zt-gray-a08: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .08);--zt-gray-a1: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .1);--zt-gray-a2: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .2);--zt-gray-a4: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .4);--zt-gray-a6: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .6);--zt-gray-a8: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .8);--zt-red: rgb(var(--zt-red-rgb));--zt-blue: rgb(var(--zt-blue-rgb));--zt-orange: rgb(var(--zt-orange-rgb));--zt-green: rgb(var(--zt-green-rgb));--zt-yellow: rgb(var(--zt-yellow-rgb));--zt-text-color-rgb: var(--zt-gray-rgb);--zt-primary-color: rgb(var(--zt-primary-color-rgb));--zt-primary-color-light: rgb(var(--zt-primary-color-r), calc(var(--zt-primary-color-g) + 30), var(--zt-primary-color-b));--zt-primary-color-a1: rgba(var(--zt-primary-color-rgb), .1);--zt-primary-color-a2: rgba(var(--zt-primary-color-rgb), .2);--zt-primary-color-a6: rgba(var(--zt-primary-color-rgb), .6);--zt-success-color: var(--zt-green);--zt-danger-color: var(--zt-red);--zt-warning-color: var(--zt-orange);--zt-text-color: var(--zt-gray);--zt-text-color-2: var(--zt-gray-6);--zt-text-color-3: var(--zt-gray-5);--zt-placeholder-color: var(--zt-gray-a2);--zt-active-color: var(--zt-gray-a2);--zt-active-opacity: .6;--zt-disabled-opacity: .4;--zt-background: #f5faff;--zt-background-2: #edf3fa;--zt-background-popup: var(--zt-white);--zt-background-card: var(--zt-white);--zt-padding-xxs: 2px;--zt-padding-base: 4px;--zt-padding-xs: 8px;--zt-padding-sm: 12px;--zt-padding-md: 16px;--zt-padding-lg: 24px;--zt-padding-xl: 32px;--zt-font-bold: 600;--zt-font-size-xs: 10px;--zt-font-size-sm: 12px;--zt-font-size-md: 14px;--zt-font-size-lg: 16px;--zt-font-size-xl: 18px;--zt-font-size-xxl: 20px;--zt-font-size-xxxl: 22px;--zt-line-height-xs: calc(2 * var(--zt-font-size-xs) - 8px);--zt-line-height-sm: calc(2 * var(--zt-font-size-sm) - 8px);--zt-line-height-md: calc(2 * var(--zt-font-size-md) - 8px);--zt-line-height-lg: calc(2 * var(--zt-font-size-lg) - 8px);--zt-line-height-xl: calc(2 * var(--zt-font-size-xl) - 8px);--zt-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--zt-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--zt-duration-base: .3s;--zt-duration-fast: .2s;--zt-ease-out: ease-out;--zt-ease-in: ease-in;--zt-border-color: var(--zt-gray-a1);--zt-border-width: 1px;--zt-radius-sm: 2px;--zt-radius-md: 4px;--zt-radius-lg: 8px;--zt-radius-gt: 16px;--zt-radius-max: 999px}:root[zt-theme-size=large]{--zt-font-size-sm: 18px;--zt-font-size-md: 20px;--zt-font-size-lg: 22px;--zt-font-size-xl: 24px;--zt-font-size-xxl: 26px;--zt-font-size-xxxl: 28px}.zt-theme-dark{--zt-gray-r: 255;--zt-gray-g: 255;--zt-gray-b: 255;--zt-text-color-2: #707070;--zt-text-color-3: #4d4d4d;--zt-background: #0f1923;--zt-background-popup: #19232d;--zt-background-2: #19232d;--zt-background-card: var(--zt-gray-a04)}
|
|
1
|
+
:root{--zt-green-r: 40;--zt-green-g: 205;--zt-green-b: 120;--zt-green-rgb: var(--zt-green-r), var(--zt-green-g), var(--zt-green-b);--zt-orange-r: 255;--zt-orange-g: 150;--zt-orange-b: 35;--zt-orange-rgb: var(--zt-orange-r), var(--zt-orange-g), var(--zt-orange-b);--zt-yellow-r: 255;--zt-yellow-g: 205;--zt-yellow-b: 35;--zt-yellow-rgb: var(--zt-yellow-r), var(--zt-yellow-g), var(--zt-yellow-b);--zt-blue-r: 0;--zt-blue-g: 145;--zt-blue-b: 250;--zt-blue-rgb: var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b);--zt-gray-r: 45;--zt-gray-g: 75;--zt-gray-b: 115;--zt-gray-rgb: var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b);--zt-red-r: 255;--zt-red-g: 80;--zt-red-b: 35;--zt-red-rgb: var(--zt-red-r), var(--zt-red-g), var(--zt-red-b);--zt-primary-color-r: 0;--zt-primary-color-g: 145;--zt-primary-color-b: 250;--zt-primary-color-rgb: var(--zt-primary-color-r), var(--zt-primary-color-g), var(--zt-primary-color-b);--zt-black: #000;--zt-white: #fff;--zt-gray: rgb(var(--zt-gray-rgb));--zt-gray-3: #ebedf0;--zt-gray-4: #dcdee0;--zt-gray-5: #c8c9cc;--zt-gray-6: #969799;--zt-gray-7: #646566;--zt-gray-8: #323233;--zt-gray-a04: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .04);--zt-gray-a06: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .06);--zt-gray-a08: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .08);--zt-gray-a1: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .1);--zt-gray-a2: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .2);--zt-gray-a4: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .4);--zt-gray-a6: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .6);--zt-gray-a8: rgb(var(--zt-gray-r), var(--zt-gray-g), var(--zt-gray-b), .8);--zt-red: rgb(var(--zt-red-rgb));--zt-blue: rgb(var(--zt-blue-rgb));--zt-blue-a6: rgb(var(--zt-blue-r), var(--zt-blue-g), var(--zt-blue-b), .6);--zt-orange: rgb(var(--zt-orange-rgb));--zt-green: rgb(var(--zt-green-rgb));--zt-yellow: rgb(var(--zt-yellow-rgb));--zt-text-color-rgb: var(--zt-gray-rgb);--zt-primary-color: rgb(var(--zt-primary-color-rgb));--zt-primary-color-light: rgb(var(--zt-primary-color-r), calc(var(--zt-primary-color-g) + 30), var(--zt-primary-color-b));--zt-primary-color-a1: rgba(var(--zt-primary-color-rgb), .1);--zt-primary-color-a2: rgba(var(--zt-primary-color-rgb), .2);--zt-primary-color-a6: rgba(var(--zt-primary-color-rgb), .6);--zt-success-color: var(--zt-green);--zt-danger-color: var(--zt-red);--zt-warning-color: var(--zt-orange);--zt-text-color: var(--zt-gray);--zt-text-color-2: var(--zt-gray-6);--zt-text-color-3: var(--zt-gray-5);--zt-placeholder-color: var(--zt-gray-a2);--zt-active-color: var(--zt-gray-a2);--zt-active-opacity: .6;--zt-disabled-opacity: .4;--zt-background: #f5faff;--zt-background-2: #edf3fa;--zt-background-popup: var(--zt-white);--zt-background-card: var(--zt-white);--zt-padding-xxs: 2px;--zt-padding-base: 4px;--zt-padding-xs: 8px;--zt-padding-sm: 12px;--zt-padding-md: 16px;--zt-padding-lg: 24px;--zt-padding-xl: 32px;--zt-font-bold: 600;--zt-font-size-xs: 10px;--zt-font-size-sm: 12px;--zt-font-size-md: 14px;--zt-font-size-lg: 16px;--zt-font-size-xl: 18px;--zt-font-size-xxl: 20px;--zt-font-size-xxxl: 22px;--zt-line-height-xs: calc(2 * var(--zt-font-size-xs) - 8px);--zt-line-height-sm: calc(2 * var(--zt-font-size-sm) - 8px);--zt-line-height-md: calc(2 * var(--zt-font-size-md) - 8px);--zt-line-height-lg: calc(2 * var(--zt-font-size-lg) - 8px);--zt-line-height-xl: calc(2 * var(--zt-font-size-xl) - 8px);--zt-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--zt-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--zt-duration-base: .3s;--zt-duration-fast: .2s;--zt-ease-out: ease-out;--zt-ease-in: ease-in;--zt-border-color: var(--zt-gray-a1);--zt-border-width: 1px;--zt-radius-sm: 2px;--zt-radius-md: 4px;--zt-radius-lg: 8px;--zt-radius-gt: 16px;--zt-radius-max: 999px}:root[zt-theme-size=large]{--zt-font-size-sm: 18px;--zt-font-size-md: 20px;--zt-font-size-lg: 22px;--zt-font-size-xl: 24px;--zt-font-size-xxl: 26px;--zt-font-size-xxxl: 28px}.zt-theme-dark{--zt-gray-r: 255;--zt-gray-g: 255;--zt-gray-b: 255;--zt-text-color-2: #707070;--zt-text-color-3: #4d4d4d;--zt-background: #0f1923;--zt-background-popup: #19232d;--zt-background-2: #19232d;--zt-background-card: var(--zt-gray-a04)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--zt-tabbar-item-text-color: var(--zt-gray-a6);--zt-tabbar-item-active-color: var(--zt-primary-color);--zt-tabbar-item-margin: 8px auto 6px;--zt-tabbar-item-icon-box-shadow: -4px -4px 8px 0 #ffffff, 4px 4px 8px 0 rgba(45, 75, 115, .1);--zt-tabbar-item-box-width: 36px;--zt-tabbar-item-box-height: 36px;--zt-tabbar-item-box-border-radius: var(--zt-radius-lg);--zt-tabbar-item-icon-border: 0;--zt-tabbar-item-text-padding-top: 4px;--zt-tabbar-item-text-height: 12px;--zt-tabbar-item-icon-background: linear-gradient(135deg, #f0f0f0 0%, #ffffff 100%);--zt-tabbar-item-icon-active-background: var(--zt-gray-a04);--zt-tabbar-item-icon-active-box-shadow: inset 4px 4px 8px 0 var(--zt-gray-a2);--zt-tabbar-item-icon-font-size: 24px}:root[zt-theme-size=large]{--zt-tabbar-item-icon-font-size: 30px}.zt-tabbar-item{color:var(--zt-tabbar-item-text-color);margin:var(--zt-tabbar-item-margin);-webkit-text-size-adjust:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.zt-tabbar-item__icon{font-size:var(--zt-tabbar-item-icon-font-size);border:var(--zt-tabbar-item-icon-border);display:flex;justify-content:center;align-items:center;width:var(--zt-tabbar-item-box-width);height:var(--zt-tabbar-item-box-height);box-shadow:var(--zt-tabbar-item-icon-box-shadow);background:var(--zt-tabbar-item-icon-background);border-radius:var(--zt-tabbar-item-box-border-radius);box-sizing:border-box}.zt-tabbar-item__icon:active{background:var(--zt-tabbar-item-icon-active-background);box-shadow:var(--zt-tabbar-item-icon-active-box-shadow)}.zt-tabbar-item__text{font-size:var(--zt-font-size-sm);padding-top:var(--zt-tabbar-item-text-padding-top);transform:scale(.83333);text-align:center;height:var(--zt-tabbar-item-text-height);line-height:var(--zt-tabbar-item-text-height)}.zt-tabbar-item--active{color:var(--zt-tabbar-item-active-color);font-weight:var(--zt-font-bold)}.zt-theme-dark{--zt-tabbar-item-text-color: var(--zt-gray);--zt-tabbar-item-icon-border: 1px solid rgba(151, 151, 151, .12);--zt-tabbar-item-icon-box-shadow: -4px -4px 8px 0 rgba(255, 255, 255, .12), 4px 4px 8px 0 rgba(0, 12, 24, .8);--zt-tabbar-item-icon-background: linear-gradient(135deg, #121d2a 0%, #1d2c3d 100%);--zt-tabbar-item-icon-active-box-shadow: inset 6px 6px 6px 0 #000d1b}
|
|
1
|
+
:root{--zt-tabbar-item-text-color: var(--zt-gray-a6);--zt-tabbar-item-active-color: var(--zt-primary-color);--zt-tabbar-item-margin: 8px auto 6px;--zt-tabbar-item-icon-box-shadow: -4px -4px 8px 0 #ffffff, 4px 4px 8px 0 rgba(45, 75, 115, .1);--zt-tabbar-item-box-width: 36px;--zt-tabbar-item-box-height: 36px;--zt-tabbar-item-box-border-radius: var(--zt-radius-lg);--zt-tabbar-item-icon-border: 0;--zt-tabbar-item-text-padding-top: 4px;--zt-tabbar-item-text-height: 12px;--zt-tabbar-item-icon-background: linear-gradient(135deg, #f0f0f0 0%, #ffffff 100%);--zt-tabbar-item-icon-active-background: var(--zt-gray-a04);--zt-tabbar-item-icon-active-box-shadow: inset 4px 4px 8px 0 var(--zt-gray-a2);--zt-tabbar-item-icon-font-size: 24px}:root[zt-theme-size=large]{--zt-tabbar-item-icon-font-size: 30px}.zt-tabbar-item{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;color:var(--zt-tabbar-item-text-color);margin:var(--zt-tabbar-item-margin);-webkit-text-size-adjust:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.zt-tabbar-item__icon{font-size:var(--zt-tabbar-item-icon-font-size);border:var(--zt-tabbar-item-icon-border);display:flex;justify-content:center;align-items:center;width:var(--zt-tabbar-item-box-width);height:var(--zt-tabbar-item-box-height);box-shadow:var(--zt-tabbar-item-icon-box-shadow);background:var(--zt-tabbar-item-icon-background);border-radius:var(--zt-tabbar-item-box-border-radius);box-sizing:border-box}.zt-tabbar-item__icon:active{background:var(--zt-tabbar-item-icon-active-background);box-shadow:var(--zt-tabbar-item-icon-active-box-shadow)}.zt-tabbar-item__text{font-size:var(--zt-font-size-sm);padding-top:var(--zt-tabbar-item-text-padding-top);transform:scale(.83333);text-align:center;height:var(--zt-tabbar-item-text-height);line-height:var(--zt-tabbar-item-text-height)}.zt-tabbar-item--active{color:var(--zt-tabbar-item-active-color);font-weight:var(--zt-font-bold)}.zt-theme-dark{--zt-tabbar-item-text-color: var(--zt-gray);--zt-tabbar-item-icon-border: 1px solid rgba(151, 151, 151, .12);--zt-tabbar-item-icon-box-shadow: -4px -4px 8px 0 rgba(255, 255, 255, .12), 4px 4px 8px 0 rgba(0, 12, 24, .8);--zt-tabbar-item-icon-background: linear-gradient(135deg, #121d2a 0%, #1d2c3d 100%);--zt-tabbar-item-icon-active-box-shadow: inset 6px 6px 6px 0 #000d1b}
|
|
@@ -32,7 +32,7 @@ function usePopupState() {
|
|
|
32
32
|
state.show = show;
|
|
33
33
|
};
|
|
34
34
|
const open = (props) => {
|
|
35
|
-
(0, import_utils.extend)(state, props, { transitionAppear: true });
|
|
35
|
+
(0, import_utils.extend)(state, { primaryHeader: false }, props, { transitionAppear: true });
|
|
36
36
|
toggle(true);
|
|
37
37
|
};
|
|
38
38
|
const close = () => toggle(false);
|