@pareto-engineering/design-system 2.0.0-alpha.32 → 2.0.0-alpha.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/a/ContentTree/ContentTree.js +83 -0
- package/dist/cjs/a/ContentTree/common/Tree/Tree.js +116 -0
- package/dist/cjs/a/ContentTree/common/Tree/index.js +15 -0
- package/dist/cjs/a/ContentTree/common/index.js +31 -0
- package/dist/cjs/a/ContentTree/common/useContentTree.js +82 -0
- package/dist/cjs/a/ContentTree/common/useFirstVisibleNode.js +65 -0
- package/dist/cjs/a/ContentTree/index.js +15 -0
- package/dist/cjs/a/ContentTree/styles.scss +33 -0
- package/dist/cjs/a/index.js +9 -1
- package/dist/cjs/c/SocialMediaShareButton/SocialMediaShareButton.js +106 -0
- package/dist/cjs/c/SocialMediaShareButton/index.js +15 -0
- package/dist/cjs/c/SocialMediaShareButton/styles.scss +39 -0
- package/dist/cjs/c/index.js +9 -1
- package/dist/es/a/ContentTree/ContentTree.js +67 -0
- package/dist/es/a/ContentTree/common/Tree/Tree.js +98 -0
- package/dist/es/a/ContentTree/common/Tree/index.js +2 -0
- package/dist/es/a/ContentTree/common/index.js +3 -0
- package/dist/es/a/ContentTree/common/useContentTree.js +74 -0
- package/dist/es/a/ContentTree/common/useFirstVisibleNode.js +54 -0
- package/dist/es/a/ContentTree/index.js +2 -0
- package/dist/es/a/ContentTree/styles.scss +33 -0
- package/dist/es/a/index.js +2 -1
- package/dist/es/c/SocialMediaShareButton/SocialMediaShareButton.js +90 -0
- package/dist/es/c/SocialMediaShareButton/index.js +2 -0
- package/dist/es/c/SocialMediaShareButton/styles.scss +39 -0
- package/dist/es/c/index.js +2 -1
- package/package.json +3 -2
- package/src/__snapshots__/Storyshots.test.js.snap +196 -12
- package/src/local.scss +1 -0
- package/src/stories/StyleGuide/Sprites.stories.mdx +25 -0
- package/src/stories/StyleGuide/helpers.js +16 -0
- package/src/stories/a/ContentTree.stories.jsx +662 -0
- package/src/stories/c/SocialMediaShareButton.stories.jsx +25 -0
- package/src/ui/a/ContentTree/ContentTree.jsx +88 -0
- package/src/ui/a/ContentTree/common/Tree/Tree.jsx +138 -0
- package/src/ui/a/ContentTree/common/Tree/index.js +2 -0
- package/src/ui/a/ContentTree/common/index.js +3 -0
- package/src/ui/a/ContentTree/common/useContentTree.js +83 -0
- package/src/ui/a/ContentTree/common/useFirstVisibleNode.js +59 -0
- package/src/ui/a/ContentTree/index.js +2 -0
- package/src/ui/a/ContentTree/styles.scss +33 -0
- package/src/ui/a/index.js +1 -0
- package/src/ui/c/SocialMediaShareButton/SocialMediaShareButton.jsx +111 -0
- package/src/ui/c/SocialMediaShareButton/index.js +2 -0
- package/src/ui/c/SocialMediaShareButton/styles.scss +39 -0
- package/src/ui/c/index.js +1 -0
|
@@ -376,6 +376,161 @@ exports[`Storyshots a/ContentCard Layout Right 1`] = `
|
|
|
376
376
|
</div>
|
|
377
377
|
`;
|
|
378
378
|
|
|
379
|
+
exports[`Storyshots a/ContentTree Base 1`] = `
|
|
380
|
+
<div
|
|
381
|
+
style={
|
|
382
|
+
Object {
|
|
383
|
+
"display": "grid",
|
|
384
|
+
"gridTemplateColumns": "5fr 2fr",
|
|
385
|
+
}
|
|
386
|
+
}
|
|
387
|
+
>
|
|
388
|
+
<main>
|
|
389
|
+
<h2
|
|
390
|
+
id="some-id-0"
|
|
391
|
+
>
|
|
392
|
+
Heading 1
|
|
393
|
+
</h2>
|
|
394
|
+
<p>
|
|
395
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae.
|
|
396
|
+
</p>
|
|
397
|
+
<h3
|
|
398
|
+
id="some-id-1"
|
|
399
|
+
>
|
|
400
|
+
Heading 1.1
|
|
401
|
+
</h3>
|
|
402
|
+
<p>
|
|
403
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
404
|
+
</p>
|
|
405
|
+
<h3
|
|
406
|
+
id="some-id-2"
|
|
407
|
+
>
|
|
408
|
+
Heading 1.2
|
|
409
|
+
</h3>
|
|
410
|
+
<p>
|
|
411
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
412
|
+
</p>
|
|
413
|
+
<h4
|
|
414
|
+
id="some-id-3"
|
|
415
|
+
>
|
|
416
|
+
Heading 1.2.1
|
|
417
|
+
</h4>
|
|
418
|
+
<p>
|
|
419
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
420
|
+
</p>
|
|
421
|
+
<h4
|
|
422
|
+
id="some-id-4"
|
|
423
|
+
>
|
|
424
|
+
Heading 1.2.2
|
|
425
|
+
</h4>
|
|
426
|
+
<p>
|
|
427
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
428
|
+
</p>
|
|
429
|
+
<h2
|
|
430
|
+
id="some-id-5"
|
|
431
|
+
>
|
|
432
|
+
Heading 2
|
|
433
|
+
</h2>
|
|
434
|
+
<p>
|
|
435
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
436
|
+
</p>
|
|
437
|
+
<h3
|
|
438
|
+
id="some-id-6"
|
|
439
|
+
>
|
|
440
|
+
Heading 2.1
|
|
441
|
+
</h3>
|
|
442
|
+
<p>
|
|
443
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
444
|
+
</p>
|
|
445
|
+
<p>
|
|
446
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
447
|
+
</p>
|
|
448
|
+
<h3
|
|
449
|
+
id="some-id-7"
|
|
450
|
+
>
|
|
451
|
+
Heading 2.2
|
|
452
|
+
</h3>
|
|
453
|
+
<p>
|
|
454
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
455
|
+
</p>
|
|
456
|
+
<p>
|
|
457
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
458
|
+
</p>
|
|
459
|
+
<h2
|
|
460
|
+
id="some-id-8"
|
|
461
|
+
>
|
|
462
|
+
Heading 3
|
|
463
|
+
</h2>
|
|
464
|
+
<p>
|
|
465
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
466
|
+
</p>
|
|
467
|
+
<h2
|
|
468
|
+
id="some-id-9"
|
|
469
|
+
>
|
|
470
|
+
Heading 4
|
|
471
|
+
</h2>
|
|
472
|
+
<p>
|
|
473
|
+
Lorem ipsum sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
474
|
+
</p>
|
|
475
|
+
<h3
|
|
476
|
+
id="some-id-10"
|
|
477
|
+
>
|
|
478
|
+
Heading 4.1
|
|
479
|
+
</h3>
|
|
480
|
+
<p>
|
|
481
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
482
|
+
</p>
|
|
483
|
+
<h4
|
|
484
|
+
id="some-id-11"
|
|
485
|
+
>
|
|
486
|
+
Heading 4.1.1
|
|
487
|
+
</h4>
|
|
488
|
+
<p>
|
|
489
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet,
|
|
490
|
+
</p>
|
|
491
|
+
<h3
|
|
492
|
+
id="some-id-12"
|
|
493
|
+
>
|
|
494
|
+
Heading 4.2
|
|
495
|
+
</h3>
|
|
496
|
+
<p>
|
|
497
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae.
|
|
498
|
+
</p>
|
|
499
|
+
<h3
|
|
500
|
+
id="some-id-13"
|
|
501
|
+
>
|
|
502
|
+
Heading 4.3
|
|
503
|
+
</h3>
|
|
504
|
+
<p>
|
|
505
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae.
|
|
506
|
+
</p>
|
|
507
|
+
<h4
|
|
508
|
+
id="some-id-14"
|
|
509
|
+
>
|
|
510
|
+
Heading 4.3.1
|
|
511
|
+
</h4>
|
|
512
|
+
<p>
|
|
513
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae.
|
|
514
|
+
</p>
|
|
515
|
+
<h3
|
|
516
|
+
id="some-id-15"
|
|
517
|
+
>
|
|
518
|
+
Heading 4.4
|
|
519
|
+
</h3>
|
|
520
|
+
<p>
|
|
521
|
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dapibus lectus nisl, ac maximus ex convallis sed. Donec quis eros vehicula, hendrerit enim sit amet, Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga porro, aliquid excepturi inciduntitaque, nam blanditiis amet dolores fugiat ullam ad dignissimos debitis rerum, culpa repellendus illo nisi hic. Vitae.
|
|
522
|
+
</p>
|
|
523
|
+
</main>
|
|
524
|
+
<div
|
|
525
|
+
className="base content-tree v5 ml-v"
|
|
526
|
+
>
|
|
527
|
+
<ul
|
|
528
|
+
className="base tree"
|
|
529
|
+
/>
|
|
530
|
+
</div>
|
|
531
|
+
</div>
|
|
532
|
+
`;
|
|
533
|
+
|
|
379
534
|
exports[`Storyshots a/Conversation Base 1`] = `
|
|
380
535
|
<div
|
|
381
536
|
className="base conversation y-background2 u1"
|
|
@@ -1290,7 +1445,7 @@ Array [
|
|
|
1290
1445
|
>
|
|
1291
1446
|
<use
|
|
1292
1447
|
className=""
|
|
1293
|
-
href="/sprite.svg"
|
|
1448
|
+
href="/sprite.svg#engine"
|
|
1294
1449
|
style={
|
|
1295
1450
|
Object {
|
|
1296
1451
|
"style": undefined,
|
|
@@ -1318,7 +1473,7 @@ Array [
|
|
|
1318
1473
|
>
|
|
1319
1474
|
<use
|
|
1320
1475
|
className=""
|
|
1321
|
-
href="/sprite.svg"
|
|
1476
|
+
href="/sprite.svg#engine"
|
|
1322
1477
|
style={
|
|
1323
1478
|
Object {
|
|
1324
1479
|
"style": undefined,
|
|
@@ -1345,7 +1500,7 @@ Array [
|
|
|
1345
1500
|
>
|
|
1346
1501
|
<use
|
|
1347
1502
|
className=""
|
|
1348
|
-
href="/sprite.svg"
|
|
1503
|
+
href="/sprite.svg#engine"
|
|
1349
1504
|
style={
|
|
1350
1505
|
Object {
|
|
1351
1506
|
"style": undefined,
|
|
@@ -1368,7 +1523,7 @@ exports[`Storyshots a/SVG Base 1`] = `
|
|
|
1368
1523
|
>
|
|
1369
1524
|
<use
|
|
1370
1525
|
className=""
|
|
1371
|
-
href="/sprite.svg"
|
|
1526
|
+
href="/sprite.svg#engine"
|
|
1372
1527
|
style={
|
|
1373
1528
|
Object {
|
|
1374
1529
|
"style": undefined,
|
|
@@ -1398,7 +1553,7 @@ Array [
|
|
|
1398
1553
|
>
|
|
1399
1554
|
<use
|
|
1400
1555
|
className=""
|
|
1401
|
-
href="/logo.svg"
|
|
1556
|
+
href="/logo.svg#logo"
|
|
1402
1557
|
style={
|
|
1403
1558
|
Object {
|
|
1404
1559
|
"style": undefined,
|
|
@@ -1421,7 +1576,7 @@ exports[`Storyshots a/SVG Stroke 1`] = `
|
|
|
1421
1576
|
>
|
|
1422
1577
|
<use
|
|
1423
1578
|
className=""
|
|
1424
|
-
href="/sprite.svg"
|
|
1579
|
+
href="/sprite.svg#engine"
|
|
1425
1580
|
style={
|
|
1426
1581
|
Object {
|
|
1427
1582
|
"style": undefined,
|
|
@@ -8280,8 +8435,8 @@ exports[`Storyshots c/ContentSlides Base 1`] = `
|
|
|
8280
8435
|
Welcome
|
|
8281
8436
|
</span>
|
|
8282
8437
|
<svg
|
|
8283
|
-
className="base svg base logo x-paragraph y-transparent xs-h sm-h"
|
|
8284
|
-
height="
|
|
8438
|
+
className="base svg base logo x-paragraph y-transparent xs-h sm-h y-transparent"
|
|
8439
|
+
height="1.1em"
|
|
8285
8440
|
preserveAspectRatio="xMinYMin meet"
|
|
8286
8441
|
version="1.1"
|
|
8287
8442
|
viewBox="0 0 156 30"
|
|
@@ -8523,8 +8678,8 @@ exports[`Storyshots c/ContentSlides Simple 1`] = `
|
|
|
8523
8678
|
Welcome
|
|
8524
8679
|
</span>
|
|
8525
8680
|
<svg
|
|
8526
|
-
className="base svg base logo x-paragraph y-transparent xs-h sm-h"
|
|
8527
|
-
height="
|
|
8681
|
+
className="base svg base logo x-paragraph y-transparent xs-h sm-h y-transparent"
|
|
8682
|
+
height="1.1em"
|
|
8528
8683
|
preserveAspectRatio="xMinYMin meet"
|
|
8529
8684
|
version="1.1"
|
|
8530
8685
|
viewBox="0 0 156 30"
|
|
@@ -8792,8 +8947,8 @@ exports[`Storyshots c/ContentSlides With Background Shape 1`] = `
|
|
|
8792
8947
|
Welcome
|
|
8793
8948
|
</span>
|
|
8794
8949
|
<svg
|
|
8795
|
-
className="base svg base logo x-paragraph y-transparent xs-h sm-h"
|
|
8796
|
-
height="
|
|
8950
|
+
className="base svg base logo x-paragraph y-transparent xs-h sm-h y-transparent"
|
|
8951
|
+
height="1.1em"
|
|
8797
8952
|
preserveAspectRatio="xMinYMin meet"
|
|
8798
8953
|
version="1.1"
|
|
8799
8954
|
viewBox="0 0 156 30"
|
|
@@ -9087,6 +9242,35 @@ exports[`Storyshots c/Shortener Base 1`] = `
|
|
|
9087
9242
|
</span>
|
|
9088
9243
|
`;
|
|
9089
9244
|
|
|
9245
|
+
exports[`Storyshots c/SocialMediaShareButton Base 1`] = `
|
|
9246
|
+
<div>
|
|
9247
|
+
<a
|
|
9248
|
+
className="base social-media-share-button x-facebook"
|
|
9249
|
+
href="https://www.facebook.com/sharer/sharer.php?u=http://localhost/#/welcome"e="
|
|
9250
|
+
rel="noreferrer"
|
|
9251
|
+
target="_blank"
|
|
9252
|
+
>
|
|
9253
|
+
<button
|
|
9254
|
+
type="button"
|
|
9255
|
+
>
|
|
9256
|
+
f
|
|
9257
|
+
</button>
|
|
9258
|
+
</a>
|
|
9259
|
+
<a
|
|
9260
|
+
className="base social-media-share-button x-twitter"
|
|
9261
|
+
href="https://twitter.com/intent/tweet?text=&url=http://localhost/#/welcome"
|
|
9262
|
+
rel="noreferrer"
|
|
9263
|
+
target="_blank"
|
|
9264
|
+
>
|
|
9265
|
+
<button
|
|
9266
|
+
type="button"
|
|
9267
|
+
>
|
|
9268
|
+
t
|
|
9269
|
+
</button>
|
|
9270
|
+
</a>
|
|
9271
|
+
</div>
|
|
9272
|
+
`;
|
|
9273
|
+
|
|
9090
9274
|
exports[`Storyshots f/FormInput Base 1`] = `
|
|
9091
9275
|
<form
|
|
9092
9276
|
action="#"
|
package/src/local.scss
CHANGED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Canvas, Story, Meta } from '@storybook/addon-docs/blocks';
|
|
2
|
+
|
|
3
|
+
import { SVG } from '../../ui'
|
|
4
|
+
|
|
5
|
+
import { spritesMap } from './helpers.js'
|
|
6
|
+
|
|
7
|
+
<Meta title="StyleGuide/Sprites" />
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
# Sprites
|
|
11
|
+
|
|
12
|
+
<div className="y-paragraph x-main3">
|
|
13
|
+
<Canvas>
|
|
14
|
+
{ spritesMap.map((item) =>
|
|
15
|
+
item.targets.map((target) =>
|
|
16
|
+
<SVG
|
|
17
|
+
width="200"
|
|
18
|
+
height="200"
|
|
19
|
+
sprite={item.sprite}
|
|
20
|
+
target={target}
|
|
21
|
+
key={target}
|
|
22
|
+
/>
|
|
23
|
+
))}
|
|
24
|
+
</Canvas>
|
|
25
|
+
</div>
|
|
@@ -37,6 +37,21 @@ const charList = [' ', '!', '"', '#', '$', '%', '&', '\'', '(', ')', '*', '+', '
|
|
|
37
37
|
'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't',
|
|
38
38
|
'u', 'v', 'w', 'x', 'y', 'z', '{', '|', '}', '~']
|
|
39
39
|
|
|
40
|
+
const spritesMap = [
|
|
41
|
+
{
|
|
42
|
+
sprite :'/homepage.sprite.svg',
|
|
43
|
+
targets:['grow-faster', 'secret-superpower', 'women-led'],
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
sprite :'/illustrations.sprite.svg',
|
|
47
|
+
targets:['building-1', 'building-2', 'building-3', 'building-4', 'building-5', 'woman-1', 'woman-2', 'woman-3', 'man-1', 'man-2', 'man-3'],
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
sprite :'/solutions.sprite.svg',
|
|
51
|
+
targets:['custom-data', 'vetting', 'contact-gen', 'research', 'tracking'],
|
|
52
|
+
},
|
|
53
|
+
]
|
|
54
|
+
|
|
40
55
|
export {
|
|
41
56
|
brandMap,
|
|
42
57
|
// wheelMap,
|
|
@@ -45,4 +60,5 @@ export {
|
|
|
45
60
|
smMap,
|
|
46
61
|
monochromeMap,
|
|
47
62
|
charList,
|
|
63
|
+
spritesMap,
|
|
48
64
|
}
|