create-fesd-app 1.0.2 → 1.0.3

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.
Files changed (5) hide show
  1. package/package.json +2 -2
  2. package/src/assets/css/layouts/article4/_article4_2.0.sass +10 -0
  3. package/src/assets/css/layouts/article4/_article4_setting.sass +39 -2
  4. package/src/layouts/article4/_article.pug +19 -18
  5. package/src/pages/about.pug +118 -255
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-fesd-app",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
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.27",
27
+ "@xwadex/fesd": "0.0.28",
28
28
  "ansi-colors": "^4.1.3",
29
29
  "chalk": "^5.3.0",
30
30
  "clsx": "^2.1.1",
package/src/assets/css/layouts/article4/_article4_2.0.sass CHANGED
@@ -754,6 +754,8 @@
754
754
  padding-bottom: #{$value} !important
755
755
  width: 100%
756
756
  content: ''
757
+ .swiper-button-cover
758
+ height: auto
757
759
  @for $i from 2 through 5
758
760
  &[swiper-num="#{$i}"]
759
761
  ._imgCover
@@ -840,15 +842,18 @@
840
842
  &.overflow
841
843
  ._table
842
844
  margin-top: $table-TB-gap
845
+ margin-bottom: $table-TB-gap
843
846
  cursor: grab
844
847
  +rwdmax($basic_rwd)
845
848
  margin-top: $table-TB-gap_rwd
849
+ margin-bottom: $table-TB-gap_rwd
846
850
  ._tableCover
847
851
  width: 100%
848
852
  ._table
849
853
  width: 100%
850
854
  max-width: 100%
851
855
  overflow-x: auto
856
+ position: relative
852
857
  -webkit-overflow-scrolling: touch
853
858
  scrollbar-width: none
854
859
  overscroll-behavior: contain
@@ -868,7 +873,10 @@
868
873
  width: 100%
869
874
  -webkit-text-size-adjust: 100%
870
875
  th, td
