create-fesd-app 1.0.8 → 1.0.10

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-fesd-app",
3
- "version": "1.0.8",
3
+ "version": "1.0.10",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "dev": "vite",
@@ -24,7 +24,7 @@
24
24
  "dependencies": {
25
25
  "@tailwindcss/postcss": "^4.1.10",
26
26
  "@tailwindcss/vite": "^4.1.10",
27
- "@xwadex/fesd": "0.0.32",
27
+ "@xwadex/fesd": "0.0.33",
28
28
  "ansi-colors": "^4.1.3",
29
29
  "chalk": "^5.3.0",
30
30
  "clsx": "^2.1.1",
@@ -102,12 +102,19 @@
102
102
  ._wordCover
103
103
  &:only-child
104
104
  margin: 0 !important
105
+ @for $i from 2 through 5
106
+ &[img-row="x#{$i}"],
107
+ &[swiper-num="#{$i}"]
108
+ &[img-merge="on"]
109
+ ._imgCover
110
+ margin-inline: 0
105
111
  +rwdmax($basic_rwd)
106
112
  &[mobile-rwd="on"]
107
113
  ._wordCover
108
114
  margin-top: 0
109
115
  ._imgCover
110
- margin-top: $img-cover-TB-gap_rwd !important
116
+ // margin-top: $img-cover-TB-gap_rwd !important
117
+ margin-top: $img-cover-TB-gap_rwd
111
118
  order: 1
112
119
  &.typeSL,
113
120
  &.typeSR
@@ -158,22 +165,26 @@
158
165
  &.typeUR
159
166
  ._imgCover
160
167
  order: 3
168
+ // margin-bottom: 0
161
169
  ._wordCover
162
170
  margin: 0
163
171
  margin-bottom: $img-cover-TB-gap
164
- ._cover
165
- margin-bottom: 0
172
+ // ._cover
173
+ // margin-bottom: 0
166
174
  &[img-row="x2"],
167
175
  &[img-row="x3"],
168
176
  &[img-row="x4"],
169
177
  &[img-row="x5"]
170
178
  ._imgCover
171
179
  margin-bottom: #{-$cover-TB-gap}
180
+ &[img-merge="on"]
181
+ ._imgCover
182
+ margin-bottom: 0
172
183
  +rwdmax($basic_rwd)
173
184
  ._wordCover
174
185
  margin-bottom: $img-cover-TB-gap_rwd
175
186
  ._imgCover
176
- margin-bottom: 0
187
+ margin-bottom: #{-$cover-TB-gap_rwd}
177
188
  &[mobile-rwd="on"]
178
189
  ._H
179
190
  // 2025.04.21 新增 important
@@ -236,21 +247,55 @@
236
247
  &.typeDR
237
248
  ._imgCover
238
249
  order: -1
250
+ &[img-merge="off"]
251
+ &:not([img-swiper="on"])
252
+ @for $i from 2 through 5
253
+ &[img-row="x#{$i}"]
254
+ ._imgCover
255
+ margin-bottom: 0
239
256
  +rwdmax($basic_rwd)
240
257
  &[mobile-rwd="on"]
241
258
  ._imgCover
242
259
  order: 1
243
- margin-bottom: 0
260
+ &[img-merge="on"]:not([img-swiper="on"])
261
+ ._imgCover
262
+ margin-bottom: 0
263
+ &[img-merge="off"]
264
+ &:not([img-swiper="on"])
265
+ @for $i from 2 through 5
266
+ &[img-row="x#{$i}"]
267
+ ._imgCover
268
+ margin-bottom: -#{$cover-TB-gap_rwd}
244
269
 
245
270
  &.typeD
246
- ._imgCover
247
- margin-bottom: #{-$cover-TB-gap + $img-cover-TB-gap}
248
271
  ._wordCover
249
272
  margin: 0
250
- +rwdmax($basic_rwd)
273
+ &[img-merge="on"]
274
+ &:not([img-swiper="on"])
275
+ ._imgCover
276
+ margin-bottom: $img-cover-TB-gap
277
+ &:not([img-merge="on"]):not([mobile-rwd="on"])
251
278
  ._imgCover
252
- margin-bottom: #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
253
-
279
+ margin-bottom: #{-$cover-TB-gap + $img-cover-TB-gap}
280
+ +rwdmax($basic_rwd)
281
+ &[img-merge="on"]
282
+ &:not([img-swiper="on"])
283
+ ._imgCover
284
+ margin-bottom: $img-cover-TB-gap_rwd
285
+ &:not([img-merge="on"]):not([img-swiper="on"])
286
+ &:not([mobile-rwd="on"])
287
+ ._imgCover
288
+ // margin-bottom: #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
289
+ margin-bottom: $img-cover-TB-gap_rwd
290
+ ._imgCover
291
+ // margin-bottom: #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
292
+ margin-bottom: $img-cover-TB-gap_rwd
293
+ &[mobile-rwd="on"]
294
+ ._imgCover
295
+ margin-bottom: 0
296
+ &[mobile-rwd="on"]
297
+ ._imgCover
298
+ margin-bottom: -#{$cover-TB-gap_rwd}
254
299
  &.typeDL,
255
300
  &.typeDR
256
301
  ._H
@@ -325,13 +370,16 @@
325
370
  margin-top: 0
326
371
  margin-right: #{$img-cover-LR-gap - $text-padding}
327
372
  width: calc(50% - #{$img-cover-LR-gap - $text-padding})
328
- &[img-row="x2"],
329
- &[img-row="x3"],
330
- &[img-row="x4"],
331
- &[img-row="x5"]
332
- ._imgCover
333
- margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap}
334
- width: calc(50% + $cover-LR-gap)
373
+ // &[img-row="x2"],
374
+ // &[img-row="x3"],
375
+ // &[img-row="x4"],
376
+ // &[img-row="x5"]
377
+ @for $i from 2 through 5
378
+ &[img-row="x#{$i}"],
379
+ &[swiper-num="#{$i}"]
380
+ ._imgCover
381
+ margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap}
382
+ width: calc(50% + $cover-LR-gap)
335
383
  &[img-merge="on"]
