create-fesd-app 1.0.1 → 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.
- package/package.json +2 -2
- package/public/assets/fonts/icomoon/fonts/icomoon.eot +0 -0
- package/public/assets/fonts/icomoon/fonts/icomoon.svg +1 -15
- package/public/assets/fonts/icomoon/fonts/icomoon.ttf +0 -0
- package/public/assets/fonts/icomoon/fonts/icomoon.woff +0 -0
- package/public/assets/fonts/icomoon/selection.json +1 -1
- package/public/assets/fonts/icomoon/style.css +8 -50
- package/public/assets/fonts/icomoon/svg/drag.svg +5 -0
- package/src/assets/css/layouts/article4/_article4_2.0.sass +108 -0
- package/src/assets/css/layouts/article4/_article4_setting.sass +297 -0
- package/src/assets/css/pages/about.sass +1 -1
- package/src/assets/js/apps/about/page.js +2 -2
- package/src/layouts/article4/_article.pug +154 -0
- package/src/pages/about.pug +562 -896
package/src/pages/about.pug
CHANGED
@@ -35,902 +35,568 @@ block content
|
|
35
35
|
section.section1(data-content)
|
36
36
|
.container
|
37
37
|
.content
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
.
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
.
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
|
286
|
-
|
287
|
-
|
288
|
-
|
289
|
-
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
|
307
|
-
|
308
|
-
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
|
315
|
-
|
316
|
-
|
317
|
-
|
318
|
-
|
319
|
-
|
320
|
-
|
321
|
-
|
322
|
-
|
323
|
-
|
324
|
-
|
325
|
-
|
326
|
-
|
327
|
-
|
328
|
-
|
329
|
-
|
330
|
-
|
331
|
-
|
332
|
-
|
333
|
-
|
334
|
-
|
335
|
-
|
336
|
-
|
337
|
-
|
338
|
-
|
339
|
-
|
340
|
-
|
341
|
-
|
342
|
-
|
343
|
-
|
344
|
-
|
345
|
-
|
346
|
-
|
347
|
-
|
348
|
-
|
349
|
-
|
350
|
-
|
351
|
-
|
352
|
-
|
353
|
-
|
354
|
-
|
355
|
-
|
356
|
-
|
357
|
-
|
358
|
-
|
359
|
-
|
360
|
-
|
361
|
-
|
362
|
-
|
363
|
-
|
364
|
-
|
365
|
-
|
366
|
-
|
367
|
-
|
368
|
-
|
369
|
-
|
370
|
-
|
371
|
-
|
372
|
-
|
373
|
-
|
374
|
-
|
375
|
-
|
376
|
-
|
377
|
-
|
378
|
-
|
379
|
-
|
380
|
-
|
381
|
-
|
382
|
-
|
383
|
-
|
384
|
-
|
385
|
-
|
386
|
-
|
387
|
-
|
388
|
-
|
389
|
-
|
390
|
-
|
391
|
-
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
399
|
-
|
400
|
-
|
401
|
-
|
402
|
-
|
403
|
-
|
404
|
-
|
405
|
-
|
406
|
-
|
407
|
-
|
408
|
-
|
409
|
-
|
410
|
-
|
411
|
-
|
412
|
-
|
413
|
-
|
414
|
-
|
415
|
-
|
416
|
-
|
417
|
-
|
418
|
-
|
419
|
-
|
420
|
-
|
421
|
-
|
422
|
-
|
423
|
-
|
424
|
-
|
425
|
-
|
426
|
-
|
427
|
-
|
428
|
-
|
429
|
-
|
430
|
-
|
431
|
-
|
432
|
-
|
433
|
-
|
434
|
-
|
435
|
-
|
436
|
-
|
437
|
-
|
438
|
-
|
439
|
-
|
440
|
-
|
441
|
-
|
442
|
-
|
443
|
-
|
444
|
-
|
445
|
-
|
446
|
-
|
447
|
-
|
448
|
-
|
449
|
-
|
450
|
-
|
451
|
-
|
452
|
-
|
453
|
-
|
454
|
-
|
455
|
-
|
456
|
-
|
457
|
-
|
458
|
-
|
459
|
-
|
460
|
-
|
461
|
-
|
462
|
-
|
463
|
-
|
464
|
-
|
465
|
-
|
466
|
-
|
467
|
-
|
468
|
-
|
469
|
-
|
470
|
-
|
471
|
-
|
472
|
-
|
473
|
-
|
474
|
-
|
475
|
-
|
476
|
-
|
477
|
-
|
478
|
-
|
479
|
-
|
480
|
-
|
481
|
-
|
482
|
-
|
483
|
-
|
484
|
-
|
485
|
-
|
486
|
-
|
487
|
-
|
488
|
-
|
489
|
-
|
490
|
-
|
491
|
-
|
492
|
-
|
493
|
-
|
494
|
-
|
495
|
-
|
496
|
-
|
497
|
-
|
498
|
-
|
499
|
-
|
500
|
-
|
501
|
-
|
502
|
-
|
503
|
-
|
504
|
-
|
505
|
-
|
506
|
-
|
507
|
-
|
508
|
-
|
509
|
-
|
510
|
-
|
511
|
-
|
512
|
-
|
513
|
-
|
514
|
-
|
515
|
-
|
516
|
-
|
517
|
-
|
518
|
-
|
519
|
-
|
520
|
-
|
521
|
-
|
522
|
-
|
523
|
-
|
524
|
-
|
525
|
-
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
530
|
-
|
531
|
-
|
532
|
-
|
533
|
-
|
534
|
-
|
535
|
-
|
536
|
-
|
537
|
-
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
|
548
|
-
|
549
|
-
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
|
556
|
-
|
557
|
-
|
558
|
-
|
559
|
-
|
560
|
-
|
561
|
-
|
562
|
-
|
563
|
-
|
564
|
-
|
565
|
-
|
566
|
-
|
567
|
-
|
568
|
-
|
569
|
-
|
570
|
-
|
571
|
-
|
572
|
-
|
573
|
-
|
574
|
-
|
575
|
-
|
576
|
-
|
577
|
-
|
578
|
-
|
579
|
-
|
580
|
-
|
581
|
-
|
582
|
-
|
583
|
-
|
584
|
-
|
585
|
-
|
586
|
-
|
587
|
-
|
588
|
-
|
589
|
-
|
590
|
-
|
591
|
-
|
592
|
-
|
593
|
-
|
594
|
-
|
595
|
-
|
596
|
-
|
597
|
-
|
598
|
-
|
599
|
-
|
600
|
-
</article>
|
601
|
-
<article class="_article typeFR" typeFull-size="l">
|
602
|
-
<div class="_backgroundWrap">
|
603
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/465/1000/650')"></div>
|
604
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/731/650/1000')"></div>
|
605
|
-
</div>
|
606
|
-
<div class="_contentWrap">
|
607
|
-
<div class="_wordCover">
|
608
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
609
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
610
|
-
<div class="_P">
|
611
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
612
|
-
</div>
|
613
|
-
</div>
|
614
|
-
</div>
|
615
|
-
</article>
|
616
|
-
<article class="_article typeF" typeFull-size="m">
|
617
|
-
<div class="_backgroundWrap">
|
618
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/989/1000/650')"></div>
|
619
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/988/650/1000')"></div>
|
620
|
-
</div>
|
621
|
-
<div class="_contentWrap">
|
622
|
-
<div class="_wordCover">
|
623
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
624
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
625
|
-
<div class="_P">
|
626
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
627
|
-
</div>
|
628
|
-
</div>
|
629
|
-
</div>
|
630
|
-
</article>
|
631
|
-
<article class="_article typeF" typeFull-color="#fdca36" typeFull-size="l">
|
632
|
-
<div class="_backgroundWrap"></div>
|
633
|
-
<div class="_contentWrap">
|
634
|
-
<div class="_wordCover">
|
635
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
636
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
637
|
-
<div class="_P">
|
638
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
639
|
-
</div>
|
640
|
-
</div>
|
641
|
-
</div>
|
642
|
-
</article>
|
643
|
-
<article class="_article typeFBox" typeFull-size="xl" img-row="x2">
|
644
|
-
<div class="_backgroundWrap">
|
645
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/379/1000/650')"></div>
|
646
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/733/650/1000')"></div>
|
647
|
-
</div>
|
648
|
-
<div class="_contentWrap">
|
649
|
-
<div class="_imgCover">
|
650
|
-
<div class="_cover">
|
651
|
-
<div class="_photo"><img src="https://picsum.photos/id/886/700/400" alt=""></div>
|
652
|
-
<p class="_description">Description</p>
|
653
|
-
</div>
|
654
|
-
<div class="_cover">
|
655
|
-
<div class="_photo"><img src="https://picsum.photos/id/887/700/400" alt=""></div>
|
656
|
-
<p class="_description">Description</p>
|
657
|
-
</div>
|
658
|
-
</div>
|
659
|
-
<div class="_wordCover">
|
660
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
661
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
662
|
-
<div class="_P">
|
663
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
664
|
-
</div>
|
665
|
-
</div>
|
666
|
-
</div>
|
667
|
-
</article>
|
668
|
-
<article class="_article typeFBoxL" typeFull-size="l">
|
669
|
-
<div class="_backgroundWrap">
|
670
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/479/1000/650')"></div>
|
671
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/735/650/1000')"></div>
|
672
|
-
</div>
|
673
|
-
<div class="_contentWrap">
|
674
|
-
<div class="_imgCover">
|
675
|
-
<div class="swiper">
|
676
|
-
<div class="swiper-wrapper">
|
677
|
-
<div class="_cover swiper-slide">
|
678
|
-
<div class="_photo"><img src="https://picsum.photos/id/886/700/400" alt=""></div>
|
679
|
-
<p class="_description">Description</p>
|
680
|
-
</div>
|
681
|
-
<div class="_cover swiper-slide">
|
682
|
-
<div class="_photo"><img src="https://picsum.photos/id/887/700/400" alt=""></div>
|
683
|
-
<p class="_description">Description</p>
|
684
|
-
</div>
|
685
|
-
</div>
|
686
|
-
</div>
|
687
|
-
<div class="swiper-button-cover"></div>
|
688
|
-
</div>
|
689
|
-
<div class="_wordCover">
|
690
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
691
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
692
|
-
<div class="_P">
|
693
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
694
|
-
</div>
|
695
|
-
</div>
|
696
|
-
</div>
|
697
|
-
</article>
|
698
|
-
<article class="_article typeFBoxR" typeFull-size="l">
|
699
|
-
<div class="_backgroundWrap">
|
700
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/591/1000/650')"></div>
|
701
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/809/650/1000')"></div>
|
702
|
-
</div>
|
703
|
-
<div class="_contentWrap">
|
704
|
-
<div class="_wordCover">
|
705
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
706
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
707
|
-
<div class="_P">
|
708
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
709
|
-
</div>
|
710
|
-
</div>
|
711
|
-
</div>
|
712
|
-
</article>
|
713
|
-
<article class="_article typeFBoxR" typeFull-boxcolor="rgba(253, 202, 54, 0.5)" typeFull-size="l">
|
714
|
-
<div class="_backgroundWrap">
|
715
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/930/1000/650')"></div>
|
716
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/931/650/1000')"></div>
|
717
|
-
</div>
|
718
|
-
<div class="_contentWrap">
|
719
|
-
<div class="_wordCover">
|
720
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
721
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
722
|
-
<div class="_P">
|
723
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
724
|
-
</div>
|
725
|
-
</div>
|
726
|
-
</div>
|
727
|
-
</article>
|
728
|
-
<article class="_article typeFBoxL" typeFull-Slice="on" typeFull-size="l">
|
729
|
-
<div class="_backgroundWrap">
|
730
|
-
<div class="_pc" style="background-image: url('https://picsum.photos/id/664/1000/650')"></div>
|
731
|
-
<div class="_mobile" style="background-image: url('https://picsum.photos/id/813/650/1000')"></div>
|
732
|
-
</div>
|
733
|
-
<div class="_contentWrap" style="background-color: rgba(255, 255, 255, 0.5)">
|
734
|
-
<div class="_wordCover">
|
735
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
736
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
737
|
-
<div class="_P">
|
738
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
739
|
-
</div>
|
740
|
-
</div>
|
741
|
-
</div>
|
742
|
-
</article>
|
743
|
-
<article class="_article" img-size="x169" img-row="x4">
|
744
|
-
<div class="_contentWrap">
|
745
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
746
|
-
<div class="_imgCover">
|
747
|
-
<div class="_cover">
|
748
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
749
|
-
<p class="_description">Description</p>
|
750
|
-
</div>
|
751
|
-
<div class="_cover">
|
752
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
753
|
-
<p class="_description">Description</p>
|
754
|
-
</div>
|
755
|
-
<div class="_cover">
|
756
|
-
<div class="_photo"><img src="https://picsum.photos/id/406/700/700" alt=""></div>
|
757
|
-
<p class="_description">Description</p>
|
758
|
-
</div>
|
759
|
-
<div class="_cover">
|
760
|
-
<div class="_photo"><img src="https://picsum.photos/id/932/580/780" alt=""></div>
|
761
|
-
<p class="_description">Description</p>
|
762
|
-
</div>
|
763
|
-
</div>
|
764
|
-
<div class="_wordCover">
|
765
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
766
|
-
<div class="_P">
|
767
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
768
|
-
</div>
|
769
|
-
</div>
|
770
|
-
</div>
|
771
|
-
</article>
|
772
|
-
<article class="_article typeD" swiper-num="3">
|
773
|
-
<div class="_contentWrap">
|
774
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
775
|
-
<div class="_imgCover">
|
776
|
-
<div class="swiper">
|
777
|
-
<div class="swiper-wrapper">
|
778
|
-
<div class="_cover swiper-slide">
|
779
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
780
|
-
<p class="_description">Description</p>
|
781
|
-
</div>
|
782
|
-
<div class="_cover swiper-slide">
|
783
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
784
|
-
<p class="_description">Description</p>
|
785
|
-
</div>
|
786
|
-
<div class="_cover swiper-slide">
|
787
|
-
<div class="_photo"><img src="https://picsum.photos/id/406/700/700" alt=""></div>
|
788
|
-
<p class="_description">Description</p>
|
789
|
-
</div>
|
790
|
-
<div class="_cover swiper-slide">
|
791
|
-
<div class="_photo"><img src="https://picsum.photos/id/932/580/780" alt=""></div>
|
792
|
-
<p class="_description">Description</p>
|
793
|
-
</div>
|
794
|
-
</div>
|
795
|
-
</div>
|
796
|
-
<div class="swiper-button-cover"></div>
|
797
|
-
</div>
|
798
|
-
<div class="_wordCover">
|
799
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
800
|
-
<div class="_P">
|
801
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
802
|
-
</div>
|
803
|
-
</div>
|
804
|
-
</div>
|
805
|
-
</article>
|
806
|
-
<article class="_article typeDL" swiper-arrow="on" swiper-num="2">
|
807
|
-
<div class="_contentWrap">
|
808
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
809
|
-
<div class="_imgCover">
|
810
|
-
<div class="swiper">
|
811
|
-
<div class="swiper-wrapper">
|
812
|
-
<div class="_cover swiper-slide">
|
813
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
814
|
-
<p class="_description">Description</p>
|
815
|
-
</div>
|
816
|
-
<div class="_cover swiper-slide">
|
817
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
818
|
-
<p class="_description">Description</p>
|
819
|
-
</div>
|
820
|
-
</div>
|
821
|
-
</div>
|
822
|
-
<div class="swiper-button-cover"></div>
|
823
|
-
</div>
|
824
|
-
<div class="_wordCover">
|
825
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
826
|
-
<div class="_P">
|
827
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
828
|
-
</div>
|
829
|
-
</div>
|
830
|
-
</div>
|
831
|
-
</article>
|
832
|
-
<article class="_article typeU" swiper-nav="off" swiper-num="3">
|
833
|
-
<div class="_contentWrap">
|
834
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
835
|
-
<div class="_imgCover">
|
836
|
-
<div class="swiper">
|
837
|
-
<div class="swiper-wrapper">
|
838
|
-
<div class="_cover swiper-slide">
|
839
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
840
|
-
<p class="_description">Description</p>
|
841
|
-
</div>
|
842
|
-
<div class="_cover swiper-slide">
|
843
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
844
|
-
<p class="_description">Description</p>
|
845
|
-
</div>
|
846
|
-
<div class="_cover swiper-slide">
|
847
|
-
<div class="_photo"><img src="https://picsum.photos/id/406/700/700" alt=""></div>
|
848
|
-
<p class="_description">Description</p>
|
849
|
-
</div>
|
850
|
-
<div class="_cover swiper-slide">
|
851
|
-
<div class="_photo"><img src="https://picsum.photos/id/932/580/780" alt=""></div>
|
852
|
-
<p class="_description">Description</p>
|
853
|
-
</div>
|
854
|
-
</div>
|
855
|
-
</div>
|
856
|
-
<div class="swiper-button-cover"></div>
|
857
|
-
</div>
|
858
|
-
<div class="_wordCover">
|
859
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
860
|
-
<div class="_P">
|
861
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
862
|
-
</div>
|
863
|
-
</div>
|
864
|
-
</div>
|
865
|
-
</article>
|
866
|
-
<article class="_article typeUR" swiper-autoplay="off" swiper-num="3">
|
867
|
-
<div class="_contentWrap">
|
868
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
869
|
-
<div class="_imgCover">
|
870
|
-
<div class="swiper">
|
871
|
-
<div class="swiper-wrapper">
|
872
|
-
<div class="_cover swiper-slide">
|
873
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
874
|
-
<p class="_description">Description</p>
|
875
|
-
</div>
|
876
|
-
<div class="_cover swiper-slide">
|
877
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
878
|
-
<p class="_description">Description</p>
|
879
|
-
</div>
|
880
|
-
<div class="_cover swiper-slide">
|
881
|
-
<div class="_photo"><img src="https://picsum.photos/id/406/700/700" alt=""></div>
|
882
|
-
<p class="_description">Description</p>
|
883
|
-
</div>
|
884
|
-
<div class="_cover swiper-slide">
|
885
|
-
<div class="_photo"><img src="https://picsum.photos/id/932/580/780" alt=""></div>
|
886
|
-
<p class="_description">Description</p>
|
887
|
-
</div>
|
888
|
-
</div>
|
889
|
-
</div>
|
890
|
-
<div class="swiper-button-cover"></div>
|
891
|
-
</div>
|
892
|
-
<div class="_wordCover">
|
893
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
894
|
-
<div class="_P">
|
895
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
896
|
-
</div>
|
897
|
-
</div>
|
898
|
-
</div>
|
899
|
-
</article>
|
900
|
-
<article class="_article typeR" swiper-loop="off" swiper-autoplay="off">
|
901
|
-
<div class="_contentWrap">
|
902
|
-
<div class="_imgCover">
|
903
|
-
<div class="swiper">
|
904
|
-
<div class="swiper-wrapper">
|
905
|
-
<div class="_cover swiper-slide">
|
906
|
-
<div class="_photo"><img src="https://picsum.photos/id/961/700/700" alt=""></div>
|
907
|
-
<p class="_description">Description</p>
|
908
|
-
</div>
|
909
|
-
<div class="_cover swiper-slide">
|
910
|
-
<div class="_photo"><img src="https://picsum.photos/id/404/700/400" alt=""></div>
|
911
|
-
<p class="_description">Description</p>
|
912
|
-
</div>
|
913
|
-
<div class="_cover swiper-slide">
|
914
|
-
<div class="_photo"><img src="https://picsum.photos/id/406/700/700" alt=""></div>
|
915
|
-
<p class="_description">Description</p>
|
916
|
-
</div>
|
917
|
-
<div class="_cover swiper-slide">
|
918
|
-
<div class="_photo"><img src="https://picsum.photos/id/932/580/780" alt=""></div>
|
919
|
-
<p class="_description">Description</p>
|
920
|
-
</div>
|
921
|
-
</div>
|
922
|
-
</div>
|
923
|
-
<div class="swiper-button-cover"></div>
|
924
|
-
</div>
|
925
|
-
<div class="_wordCover">
|
926
|
-
<h4 class="_H">This is the title of the Article, A satirical title generator for designers...</h4>
|
927
|
-
<h5 class="_subH">Sub-Title of the Article, A satirical title generator for designers...</h5>
|
928
|
-
<div class="_P">
|
929
|
-
<p>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. The museum simulator"Mondo Museum" is a game that tests the player's ability to manage. You can freely design the structure of the museum, from the planning of the exhibition hall to the location of the gift shop, laying different floors for each room, setting windows, and of course matching Create a first class museum on the wallpaper.</p><span class="_buttonCover"><a class="_button" href="javascript:;">Button Description</a></span>
|
930
|
-
</div>
|
931
|
-
</div>
|
932
|
-
</div>
|
933
|
-
</article>
|
38
|
+
-
|
39
|
+
const data = {
|
40
|
+
base:{
|
41
|
+
articleType: 'base',
|
42
|
+
attributes: {
|
43
|
+
'img-row': 'x3',
|
44
|
+
},
|
45
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
46
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
47
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
48
|
+
button: 'Button Description',
|
49
|
+
img:[
|
50
|
+
{
|
51
|
+
img: 'https://picsum.photos/id/964/700/400',
|
52
|
+
description: 'Description'
|
53
|
+
},
|
54
|
+
{
|
55
|
+
img: 'https://picsum.photos/id/941/700/400',
|
56
|
+
description: 'Description'
|
57
|
+
},
|
58
|
+
{
|
59
|
+
img: 'https://picsum.photos/id/986/700/400',
|
60
|
+
description: 'Description'
|
61
|
+
}
|
62
|
+
],
|
63
|
+
},
|
64
|
+
typeSL:{
|
65
|
+
articleType: 'typeSL',
|
66
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
67
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
68
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
69
|
+
button: 'Button Description',
|
70
|
+
img:[
|
71
|
+
{
|
72
|
+
img: 'https://picsum.photos/id/964/700/400',
|
73
|
+
description: 'Description'
|
74
|
+
},
|
75
|
+
],
|
76
|
+
},
|
77
|
+
typeSR:{
|
78
|
+
articleType: 'typeSR',
|
79
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
80
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
81
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
82
|
+
button: 'Button Description',
|
83
|
+
img:[
|
84
|
+
{
|
85
|
+
img: 'https://picsum.photos/id/964/700/400',
|
86
|
+
description: 'Description'
|
87
|
+
},
|
88
|
+
],
|
89
|
+
},
|
90
|
+
typeU:{
|
91
|
+
articleType: 'typeU',
|
92
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
93
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
94
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
95
|
+
button: 'Button Description',
|
96
|
+
img:[
|
97
|
+
{
|
98
|
+
img: 'https://picsum.photos/id/964/700/400',
|
99
|
+
description: 'Description'
|
100
|
+
},
|
101
|
+
],
|
102
|
+
},
|
103
|
+
typeUL:{
|
104
|
+
articleType: 'typeUL',
|
105
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
106
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
107
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
108
|
+
button: 'Button Description',
|
109
|
+
img:[
|
110
|
+
{
|
111
|
+
img: 'https://picsum.photos/id/964/700/400',
|
112
|
+
description: 'Description'
|
113
|
+
},
|
114
|
+
],
|
115
|
+
},
|
116
|
+
typeUR:{
|
117
|
+
articleType: 'typeUR',
|
118
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
119
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
120
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
121
|
+
button: 'Button Description',
|
122
|
+
img:[
|
123
|
+
{
|
124
|
+
img: 'https://picsum.photos/id/964/700/400',
|
125
|
+
description: 'Description'
|
126
|
+
},
|
127
|
+
],
|
128
|
+
},
|
129
|
+
typeD:{
|
130
|
+
articleType: 'typeD',
|
131
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
132
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
133
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
134
|
+
button: 'Button Description',
|
135
|
+
img:[
|
136
|
+
{
|
137
|
+
img: 'https://picsum.photos/id/964/700/400',
|
138
|
+
description: 'Description'
|
139
|
+
},
|
140
|
+
],
|
141
|
+
},
|
142
|
+
typeDL:{
|
143
|
+
articleType: 'typeDL',
|
144
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
145
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
146
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
147
|
+
button: 'Button Description',
|
148
|
+
img:[
|
149
|
+
{
|
150
|
+
img: 'https://picsum.photos/id/964/700/400',
|
151
|
+
description: 'Description'
|
152
|
+
},
|
153
|
+
],
|
154
|
+
},
|
155
|
+
typeDR:{
|
156
|
+
articleType: 'typeDR',
|
157
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
158
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
159
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
160
|
+
button: 'Button Description',
|
161
|
+
img:[
|
162
|
+
{
|
163
|
+
img: 'https://picsum.photos/id/964/700/400',
|
164
|
+
description: 'Description'
|
165
|
+
},
|
166
|
+
],
|
167
|
+
},
|
168
|
+
typeL:{
|
169
|
+
articleType: 'typeL',
|
170
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
171
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
172
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
173
|
+
button: 'Button Description',
|
174
|
+
img:[
|
175
|
+
{
|
176
|
+
img: 'https://picsum.photos/id/964/700/400',
|
177
|
+
description: 'Description'
|
178
|
+
},
|
179
|
+
],
|
180
|
+
},
|
181
|
+
typeR:{
|
182
|
+
articleType: 'typeR',
|
183
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
184
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
185
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
186
|
+
button: 'Button Description',
|
187
|
+
img:[
|
188
|
+
{
|
189
|
+
img: 'https://picsum.photos/id/964/700/400',
|
190
|
+
description: 'Description'
|
191
|
+
},
|
192
|
+
],
|
193
|
+
},
|
194
|
+
typeLR:{
|
195
|
+
articleType: 'typeLR',
|
196
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
197
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
198
|
+
P: 'paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...paragraph of the Article, A satirical title generator for designers...',
|
199
|
+
button: 'Button Description',
|
200
|
+
img:[
|
201
|
+
{
|
202
|
+
img: 'https://picsum.photos/id/964/700/400',
|
203
|
+
description: 'Description'
|
204
|
+
},
|
205
|
+
],
|
206
|
+
},
|
207
|
+
typeRR:{
|
208
|
+
articleType: 'typeRR',
|
209
|
+
H: 'This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers... This is the title of the Article, A satirical title generator for designers...',
|
210
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
211
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
212
|
+
button: 'Button Description',
|
213
|
+
img:[
|
214
|
+
{
|
215
|
+
img: 'https://picsum.photos/id/964/700/400',
|
216
|
+
description: 'Description'
|
217
|
+
},
|
218
|
+
],
|
219
|
+
},
|
220
|
+
typeF:{
|
221
|
+
articleType: 'typeF',
|
222
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
223
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
224
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
225
|
+
button: 'Button Description',
|
226
|
+
backgroundPC:'https://picsum.photos/id/347/1000/650',
|
227
|
+
backgroundMobile:'https://picsum.photos/id/730/650/1000',
|
228
|
+
img:[
|
229
|
+
{
|
230
|
+
img: 'https://picsum.photos/id/964/700/400',
|
231
|
+
description: 'Description'
|
232
|
+
},
|
233
|
+
],
|
234
|
+
},
|
235
|
+
typeFL:{
|
236
|
+
articleType: 'typeFL',
|
237
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
238
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
239
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
240
|
+
button: 'Button Description',
|
241
|
+
backgroundPC:'https://picsum.photos/id/347/1000/650',
|
242
|
+
backgroundMobile:'https://picsum.photos/id/730/650/1000',
|
243
|
+
img:[
|
244
|
+
{
|
245
|
+
img: 'https://picsum.photos/id/964/700/400',
|
246
|
+
description: 'Description'
|
247
|
+
},
|
248
|
+
],
|
249
|
+
},
|
250
|
+
typeFR:{
|
251
|
+
articleType: 'typeFR',
|
252
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
253
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
254
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
255
|
+
button: 'Button Description',
|
256
|
+
backgroundPC:'https://picsum.photos/id/347/1000/650',
|
257
|
+
backgroundMobile:'https://picsum.photos/id/730/650/1000',
|
258
|
+
img:[
|
259
|
+
{
|
260
|
+
img: 'https://picsum.photos/id/964/700/400',
|
261
|
+
description: 'Description'
|
262
|
+
},
|
263
|
+
],
|
264
|
+
},
|
265
|
+
typeFBox:{
|
266
|
+
articleType: 'typeFBox',
|
267
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
268
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
269
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
270
|
+
button: 'Button Description',
|
271
|
+
backgroundPC:'https://picsum.photos/id/347/1000/650',
|
272
|
+
backgroundMobile:'https://picsum.photos/id/730/650/1000',
|
273
|
+
img:[
|
274
|
+
{
|
275
|
+
img: 'https://picsum.photos/id/964/700/400',
|
276
|
+
description: 'Description'
|
277
|
+
},
|
278
|
+
],
|
279
|
+
},
|
280
|
+
typeTable:{
|
281
|
+
articleType: 'typeTable',
|
282
|
+
attributes: {
|
283
|
+
'data-table-markdown':'on'
|
284
|
+
},
|
285
|
+
tableData: {
|
286
|
+
H: 'This is the title of the Form',
|
287
|
+
tipText: '左右托拉',
|
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
|
+
table: {
|
290
|
+
head: [
|
291
|
+
{
|
292
|
+
A: '預設均分 (最小100)',
|
293
|
+
B: '預設均分 (最小100)'
|
294
|
+
}
|
295
|
+
],
|
296
|
+
body: [
|
297
|
+
{
|
298
|
+
A: '@center@置中文字@center@ \n- 列點 \n - 列點 - **列點粗體**',
|
299
|
+
B: '1. ~~列點斜體~~ \n 2. *列點斜體*'
|
300
|
+
},
|
301
|
+
{
|
302
|
+
A: '@center@置中文字@center@ \n- 列點 \n - 列點 - **列點粗體**',
|
303
|
+
B: '1. ~~列點斜體~~ \n 2. *列點斜體*'
|
304
|
+
},
|
305
|
+
{
|
306
|
+
A: '@center@置中文字@center@ \n- 列點 \n - 列點 - **列點粗體**',
|
307
|
+
B: '1. ~~列點斜體~~ \n 2. *列點斜體*'
|
308
|
+
},
|
309
|
+
],
|
310
|
+
},
|
311
|
+
},
|
312
|
+
},
|
313
|
+
typeQuote:{
|
314
|
+
articleType: 'typeQuote',
|
315
|
+
attributes: {
|
316
|
+
'quote-color':'#7cc087',
|
317
|
+
},
|
318
|
+
quote: 'Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.',
|
319
|
+
quoteP: 'paragraph of the Article, A satirical title generator for designers...',
|
320
|
+
},
|
321
|
+
swiperDemo:{
|
322
|
+
articleType: 'typeFBox',
|
323
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
324
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
325
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
326
|
+
button: 'Button Description',
|
327
|
+
backgroundPC:'https://picsum.photos/id/347/1000/650',
|
328
|
+
backgroundMobile:'https://picsum.photos/id/730/650/1000',
|
329
|
+
SwiperImg:[
|
330
|
+
{
|
331
|
+
img: 'https://picsum.photos/id/964/700/400',
|
332
|
+
description: 'Description'
|
333
|
+
},
|
334
|
+
{
|
335
|
+
img: 'https://picsum.photos/id/941/700/400',
|
336
|
+
description: 'Description'
|
337
|
+
},
|
338
|
+
{
|
339
|
+
img: 'https://picsum.photos/id/986/700/400',
|
340
|
+
description: 'Description'
|
341
|
+
}
|
342
|
+
],
|
343
|
+
},
|
344
|
+
videoDemo:{
|
345
|
+
articleType: 'typeD',
|
346
|
+
H: 'This is the title of the Article, A satirical title generator for designers...',
|
347
|
+
subH: 'Sub-Title of the Article, A satirical title generator for designers...',
|
348
|
+
P: 'paragraph of the Article, A satirical title generator for designers...',
|
349
|
+
button: 'Button Description',
|
350
|
+
img:[
|
351
|
+
{
|
352
|
+
videoAttributes: {
|
353
|
+
"video-type":"youtube",
|
354
|
+
"video-id":"3-v360P1rUY",
|
355
|
+
},
|
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
|
+
},
|
392
|
+
img: 'https://picsum.photos/id/964/700/400',
|
393
|
+
description: 'Description'
|
394
|
+
},
|
395
|
+
],
|
396
|
+
},
|
397
|
+
tableDemo:{
|
398
|
+
articleType: 'typeTable',
|
399
|
+
attributes: {
|
400
|
+
'data-table-markdown':'on'
|
401
|
+
},
|
402
|
+
tableData: {
|
403
|
+
H: 'This is the title of the Form',
|
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.",
|
417
|
+
},
|
418
|
+
},
|
419
|
+
}
|
420
|
+
._articleBlock
|
421
|
+
include ../layouts/article4/_article.pug
|
422
|
+
// 基本樣式
|
423
|
+
+article(data.base)
|
424
|
+
+article(data.typeSL)
|
425
|
+
+article(data.typeSR)
|
426
|
+
+article(data.typeU)
|
427
|
+
+article(data.typeUL)
|
428
|
+
+article(data.typeUR)
|
429
|
+
+article(data.typeD)
|
430
|
+
+article(data.typeDL)
|
431
|
+
+article(data.typeDR)
|
432
|
+
|
433
|
+
// 文繞圖
|
434
|
+
+article(data.typeL)
|
435
|
+
+article(data.typeR)
|
436
|
+
+article(data.typeLR)
|
437
|
+
+article(data.typeRR)
|
438
|
+
|
439
|
+
// 背景
|
440
|
+
+article(data.typeF)
|
441
|
+
+article(data.typeFL)
|
442
|
+
+article(data.typeFR)
|
443
|
+
+article(data.typeFBox)
|
444
|
+
|
445
|
+
// 最新新增
|
446
|
+
+article(data.typeTable)
|
447
|
+
+article(data.typeQuote)
|
448
|
+
|
449
|
+
// 其他
|
450
|
+
+article(data.swiperDemo)
|
451
|
+
+article(data.videoDemo)
|
452
|
+
+article(data.videoWithSwiperDemo)
|
453
|
+
+article(data.tableDemo)
|
454
|
+
table
|
455
|
+
thead
|
456
|
+
tr
|
457
|
+
th(style='width:200px; min-width:200px;')
|
458
|
+
span aaa
|
459
|
+
th(style='width:200px; min-width:200px;')
|
460
|
+
span bbb
|
461
|
+
th(style='width:300px; min-width:300px;')
|
462
|
+
span ccc
|
463
|
+
th(style='width:300px; min-width:300px;')
|
464
|
+
span ddd
|
465
|
+
th(style='width:300px; min-width:300px;')
|
466
|
+
span eee
|
467
|
+
th(style='width:300px; min-width:300px;')
|
468
|
+
span fff
|
469
|
+
tbody
|
470
|
+
tr
|
471
|
+
td(rowspan="3" style='width:200px; min-width:200px;')
|
472
|
+
span aaa
|
473
|
+
td(colspan="3" style='width:200px; min-width:200px;')
|
474
|
+
span bbb
|
475
|
+
td(style='width:300px; min-width:300px;')
|
476
|
+
span eee
|
477
|
+
td(style='width:300px; min-width:300px;')
|
478
|
+
span fff
|
479
|
+
tr
|
480
|
+
td(rowspan="2" style='width:200px; min-width:200px;')
|
481
|
+
span bbb
|
482
|
+
td(colspan="3" style='width:200px; min-width:200px;')
|
483
|
+
span ccc
|
484
|
+
td(style='width:300px; min-width:300px;')
|
485
|
+
span fff
|
486
|
+
tr
|
487
|
+
td(style='width:300px; min-width:300px;')
|
488
|
+
span ccc
|
489
|
+
td(style='width:300px; min-width:300px;')
|
490
|
+
span ddd
|
491
|
+
td(style='width:300px; min-width:300px;')
|
492
|
+
span eee
|
493
|
+
td(style='width:300px; min-width:300px;')
|
494
|
+
span fff
|
495
|
+
tr
|
496
|
+
td(rowspan="2" style='width:200px; min-width:200px;')
|
497
|
+
span aaa
|
498
|
+
td(style='width:200px; min-width:200px;')
|
499
|
+
span bbb
|
500
|
+
td(style='width:300px; min-width:300px;')
|
501
|
+
span ccc
|
502
|
+
td(style='width:300px; min-width:300px;')
|
503
|
+
span ddd
|
504
|
+
td(style='width:300px; min-width:300px;')
|
505
|
+
span eee
|
506
|
+
td(style='width:300px; min-width:300px;')
|
507
|
+
span fff
|
508
|
+
tr
|
509
|
+
td(style='width:200px; min-width:200px;')
|
510
|
+
span bbb
|
511
|
+
td(style='width:300px; min-width:300px;')
|
512
|
+
span ccc
|
513
|
+
td(style='width:300px; min-width:300px;')
|
514
|
+
span ddd
|
515
|
+
td(style='width:300px; min-width:300px;')
|
516
|
+
span eee
|
517
|
+
td(style='width:300px; min-width:300px;')
|
518
|
+
span fff
|
519
|
+
for i in [1,2,3,4,5,6,7]
|
520
|
+
tr
|
521
|
+
td(style='width:200px; min-width:200px;')
|
522
|
+
span aaa
|
523
|
+
td(style='width:200px; min-width:200px;')
|
524
|
+
span bbb
|
525
|
+
td(style='width:300px; min-width:300px;')
|
526
|
+
span ccc
|
527
|
+
td(style='width:300px; min-width:300px;')
|
528
|
+
span ddd
|
529
|
+
td(style='width:300px; min-width:300px;')
|
530
|
+
span eee
|
531
|
+
td(style='width:300px; min-width:300px;')
|
532
|
+
span fff
|
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
|
599
|
+
|
934
600
|
|
935
601
|
section.section2(data-noContent)
|
936
602
|
.container
|