876
+ width: var(--minWidth, #{$table-min-width})
871
877
  min-width: var(--minWidth, #{$table-min-width})
878
+ vertical-align: middle
879
+ word-break: break-all
872
880
  padding: $table-padding
873
881
  +rwdmax($basic_rwd)
874
882
  padding: $table-padding_rwd
@@ -880,6 +888,8 @@
880
888
  padding: 0 $text-padding
881
889
  +rwdmax($basic_rwd)
882
890
  padding: 0 $text-padding_rwd
891
+ .table_navigation
892
+ @extend %table_navigation
883
893
 
884
894
  // 對齊方式同大標題
885
895
  &[h-align="center"]
package/src/assets/css/layouts/article4/_article4_setting.sass CHANGED
@@ -86,7 +86,7 @@ $table-TB-gap: 20px
86
86
  $table-TB-gap_rwd: 20px
87
87
 
88
88
  // 表格最小寬度
89
- $table-min-width: 100px
89
+ $table-min-width: 180px
90
90
  $freeze-table-height: 500px
91
91
 
92
92
  // 表格間距
@@ -367,6 +367,43 @@ $quote-TB-gap: 20px
367
367
  i.icon-drag
368
368
  font-size: px(20)
369
369
 
370
+ %table_navigation
371
+ gap: 20px
372
+ display: flex
373
+ justify-content: center
374
+ align-items: center
375
+ .table-nav-left,
376
+ .table-nav-right
377
+ position: relative
378
+ cursor: pointer
379
+ &.disabled
380
+ pointer-events: none
381
+ opacity: .3
382
+ &::after
383
+ content: ''
384
+ display: block
385
+ width: 40px
386
+ height: 40px
387
+ border: 1px solid rgba(#000,.5)
388
+ border-radius: 5px
389
+ &::before
390
+ content: ''
391
+ width: 10px
392
+ height: 10px
393
+ position: absolute
394
+ top: 50%
395
+ left: 50%
396
+ .table-nav-left
397
+ &::before
398
+ border-left: 2px solid #000
399
+ border-bottom: 2px solid #000
400
+ transform: translate(-25%, -50%) rotate(45deg)
401
+ .table-nav-right
402
+ &::before
403
+ border-right: 2px solid #000
404
+ border-top: 2px solid #000
405
+ transform: translate(-75%, -50%) rotate(45deg)
406
+
370
407
  // 以下可修改 - 可新增 / 自訂表格樣式
371
408
  // 表格內框線樣式建議使用 偽元素製作以避免凍結合併時出錯
372
409
  %table_solid_single
@@ -554,7 +591,7 @@ $quote-TB-gap: 20px
554
591
  p
555
592
  font-size: 16px
556
593
  line-height: 1.2
557
- white-space: pre
594
+ white-space: pre-wrap
558
595
  em
559
596
  font-style: italic
560
597
  a
package/src/layouts/article4/_article.pug CHANGED
@@ -25,20 +25,18 @@ mixin article(data, HTag='h4', subHTag='h5')
25
25
  mixin dynamicHeading(tag, className, content)
26
26
  - const validTags = ['h2', 'h3', 'h4', 'h5', 'h6']
27
27
  - const seoTag = validTags.includes(tag) ? tag : 'h4'
28
- if seoTag === 'h1'
29
- h1(class=className)= content
30
- else if seoTag === 'h2'
31
- h2(class=className)= content
28
+ if seoTag === 'h2'
29
+ h2(class=className) !{content}
32
30
  else if seoTag === 'h3'
33
- h3(class=className)= content
31
+ h3(class=className) !{content}
34
32
  else if seoTag === 'h4'
35
- h4(class=className)= content
33
+ h4(class=className) !{content}
36
34
  else if seoTag === 'h5'
37
- h5(class=className)= content
35
+ h5(class=className) !{content}
38
36
  else if seoTag === 'h6'
39
- h6(class=className)= content
37
+ h6(class=className) !{content}
40
38
  else
41
- p(class=className)= content
39
+ p(class=className) !{content}
42
40
 
43
41
  //- ========================
44
42
  //- mixin: backgroundWrap
@@ -94,12 +92,12 @@ mixin wordBlock(d, isComplex, HTag, subHTag)
94
92
  +dynamicHeading(subHTag, '_subH', d.subH)
95
93
  if d.P
96
94
  ._P
97
- p= d.P
95
+ p !{d.P}
98
96
  if d.button
99
97
  span._buttonCover
100
98
  a._button(href='javascript:;')= d.button
101
99
  else
102
- if d.H || d.subH || d.P
100
+ if (!isComplex && d.H) || d.subH || d.P
103
101
  ._wordCover
104
102
  if !isComplex && d.H
105
103
  +dynamicHeading(d.titleTag || 'h4', '_H', d.H)
@@ -107,7 +105,7 @@ mixin wordBlock(d, isComplex, HTag, subHTag)
107
105
  +dynamicHeading(d.subTitleTag || 'h5', '_subH', d.subH)
108
106
  if d.P
109
107
  ._P
110
- p= d.P
108
+ p !{d.P}
111
109
  if d.button
112
110
  span._buttonCover
113
111
  a._button(href='javascript:;')= d.button
@@ -117,10 +115,10 @@ mixin wordBlock(d, isComplex, HTag, subHTag)
117
115
  //- ========================
118
116
  mixin quoteBlock(d)
119
117
  if d.quote
120
- q._quote= d.quote
118
+ q._quote !{d.quote}
121
119
  if d.quoteP
122
120
  ._P
123
- p= d.quoteP
121
+ p !{d.quoteP}
124
122
 
125
123
 
126
124
  //- ========================
@@ -141,13 +139,16 @@ mixin tableBlock(d,tableData)
141
139
  each head in tableData.table.head
142
140
  tr
143
141
  each th in head
144
- th=th
142
+ th
143
+ p=th
145
144
  tbody
146
145
  each body in tableData.table.body
147
146
  tr
148
147
  each td in body
149
- td=td
150
- if block
148
+ td
149
+ p=td
150
+ else if block
151
151
  ._table
152
152
  block
153
- p._description !{tableData.description}
153
+ ._P
154
+ p !{tableData.paragraph}
package/src/pages/about.pug CHANGED
@@ -285,7 +285,7 @@ block content
285
285
  tableData: {
286
286
  H: 'This is the title of the Form',
287
287
  tipText: '左右托拉',
288
- description: "What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.",
288
+ paragraph: "What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.",
289
289
  table: {
290
290
  head: [
291
291
  {
@@ -342,7 +342,7 @@ block content
342
342
  ],
343
343
  },
344
344
  videoDemo:{
345
- articleType: 'typeU',
345
+ articleType: 'typeD',
346
346
  H: 'This is the title of the Article, A satirical title generator for designers...',
347
347
  subH: 'Sub-Title of the Article, A satirical title generator for designers...',
348
348
  P: 'paragraph of the Article, A satirical title generator for designers...',
@@ -353,8 +353,42 @@ block content
353
353
  "video-type":"youtube",
354
354
  "video-id":"3-v360P1rUY",
355
355
  },
356
- videoType: 'youtube',
357
- videoId: 'S69LZK3-Z5E',
356
+ img: 'https://picsum.photos/id/964/700/400',
357
+ description: 'Description'
358
+ },
359
+ ],
360
+ },
361
+ videoWithSwiperDemo:{
362
+ articleType: 'typeD',
363
+ H: 'This is the title of the Article, A satirical title generator for designers...',
364
+ subH: 'Sub-Title of the Article, A satirical title generator for designers...',
365
+ P: 'paragraph of the Article, A satirical title generator for designers...',
366
+ button: 'Button Description',
367
+ SwiperImg:[
368
+ {
369
+ videoAttributes: {
370
+ "video-type":"youtube",
371
+ "video-id":"3-v360P1rUY",
372
+ "highquality":'on',
373
+ "video-starttime":'600',
374
+ },
375
+ img: 'https://picsum.photos/id/961/900/500',
376
+ description: 'Description'
377
+ },
378
+ {
379
+ videoAttributes: {
380
+ "video-id": '7449986489389272327' ,
381
+ "video-autoplay": 'on' ,
382
+ "video-type": 'tiktok',
383
+ },
384
+ img: 'https://picsum.photos/id/964/700/400',
385
+ description: 'Description'
386
+ },
387
+ {
388
+ videoAttributes: {
389
+ "video-type":"youtube",
390
+ "video-id":"3-v360P1rUY",
391
+ },
358
392
  img: 'https://picsum.photos/id/964/700/400',
359
393
  description: 'Description'
360
394
  },
@@ -367,7 +401,19 @@ block content
367
401
  },
368
402
  tableData: {
369
403
  H: 'This is the title of the Form',
370
- description: "What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.",
404
+ paragraph: "What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.",
405
+ },
406
+ },
407
+ tableFreezeDemo:{
408
+ articleType: 'typeTable',
409
+ attributes: {
410
+ "freeze-table": 'on',
411
+ "freeze-table-row": '3',
412
+ "freeze-table-col": '1'
413
+ },
414
+ tableData: {
415
+ H: 'This is the title of the Form',
416
+ paragraph: "What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.",
371
417
  },
372
418
  },
373
419
  }
@@ -403,6 +449,7 @@ block content
403
449
  // 其他
404
450
  +article(data.swiperDemo)
405
451
  +article(data.videoDemo)
452
+ +article(data.videoWithSwiperDemo)
406
453
  +article(data.tableDemo)
407
454
  table
408
455
  thead
@@ -483,256 +530,72 @@ block content
483
530
  span eee
484
531
  td(style='width:300px; min-width:300px;')
485
532
  span fff
486
-
487
-
488
-
489
- // 舊的範例用！！！
490
- // 引言樣式
491
- article._article.typeQuote(data-aost data-aost-fade-up quote-color='#7cc087')
492
- ._contentWrap
493
- q._quote Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.
494
- ._P
495
- p aaa
496
-
497
- // 簡易表格樣式 基本格式(無特殊設定)
498
- article._article.typeTable(data-aost data-aost-fade-up data-table-markdown='on')
499
- ._contentWrap
500
- h4._H This is the title of the Form (基本表格)
501
- ._tableCover
502
- p._tipText
503
- i.icon-drag
504
- span 左右托拉查看表格資訊
505
- ._table
506
- table
507
- thead
508
- tr(data-row='0')
509
- th(data-column="A")
510
- | # 預設均分
511
- | (最小100)
512
- th(data-column="B")
513
- | # 預設均分
514
- | (最小100)
515
- tbody
516
- for i in [1,2,3,4,5,6,7]
517
- tr(data-row=`${i}`)
518
- td(data-column="A")
519
- | @center@列點@center@
520
- | - <a href="google.com">test</a>
521
- | - 列點連結[點我](http://example.com/ "Title")
522
- | - **列點粗體**
523
- td(data-column="B")
524
- | 1. ~~列點斜體~~
525
- | 2. *列點斜體*
526
- p._description What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.
527
-
528
- // 合併 : td/th 設定 colspan="2" / rowspan="2"
529
- // 個別表格設定最小寬度(非預設) table(style='--minWidth: 500px;')
530
- article._article.typeTable(data-aost data-aost-fade-up)
531
- ._contentWrap
532
- h4._H This is the title of the Form (有合併/拖拉的)
533
- ._tableCover
534
- p._tipText
535
- i.icon-drag
536
- span 左右托拉查看表格資訊
537
- ._table
538
- table(style='--minWidth: 500px;')
539
- thead
540
- tr(data-row='0')
541
- th(data-column="A")
542
- span 最小寬500
543
- th(data-column="B")
544
- span 最小寬500
545
- th(data-column="C")
546
- span 最小寬500
547
- tbody
548
- tr(data-row='1')
549
- td(data-column="A")
550
- span aaa
551
- td(data-column="B" colspan="2")
552
- span bbb
553
- tr(data-row='2')
554
- td(data-column="A")
555
- span aaa
556
- td(data-column="B" rowspan="2")
557
- span bbb
558
- td(data-column="C")
559
- span ccc
560
- tr(data-row='3')
561
- td(data-column="A")
562
- span aaa
563
- td(data-column="C")
564
- span ccc
565
- for i in [1,2,3,4,5,6,7]
566
- tr(data-row=`${i + 3}`)
567
- td(data-column="A")
568
- span aaa
569
- td(data-column="B")
570
- span bbb
571
- td(data-column="C")
572
- span ccc
573
- p._description What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.
574
-
575
- // 特例表格樣式 (TSC專用)
576
- // 凍結表格設定 freeze-table='on' 預設凍結 第一列/第一欄
577
- // 個別欄位寬度設定 td(style='width:100px; min-width:100px;')
578
- article._article.typeTable(data-aost data-aost-fade-up freeze-table='on' freeze-table-row='1' freeze-table-col='1')
579
- ._contentWrap
580
- h4._H This is the title of the Form (有合併/拖拉/凍結的)
581
- ._tableCover
582
- p._tipText
583
- i.icon-drag
584
- span 左右托拉查看表格資訊
585
- ._table
586
- table(style='--minWidth: 400px;')
587
- thead
588
- tr(data-row='0')
589
- th(data-column="A" style='width: 200px; min-width: 200px;')
590
- span 固定寬度 200
591
- th(data-column="B")
592
- span BBB
593
- th(data-column="C")
594
- span CCC
595
- th(data-column="D")
596
- span DDD
597
- th(data-column="E")
598
- span EEE
599
- tbody
600
- tr(data-row='1')
601
- td(data-column="A" style='width: 200px; min-width: 200px;')
602
- span aaa
603
- td(data-column="B" colspan="2")
604
- span bbb
605
- td(data-column="D")
606
- span ddd
607
- td(data-column="E")
608
- span eee
609
- tr(data-row='2')
610
- td(data-column="A" style='width: 200px; min-width: 200px;')
611
- span aaa
612
- td(data-column="B" rowspan="2")
613
- span bbb
614
- td(data-column="C")
615
- span ccc
616
- td(data-column="D")
617
- span ddd
618
- td(data-column="E")
619
- span eee
620
- tr(data-row='3')
621
- td(data-column="A" style='width: 200px; min-width: 200px;')
622
- span aaa
623
- td(data-column="C")
624
- span ccc
625
- td(data-column="D")
626
- span ddd
627
- td(data-column="E")
628
- span eee
629
- for i in [1,2,3,4,5,6,7]
630
- tr(data-row=`${i+3}`)
631
- td(data-column="A" style='width: 200px; min-width: 200px;')
632
- span aaa
633
- td(data-column="B")
634
- span bbb
635
- td(data-column="C")
636
- span ccc
637
- td(data-column="D")
638
- span ddd
639
- td(data-column="E")
640
- span eee
641
- p._description What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.
642
-
643
- // 特例表格樣式 (TSC專用)
644
- // 凍結表格設定 freeze-table='on'
645
- // 凍結行列設定 freeze-table-row='2' freeze-table-col='2'
646
- article._article.typeTable(data-aost data-aost-fade-up freeze-table='on' freeze-table-row='3' freeze-table-col='1')
647
- ._contentWrap
648
- h4._H This is the title of the Form (有合併/拖拉/凍結多欄多列的)
649
- ._tableCover
650
- p._tipText
651
- i.icon-drag
652
- span 左右托拉查看表格資訊
653
- ._table
654
- table
655
- tbody
656
- tr(data-row='0')
657
- td(data-column="A" rowspan="3" style='width:200px; min-width:200px;')
658
- span aaa
659
- td(data-column="B" colspan="3" style='width:200px; min-width:200px;')
660
- span bbb
661
- //- td(data-column="C" style='width:200px; min-width:200px;')
662
- //- span ccc
663
- //- td(data-column="D" style='width:300px; min-width:300px;')
664
- //- span ddd
665
- td(data-column="E" style='width:300px; min-width:300px;')
666
- span eee
667
- td(data-column="F" style='width:300px; min-width:300px;')
668
- span fff
669
- tr(data-row='1')
670
- //- td(data-column="A" style='width:200px; min-width:200px;')
671
- //- span aaa
672
- td(data-column="B" rowspan="2" style='width:200px; min-width:200px;')
673
- span bbb
674
- td(data-column="C" colspan="3" style='width:200px; min-width:200px;')
675
- span ccc
676
- //- td(data-column="D" style='width:300px; min-width:300px;')
677
- //- span ddd
678
- //- td(data-column="E" style='width:300px; min-width:300px;')
679
- //- span eee
680
- td(data-column="F" style='width:300px; min-width:300px;')
681
- span fff
682
- tr(data-row='2')
683
- //- td(data-column="A" rowspan="2" style='width:200px; min-width:200px;')
684
- //- span aaa
685
- //- td(data-column="B" style='width:200px; min-width:200px;')
686
- //- span bbb
687
- td(data-column="C" style='width:300px; min-width:300px;')
688
- span ccc
689
- td(data-column="D" style='width:300px; min-width:300px;')
690
- span ddd
691
- td(data-column="E" style='width:300px; min-width:300px;')
692
- span eee
693
- td(data-column="F" style='width:300px; min-width:300px;')
694
- span fff
695
- tr(data-row='3')
696
- td(data-column="A" rowspan="2" style='width:200px; min-width:200px;')
697
- span aaa
698
- td(data-column="B" style='width:200px; min-width:200px;')
699
- span bbb
700
- td(data-column="C" style='width:300px; min-width:300px;')
701
- span ccc
702
- td(data-column="D" style='width:300px; min-width:300px;')
703
- span ddd
704
- td(data-column="E" style='width:300px; min-width:300px;')
705
- span eee
706
- td(data-column="F" style='width:300px; min-width:300px;')
707
- span fff
708
- tr(data-row='3')
709
- //- td(data-column="B" style='width:200px; min-width:200px;')
710
- //- span bbb
711
- td(data-column="B" style='width:200px; min-width:200px;')
712
- span bbb
713
- td(data-column="C" style='width:300px; min-width:300px;')
714
- span ccc
715
- td(data-column="D" style='width:300px; min-width:300px;')
716
- span ddd
717
- td(data-column="E" style='width:300px; min-width:300px;')
718
- span eee
719
- td(data-column="F" style='width:300px; min-width:300px;')
720
- span fff
721
- for i in [1,2,3,4,5,6,7]
722
- tr(data-row=`${i+3}`)
723
- td(data-column="A" style='width:200px; min-width:200px;')
724
- span aaa
725
- td(data-column="B" style='width:200px; min-width:200px;')
726
- span bbb
727
- td(data-column="C" style='width:300px; min-width:300px;')
728
- span ccc
729
- td(data-column="D" style='width:300px; min-width:300px;')
730
- span ddd
731
- td(data-column="E" style='width:300px; min-width:300px;')
732
- span eee
733
- td(data-column="F" style='width:300px; min-width:300px;')
734
- span fff
735
- p._description What would the museum in your imagination look like? It's a good idea to build your favorite museum in Mondo Museum, whether it's to be displayed in a sub-category, or to show it all at once and make a sensation in the world.
533
+ +article(data.tableFreezeDemo)
534
+ table
535
+ tbody
536
+ tr(data-row='0')
537
+ td(data-column="A" rowspan="3" style='width:200px; min-width:200px;')
538
+ span aaa
539
+ td(data-column="B" colspan="3" style='width:200px; min-width:200px;')
540
+ span bbb
541
+ td(data-column="E" style='width:300px; min-width:300px;')
542
+ span eee
543
+ td(data-column="F" style='width:300px; min-width:300px;')
544
+ span fff
545
+ tr(data-row='1')
546
+ td(data-column="B" rowspan="2" style='width:200px; min-width:200px;')
547
+ span bbb
548
+ td(data-column="C" colspan="3" style='width:200px; min-width:200px;')
549
+ span ccc
550
+ td(data-column="F" style='width:300px; min-width:300px;')
551
+ span fff
552
+ tr(data-row='2')
553
+ td(data-column="C" style='width:300px; min-width:300px;')
554
+ span ccc
555
+ td(data-column="D" style='width:300px; min-width:300px;')
556
+ span ddd
557
+ td(data-column="E" style='width:300px; min-width:300px;')
558
+ span eee
559
+ td(data-column="F" style='width:300px; min-width:300px;')
560
+ span fff
561
+ tr(data-row='3')
562
+ td(data-column="A" rowspan="2" style='width:200px; min-width:200px;')
563
+ span aaa
564
+ td(data-column="B" style='width:200px; min-width:200px;')
565
+ span bbb
566
+ td(data-column="C" style='width:300px; min-width:300px;')
567
+ span ccc
568
+ td(data-column="D" style='width:300px; min-width:300px;')
569
+ span ddd
570
+ td(data-column="E" style='width:300px; min-width:300px;')
571
+ span eee
572
+ td(data-column="F" style='width:300px; min-width:300px;')
573
+ span fff
574
+ tr(data-row='3')
575
+ td(data-column="B" style='width:200px; min-width:200px;')
576
+ span bbb
577
+ td(data-column="C" style='width:300px; min-width:300px;')
578
+ span ccc
579
+ td(data-column="D" style='width:300px; min-width:300px;')
580
+ span ddd
581
+ td(data-column="E" style='width:300px; min-width:300px;')
582
+ span eee
583
+ td(data-column="F" style='width:300px; min-width:300px;')
584
+ span fff
585
+ for i in [1,2,3,4,5,6,7]
586
+ tr(data-row=`${i+3}`)
587
+ td(data-column="A" style='width:200px; min-width:200px;')
588
+ span aaa
589
+ td(data-column="B" style='width:200px; min-width:200px;')
590
+ span bbb
591
+ td(data-column="C" style='width:300px; min-width:300px;')
592
+ span ccc
593
+ td(data-column="D" style='width:300px; min-width:300px;')
594
+ span ddd
595
+ td(data-column="E" style='width:300px; min-width:300px;')
596
+ span eee
597
+ td(data-column="F" style='width:300px; min-width:300px;')
598
+ span fff
736
599
 
737
600
 
738
601
  section.section2(data-noContent)