@hlw-uni/mp-vue 1.0.16 → 1.0.17
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.js +36 -31
- package/dist/index.mjs +36 -31
- package/dist/style.css +47 -42
- package/package.json +1 -1
- package/src/components/hlw-menu/index.vue +7 -0
package/dist/index.js
CHANGED
|
@@ -304,26 +304,30 @@
|
|
|
304
304
|
key: 0,
|
|
305
305
|
class: "hlw-menu-title"
|
|
306
306
|
};
|
|
307
|
-
const _hoisted_3$2 = {
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
const
|
|
312
|
-
const
|
|
313
|
-
const
|
|
314
|
-
const
|
|
307
|
+
const _hoisted_3$2 = {
|
|
308
|
+
key: 1,
|
|
309
|
+
class: "hlw-menu-title-divider"
|
|
310
|
+
};
|
|
311
|
+
const _hoisted_4$1 = { class: "hlw-menu-left" };
|
|
312
|
+
const _hoisted_5$1 = { class: "hlw-menu-label" };
|
|
313
|
+
const _hoisted_6$1 = { class: "hlw-menu-right" };
|
|
314
|
+
const _hoisted_7$1 = ["onClick"];
|
|
315
|
+
const _hoisted_8 = { class: "hlw-menu-left" };
|
|
316
|
+
const _hoisted_9 = { class: "hlw-menu-label" };
|
|
317
|
+
const _hoisted_10 = { class: "hlw-menu-right" };
|
|
318
|
+
const _hoisted_11 = {
|
|
315
319
|
key: 0,
|
|
316
320
|
class: "i-fa6-solid-circle-notch hlw-menu-spin hlw-menu-muted"
|
|
317
321
|
};
|
|
318
|
-
const
|
|
322
|
+
const _hoisted_12 = {
|
|
319
323
|
key: 2,
|
|
320
324
|
class: "hlw-menu-divider"
|
|
321
325
|
};
|
|
322
|
-
const
|
|
323
|
-
const
|
|
324
|
-
const
|
|
325
|
-
const
|
|
326
|
-
const
|
|
326
|
+
const _hoisted_13 = { class: "hlw-menu-grid-icon-wrap" };
|
|
327
|
+
const _hoisted_14 = { class: "hlw-menu-grid-label" };
|
|
328
|
+
const _hoisted_15 = ["onClick"];
|
|
329
|
+
const _hoisted_16 = { class: "hlw-menu-grid-icon-wrap" };
|
|
330
|
+
const _hoisted_17 = { class: "hlw-menu-grid-label" };
|
|
327
331
|
const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
|
|
328
332
|
__name: "index",
|
|
329
333
|
props: {
|
|
@@ -346,7 +350,8 @@
|
|
|
346
350
|
props.title ? (vue.openBlock(), vue.createElementBlock("view", _hoisted_2$2, [
|
|
347
351
|
vue.createElementVNode("text", null, vue.toDisplayString(props.title), 1)
|
|
348
352
|
])) : vue.createCommentVNode("", true),
|
|
349
|
-
props.
|
|
353
|
+
props.title ? (vue.openBlock(), vue.createElementBlock("view", _hoisted_3$2)) : vue.createCommentVNode("", true),
|
|
354
|
+
props.mode === "list" ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 2 }, vue.renderList(visibleItems.value, (item, index2) => {
|
|
350
355
|
return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: index2 }, [
|
|
351
356
|
item.url ? (vue.openBlock(), vue.createBlock(_component_navigator, {
|
|
352
357
|
key: 0,
|
|
@@ -355,7 +360,7 @@
|
|
|
355
360
|
"hover-class": "hlw-menu-item--active"
|
|
356
361
|
}, {
|
|
357
362
|
default: vue.withCtx(() => [
|
|
358
|
-
vue.createElementVNode("view",
|
|
363
|
+
vue.createElementVNode("view", _hoisted_4$1, [
|
|
359
364
|
vue.createElementVNode("view", {
|
|
360
365
|
class: vue.normalizeClass(["hlw-menu-icon", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
361
366
|
}, [
|
|
@@ -363,9 +368,9 @@
|
|
|
363
368
|
class: vue.normalizeClass(item.icon)
|
|
364
369
|
}, null, 2)
|
|
365
370
|
], 2),
|
|
366
|
-
vue.createElementVNode("text",
|
|
371
|
+
vue.createElementVNode("text", _hoisted_5$1, vue.toDisplayString(item.label), 1)
|
|
367
372
|
]),
|
|
368
|
-
vue.createElementVNode("view",
|
|
373
|
+
vue.createElementVNode("view", _hoisted_6$1, [
|
|
369
374
|
item.tag ? (vue.openBlock(), vue.createElementBlock("text", {
|
|
370
375
|
key: 0,
|
|
371
376
|
class: vue.normalizeClass(["hlw-menu-tag", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
@@ -380,7 +385,7 @@
|
|
|
380
385
|
"hover-class": "hlw-menu-item--active",
|
|
381
386
|
onClick: ($event) => handleClick(item)
|
|
382
387
|
}, [
|
|
383
|
-
vue.createElementVNode("view",
|
|
388
|
+
vue.createElementVNode("view", _hoisted_8, [
|
|
384
389
|
vue.createElementVNode("view", {
|
|
385
390
|
class: vue.normalizeClass(["hlw-menu-icon", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
386
391
|
}, [
|
|
@@ -388,21 +393,21 @@
|
|
|
388
393
|
class: vue.normalizeClass(item.icon)
|
|
389
394
|
}, null, 2)
|
|
390
395
|
], 2),
|
|
391
|
-
vue.createElementVNode("text",
|
|
396
|
+
vue.createElementVNode("text", _hoisted_9, vue.toDisplayString(item.label), 1)
|
|
392
397
|
]),
|
|
393
|
-
vue.createElementVNode("view",
|
|
394
|
-
item.loading ? (vue.openBlock(), vue.createElementBlock("text",
|
|
398
|
+
vue.createElementVNode("view", _hoisted_10, [
|
|
399
|
+
item.loading ? (vue.openBlock(), vue.createElementBlock("text", _hoisted_11)) : vue.createCommentVNode("", true),
|
|
395
400
|
item.tag ? (vue.openBlock(), vue.createElementBlock("text", {
|
|
396
401
|
key: 1,
|
|
397
402
|
class: vue.normalizeClass(["hlw-menu-tag", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
398
403
|
}, vue.toDisplayString(item.tag), 3)) : vue.createCommentVNode("", true),
|
|
399
404
|
_cache[1] || (_cache[1] = vue.createElementVNode("text", { class: "i-fa6-solid-chevron-right hlw-menu-arrow" }, null, -1))
|
|
400
405
|
])
|
|
401
|
-
], 8,
|
|
402
|
-
index2 < visibleItems.value.length - 1 ? (vue.openBlock(), vue.createElementBlock("view",
|
|
406
|
+
], 8, _hoisted_7$1)),
|
|
407
|
+
index2 < visibleItems.value.length - 1 ? (vue.openBlock(), vue.createElementBlock("view", _hoisted_12)) : vue.createCommentVNode("", true)
|
|
403
408
|
], 64);
|
|
404
409
|
}), 128)) : (vue.openBlock(), vue.createElementBlock("view", {
|
|
405
|
-
key:
|
|
410
|
+
key: 3,
|
|
406
411
|
class: "hlw-menu-grid",
|
|
407
412
|
style: vue.normalizeStyle({ gridTemplateColumns: `repeat(${props.columns}, 1fr)` })
|
|
408
413
|
}, [
|
|
@@ -415,7 +420,7 @@
|
|
|
415
420
|
"hover-class": "hlw-menu-grid-item--active"
|
|
416
421
|
}, {
|
|
417
422
|
default: vue.withCtx(() => [
|
|
418
|
-
vue.createElementVNode("view",
|
|
423
|
+
vue.createElementVNode("view", _hoisted_13, [
|
|
419
424
|
vue.createElementVNode("view", {
|
|
420
425
|
class: vue.normalizeClass(["hlw-menu-icon hlw-menu-icon--grid", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
421
426
|
}, [
|
|
@@ -428,7 +433,7 @@
|
|
|
428
433
|
class: vue.normalizeClass(["hlw-menu-badge", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
429
434
|
}, vue.toDisplayString(item.tag), 3)) : vue.createCommentVNode("", true)
|
|
430
435
|
]),
|
|
431
|
-
vue.createElementVNode("text",
|
|
436
|
+
vue.createElementVNode("text", _hoisted_14, vue.toDisplayString(item.label), 1)
|
|
432
437
|
]),
|
|
433
438
|
_: 2
|
|
434
439
|
}, 1032, ["url"])) : (vue.openBlock(), vue.createElementBlock("view", {
|
|
@@ -437,7 +442,7 @@
|
|
|
437
442
|
"hover-class": "hlw-menu-grid-item--active",
|
|
438
443
|
onClick: ($event) => handleClick(item)
|
|
439
444
|
}, [
|
|
440
|
-
vue.createElementVNode("view",
|
|
445
|
+
vue.createElementVNode("view", _hoisted_16, [
|
|
441
446
|
vue.createElementVNode("view", {
|
|
442
447
|
class: vue.normalizeClass(["hlw-menu-icon hlw-menu-icon--grid", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
443
448
|
}, [
|
|
@@ -450,8 +455,8 @@
|
|
|
450
455
|
class: vue.normalizeClass(["hlw-menu-badge", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
451
456
|
}, vue.toDisplayString(item.tag), 3)) : vue.createCommentVNode("", true)
|
|
452
457
|
]),
|
|
453
|
-
vue.createElementVNode("text",
|
|
454
|
-
], 8,
|
|
458
|
+
vue.createElementVNode("text", _hoisted_17, vue.toDisplayString(item.label), 1)
|
|
459
|
+
], 8, _hoisted_15))
|
|
455
460
|
], 64);
|
|
456
461
|
}), 128))
|
|
457
462
|
], 4))
|
|
@@ -459,7 +464,7 @@
|
|
|
459
464
|
};
|
|
460
465
|
}
|
|
461
466
|
});
|
|
462
|
-
const index$2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-
|
|
467
|
+
const index$2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-0275c21a"]]);
|
|
463
468
|
const _hoisted_1$1 = { class: "hlw-menu-list" };
|
|
464
469
|
const _hoisted_2$1 = ["onTap"];
|
|
465
470
|
const _hoisted_3$1 = { class: "hlw-menu-list__left" };
|
package/dist/index.mjs
CHANGED
|
@@ -301,26 +301,30 @@ const _hoisted_2$2 = {
|
|
|
301
301
|
key: 0,
|
|
302
302
|
class: "hlw-menu-title"
|
|
303
303
|
};
|
|
304
|
-
const _hoisted_3$2 = {
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
const
|
|
309
|
-
const
|
|
310
|
-
const
|
|
311
|
-
const
|
|
304
|
+
const _hoisted_3$2 = {
|
|
305
|
+
key: 1,
|
|
306
|
+
class: "hlw-menu-title-divider"
|
|
307
|
+
};
|
|
308
|
+
const _hoisted_4$1 = { class: "hlw-menu-left" };
|
|
309
|
+
const _hoisted_5$1 = { class: "hlw-menu-label" };
|
|
310
|
+
const _hoisted_6$1 = { class: "hlw-menu-right" };
|
|
311
|
+
const _hoisted_7$1 = ["onClick"];
|
|
312
|
+
const _hoisted_8 = { class: "hlw-menu-left" };
|
|
313
|
+
const _hoisted_9 = { class: "hlw-menu-label" };
|
|
314
|
+
const _hoisted_10 = { class: "hlw-menu-right" };
|
|
315
|
+
const _hoisted_11 = {
|
|
312
316
|
key: 0,
|
|
313
317
|
class: "i-fa6-solid-circle-notch hlw-menu-spin hlw-menu-muted"
|
|
314
318
|
};
|
|
315
|
-
const
|
|
319
|
+
const _hoisted_12 = {
|
|
316
320
|
key: 2,
|
|
317
321
|
class: "hlw-menu-divider"
|
|
318
322
|
};
|
|
319
|
-
const
|
|
320
|
-
const
|
|
321
|
-
const
|
|
322
|
-
const
|
|
323
|
-
const
|
|
323
|
+
const _hoisted_13 = { class: "hlw-menu-grid-icon-wrap" };
|
|
324
|
+
const _hoisted_14 = { class: "hlw-menu-grid-label" };
|
|
325
|
+
const _hoisted_15 = ["onClick"];
|
|
326
|
+
const _hoisted_16 = { class: "hlw-menu-grid-icon-wrap" };
|
|
327
|
+
const _hoisted_17 = { class: "hlw-menu-grid-label" };
|
|
324
328
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
325
329
|
__name: "index",
|
|
326
330
|
props: {
|
|
@@ -343,7 +347,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
343
347
|
props.title ? (openBlock(), createElementBlock("view", _hoisted_2$2, [
|
|
344
348
|
createElementVNode("text", null, toDisplayString(props.title), 1)
|
|
345
349
|
])) : createCommentVNode("", true),
|
|
346
|
-
props.
|
|
350
|
+
props.title ? (openBlock(), createElementBlock("view", _hoisted_3$2)) : createCommentVNode("", true),
|
|
351
|
+
props.mode === "list" ? (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(visibleItems.value, (item, index2) => {
|
|
347
352
|
return openBlock(), createElementBlock(Fragment, { key: index2 }, [
|
|
348
353
|
item.url ? (openBlock(), createBlock(_component_navigator, {
|
|
349
354
|
key: 0,
|
|
@@ -352,7 +357,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
352
357
|
"hover-class": "hlw-menu-item--active"
|
|
353
358
|
}, {
|
|
354
359
|
default: withCtx(() => [
|
|
355
|
-
createElementVNode("view",
|
|
360
|
+
createElementVNode("view", _hoisted_4$1, [
|
|
356
361
|
createElementVNode("view", {
|
|
357
362
|
class: normalizeClass(["hlw-menu-icon", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
358
363
|
}, [
|
|
@@ -360,9 +365,9 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
360
365
|
class: normalizeClass(item.icon)
|
|
361
366
|
}, null, 2)
|
|
362
367
|
], 2),
|
|
363
|
-
createElementVNode("text",
|
|
368
|
+
createElementVNode("text", _hoisted_5$1, toDisplayString(item.label), 1)
|
|
364
369
|
]),
|
|
365
|
-
createElementVNode("view",
|
|
370
|
+
createElementVNode("view", _hoisted_6$1, [
|
|
366
371
|
item.tag ? (openBlock(), createElementBlock("text", {
|
|
367
372
|
key: 0,
|
|
368
373
|
class: normalizeClass(["hlw-menu-tag", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
@@ -377,7 +382,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
377
382
|
"hover-class": "hlw-menu-item--active",
|
|
378
383
|
onClick: ($event) => handleClick(item)
|
|
379
384
|
}, [
|
|
380
|
-
createElementVNode("view",
|
|
385
|
+
createElementVNode("view", _hoisted_8, [
|
|
381
386
|
createElementVNode("view", {
|
|
382
387
|
class: normalizeClass(["hlw-menu-icon", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
383
388
|
}, [
|
|
@@ -385,21 +390,21 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
385
390
|
class: normalizeClass(item.icon)
|
|
386
391
|
}, null, 2)
|
|
387
392
|
], 2),
|
|
388
|
-
createElementVNode("text",
|
|
393
|
+
createElementVNode("text", _hoisted_9, toDisplayString(item.label), 1)
|
|
389
394
|
]),
|
|
390
|
-
createElementVNode("view",
|
|
391
|
-
item.loading ? (openBlock(), createElementBlock("text",
|
|
395
|
+
createElementVNode("view", _hoisted_10, [
|
|
396
|
+
item.loading ? (openBlock(), createElementBlock("text", _hoisted_11)) : createCommentVNode("", true),
|
|
392
397
|
item.tag ? (openBlock(), createElementBlock("text", {
|
|
393
398
|
key: 1,
|
|
394
399
|
class: normalizeClass(["hlw-menu-tag", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
395
400
|
}, toDisplayString(item.tag), 3)) : createCommentVNode("", true),
|
|
396
401
|
_cache[1] || (_cache[1] = createElementVNode("text", { class: "i-fa6-solid-chevron-right hlw-menu-arrow" }, null, -1))
|
|
397
402
|
])
|
|
398
|
-
], 8,
|
|
399
|
-
index2 < visibleItems.value.length - 1 ? (openBlock(), createElementBlock("view",
|
|
403
|
+
], 8, _hoisted_7$1)),
|
|
404
|
+
index2 < visibleItems.value.length - 1 ? (openBlock(), createElementBlock("view", _hoisted_12)) : createCommentVNode("", true)
|
|
400
405
|
], 64);
|
|
401
406
|
}), 128)) : (openBlock(), createElementBlock("view", {
|
|
402
|
-
key:
|
|
407
|
+
key: 3,
|
|
403
408
|
class: "hlw-menu-grid",
|
|
404
409
|
style: normalizeStyle({ gridTemplateColumns: `repeat(${props.columns}, 1fr)` })
|
|
405
410
|
}, [
|
|
@@ -412,7 +417,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
412
417
|
"hover-class": "hlw-menu-grid-item--active"
|
|
413
418
|
}, {
|
|
414
419
|
default: withCtx(() => [
|
|
415
|
-
createElementVNode("view",
|
|
420
|
+
createElementVNode("view", _hoisted_13, [
|
|
416
421
|
createElementVNode("view", {
|
|
417
422
|
class: normalizeClass(["hlw-menu-icon hlw-menu-icon--grid", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
418
423
|
}, [
|
|
@@ -425,7 +430,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
425
430
|
class: normalizeClass(["hlw-menu-badge", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
426
431
|
}, toDisplayString(item.tag), 3)) : createCommentVNode("", true)
|
|
427
432
|
]),
|
|
428
|
-
createElementVNode("text",
|
|
433
|
+
createElementVNode("text", _hoisted_14, toDisplayString(item.label), 1)
|
|
429
434
|
]),
|
|
430
435
|
_: 2
|
|
431
436
|
}, 1032, ["url"])) : (openBlock(), createElementBlock("view", {
|
|
@@ -434,7 +439,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
434
439
|
"hover-class": "hlw-menu-grid-item--active",
|
|
435
440
|
onClick: ($event) => handleClick(item)
|
|
436
441
|
}, [
|
|
437
|
-
createElementVNode("view",
|
|
442
|
+
createElementVNode("view", _hoisted_16, [
|
|
438
443
|
createElementVNode("view", {
|
|
439
444
|
class: normalizeClass(["hlw-menu-icon hlw-menu-icon--grid", `hlw-menu-icon--${item.iconTheme || "slate"}`])
|
|
440
445
|
}, [
|
|
@@ -447,8 +452,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
447
452
|
class: normalizeClass(["hlw-menu-badge", [`hlw-menu-tag--${item.tagTheme || "rose"}`, item.tagPulse ? "hlw-menu-tag-pulse" : ""]])
|
|
448
453
|
}, toDisplayString(item.tag), 3)) : createCommentVNode("", true)
|
|
449
454
|
]),
|
|
450
|
-
createElementVNode("text",
|
|
451
|
-
], 8,
|
|
455
|
+
createElementVNode("text", _hoisted_17, toDisplayString(item.label), 1)
|
|
456
|
+
], 8, _hoisted_15))
|
|
452
457
|
], 64);
|
|
453
458
|
}), 128))
|
|
454
459
|
], 4))
|
|
@@ -456,7 +461,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
|
456
461
|
};
|
|
457
462
|
}
|
|
458
463
|
});
|
|
459
|
-
const index$2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-
|
|
464
|
+
const index$2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-0275c21a"]]);
|
|
460
465
|
const _hoisted_1$1 = { class: "hlw-menu-list" };
|
|
461
466
|
const _hoisted_2$1 = ["onTap"];
|
|
462
467
|
const _hoisted_3$1 = { class: "hlw-menu-list__left" };
|
package/dist/style.css
CHANGED
|
@@ -145,7 +145,7 @@ to { transform: rotate(360deg);
|
|
|
145
145
|
color: #999;
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
.hlw-menu[data-v-
|
|
148
|
+
.hlw-menu[data-v-0275c21a] {
|
|
149
149
|
background: #fff;
|
|
150
150
|
border-radius: var(--radius-lg, 24rpx);
|
|
151
151
|
border: 1rpx solid var(--border-color, #e2e8f0);
|
|
@@ -154,62 +154,67 @@ to { transform: rotate(360deg);
|
|
|
154
154
|
}
|
|
155
155
|
|
|
156
156
|
/* 标题 */
|
|
157
|
-
.hlw-menu-title[data-v-
|
|
157
|
+
.hlw-menu-title[data-v-0275c21a] {
|
|
158
158
|
padding: 24rpx 32rpx 0;
|
|
159
159
|
}
|
|
160
|
-
.hlw-menu-title text[data-v-
|
|
160
|
+
.hlw-menu-title text[data-v-0275c21a] {
|
|
161
161
|
font-size: 24rpx;
|
|
162
162
|
font-weight: 600;
|
|
163
163
|
color: #94a3b8;
|
|
164
164
|
letter-spacing: 1rpx;
|
|
165
165
|
}
|
|
166
|
+
.hlw-menu-title-divider[data-v-0275c21a] {
|
|
167
|
+
margin: 16rpx 32rpx 0;
|
|
168
|
+
height: 0;
|
|
169
|
+
border-bottom: 1rpx dashed var(--border-color, #e2e8f0);
|
|
170
|
+
}
|
|
166
171
|
|
|
167
172
|
/* ========== 列表模式 ========== */
|
|
168
|
-
.hlw-menu-item[data-v-
|
|
173
|
+
.hlw-menu-item[data-v-0275c21a] {
|
|
169
174
|
display: flex;
|
|
170
175
|
align-items: center;
|
|
171
176
|
justify-content: space-between;
|
|
172
177
|
padding: 24rpx 32rpx;
|
|
173
178
|
}
|
|
174
|
-
.hlw-menu-item--active[data-v-
|
|
179
|
+
.hlw-menu-item--active[data-v-0275c21a] {
|
|
175
180
|
background: #f8fafc;
|
|
176
181
|
}
|
|
177
|
-
.hlw-menu-divider[data-v-
|
|
182
|
+
.hlw-menu-divider[data-v-0275c21a] {
|
|
178
183
|
margin: 0 32rpx;
|
|
179
184
|
height: 0;
|
|
180
185
|
border-bottom: 1rpx dashed var(--border-color, #e2e8f0);
|
|
181
186
|
}
|
|
182
|
-
.hlw-menu-left[data-v-
|
|
187
|
+
.hlw-menu-left[data-v-0275c21a] {
|
|
183
188
|
display: flex;
|
|
184
189
|
align-items: center;
|
|
185
190
|
gap: 24rpx;
|
|
186
191
|
}
|
|
187
|
-
.hlw-menu-right[data-v-
|
|
192
|
+
.hlw-menu-right[data-v-0275c21a] {
|
|
188
193
|
display: flex;
|
|
189
194
|
align-items: center;
|
|
190
195
|
gap: 16rpx;
|
|
191
196
|
}
|
|
192
197
|
|
|
193
198
|
/* ========== 宫格模式 ========== */
|
|
194
|
-
.hlw-menu-grid[data-v-
|
|
199
|
+
.hlw-menu-grid[data-v-0275c21a] {
|
|
195
200
|
display: grid;
|
|
196
201
|
padding: 16rpx 0 24rpx;
|
|
197
202
|
}
|
|
198
|
-
.hlw-menu-grid-item[data-v-
|
|
203
|
+
.hlw-menu-grid-item[data-v-0275c21a] {
|
|
199
204
|
display: flex;
|
|
200
205
|
flex-direction: column;
|
|
201
206
|
align-items: center;
|
|
202
207
|
gap: 12rpx;
|
|
203
208
|
padding: 16rpx 8rpx;
|
|
204
209
|
}
|
|
205
|
-
.hlw-menu-grid-item--active[data-v-
|
|
210
|
+
.hlw-menu-grid-item--active[data-v-0275c21a] {
|
|
206
211
|
background: #f8fafc;
|
|
207
212
|
}
|
|
208
|
-
.hlw-menu-grid-icon-wrap[data-v-
|
|
213
|
+
.hlw-menu-grid-icon-wrap[data-v-0275c21a] {
|
|
209
214
|
position: relative;
|
|
210
215
|
padding-top: 20rpx; /* 预留徽标空间,保证所有格子图标水平对齐 */
|
|
211
216
|
}
|
|
212
|
-
.hlw-menu-badge[data-v-
|
|
217
|
+
.hlw-menu-badge[data-v-0275c21a] {
|
|
213
218
|
position: absolute;
|
|
214
219
|
top: 0;
|
|
215
220
|
right: -8rpx;
|
|
@@ -222,14 +227,14 @@ to { transform: rotate(360deg);
|
|
|
222
227
|
line-height: 28rpx;
|
|
223
228
|
height: 28rpx;
|
|
224
229
|
}
|
|
225
|
-
.hlw-menu-grid-label[data-v-
|
|
230
|
+
.hlw-menu-grid-label[data-v-0275c21a] {
|
|
226
231
|
font-size: 24rpx;
|
|
227
232
|
color: #334155;
|
|
228
233
|
text-align: center;
|
|
229
234
|
}
|
|
230
235
|
|
|
231
236
|
/* ========== 图标 ========== */
|
|
232
|
-
.hlw-menu-icon[data-v-
|
|
237
|
+
.hlw-menu-icon[data-v-0275c21a] {
|
|
233
238
|
width: 64rpx;
|
|
234
239
|
height: 64rpx;
|
|
235
240
|
border-radius: var(--radius-md, 16rpx);
|
|
@@ -238,86 +243,86 @@ to { transform: rotate(360deg);
|
|
|
238
243
|
justify-content: center;
|
|
239
244
|
flex-shrink: 0;
|
|
240
245
|
}
|
|
241
|
-
.hlw-menu-icon text[data-v-
|
|
246
|
+
.hlw-menu-icon text[data-v-0275c21a] {
|
|
242
247
|
font-size: 20rpx;
|
|
243
248
|
}
|
|
244
|
-
.hlw-menu-icon--grid[data-v-
|
|
249
|
+
.hlw-menu-icon--grid[data-v-0275c21a] {
|
|
245
250
|
width: 88rpx;
|
|
246
251
|
height: 88rpx;
|
|
247
252
|
border-radius: var(--radius-lg, 24rpx);
|
|
248
253
|
}
|
|
249
|
-
.hlw-menu-icon--grid text[data-v-
|
|
254
|
+
.hlw-menu-icon--grid text[data-v-0275c21a] {
|
|
250
255
|
font-size: 32rpx;
|
|
251
256
|
}
|
|
252
|
-
.hlw-menu-icon--orange[data-v-
|
|
257
|
+
.hlw-menu-icon--orange[data-v-0275c21a] {
|
|
253
258
|
background: #fff7ed;
|
|
254
259
|
color: #f97316;
|
|
255
260
|
}
|
|
256
|
-
.hlw-menu-icon--purple[data-v-
|
|
261
|
+
.hlw-menu-icon--purple[data-v-0275c21a] {
|
|
257
262
|
background: #faf5ff;
|
|
258
263
|
color: #a855f7;
|
|
259
264
|
}
|
|
260
|
-
.hlw-menu-icon--wechat[data-v-
|
|
265
|
+
.hlw-menu-icon--wechat[data-v-0275c21a] {
|
|
261
266
|
background: #f0fdf4;
|
|
262
267
|
color: #07c160;
|
|
263
268
|
}
|
|
264
|
-
.hlw-menu-icon--cyan[data-v-
|
|
269
|
+
.hlw-menu-icon--cyan[data-v-0275c21a] {
|
|
265
270
|
background: #ecfeff;
|
|
266
271
|
color: #06b6d4;
|
|
267
272
|
}
|
|
268
|
-
.hlw-menu-icon--emerald[data-v-
|
|
273
|
+
.hlw-menu-icon--emerald[data-v-0275c21a] {
|
|
269
274
|
background: #ecfdf5;
|
|
270
275
|
color: #10b981;
|
|
271
276
|
}
|
|
272
|
-
.hlw-menu-icon--slate[data-v-
|
|
277
|
+
.hlw-menu-icon--slate[data-v-0275c21a] {
|
|
273
278
|
background: #f1f5f9;
|
|
274
279
|
color: #64748b;
|
|
275
280
|
}
|
|
276
|
-
.hlw-menu-icon--rose[data-v-
|
|
281
|
+
.hlw-menu-icon--rose[data-v-0275c21a] {
|
|
277
282
|
background: #fff1f2;
|
|
278
283
|
color: #f43f5e;
|
|
279
284
|
}
|
|
280
|
-
.hlw-menu-icon--blue[data-v-
|
|
285
|
+
.hlw-menu-icon--blue[data-v-0275c21a] {
|
|
281
286
|
background: #eff6ff;
|
|
282
287
|
color: #3b82f6;
|
|
283
288
|
}
|
|
284
|
-
.hlw-menu-icon--red[data-v-
|
|
289
|
+
.hlw-menu-icon--red[data-v-0275c21a] {
|
|
285
290
|
background: #fef2f2;
|
|
286
291
|
color: #ef4444;
|
|
287
292
|
}
|
|
288
293
|
|
|
289
294
|
/* ========== 标签 / 角标 ========== */
|
|
290
|
-
.hlw-menu-label[data-v-
|
|
295
|
+
.hlw-menu-label[data-v-0275c21a] {
|
|
291
296
|
font-size: 28rpx;
|
|
292
297
|
font-weight: 500;
|
|
293
298
|
color: #334155;
|
|
294
299
|
}
|
|
295
|
-
.hlw-menu-tag[data-v-
|
|
300
|
+
.hlw-menu-tag[data-v-0275c21a] {
|
|
296
301
|
font-size: 20rpx;
|
|
297
302
|
color: #fff;
|
|
298
303
|
padding: 2rpx 12rpx;
|
|
299
304
|
border-radius: 9999rpx;
|
|
300
305
|
box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
|
|
301
306
|
}
|
|
302
|
-
.hlw-menu-tag--orange[data-v-
|
|
307
|
+
.hlw-menu-tag--orange[data-v-0275c21a] {
|
|
303
308
|
background: #fb923c;
|
|
304
309
|
}
|
|
305
|
-
.hlw-menu-tag--red[data-v-
|
|
310
|
+
.hlw-menu-tag--red[data-v-0275c21a] {
|
|
306
311
|
background: #ef4444;
|
|
307
312
|
}
|
|
308
|
-
.hlw-menu-tag--wechat[data-v-
|
|
313
|
+
.hlw-menu-tag--wechat[data-v-0275c21a] {
|
|
309
314
|
background: #07c160;
|
|
310
315
|
}
|
|
311
|
-
.hlw-menu-tag--rose[data-v-
|
|
316
|
+
.hlw-menu-tag--rose[data-v-0275c21a] {
|
|
312
317
|
background: #f43f5e;
|
|
313
318
|
}
|
|
314
|
-
.hlw-menu-tag--blue[data-v-
|
|
319
|
+
.hlw-menu-tag--blue[data-v-0275c21a] {
|
|
315
320
|
background: #3b82f6;
|
|
316
321
|
}
|
|
317
|
-
.hlw-menu-tag-pulse[data-v-
|
|
318
|
-
animation: tag-pulse-
|
|
322
|
+
.hlw-menu-tag-pulse[data-v-0275c21a] {
|
|
323
|
+
animation: tag-pulse-0275c21a 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
319
324
|
}
|
|
320
|
-
@keyframes tag-pulse-
|
|
325
|
+
@keyframes tag-pulse-0275c21a {
|
|
321
326
|
0%, 100% {
|
|
322
327
|
opacity: 1;
|
|
323
328
|
}
|
|
@@ -325,18 +330,18 @@ to { transform: rotate(360deg);
|
|
|
325
330
|
opacity: 0.5;
|
|
326
331
|
}
|
|
327
332
|
}
|
|
328
|
-
.hlw-menu-arrow[data-v-
|
|
333
|
+
.hlw-menu-arrow[data-v-0275c21a] {
|
|
329
334
|
color: #d1d5db;
|
|
330
335
|
font-size: 20rpx;
|
|
331
336
|
}
|
|
332
|
-
.hlw-menu-spin[data-v-
|
|
333
|
-
animation: icon-spin-
|
|
337
|
+
.hlw-menu-spin[data-v-0275c21a] {
|
|
338
|
+
animation: icon-spin-0275c21a 1s linear infinite;
|
|
334
339
|
}
|
|
335
|
-
.hlw-menu-muted[data-v-
|
|
340
|
+
.hlw-menu-muted[data-v-0275c21a] {
|
|
336
341
|
color: #94a3b8;
|
|
337
342
|
font-size: 20rpx;
|
|
338
343
|
}
|
|
339
|
-
@keyframes icon-spin-
|
|
344
|
+
@keyframes icon-spin-0275c21a {
|
|
340
345
|
from {
|
|
341
346
|
transform: rotate(0deg);
|
|
342
347
|
}
|
package/package.json
CHANGED
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
<view v-if="props.title" class="hlw-menu-title">
|
|
5
5
|
<text>{{ props.title }}</text>
|
|
6
6
|
</view>
|
|
7
|
+
<view v-if="props.title" class="hlw-menu-title-divider"></view>
|
|
7
8
|
|
|
8
9
|
<!-- 列表模式 -->
|
|
9
10
|
<template v-if="props.mode === 'list'">
|
|
@@ -118,6 +119,12 @@ const handleClick = (item: HlwMenuItem) => {
|
|
|
118
119
|
}
|
|
119
120
|
}
|
|
120
121
|
|
|
122
|
+
.hlw-menu-title-divider {
|
|
123
|
+
margin: 16rpx 32rpx 0;
|
|
124
|
+
height: 0;
|
|
125
|
+
border-bottom: 1rpx dashed var(--border-color, #e2e8f0);
|
|
126
|
+
}
|
|
127
|
+
|
|
121
128
|
/* ========== 列表模式 ========== */
|
|
122
129
|
.hlw-menu-item {
|
|
123
130
|
display: flex;
|