fantasia-ui 0.2.53 → 0.2.56
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/fantasia-ui.css +248 -39
- package/dist/fantasia-ui.es.js +583 -404
- package/dist/fantasia-ui.umd.js +582 -403
- package/dist/types/global.d.ts +1 -0
- package/dist/types/packages/components/index.d.ts +1 -0
- package/dist/types/packages/components/modules/FDialog.vue.d.ts +6 -4
- package/dist/types/packages/components/modules/FDivider.vue.d.ts +13 -2
- package/dist/types/packages/components/modules/FDrawer.vue.d.ts +33 -0
- package/dist/types/packages/components/modules/FSelect.vue.d.ts +14 -11
- package/dist/types/packages/types/components/index.d.ts +1 -0
- package/dist/types/packages/types/components/modules/f-dialog.d.ts +4 -0
- package/dist/types/packages/types/components/modules/f-divider.d.ts +15 -3
- package/dist/types/packages/types/components/modules/f-drawer.d.ts +29 -0
- package/dist/types/packages/types/components/modules/f-select.d.ts +16 -2
- package/dist/types/volar.d.ts +1 -0
- package/package.json +1 -1
package/dist/fantasia-ui.css
CHANGED
|
@@ -2482,7 +2482,7 @@ to {
|
|
|
2482
2482
|
.f-dropdown-motion-leave-to[data-v-ecac3ad8] {
|
|
2483
2483
|
opacity: 0;
|
|
2484
2484
|
transform: scale(0.92);
|
|
2485
|
-
}.f-select[data-v-
|
|
2485
|
+
}.f-select[data-v-046bf984] {
|
|
2486
2486
|
display: inline-flex;
|
|
2487
2487
|
align-items: center;
|
|
2488
2488
|
justify-content: space-between;
|
|
@@ -2491,58 +2491,90 @@ to {
|
|
|
2491
2491
|
width: 100%;
|
|
2492
2492
|
max-width: 100%;
|
|
2493
2493
|
box-sizing: border-box;
|
|
2494
|
-
padding:
|
|
2495
|
-
|
|
2496
|
-
|
|
2497
|
-
border
|
|
2494
|
+
padding: 0 12px;
|
|
2495
|
+
height: 36px;
|
|
2496
|
+
background: #fff;
|
|
2497
|
+
border: 1px solid #dcdfe6;
|
|
2498
|
+
border-radius: 4px;
|
|
2498
2499
|
cursor: pointer;
|
|
2499
2500
|
user-select: none;
|
|
2500
|
-
transition:
|
|
2501
|
+
transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
2501
2502
|
}
|
|
2502
|
-
.f-select[data-v-
|
|
2503
|
-
|
|
2504
|
-
border-color: var(--border2);
|
|
2503
|
+
.f-select[data-v-046bf984]:hover:not(.is-disabled) {
|
|
2504
|
+
border-color: #c0c4cc;
|
|
2505
2505
|
}
|
|
2506
|
-
.f-select.is-open[data-v-
|
|
2507
|
-
|
|
2508
|
-
border-color: var(--accent);
|
|
2509
|
-
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
|
|
2506
|
+
.f-select.is-open[data-v-046bf984]:not(.is-disabled), .f-select[data-v-046bf984]:focus-within:not(.is-disabled) {
|
|
2507
|
+
border-color: #409eff;
|
|
2510
2508
|
}
|
|
2511
|
-
.f-select.is-
|
|
2512
|
-
|
|
2513
|
-
font-weight: 500;
|
|
2509
|
+
.f-select.is-open:not(.is-disabled) .f-select__arrow[data-v-046bf984], .f-select:focus-within:not(.is-disabled) .f-select__arrow[data-v-046bf984] {
|
|
2510
|
+
transform: rotate(180deg);
|
|
2514
2511
|
}
|
|
2515
|
-
.f-select.is-
|
|
2512
|
+
.f-select.is-active .f-select__label[data-v-046bf984] {
|
|
2513
|
+
color: #606266;
|
|
2514
|
+
}
|
|
2515
|
+
.f-select.is-disabled[data-v-046bf984] {
|
|
2516
2516
|
cursor: not-allowed;
|
|
2517
|
-
|
|
2518
|
-
|
|
2517
|
+
background-color: #f5f7fa;
|
|
2518
|
+
border-color: #e4e7ed;
|
|
2519
|
+
color: #c0c4cc;
|
|
2519
2520
|
}
|
|
2520
|
-
.f-select.is-disabled .f-select__label[data-v-
|
|
2521
|
-
.f-select.is-disabled .f-select__arrow[data-v-
|
|
2521
|
+
.f-select.is-disabled .f-select__label[data-v-046bf984],
|
|
2522
|
+
.f-select.is-disabled .f-select__arrow[data-v-046bf984] {
|
|
2522
2523
|
cursor: not-allowed;
|
|
2523
2524
|
}
|
|
2524
|
-
.f-
|
|
2525
|
+
.f-select--small[data-v-046bf984] {
|
|
2526
|
+
height: 32px;
|
|
2527
|
+
font-size: 13px;
|
|
2528
|
+
}
|
|
2529
|
+
.f-select--small .f-select__label[data-v-046bf984] {
|
|
2530
|
+
font-size: 13px;
|
|
2531
|
+
}
|
|
2532
|
+
.f-select--medium[data-v-046bf984] {
|
|
2533
|
+
height: 36px;
|
|
2525
2534
|
font-size: 14px;
|
|
2526
|
-
|
|
2527
|
-
|
|
2535
|
+
}
|
|
2536
|
+
.f-select--large[data-v-046bf984] {
|
|
2537
|
+
height: 40px;
|
|
2538
|
+
font-size: 16px;
|
|
2539
|
+
}
|
|
2540
|
+
.f-select--large .f-select__label[data-v-046bf984] {
|
|
2541
|
+
font-size: 16px;
|
|
2542
|
+
}
|
|
2543
|
+
.f-select__label[data-v-046bf984] {
|
|
2544
|
+
font-size: 14px;
|
|
2545
|
+
line-height: 1.5;
|
|
2546
|
+
color: #606266;
|
|
2528
2547
|
flex: 1;
|
|
2529
2548
|
white-space: nowrap;
|
|
2530
2549
|
overflow: hidden;
|
|
2531
2550
|
text-overflow: ellipsis;
|
|
2532
|
-
transition: color 0.2s
|
|
2551
|
+
transition: color 0.2s;
|
|
2533
2552
|
}
|
|
2534
|
-
.f-select__label.is-placeholder[data-v-
|
|
2535
|
-
color:
|
|
2536
|
-
font-weight: 400;
|
|
2553
|
+
.f-select__label.is-placeholder[data-v-046bf984] {
|
|
2554
|
+
color: #c0c4cc;
|
|
2537
2555
|
}
|
|
2538
|
-
.f-
|
|
2539
|
-
|
|
2540
|
-
|
|
2556
|
+
.f-select__suffix[data-v-046bf984] {
|
|
2557
|
+
display: flex;
|
|
2558
|
+
align-items: center;
|
|
2559
|
+
gap: 4px;
|
|
2541
2560
|
flex-shrink: 0;
|
|
2542
|
-
transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
2543
2561
|
}
|
|
2544
|
-
.f-
|
|
2545
|
-
|
|
2562
|
+
.f-select__clear[data-v-046bf984] {
|
|
2563
|
+
font-size: 14px;
|
|
2564
|
+
color: #c0c4cc;
|
|
2565
|
+
transition: color 0.2s;
|
|
2566
|
+
cursor: pointer;
|
|
2567
|
+
}
|
|
2568
|
+
.f-select__clear[data-v-046bf984]:hover {
|
|
2569
|
+
color: #909399;
|
|
2570
|
+
}
|
|
2571
|
+
.f-select__arrow[data-v-046bf984] {
|
|
2572
|
+
font-size: 14px;
|
|
2573
|
+
color: #c0c4cc;
|
|
2574
|
+
transition: transform 0.3s, color 0.2s;
|
|
2575
|
+
}
|
|
2576
|
+
.f-select:hover:not(.is-disabled) .f-select__arrow[data-v-046bf984] {
|
|
2577
|
+
color: #909399;
|
|
2546
2578
|
}.f-pagination[data-v-930f8b20] {
|
|
2547
2579
|
display: flex;
|
|
2548
2580
|
justify-content: center;
|
|
@@ -5351,12 +5383,46 @@ to {
|
|
|
5351
5383
|
}.f-container[data-v-08450ddf] {
|
|
5352
5384
|
width: 100%;
|
|
5353
5385
|
height: 100%;
|
|
5354
|
-
}
|
|
5386
|
+
}.f-divider[data-v-109f761f] {
|
|
5387
|
+
position: relative;
|
|
5388
|
+
}
|
|
5389
|
+
.f-divider--horizontal[data-v-109f761f] {
|
|
5390
|
+
display: block;
|
|
5355
5391
|
width: 100%;
|
|
5356
|
-
|
|
5357
|
-
height: 1px;
|
|
5392
|
+
height: 0;
|
|
5358
5393
|
margin: 24px 0;
|
|
5359
|
-
|
|
5394
|
+
}
|
|
5395
|
+
.f-divider--horizontal.f-divider--with-text[data-v-109f761f] {
|
|
5396
|
+
display: flex;
|
|
5397
|
+
align-items: center;
|
|
5398
|
+
margin: 24px 0;
|
|
5399
|
+
color: #909399;
|
|
5400
|
+
font-size: 14px;
|
|
5401
|
+
}
|
|
5402
|
+
.f-divider--vertical[data-v-109f761f] {
|
|
5403
|
+
display: inline-block;
|
|
5404
|
+
width: 0;
|
|
5405
|
+
vertical-align: middle;
|
|
5406
|
+
}
|
|
5407
|
+
.f-divider__line[data-v-109f761f] {
|
|
5408
|
+
flex: 1;
|
|
5409
|
+
min-width: 10%;
|
|
5410
|
+
}
|
|
5411
|
+
.f-divider__text[data-v-109f761f] {
|
|
5412
|
+
padding: 0 16px;
|
|
5413
|
+
white-space: nowrap;
|
|
5414
|
+
font-weight: 500;
|
|
5415
|
+
}
|
|
5416
|
+
.f-divider--left .f-divider__line[data-v-109f761f]:first-child {
|
|
5417
|
+
flex: 0;
|
|
5418
|
+
min-width: 5%;
|
|
5419
|
+
}
|
|
5420
|
+
.f-divider--right .f-divider__line[data-v-109f761f]:last-child {
|
|
5421
|
+
flex: 0;
|
|
5422
|
+
min-width: 5%;
|
|
5423
|
+
}
|
|
5424
|
+
.f-divider--center .f-divider__line[data-v-109f761f] {
|
|
5425
|
+
flex: 1;
|
|
5360
5426
|
}.f-avatar[data-v-b3665268] {
|
|
5361
5427
|
background-color: var(--surface);
|
|
5362
5428
|
color: var(--text-dim);
|
|
@@ -7582,11 +7648,35 @@ to {
|
|
|
7582
7648
|
will-change: transform, opacity;
|
|
7583
7649
|
transform-origin: center;
|
|
7584
7650
|
}
|
|
7651
|
+
.f-dialog__close {
|
|
7652
|
+
position: absolute;
|
|
7653
|
+
top: 16px;
|
|
7654
|
+
right: 16px;
|
|
7655
|
+
width: 32px;
|
|
7656
|
+
height: 32px;
|
|
7657
|
+
display: flex;
|
|
7658
|
+
align-items: center;
|
|
7659
|
+
justify-content: center;
|
|
7660
|
+
border: none;
|
|
7661
|
+
background: transparent;
|
|
7662
|
+
color: #909399;
|
|
7663
|
+
cursor: pointer;
|
|
7664
|
+
border-radius: 4px;
|
|
7665
|
+
transition: all 0.2s;
|
|
7666
|
+
z-index: 1;
|
|
7667
|
+
padding: 0;
|
|
7668
|
+
}
|
|
7669
|
+
.f-dialog__close:hover {
|
|
7670
|
+
background: #f5f7fa;
|
|
7671
|
+
color: #606266;
|
|
7672
|
+
}
|
|
7585
7673
|
.f-dialog__header {
|
|
7586
|
-
padding:
|
|
7674
|
+
padding: 20px 20px 16px;
|
|
7587
7675
|
display: flex;
|
|
7588
7676
|
align-items: center;
|
|
7589
7677
|
gap: 12px;
|
|
7678
|
+
}
|
|
7679
|
+
.f-dialog__header.has-divider {
|
|
7590
7680
|
border-bottom: 1px solid #e4e7ed;
|
|
7591
7681
|
}
|
|
7592
7682
|
.f-dialog__icon {
|
|
@@ -7627,6 +7717,8 @@ to {
|
|
|
7627
7717
|
align-items: center;
|
|
7628
7718
|
justify-content: flex-end;
|
|
7629
7719
|
gap: 12px;
|
|
7720
|
+
}
|
|
7721
|
+
.f-dialog__footer.has-divider {
|
|
7630
7722
|
border-top: 1px solid #e4e7ed;
|
|
7631
7723
|
}
|
|
7632
7724
|
.f-dialog--info .f-dialog__icon {
|
|
@@ -7675,6 +7767,123 @@ to {
|
|
|
7675
7767
|
.dialog-leave-from {
|
|
7676
7768
|
opacity: 1;
|
|
7677
7769
|
transform: scale(1) translateY(0);
|
|
7770
|
+
}.f-drawer-backdrop[data-v-c932e83d] {
|
|
7771
|
+
position: fixed;
|
|
7772
|
+
inset: 0;
|
|
7773
|
+
background: rgba(0, 0, 0, 0.5);
|
|
7774
|
+
z-index: 1100;
|
|
7775
|
+
backdrop-filter: blur(2px);
|
|
7776
|
+
}
|
|
7777
|
+
.f-drawer[data-v-c932e83d] {
|
|
7778
|
+
position: fixed;
|
|
7779
|
+
background: #fff;
|
|
7780
|
+
z-index: 1101;
|
|
7781
|
+
display: flex;
|
|
7782
|
+
flex-direction: column;
|
|
7783
|
+
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
|
|
7784
|
+
}
|
|
7785
|
+
.f-drawer--left[data-v-c932e83d] {
|
|
7786
|
+
top: 0;
|
|
7787
|
+
bottom: 0;
|
|
7788
|
+
left: 0;
|
|
7789
|
+
}
|
|
7790
|
+
.f-drawer--right[data-v-c932e83d] {
|
|
7791
|
+
top: 0;
|
|
7792
|
+
bottom: 0;
|
|
7793
|
+
right: 0;
|
|
7794
|
+
}
|
|
7795
|
+
.f-drawer--top[data-v-c932e83d] {
|
|
7796
|
+
top: 0;
|
|
7797
|
+
left: 0;
|
|
7798
|
+
right: 0;
|
|
7799
|
+
}
|
|
7800
|
+
.f-drawer--bottom[data-v-c932e83d] {
|
|
7801
|
+
bottom: 0;
|
|
7802
|
+
left: 0;
|
|
7803
|
+
right: 0;
|
|
7804
|
+
}
|
|
7805
|
+
.f-drawer__header[data-v-c932e83d] {
|
|
7806
|
+
display: flex;
|
|
7807
|
+
align-items: center;
|
|
7808
|
+
justify-content: space-between;
|
|
7809
|
+
padding: 20px;
|
|
7810
|
+
border-bottom: 1px solid #e4e7ed;
|
|
7811
|
+
flex-shrink: 0;
|
|
7812
|
+
}
|
|
7813
|
+
.f-drawer__title[data-v-c932e83d] {
|
|
7814
|
+
font-size: 18px;
|
|
7815
|
+
font-weight: 600;
|
|
7816
|
+
margin: 0;
|
|
7817
|
+
color: #303133;
|
|
7818
|
+
}
|
|
7819
|
+
.f-drawer__close[data-v-c932e83d] {
|
|
7820
|
+
width: 40px;
|
|
7821
|
+
height: 40px;
|
|
7822
|
+
display: flex;
|
|
7823
|
+
align-items: center;
|
|
7824
|
+
justify-content: center;
|
|
7825
|
+
border: none;
|
|
7826
|
+
border-radius: 4px;
|
|
7827
|
+
background: transparent;
|
|
7828
|
+
color: #909399;
|
|
7829
|
+
cursor: pointer;
|
|
7830
|
+
padding: 0;
|
|
7831
|
+
transition: all 0.2s;
|
|
7832
|
+
}
|
|
7833
|
+
.f-drawer__close[data-v-c932e83d]:hover {
|
|
7834
|
+
background: #f5f7fa;
|
|
7835
|
+
color: #606266;
|
|
7836
|
+
}
|
|
7837
|
+
.f-drawer__body[data-v-c932e83d] {
|
|
7838
|
+
flex: 1;
|
|
7839
|
+
min-height: 0;
|
|
7840
|
+
overflow-y: auto;
|
|
7841
|
+
padding: 20px;
|
|
7842
|
+
}
|
|
7843
|
+
.f-drawer__footer[data-v-c932e83d] {
|
|
7844
|
+
padding: 20px;
|
|
7845
|
+
border-top: 1px solid #e4e7ed;
|
|
7846
|
+
flex-shrink: 0;
|
|
7847
|
+
}
|
|
7848
|
+
.drawer-fade-enter-active[data-v-c932e83d],
|
|
7849
|
+
.drawer-fade-leave-active[data-v-c932e83d] {
|
|
7850
|
+
transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
7851
|
+
}
|
|
7852
|
+
.drawer-fade-enter-from[data-v-c932e83d],
|
|
7853
|
+
.drawer-fade-leave-to[data-v-c932e83d] {
|
|
7854
|
+
opacity: 0;
|
|
7855
|
+
}
|
|
7856
|
+
.drawer-left-enter-active[data-v-c932e83d],
|
|
7857
|
+
.drawer-left-leave-active[data-v-c932e83d] {
|
|
7858
|
+
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
7859
|
+
}
|
|
7860
|
+
.drawer-left-enter-from[data-v-c932e83d],
|
|
7861
|
+
.drawer-left-leave-to[data-v-c932e83d] {
|
|
7862
|
+
transform: translateX(-100%);
|
|
7863
|
+
}
|
|
7864
|
+
.drawer-right-enter-active[data-v-c932e83d],
|
|
7865
|
+
.drawer-right-leave-active[data-v-c932e83d] {
|
|
7866
|
+
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
7867
|
+
}
|
|
7868
|
+
.drawer-right-enter-from[data-v-c932e83d],
|
|
7869
|
+
.drawer-right-leave-to[data-v-c932e83d] {
|
|
7870
|
+
transform: translateX(100%);
|
|
7871
|
+
}
|
|
7872
|
+
.drawer-top-enter-active[data-v-c932e83d],
|
|
7873
|
+
.drawer-top-leave-active[data-v-c932e83d] {
|
|
7874
|
+
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
7875
|
+
}
|
|
7876
|
+
.drawer-top-enter-from[data-v-c932e83d],
|
|
7877
|
+
.drawer-top-leave-to[data-v-c932e83d] {
|
|
7878
|
+
transform: translateY(-100%);
|
|
7879
|
+
}
|
|
7880
|
+
.drawer-bottom-enter-active[data-v-c932e83d],
|
|
7881
|
+
.drawer-bottom-leave-active[data-v-c932e83d] {
|
|
7882
|
+
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
7883
|
+
}
|
|
7884
|
+
.drawer-bottom-enter-from[data-v-c932e83d],
|
|
7885
|
+
.drawer-bottom-leave-to[data-v-c932e83d] {
|
|
7886
|
+
transform: translateY(100%);
|
|
7678
7887
|
}.f-message[data-v-97556afa] {
|
|
7679
7888
|
--f-bg: #1f1f1f;
|
|
7680
7889
|
--f-border: rgba(255, 255, 255, 0.08);
|