336
384
  ._imgCover
337
385
  margin: 0
@@ -342,22 +390,27 @@
342
390
  ._wordCover
343
391
  margin-right: 0
344
392
  width: 100%
345
- &[img-row="x2"],
346
- &[img-row="x3"],
347
- &[img-row="x4"],
348
- &[img-row="x5"]
349
- ._imgCover
350
- margin: $img-cover-TB-gap_rwd calc(#{-$cover-LR-gap_rwd} / 2) #{-$cover-TB-gap_rwd}
351
- width: calc(100% + #{$cover-LR-gap_rwd})
393
+ // &[img-row="x2"],
394
+ // &[img-row="x3"],
395
+ // &[img-row="x4"],
396
+ // &[img-row="x5"]
397
+ @for $i from 2 through 5
398
+ &[img-row="x#{$i}"],
399
+ &[swiper-num="#{$i}"]
400
+ ._imgCover
401
+ margin: $img-cover-TB-gap_rwd calc(#{-$cover-LR-gap_rwd} / 2) #{-$cover-TB-gap_rwd}
402
+ width: calc(100% + #{$cover-LR-gap_rwd})
352
403
  &[img-merge="on"]
353
404
  ._imgCover
354
405
  margin: $img-cover-TB-gap_rwd 0 0
355
406
  width: 100%
356
407
  &[mobile-rwd="on"]
357
408
  ._imgCover
358
- margin: 0 0 #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
409
+ // margin: 0 0 #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
410
+ margin-top: 0
359
411
  order: initial
360
412
  ._wordCover
413
+ margin-top: $img-cover-TB-gap_rwd
361
414
  width: 100%
362
415
  &.typeLR
363
416
  &:after,
@@ -371,13 +424,20 @@
371
424
  float: right
372
425
  margin-left: $img-cover-LR-gap
373
426
  margin-bottom: #{-$cover-TB-gap + $wrapping-gap}
374
- &[img-row="x2"],
375
- &[img-row="x3"],
376
- &[img-row="x4"],
377
- &[img-row="x5"]
378
- ._imgCover
379
- margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap + $wrapping-gap} #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)}
380
- width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
427
+ // &[img-row="x2"],
428
+ // &[img-row="x3"],
429
+ // &[img-row="x4"],
430
+ // &[img-row="x5"]
431
+ @for $i from 2 through 5
432
+ &[img-row="x#{$i}"]
433
+ ._imgCover
434
+ margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap + $wrapping-gap} #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)}
435
+ width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
436
+ // 2025.09.09 scarlett 新增
437
+ &[swiper-num="#{$i}"]
438
+ ._imgCover
439
+ margin: 0 #{-$cover-LR-gap * 0.5} #{$cover-TB-gap - $wrapping-gap} #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)}
440
+ width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
381
441
  &[img-merge="on"]
382
442
  ._imgCover
383
443
  margin: 0 0 $wrapping-gap $img-cover-LR-gap
@@ -394,13 +454,16 @@
394
454
  ._imgCover
395
455
  margin: $img-cover-TB-gap_rwd 0 #{-$cover-TB-gap_rwd}
396
456
  order: 1
397
- &[img-row="x2"],
398
- &[img-row="x3"],
399
- &[img-row="x4"],
400
- &[img-row="x5"]
401
- ._imgCover
402
- margin: $img-cover-TB-gap_rwd #{-$cover-LR-gap_rwd * 0.5} #{-$cover-TB-gap_rwd}
403
- width: calc(100% + #{$cover-LR-gap_rwd})
457
+ // &[img-row="x2"],
458
+ // &[img-row="x3"],
459
+ // &[img-row="x4"],
460
+ // &[img-row="x5"]
461
+ @for $i from 2 through 5
462
+ &[img-row="x#{$i}"],
463
+ &[swiper-num="#{$i}"]
464
+ ._imgCover
465
+ margin: $img-cover-TB-gap_rwd #{-$cover-LR-gap_rwd * 0.5} #{-$cover-TB-gap_rwd}
466
+ width: calc(100% + #{$cover-LR-gap_rwd})
404
467
  &[img-merge="on"]
405
468
  ._imgCover
406
469
  margin-left: 0
@@ -427,13 +490,17 @@
427
490
  margin-top: 0
428
491
  margin-left: #{$img-cover-LR-gap - $text-padding}
429
492
  width: calc(50% - #{$img-cover-LR-gap - $text-padding})
430
- &[img-row="x2"],
431
- &[img-row="x3"],
432
- &[img-row="x4"],
433
- &[img-row="x5"]
434
- ._imgCover
435
- margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap}
436
- width: calc(50% - #{$cover-LR-gap})
493
+ // &[img-row="x2"],
494
+ // &[img-row="x3"],
495
+ // &[img-row="x4"],
496
+ // &[img-row="x5"]
497
+ @for $i from 2 through 5
498
+ &[img-row="x#{$i}"],
499
+ &[swiper-num="#{$i}"]
500
+ ._imgCover
501
+ margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap}
502
+ // width: calc(50% - #{$cover-LR-gap})
503
+ width: calc(50% + #{$cover-LR-gap})
437
504
  &[img-merge="on"]
438
505
  ._imgCover
439
506
  margin: 0 $img-cover-LR-gap 0 0
@@ -443,22 +510,37 @@
443
510
  margin: 0 0 #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
444
511
  ._wordCover
445
512
  margin-left: 0
513
+ // 2025.09.09 scarlett 新增
514
+ // margin-top: #{$cover-TB-gap_rwd}
515
+ margin-top: #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
516
+ // -
446
517
  width: 100%
447
- &[img-row="x2"],
448
- &[img-row="x3"],
449
- &[img-row="x4"],
450
- &[img-row="x5"]
451
- ._imgCover
452
- margin: 0 #{-$cover-LR-gap_rwd * 0.5} #{-$cover-TB-gap_rwd}
453
- width: calc(100% + #{$cover-LR-gap_rwd})
518
+ // &[img-row="x2"],
519
+ // &[img-row="x3"],
520
+ // &[img-row="x4"],
521
+ // &[img-row="x5"]
522
+ @for $i from 2 through 5
523
+ &[img-row="x#{$i}"],
524
+ &[swiper-num="#{$i}"]
525
+ ._imgCover
526
+ margin: 0 #{-$cover-LR-gap_rwd * 0.5}
527
+ width: calc(100% + #{$cover-LR-gap_rwd})
454
528
  &[img-merge="on"]
455
529
  ._imgCover
456
530
  margin-left: 0
457
531
  margin-right: 0
458
532
  width: 100%
533
+ ._wordCover
534
+ margin-top: #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd + $cover-TB-gap_rwd }
459
535
  &[mobile-rwd="on"]
536
+ ._wordCover
537
+ margin-top: 0
460
538
  ._imgCover
461
539
  margin: $img-cover-TB-gap_rwd 0 #{-$cover-TB-gap_rwd}
540
+ // 2025.09.09 scarlett 新增
541
+ &[img-swiper="on"]
542
+ ._imgCover
543
+ margin-bottom: 0
462
544
  &.typeRR
463
545
  &:after,
464
546
  &:before
@@ -471,13 +553,20 @@
471
553
  float: left
472
554
  margin-right: $img-cover-LR-gap
473
555
  margin-bottom: #{-$cover-TB-gap + $wrapping-gap}
474
- &[img-row="x2"],
475
- &[img-row="x3"],
476
- &[img-row="x4"],
477
- &[img-row="x5"]
478
- ._imgCover
479
- margin: 0 #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} #{-$cover-TB-gap + $wrapping-gap} #{-$cover-LR-gap * 0.5}
480
- width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
556
+ // &[img-row="x2"],
557
+ // &[img-row="x3"],
558
+ // &[img-row="x4"],
559
+ // &[img-row="x5"]
560
+ @for $i from 2 through 5
561
+ &[img-row="x#{$i}"]
562
+ ._imgCover
563
+ margin: 0 #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} #{-$cover-TB-gap + $wrapping-gap} #{-$cover-LR-gap * 0.5}
564
+ width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
565
+ // 2025.09.09 scarlett 新增
566
+ &[swiper-num="#{$i}"]
567
+ ._imgCover
568
+ margin: 0 #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} #{$cover-TB-gap - $wrapping-gap} #{-$cover-LR-gap * 0.5}
569
+ width: calc(50% - #{$img-cover-LR-gap - ($cover-LR-gap * 0.5)} + #{$cover-LR-gap * 0.5})
481
570
  &[img-merge="on"]
482
571
  ._imgCover
483
572
  margin: 0 $img-cover-LR-gap $wrapping-gap 0
@@ -493,13 +582,19 @@
493
582
  width: 100%
494
583
  ._imgCover
495
584
  margin: 0 0 #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
496
- &[img-row="x2"],
497
- &[img-row="x3"],
498
- &[img-row="x4"],
499
- &[img-row="x5"]
500
- ._imgCover
501
- margin: 0 #{-$cover-LR-gap_rwd * 0.5} #{$img-cover-TB-gap_rwd + $cover-TB-gap_rwd - $img-cover-TB-gap_rwd}
502
- width: calc(100% + #{$cover-LR-gap_rwd})
585
+ // &[img-row="x2"],
586
+ // &[img-row="x3"],
587
+ // &[img-row="x4"],
588
+ // &[img-row="x5"]
589
+ @for $i from 2 through 5
590
+ &[img-row="x#{$i}"],
591
+ &[swiper-num="#{$i}"]
592
+ ._imgCover
593
+ // 2025.09.09 scarlett 新增
594
+ // margin: 0 #{-$cover-LR-gap_rwd * 0.5} #{$img-cover-TB-gap_rwd + $cover-TB-gap_rwd - $img-cover-TB-gap_rwd}
595
+ margin: 0 #{-$cover-LR-gap_rwd * 0.5} #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
596
+ // -
597
+ width: calc(100% + #{$cover-LR-gap_rwd})
503
598
  &[img-merge="on"]
504
599
  ._imgCover
505
600
  margin: 0 0 #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd} 0
@@ -594,17 +689,36 @@
594
689
  &:not(:last-child)
595
690
  margin-bottom: $article-gap_rwd
596
691
 
692
+ // 2025.09.09 scarlett 新增
693
+ // img-row
694
+ @for $i from 2 through 5
695
+ &[img-row="x#{$i}"],
696
+ &[swiper-num="#{$i}"]
697
+ ._imgCover
698
+ width: calc(100% + #{$cover-LR-gap})
699
+ margin-inline: #{-$cover-LR-gap * 0.5}
700
+ ._cover
701
+ margin-bottom: $cover-TB-gap
702
+ padding: 0 #{$cover-LR-gap * 0.5}
703
+ width: calc(100% / #{$i})
704
+ +rwdmax($basic_rwd)
705
+ ._imgCover
706
+ margin-inline: #{-$cover-LR-gap_rwd * 0.5}
707
+ width: calc(100% + #{$cover-LR-gap_rwd})
708
+ ._cover
709
+ margin-bottom: $cover-TB-gap_rwd
710
+ padding: 0 #{$cover-LR-gap_rwd * 0.5}
711
+ width: calc(100% / 2)
712
+
597
713
  // swiper
598
714
  &[img-swiper="on"]
599
- &.typeD
600
- ._imgCover
601
- // margin-bottom: #{-$cover-TB-gap + $img-cover-TB-gap}
602
- margin-bottom: #{$img-cover-TB-gap - (-$cover-TB-gap + $img-cover-TB-gap)}
603
715
  ._imgCover
604
716
  position: relative
605
- margin: 0 #{-$swiper-cover-LR-gap * 0.5}
717
+ // 2025.09.09 scarlett 新增
718
+ // margin: 0 #{-$swiper-cover-LR-gap * 0.5}
719
+ // -
606
720
  ._cover
607
- margin-bottom: 0
721
+ // margin-bottom: 0
608
722
  padding: 0 #{$swiper-cover-LR-gap * 0.5}
609
723
  .swiper-button-cover
610
724
  &:before
@@ -625,26 +739,7 @@
625
739
  .swiper-button-cover
626
740
  &:before
627
741
  padding-bottom: 56.25% !important
628
-
629
- // img-row
630
- @for $i from 2 through 5
631
- &[img-row="x#{$i}"],
632
- &[swiper-num="#{$i}"]
633
- ._imgCover
634
- // margin: 0 #{-$cover-LR-gap * 0.5} #{-$cover-TB-gap + $img-cover-TB-gap} #{-$cover-LR-gap * 0.5}
635
- width: calc(100% + #{$cover-LR-gap})
636
- ._cover
637
- margin-bottom: $cover-TB-gap
638
- padding: 0 #{$cover-LR-gap * 0.5}
639
- width: calc(100% / #{$i})
640
- +rwdmax($basic_rwd)
641
- ._imgCover
642
- // margin: 0 #{-$cover-LR-gap_rwd * 0.5} #{-$cover-TB-gap_rwd + $img-cover-TB-gap_rwd}
643
- width: calc(100% + #{$cover-LR-gap_rwd})
644
- ._cover
645
- margin-bottom: $cover-TB-gap_rwd
646
- padding: 0 #{$cover-LR-gap_rwd * 0.5}
647
- width: calc(100% / 2)
742
+ // -
648
743
 
649
744
  // img-merge
650
745
  &[img-merge="on"]
@@ -653,7 +748,7 @@
653
748
  margin-bottom: 0
654
749
  ._cover
655
750
  padding: 0
656
- &:not([swiper-num])
751
+ &:not([img-swiper="on"])
657
752
  ._imgCover
658
753
  // margin: 0 0 $cover-TB-gap
659
754
  ._cover
@@ -720,7 +815,14 @@
720
815
  &[button-align="right"]
721
816
  ._buttonCover
722
817
  text-align: right
723
-
818
+ // 新增 - 圖片比例若設定不指定時, 圖片寬度是否自動填滿
819
+ &[img-widthFull="false"]
820
+ &:not([img-size="x11"]):not([img-size="x34"]):not([img-size="x43"]):not([img-size="x169"])
821
+ ._imgCover
822
+ ._photo
823
+ justify-content: flex-start
824
+ img
825
+ width: auto
724
826
  // img-size
725
827
  // &[img-swiper="on"],
726
828
  &[img-size="x11"],
@@ -743,6 +845,7 @@
743
845
  transform: translate(-50%, -50%)
744
846
  height: auto
745
847
 
848
+
746
849
  $proportions: ("x11": 100%, "x34": 133.3%, "x43": 75%, "x169": 56.25%)
747
850
  @each $proportion, $value in $proportions
748
851
  &[img-size="#{$proportion}"]
@@ -842,11 +945,15 @@
842
945
  &.overflow
843
946
  ._table
844
947
  margin-top: $table-TB-gap
845
- margin-bottom: $table-TB-gap
846
948
  cursor: grab
847
949
  +rwdmax($basic_rwd)
848
950
  margin-top: $table-TB-gap_rwd
849
- margin-bottom: $table-TB-gap_rwd
951
+ ._wordCover
952
+ margin-top: 0
953
+ margin-bottom: $table-TB-gap
954
+ +rwdmax($basic_rwd)
955
+ margin-top: 0
956
+ margin-bottom: $table-TB-gap_rwd
850
957
  ._tableCover
851
958
  width: 100%
852
959
  ._table
@@ -856,7 +963,7 @@
856
963
  position: relative
857
964
  -webkit-overflow-scrolling: touch
858
965
  scrollbar-width: none
859
- overscroll-behavior: contain
966
+ overscroll-behavior-inline: contain
860
967
  &::-webkit-scrollbar
861
968
  width: 2px
862
969
  height: 0
@@ -892,13 +999,13 @@
892
999
  @extend %table_navigation
893
1000
 
894
1001
  // 對齊方式同大標題
895
- &[h-align="center"]
1002
+ &[tip-align="center"]
896
1003
  ._tipText
897
1004
  justify-content: center
898
- &[h-align="right"]
1005
+ &[tip-align="right"]
899
1006
  ._tipText
900
1007
  justify-content: flex-end
901
- &[h-align="left"]
1008
+ &[tip-align="left"]
902
1009
  ._tipText
903
1010
  justify-content: flex-start
904
1011
 
@@ -919,4 +1026,3 @@
919
1026
  &::-webkit-scrollbar-thumb
920
1027
  background: none
921
1028
  border-radius: 99em
922
-