@kickstartds/ds-agency-premium 1.6.68--canary.45.1711.0 → 1.6.68--canary.45.1716.0
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/{BlogAsideProps-d9decb7c.d.ts → BlogAsideProps-c760fd2a.d.ts} +5 -5
- package/dist/{BlogAuthorProps-9320ef58.d.ts → BlogAuthorProps-fb0241df.d.ts} +1 -1
- package/dist/BlogOverviewProps-9f207f1c.d.ts +2 -2
- package/dist/{BlogPostProps-c04a5ed8.d.ts → BlogPostProps-6b3cff22.d.ts} +2 -2
- package/dist/{ButtonProps-03ff6d21.d.ts → ButtonProps-00ddee3a.d.ts} +4 -4
- package/dist/{CtaProps-8a0dba0d.d.ts → CtaProps-babe4ee6.d.ts} +4 -4
- package/dist/{EventListAppointmentProps-da54c3b9.d.ts → EventAppointmentProps-443cd1ce.d.ts} +4 -4
- package/dist/{EventDetailProps-19b81db8.d.ts → EventDetailProps-42a7eebe.d.ts} +5 -5
- package/dist/{EventTeaserProps-e00ea659.d.ts → EventLatestTeaserProps-fc9d3281.d.ts} +2 -2
- package/dist/{EventListLocationProps-d4345e0e.d.ts → EventLocationProps-dd4aeaa9.d.ts} +5 -5
- package/dist/{FeaturesProps-7ef528ec.d.ts → FeaturesProps-a9041d97.d.ts} +4 -4
- package/dist/{FooterProps-171a3067.d.ts → FooterProps-a0a104ca.d.ts} +2 -2
- package/dist/{HeaderProps-e22382f1.d.ts → HeaderProps-72763967.d.ts} +2 -2
- package/dist/{HeroProps-aa4e6431.d.ts → HeroProps-40f6c7f5.d.ts} +4 -4
- package/dist/ImageStoryProps-e853e1e7.d.ts +1 -1
- package/dist/MosaicProps-d52c7151.d.ts +4 -4
- package/dist/SectionProps-7caa223c.d.ts +7 -7
- package/dist/{SliderProps-8a0dba0d.d.ts → SliderProps-babe4ee6.d.ts} +4 -4
- package/dist/{TeaserCardProps-b9c28e78.d.ts → TeaserCardProps-994cb119.d.ts} +4 -4
- package/dist/{VideoCurtainProps-88f08b62.d.ts → VideoCurtainProps-a2c0cc7f.d.ts} +4 -4
- package/dist/components/blog-aside/blog-aside.schema.dereffed.json +7 -7
- package/dist/components/blog-aside/blog-aside.schema.json +4 -4
- package/dist/components/blog-aside/index.d.ts +1 -1
- package/dist/components/blog-aside/index.js +1 -1
- package/dist/components/blog-author/blog-author.schema.dereffed.json +3 -3
- package/dist/components/blog-author/index.d.ts +1 -1
- package/dist/components/blog-overview/blog-overview.schema.dereffed.json +41 -41
- package/dist/components/blog-post/blog-post.schema.dereffed.json +48 -48
- package/dist/components/blog-post/index.d.ts +1 -1
- package/dist/components/blog-teaser/index.d.ts +1 -1
- package/dist/components/blog-teaser/index.js +5 -7
- package/dist/components/button/button.schema.dereffed.json +3 -3
- package/dist/components/button/button.schema.json +3 -3
- package/dist/components/button/index.d.ts +1 -1
- package/dist/components/button/index.js +1 -1
- package/dist/components/button-group/button-group.schema.dereffed.json +3 -3
- package/dist/components/button-group/index.d.ts +1 -1
- package/dist/components/contact/contact.schema.dereffed.json +3 -3
- package/dist/components/contact/contact.schema.json +3 -3
- package/dist/components/contact/index.d.ts +1 -1
- package/dist/components/contact/index.js +1 -1
- package/dist/components/cta/cta.schema.dereffed.json +3 -3
- package/dist/components/cta/cta.schema.json +2 -2
- package/dist/components/cta/index.d.ts +1 -1
- package/dist/components/{event-list-appointment/event-list-appointment.css → event-appointment/event-appointment.css} +9 -9
- package/dist/components/{event-list-appointment/event-list-appointment.schema.dereffed.json → event-appointment/event-appointment.schema.dereffed.json} +5 -5
- package/dist/components/{event-list-appointment/event-list-appointment.schema.json → event-appointment/event-appointment.schema.json} +4 -4
- package/dist/components/event-appointment/index.d.ts +7 -0
- package/dist/components/event-appointment/index.js +14 -0
- package/dist/components/event-detail/event-detail.schema.dereffed.json +12 -12
- package/dist/components/event-detail/event-detail.schema.json +3 -3
- package/dist/components/event-detail/index.d.ts +1 -1
- package/dist/components/event-detail/index.js +4 -4
- package/dist/components/event-latest/event-latest.schema.dereffed.json +3 -3
- package/dist/components/event-latest/event-latest.schema.json +1 -1
- package/dist/components/event-latest/index.d.ts +3 -3
- package/dist/components/{event-teaser/event-teaser.css → event-latest-teaser/event-latest-teaser.css} +13 -13
- package/dist/components/{event-teaser/event-teaser.schema.dereffed.json → event-latest-teaser/event-latest-teaser.schema.dereffed.json} +3 -3
- package/dist/components/{event-teaser/event-teaser.schema.json → event-latest-teaser/event-latest-teaser.schema.json} +2 -2
- package/dist/components/event-latest-teaser/index.d.ts +8 -0
- package/dist/components/event-latest-teaser/index.js +17 -0
- package/dist/components/{event-list-location/event-list-location.css → event-location/event-location.css} +15 -15
- package/dist/components/{event-list-location/event-list-location.schema.dereffed.json → event-location/event-location.schema.dereffed.json} +10 -10
- package/dist/components/{event-list-location/event-list-location.schema.json → event-location/event-location.schema.json} +5 -5
- package/dist/components/event-location/index.d.ts +7 -0
- package/dist/components/event-location/index.js +16 -0
- package/dist/components/feature/feature.schema.dereffed.json +3 -3
- package/dist/components/feature/feature.schema.json +3 -3
- package/dist/components/feature/index.d.ts +3 -3
- package/dist/components/feature/index.js +1 -1
- package/dist/components/features/features.schema.dereffed.json +3 -3
- package/dist/components/features/features.schema.json +2 -2
- package/dist/components/features/index.d.ts +1 -1
- package/dist/components/features/index.js +1 -1
- package/dist/components/footer/footer.schema.dereffed.json +12 -12
- package/dist/components/footer/index.d.ts +1 -1
- package/dist/components/footer/index.js +1 -1
- package/dist/components/header/header.schema.dereffed.json +12 -12
- package/dist/components/header/index.d.ts +1 -1
- package/dist/components/hero/hero.schema.dereffed.json +3 -3
- package/dist/components/hero/hero.schema.json +2 -2
- package/dist/components/hero/index.d.ts +1 -1
- package/dist/components/image-story/image-story.schema.dereffed.json +3 -3
- package/dist/components/index/index.d.ts +4 -4
- package/dist/components/logos/index.js +1 -1
- package/dist/components/mosaic/index.js +1 -1
- package/dist/components/mosaic/mosaic.schema.dereffed.json +3 -3
- package/dist/components/nav-dropdown/index.d.ts +1 -1
- package/dist/components/nav-dropdown/index.js +2 -2
- package/dist/components/nav-dropdown/nav-dropdown.schema.dereffed.json +1 -1
- package/dist/components/nav-flyout/index.d.ts +2 -2
- package/dist/components/nav-flyout/index.js +4 -4
- package/dist/components/nav-flyout/nav-flyout.schema.dereffed.json +12 -12
- package/dist/components/nav-main/index.d.ts +5 -5
- package/dist/components/nav-main/nav-main.schema.dereffed.json +15 -15
- package/dist/components/nav-main/nav-main.schema.json +14 -14
- package/dist/components/nav-topbar/index.d.ts +2 -2
- package/dist/components/nav-topbar/index.js +2 -2
- package/dist/components/nav-topbar/nav-topbar.schema.dereffed.json +12 -12
- package/dist/components/page/page.schema.dereffed.json +38 -38
- package/dist/components/page-wrapper/tokens.css +1 -1
- package/dist/components/presets.json +200 -198
- package/dist/components/section/section.schema.dereffed.json +38 -38
- package/dist/components/settings/settings.schema.dereffed.json +24 -24
- package/dist/components/slider/index.d.ts +1 -1
- package/dist/components/slider/slider.schema.dereffed.json +13 -13
- package/dist/components/teaser-card/index.d.ts +1 -1
- package/dist/components/teaser-card/index.js +2 -2
- package/dist/components/teaser-card/teaser-card.schema.dereffed.json +4 -4
- package/dist/components/teaser-card/teaser-card.schema.json +4 -4
- package/dist/components/testimonials/index.d.ts +1 -1
- package/dist/components/tile/tile.schema.dereffed.json +3 -3
- package/dist/components/tile/tile.schema.json +2 -2
- package/dist/components/video-curtain/index.d.ts +1 -1
- package/dist/components/video-curtain/video-curtain.schema.dereffed.json +3 -3
- package/dist/components/video-curtain/video-curtain.schema.json +2 -2
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +1 -1
- package/dist/tokens/tokens.js +1 -1
- package/package.json +1 -1
- package/dist/components/event-list-appointment/index.d.ts +0 -7
- package/dist/components/event-list-appointment/index.js +0 -14
- package/dist/components/event-list-location/index.d.ts +0 -7
- package/dist/components/event-list-location/index.js +0 -16
- package/dist/components/event-teaser/index.d.ts +0 -8
- package/dist/components/event-teaser/index.js +0 -17
- /package/dist/{BlogTeaserProps-d62a0a9a.d.ts → BlogTeaserProps-f5855e93.d.ts} +0 -0
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"id": "blog-blog-aside--default",
|
|
4
4
|
"group": "Blog/ Blog Aside",
|
|
5
5
|
"name": "Default",
|
|
6
|
-
"code": "<BlogAside\n author={{\n byline: 'CEO at Company',\n image: {\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
6
|
+
"code": "<BlogAside\n author={{\n byline: 'CEO at Company',\n image: {\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'twitter',\n label: 'jane_smith',\n newTab: false,\n url: 'tel:+4922868896620'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'email',\n label: 'jane.smith@example.com',\n newTab: false,\n url: 'mailto:mail@example.com'\n }\n ],\n name: 'Jane Smith'\n }}\n date=\"12/30/2022\"\n readingTime=\"5 min read\"\n socialSharing={[\n {\n href: 'https://twitter.com/share?text=The%20Future%20of%20AI&url=https://example.com/blog/the-future-of-ai',\n icon: 'twitter',\n title: 'Share on Twitter',\n url: 'https://twitter.com/share?text=Check%20this%20out!&url=https://example.com'\n },\n {\n href: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog/the-future-of-ai&title=The%20Future%20of%20AI&summary=The%20Future%20of%20AI&source=LinkedIn',\n icon: 'linkedin',\n title: 'Share on LinkedIn',\n url: 'https://twitter.com/share?text=Check%20this%20out!&url=https://example.com'\n }\n ]}\n/>",
|
|
7
7
|
"args": {
|
|
8
8
|
"author": {
|
|
9
9
|
"name": "Jane Smith",
|
|
@@ -18,14 +18,14 @@
|
|
|
18
18
|
{
|
|
19
19
|
"icon": "twitter",
|
|
20
20
|
"label": "jane_smith",
|
|
21
|
-
"
|
|
21
|
+
"url": "tel:+4922868896620",
|
|
22
22
|
"newTab": false,
|
|
23
23
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
24
24
|
},
|
|
25
25
|
{
|
|
26
26
|
"icon": "email",
|
|
27
27
|
"label": "jane.smith@example.com",
|
|
28
|
-
"
|
|
28
|
+
"url": "mailto:mail@example.com",
|
|
29
29
|
"newTab": false,
|
|
30
30
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
31
31
|
}
|
|
@@ -34,13 +34,15 @@
|
|
|
34
34
|
"socialSharing": [
|
|
35
35
|
{
|
|
36
36
|
"icon": "twitter",
|
|
37
|
-
"
|
|
38
|
-
"title": "Share on Twitter"
|
|
37
|
+
"url": "https://twitter.com/share?text=Check%20this%20out!&url=https://example.com",
|
|
38
|
+
"title": "Share on Twitter",
|
|
39
|
+
"href": "https://twitter.com/share?text=The%20Future%20of%20AI&url=https://example.com/blog/the-future-of-ai"
|
|
39
40
|
},
|
|
40
41
|
{
|
|
41
42
|
"icon": "linkedin",
|
|
42
|
-
"
|
|
43
|
-
"title": "Share on LinkedIn"
|
|
43
|
+
"url": "https://twitter.com/share?text=Check%20this%20out!&url=https://example.com",
|
|
44
|
+
"title": "Share on LinkedIn",
|
|
45
|
+
"href": "https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog/the-future-of-ai&title=The%20Future%20of%20AI&summary=The%20Future%20of%20AI&source=LinkedIn"
|
|
44
46
|
}
|
|
45
47
|
],
|
|
46
48
|
"readingTime": "5 min read",
|
|
@@ -52,7 +54,7 @@
|
|
|
52
54
|
"id": "blog-blog-author--default",
|
|
53
55
|
"group": "Blog/ Blog Author",
|
|
54
56
|
"name": "Default",
|
|
55
|
-
"code": "<BlogAuthor\n byline=\"CEO at Company\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
57
|
+
"code": "<BlogAuthor\n byline=\"CEO at Company\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'twitter',\n label: 'jane_smith',\n newTab: false,\n url: 'tel:+4922868896620'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'email',\n label: 'jane.smith@example.com',\n newTab: false,\n url: 'mailto:mail@example.com'\n }\n ]}\n name=\"Jane Smith\"\n/>",
|
|
56
58
|
"args": {
|
|
57
59
|
"name": "Jane Smith",
|
|
58
60
|
"byline": "CEO at Company",
|
|
@@ -66,14 +68,14 @@
|
|
|
66
68
|
{
|
|
67
69
|
"icon": "twitter",
|
|
68
70
|
"label": "jane_smith",
|
|
69
|
-
"
|
|
71
|
+
"url": "tel:+4922868896620",
|
|
70
72
|
"newTab": false,
|
|
71
73
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
72
74
|
},
|
|
73
75
|
{
|
|
74
76
|
"icon": "email",
|
|
75
77
|
"label": "jane.smith@example.com",
|
|
76
|
-
"
|
|
78
|
+
"url": "mailto:mail@example.com",
|
|
77
79
|
"newTab": false,
|
|
78
80
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
79
81
|
}
|
|
@@ -190,7 +192,7 @@
|
|
|
190
192
|
"id": "page-archetypes-blog-overview--blog-overview",
|
|
191
193
|
"group": "Page Archetypes/Blog Overview",
|
|
192
194
|
"name": "BlogOverview",
|
|
193
|
-
"code": "<BlogOverview\n cta={{\n align: 'center',\n buttons: [\n {\n icon: 'person',\n label: 'Contact us',\n
|
|
195
|
+
"code": "<BlogOverview\n cta={{\n align: 'center',\n buttons: [\n {\n icon: 'person',\n label: 'Contact us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n url: '#'\n }\n ],\n colorNeutral: false,\n contentAlign: 'center',\n fullWidth: true,\n headline: 'Get in touch',\n highlightText: false,\n image: {\n align: 'center',\n padding: false,\n src: 'img/contact-person.png'\n },\n inverted: false,\n order: {\n desktopImageLast: false,\n mobileImageLast: false\n },\n padding: false,\n sub: 'Chat with us about getting your product or platform to market faster',\n text: 'Our modular design approach allows for flexibility and scalability in your application\\'s architecture.',\n textAlign: 'left',\n width: 'wide'\n }}\n latest={{\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics: A Journey from Vision to Reality',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Design Systems'\n },\n {\n entry: 'Headless Websites'\n },\n {\n entry: 'Training'\n }\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence. We discuss our unique approach to Design System Consulting, where we align your vision with actionable strategies for seamless and captivating user experiences.'\n }}\n latestTitle=\"Latest Post\"\n list={[\n {\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Design Systems'\n }\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence..'\n },\n {\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-emily.png',\n name: 'Jane Doe',\n title: 'CTO'\n },\n date: '12/30/2022',\n headline: 'Unleashing Innovation with Headless Websites',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article2'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Headless Websites'\n }\n ],\n teaserText: 'Dive into the exciting world of headless architecture with Systemics. This article explores our Headless Websites service, a playground of innovation and creativity for brands seeking to redefine their digital journey.'\n },\n {\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Investing in Digital Excellence: Systemics\\' Design System Trainings',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article3'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Training'\n }\n ],\n teaserText: 'Investing in your digital team\\'s growth is crucial for sustainable success. In this article, we highlight Systemics\\' Design System Trainings, designed to equip your team with the skills they need to harness your design system effectively.'\n }\n ]}\n listTitle=\"Recent Posts\"\n more={[\n {\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-alex.png',\n name: 'John Doe',\n title: 'CEO'\n },\n date: '12/30/2022',\n headline: 'Mastering the Art of Design Systems with Systemics',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article1'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Design Systems'\n }\n ],\n teaserText: 'In this enlightening article, we delve into how Systemics, your go-to Design System agency, brings clarity and coherence to your brand\\'s digital presence..'\n },\n {\n alt: 'Image of a business team working',\n author: {\n image: 'img/people/author-emily.png',\n name: 'Jane Doe',\n title: 'CTO'\n },\n date: '12/30/2022',\n headline: 'Unleashing Innovation with Headless Websites',\n image: 'img/close-up-young-business-team-working.png',\n link: {\n label: 'Read more',\n text: 'Read article',\n url: 'https://example.com/article2'\n },\n readingTime: '5 min read',\n tags: [\n {\n entry: 'Headless Websites'\n }\n ],\n teaserText: 'Dive into the exciting world of headless architecture with Systemics. This article explores our Headless Websites service, a playground of innovation and creativity for brands seeking to redefine their digital journey.'\n }\n ]}\n moreTitle=\"Featured Posts\"\n section={[\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
194
196
|
"args": {
|
|
195
197
|
"section": [
|
|
196
198
|
{
|
|
@@ -480,12 +482,12 @@
|
|
|
480
482
|
{
|
|
481
483
|
"label": "Contact us",
|
|
482
484
|
"icon": "person",
|
|
483
|
-
"
|
|
485
|
+
"url": "#"
|
|
484
486
|
},
|
|
485
487
|
{
|
|
486
488
|
"label": "Book a meeting",
|
|
487
489
|
"icon": "date",
|
|
488
|
-
"
|
|
490
|
+
"url": "#"
|
|
489
491
|
}
|
|
490
492
|
],
|
|
491
493
|
"image": {
|
|
@@ -513,7 +515,7 @@
|
|
|
513
515
|
"id": "page-archetypes-blog-post--blog-post",
|
|
514
516
|
"group": "Page Archetypes/Blog Post",
|
|
515
517
|
"name": "BlogPost",
|
|
516
|
-
"code": "<BlogPost\n aside={{\n author: {\n byline: 'Senior Developer',\n email: 'Jane.doe@example.com',\n image: {\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
518
|
+
"code": "<BlogPost\n aside={{\n author: {\n byline: 'Senior Developer',\n email: 'Jane.doe@example.com',\n image: {\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'phone',\n label: '0228 / 688 966 20',\n newTab: false,\n url: 'tel:+4922868896620'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'email',\n label: 'mail@example.com',\n newTab: false,\n url: 'mailto:mail@example.com'\n }\n ],\n name: 'Jane Doe',\n twitter: 'Janedoe'\n },\n date: '12/30/2022',\n readingTime: '5 min read',\n socialSharing: [\n {\n icon: 'twitter',\n title: 'Share on Twitter',\n url: 'https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog'\n },\n {\n icon: 'linkedin',\n title: 'Share on LinkedIn',\n url: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline'\n }\n ]\n }}\n contact={{\n copy: 'Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences.',\n image: {\n alt: 'Picture of Jane Smith',\n aspectRatio: 'vertical',\n fullWidth: false,\n src: 'img/people/contact-john.png'\n },\n links: [\n {\n icon: 'xing',\n label: 'john.smith',\n newTab: false,\n url: 'mailto:mail@example.com'\n },\n {\n icon: 'twitter',\n label: '@john_smith',\n newTab: false,\n url: '#'\n }\n ],\n subtitle: 'Sales Representative',\n title: 'John Smith'\n }}\n content=\"\n## Introduction\nThe future of **Artificial Intelligence (AI)** is a topic that has been the subject of much debate. It's a field that's constantly evolving, with new advancements and breakthroughs happening all the time. [Learn more about AI](https://en.wikipedia.org/wiki/Artificial_intelligence)\n\n## The Current State of AI\nToday, AI is already a part of our daily lives. From *smart home devices* to *recommendation algorithms* on our favorite streaming services, AI is everywhere.\n\n## The Potential of AI\nThe potential of AI is immense. It has the ability to revolutionize industries, from healthcare to finance, and everything in between.\n\n## The Challenges of AI\nHowever, with great potential comes great challenges. Issues such as data privacy and the ethical implications of AI are just some of the hurdles that need to be overcome.\n\n## The Role of AI in Society\nAI has the potential to greatly impact society. It can lead to job creation in new industries, and can also help solve complex societal problems.\n\n## Conclusion\nThe future of AI is exciting and full of potential. However, it's important that we navigate this future with caution, ensuring that the benefits of AI are accessible to all, while minimizing its potential risks.\n \"\n cta={{\n align: 'center',\n buttons: [\n {\n icon: 'person',\n label: 'Contact Us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n url: '#'\n }\n ],\n colorNeutral: false,\n headline: 'Ready to Transform Your Development Process?',\n highlightText: false,\n image: {\n align: 'center',\n padding: true\n },\n inverted: false,\n order: {\n desktopImageLast: true,\n mobileImageLast: false\n },\n padding: false,\n sub: 'Start your journey today.',\n text: 'Get started with our design system today and experience a new level of efficiency and consistency in your projects.',\n textAlign: 'center'\n }}\n head={{\n alt: 'Image of a business team working',\n date: '12/30/2022',\n headline: 'The Future of AI: A Glimpse into the Unseen',\n image: 'img/close-up-young-business-team-working.png',\n tags: [\n {\n entry: 'Technology'\n },\n {\n entry: 'AI'\n }\n ]\n }}\n section={[\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n },\n {\n backgroundColor: 'default',\n buttons: [\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ],\n content: {\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n },\n headerSpacing: false,\n headline: {\n large: false,\n text: 'Section headline',\n width: 'unset'\n },\n inverted: false,\n spaceAfter: 'default',\n spaceBefore: 'default',\n spotlight: false,\n transition: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
517
519
|
"args": {
|
|
518
520
|
"head": {
|
|
519
521
|
"date": "12/30/2022",
|
|
@@ -543,14 +545,14 @@
|
|
|
543
545
|
{
|
|
544
546
|
"icon": "phone",
|
|
545
547
|
"label": "0228 / 688 966 20",
|
|
546
|
-
"
|
|
548
|
+
"url": "tel:+4922868896620",
|
|
547
549
|
"newTab": false,
|
|
548
550
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
549
551
|
},
|
|
550
552
|
{
|
|
551
553
|
"icon": "email",
|
|
552
554
|
"label": "mail@example.com",
|
|
553
|
-
"
|
|
555
|
+
"url": "mailto:mail@example.com",
|
|
554
556
|
"newTab": false,
|
|
555
557
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
556
558
|
}
|
|
@@ -561,12 +563,12 @@
|
|
|
561
563
|
"socialSharing": [
|
|
562
564
|
{
|
|
563
565
|
"icon": "twitter",
|
|
564
|
-
"
|
|
566
|
+
"url": "https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog",
|
|
565
567
|
"title": "Share on Twitter"
|
|
566
568
|
},
|
|
567
569
|
{
|
|
568
570
|
"icon": "linkedin",
|
|
569
|
-
"
|
|
571
|
+
"url": "https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline",
|
|
570
572
|
"title": "Share on LinkedIn"
|
|
571
573
|
}
|
|
572
574
|
],
|
|
@@ -709,12 +711,12 @@
|
|
|
709
711
|
"buttons": [
|
|
710
712
|
{
|
|
711
713
|
"label": "Contact Us",
|
|
712
|
-
"
|
|
714
|
+
"url": "#",
|
|
713
715
|
"icon": "person"
|
|
714
716
|
},
|
|
715
717
|
{
|
|
716
718
|
"label": "Learn More",
|
|
717
|
-
"
|
|
719
|
+
"url": "#",
|
|
718
720
|
"icon": "date"
|
|
719
721
|
}
|
|
720
722
|
],
|
|
@@ -746,13 +748,13 @@
|
|
|
746
748
|
{
|
|
747
749
|
"icon": "xing",
|
|
748
750
|
"label": "john.smith",
|
|
749
|
-
"
|
|
751
|
+
"url": "mailto:mail@example.com",
|
|
750
752
|
"newTab": false
|
|
751
753
|
},
|
|
752
754
|
{
|
|
753
755
|
"icon": "twitter",
|
|
754
756
|
"label": "@john_smith",
|
|
755
|
-
"
|
|
757
|
+
"url": "#",
|
|
756
758
|
"newTab": false
|
|
757
759
|
}
|
|
758
760
|
],
|
|
@@ -765,7 +767,7 @@
|
|
|
765
767
|
"id": "page-archetypes-event-detail--event-detail",
|
|
766
768
|
"group": "Page Archetypes/Event Detail",
|
|
767
769
|
"name": "EventDetail",
|
|
768
|
-
"code": "<EventDetail\n button={{\n label: 'See all Events',\n
|
|
770
|
+
"code": "<EventDetail\n button={{\n label: 'See all Events',\n url: '/#'\n }}\n categories={[\n {\n label: 'Conference'\n },\n {\n label: 'Design Systems'\n }\n ]}\n description=\"\nJoin us for a day of inspiring talks, hands-on workshops, and networking with design system experts from around the world.\n\n**Highlights:**\n- Keynotes from industry leaders\n- Practical sessions on design tokens, accessibility, and scaling systems\n- Evening networking event with food & drinks\n \"\n downloads={[\n {\n format: 'PDF',\n name: 'Product Brochure',\n previewImage: 'img/offset-image.png',\n size: '2.5 MB',\n url: 'img/offset-image.png'\n },\n {\n format: 'PDF',\n name: 'Company Brochure',\n previewImage: 'img/kickstartDS/CMS-Starter producthunt-slide-01.svg',\n size: '3.2 MB',\n url: 'img/kickstartDS/CMS-Starter producthunt-slide-01.svg'\n },\n {\n format: 'DOC',\n name: 'User Guide',\n size: '20 KB',\n url: 'assets/user-guide.doc'\n },\n {\n format: 'TXT',\n name: 'Technical Specifications',\n size: '12 KB',\n url: 'assets/technical-specifications.txt'\n }\n ]}\n images={[\n {\n alt: 'Alt text Image 1',\n caption: 'Caption Image 1',\n src: 'img/close-up-young-business-team-working.png'\n },\n {\n alt: 'Alt text Image 2',\n caption: 'Caption Image 2',\n src: 'img/low-angle-tall-building-with-many-windows_23-2148230392.png'\n },\n {\n alt: 'Alt text Image 3',\n caption: 'Caption Image 3',\n src: 'img/full-shot-different-people-working-together.png'\n },\n {\n alt: 'Alt text Image 4',\n caption: 'Caption Image 4',\n src: 'img/top-view-desk-with-keyboard-drawing-pad.png'\n }\n ]}\n intro=\"A full-day event for design system professionals and enthusiasts. Join us to learn, share, and connect with like-minded individuals.\"\n locations={[\n {\n address: 'Alexanderplatz 1<br />\\n 10178 Berlin',\n dates: [\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00',\n url: '#'\n },\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00',\n url: '#'\n }\n ],\n links: [\n {\n label: 'Open in Google Maps',\n newTab: true,\n url: 'https://maps.google.com/?q=Berlin+Congress+Center'\n }\n ],\n locationName: 'Berlin Congress Center'\n },\n {\n address: 'Messeplatz 1<br />\\n 50679 Köln',\n dates: [\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00',\n url: '#'\n }\n ],\n links: [\n {\n label: 'Open in Google Maps',\n newTab: true,\n url: 'https://maps.google.com/?q=Berlin+Congress+Center'\n },\n {\n label: 'Location Website',\n newTab: true,\n url: 'https://www.berlincongresscenter.com'\n }\n ],\n locationName: 'Köln Messe'\n }\n ]}\n title=\"Systemics Design Conference 2025\"\n/>",
|
|
769
771
|
"args": {
|
|
770
772
|
"categories": [
|
|
771
773
|
{
|
|
@@ -782,7 +784,7 @@
|
|
|
782
784
|
"date": "2025-09-18",
|
|
783
785
|
"time": "09:00 – 17:00",
|
|
784
786
|
"label": "Register",
|
|
785
|
-
"
|
|
787
|
+
"url": "#",
|
|
786
788
|
"newTab": true,
|
|
787
789
|
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
788
790
|
},
|
|
@@ -790,7 +792,7 @@
|
|
|
790
792
|
"date": "2025-09-18",
|
|
791
793
|
"time": "09:00 – 17:00",
|
|
792
794
|
"label": "Register",
|
|
793
|
-
"
|
|
795
|
+
"url": "#",
|
|
794
796
|
"newTab": true,
|
|
795
797
|
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
796
798
|
}
|
|
@@ -800,7 +802,7 @@
|
|
|
800
802
|
"links": [
|
|
801
803
|
{
|
|
802
804
|
"newTab": true,
|
|
803
|
-
"
|
|
805
|
+
"url": "https://maps.google.com/?q=Berlin+Congress+Center",
|
|
804
806
|
"label": "Open in Google Maps"
|
|
805
807
|
}
|
|
806
808
|
]
|
|
@@ -811,7 +813,7 @@
|
|
|
811
813
|
"date": "2025-09-18",
|
|
812
814
|
"time": "09:00 – 17:00",
|
|
813
815
|
"label": "Register",
|
|
814
|
-
"
|
|
816
|
+
"url": "#",
|
|
815
817
|
"newTab": true,
|
|
816
818
|
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
817
819
|
}
|
|
@@ -821,12 +823,12 @@
|
|
|
821
823
|
"links": [
|
|
822
824
|
{
|
|
823
825
|
"newTab": true,
|
|
824
|
-
"
|
|
826
|
+
"url": "https://maps.google.com/?q=Berlin+Congress+Center",
|
|
825
827
|
"label": "Open in Google Maps"
|
|
826
828
|
},
|
|
827
829
|
{
|
|
828
830
|
"newTab": true,
|
|
829
|
-
"
|
|
831
|
+
"url": "https://www.berlincongresscenter.com",
|
|
830
832
|
"label": "Location Website"
|
|
831
833
|
}
|
|
832
834
|
]
|
|
@@ -856,7 +858,7 @@
|
|
|
856
858
|
],
|
|
857
859
|
"button": {
|
|
858
860
|
"label": "See all Events",
|
|
859
|
-
"
|
|
861
|
+
"url": "/#"
|
|
860
862
|
},
|
|
861
863
|
"title": "Systemics Design Conference 2025",
|
|
862
864
|
"intro": "A full-day event for design system professionals and enthusiasts. Join us to learn, share, and connect with like-minded individuals.",
|
|
@@ -896,7 +898,7 @@
|
|
|
896
898
|
"id": "components-contact--wide-image",
|
|
897
899
|
"group": "Components/Contact",
|
|
898
900
|
"name": "WideImage",
|
|
899
|
-
"code": "<Contact\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'wide',\n fullWidth: false,\n src: 'img/people/contact-isabella.png'\n }}\n links={[\n {\n ariaLabel: 'Isabella Doe on Twitter',\n
|
|
901
|
+
"code": "<Contact\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'wide',\n fullWidth: false,\n src: 'img/people/contact-isabella.png'\n }}\n links={[\n {\n ariaLabel: 'Isabella Doe on Twitter',\n icon: 'twitter',\n label: '@Isabella_Doe',\n newTab: false,\n url: '#'\n },\n {\n ariaLabel: 'Isabella Doe on LinkedIn',\n icon: 'linkedin',\n label: 'Isabella.Doe',\n newTab: false,\n url: 'mailto:mail@example.com'\n }\n ]}\n subtitle=\"Creative Director\"\n title=\"Isabella Doe\"\n/>",
|
|
900
902
|
"args": {
|
|
901
903
|
"image": {
|
|
902
904
|
"src": "img/people/contact-isabella.png",
|
|
@@ -910,14 +912,14 @@
|
|
|
910
912
|
{
|
|
911
913
|
"icon": "twitter",
|
|
912
914
|
"label": "@Isabella_Doe",
|
|
913
|
-
"
|
|
915
|
+
"url": "#",
|
|
914
916
|
"newTab": false,
|
|
915
917
|
"ariaLabel": "Isabella Doe on Twitter"
|
|
916
918
|
},
|
|
917
919
|
{
|
|
918
920
|
"icon": "linkedin",
|
|
919
921
|
"label": "Isabella.Doe",
|
|
920
|
-
"
|
|
922
|
+
"url": "mailto:mail@example.com",
|
|
921
923
|
"newTab": false,
|
|
922
924
|
"ariaLabel": "Isabella Doe on LinkedIn"
|
|
923
925
|
}
|
|
@@ -929,7 +931,7 @@
|
|
|
929
931
|
"id": "components-contact--circular-avatar",
|
|
930
932
|
"group": "Components/Contact",
|
|
931
933
|
"name": "CircularAvatar",
|
|
932
|
-
"code": "<Contact\n copy=\"Leads with a vision for innovative, user-centric web designs\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
934
|
+
"code": "<Contact\n copy=\"Leads with a vision for innovative, user-centric web designs\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'twitter',\n label: '@jane_smith',\n newTab: false,\n url: '#'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'linkedin',\n label: 'jane.smith',\n newTab: false,\n url: 'mailto:mail@example.com'\n }\n ]}\n subtitle=\"CEO at DS Agency\"\n title=\"Jane Smith\"\n/>",
|
|
933
935
|
"args": {
|
|
934
936
|
"image": {
|
|
935
937
|
"src": "img/people/author-emily.png",
|
|
@@ -943,14 +945,14 @@
|
|
|
943
945
|
{
|
|
944
946
|
"icon": "twitter",
|
|
945
947
|
"label": "@jane_smith",
|
|
946
|
-
"
|
|
948
|
+
"url": "#",
|
|
947
949
|
"newTab": false,
|
|
948
950
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
949
951
|
},
|
|
950
952
|
{
|
|
951
953
|
"icon": "linkedin",
|
|
952
954
|
"label": "jane.smith",
|
|
953
|
-
"
|
|
955
|
+
"url": "mailto:mail@example.com",
|
|
954
956
|
"newTab": false,
|
|
955
957
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
956
958
|
}
|
|
@@ -963,7 +965,7 @@
|
|
|
963
965
|
"id": "components-contact--vertical-image-with-paragraph",
|
|
964
966
|
"group": "Components/Contact",
|
|
965
967
|
"name": "VerticalImageWithParagraph",
|
|
966
|
-
"code": "<Contact\n copy=\"Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences.\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'vertical',\n fullWidth: false,\n src: 'img/people/contact-john.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
968
|
+
"code": "<Contact\n copy=\"Leads with a vision for innovative, user-centric web designs, ensuring each project merges creativity with functionality to deliver outstanding digital experiences.\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'vertical',\n fullWidth: false,\n src: 'img/people/contact-john.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'xing',\n label: 'john.smith',\n newTab: false,\n url: 'mailto:mail@example.com'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'twitter',\n label: '@john_smith',\n newTab: false,\n url: '#'\n }\n ]}\n subtitle=\"Sales Representative\"\n title=\"John Smith\"\n/>",
|
|
967
969
|
"args": {
|
|
968
970
|
"image": {
|
|
969
971
|
"src": "img/people/contact-john.png",
|
|
@@ -977,14 +979,14 @@
|
|
|
977
979
|
{
|
|
978
980
|
"icon": "xing",
|
|
979
981
|
"label": "john.smith",
|
|
980
|
-
"
|
|
982
|
+
"url": "mailto:mail@example.com",
|
|
981
983
|
"newTab": false,
|
|
982
984
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
983
985
|
},
|
|
984
986
|
{
|
|
985
987
|
"icon": "twitter",
|
|
986
988
|
"label": "@john_smith",
|
|
987
|
-
"
|
|
989
|
+
"url": "#",
|
|
988
990
|
"newTab": false,
|
|
989
991
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
990
992
|
}
|
|
@@ -997,7 +999,7 @@
|
|
|
997
999
|
"id": "components-contact--full-image-width",
|
|
998
1000
|
"group": "Components/Contact",
|
|
999
1001
|
"name": "FullImageWidth",
|
|
1000
|
-
"code": "<Contact\n copy=\"Blends artistic flair with technical expertise, creating visually stunning and intuitive websites that captivate users and drive engagement.\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'wide',\n fullWidth: true,\n src: 'img/people/contact-jim.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n
|
|
1002
|
+
"code": "<Contact\n copy=\"Blends artistic flair with technical expertise, creating visually stunning and intuitive websites that captivate users and drive engagement.\"\n image={{\n alt: 'Picture of Isabella Doe',\n aspectRatio: 'wide',\n fullWidth: true,\n src: 'img/people/contact-jim.png'\n }}\n links={[\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'email',\n label: 'jim.johnsson@mail.com',\n newTab: false,\n url: 'mailto:mail@example.com'\n },\n {\n ariaLabel: 'Link to Isabella Doe\\'s social media profile',\n icon: 'facebook',\n label: '@jim_johnsson',\n newTab: false,\n url: '#'\n }\n ]}\n subtitle=\"Lead Designer\"\n title=\"Jim Johnsson\"\n/>",
|
|
1001
1003
|
"args": {
|
|
1002
1004
|
"image": {
|
|
1003
1005
|
"src": "img/people/contact-jim.png",
|
|
@@ -1011,14 +1013,14 @@
|
|
|
1011
1013
|
{
|
|
1012
1014
|
"icon": "email",
|
|
1013
1015
|
"label": "jim.johnsson@mail.com",
|
|
1014
|
-
"
|
|
1016
|
+
"url": "mailto:mail@example.com",
|
|
1015
1017
|
"newTab": false,
|
|
1016
1018
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
1017
1019
|
},
|
|
1018
1020
|
{
|
|
1019
1021
|
"icon": "facebook",
|
|
1020
1022
|
"label": "@jim_johnsson",
|
|
1021
|
-
"
|
|
1023
|
+
"url": "#",
|
|
1022
1024
|
"newTab": false,
|
|
1023
1025
|
"ariaLabel": "Link to Isabella Doe's social media profile"
|
|
1024
1026
|
}
|
|
@@ -1031,7 +1033,7 @@
|
|
|
1031
1033
|
"id": "components-cta--banner",
|
|
1032
1034
|
"group": "Components/Cta",
|
|
1033
1035
|
"name": "Banner",
|
|
1034
|
-
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact Us',\n
|
|
1036
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact Us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n url: '#'\n }\n ]}\n headline=\"Ready to Transform Your Development Process?\"\n image={{\n align: 'center',\n padding: true\n }}\n order={{\n desktopImageLast: true,\n mobileImageLast: false\n }}\n sub=\"Start your journey today.\"\n text=\"Get started with our design system today and experience a new level of efficiency and consistency in your projects.\"\n textAlign=\"center\"\n/>",
|
|
1035
1037
|
"args": {
|
|
1036
1038
|
"headline": "Ready to Transform Your Development Process?",
|
|
1037
1039
|
"sub": "Start your journey today.",
|
|
@@ -1040,12 +1042,12 @@
|
|
|
1040
1042
|
"buttons": [
|
|
1041
1043
|
{
|
|
1042
1044
|
"label": "Contact Us",
|
|
1043
|
-
"
|
|
1045
|
+
"url": "#",
|
|
1044
1046
|
"icon": "person"
|
|
1045
1047
|
},
|
|
1046
1048
|
{
|
|
1047
1049
|
"label": "Learn More",
|
|
1048
|
-
"
|
|
1050
|
+
"url": "#",
|
|
1049
1051
|
"icon": "date"
|
|
1050
1052
|
}
|
|
1051
1053
|
],
|
|
@@ -1069,7 +1071,7 @@
|
|
|
1069
1071
|
"id": "components-cta--highlighted",
|
|
1070
1072
|
"group": "Components/Cta",
|
|
1071
1073
|
"name": "Highlighted",
|
|
1072
|
-
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Get Started',\n
|
|
1074
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Get Started',\n url: '#'\n }\n ]}\n headline=\"Why Choose Our Design System?\"\n highlightText\n image={{\n align: 'center',\n padding: true\n }}\n order={{\n desktopImageLast: true,\n mobileImageLast: false\n }}\n sub=\"Built for consistency and speed.\"\n text=\"Our design system is built with scalability and efficiency in mind. It allows for consistent UI across different platforms, making your development process smoother and faster.\"\n textAlign=\"center\"\n/>",
|
|
1073
1075
|
"args": {
|
|
1074
1076
|
"headline": "Why Choose Our Design System?",
|
|
1075
1077
|
"sub": "Built for consistency and speed.",
|
|
@@ -1078,7 +1080,7 @@
|
|
|
1078
1080
|
"buttons": [
|
|
1079
1081
|
{
|
|
1080
1082
|
"label": "Get Started",
|
|
1081
|
-
"
|
|
1083
|
+
"url": "#",
|
|
1082
1084
|
"icon": "person"
|
|
1083
1085
|
}
|
|
1084
1086
|
],
|
|
@@ -1102,7 +1104,7 @@
|
|
|
1102
1104
|
"id": "components-cta--left-aligned",
|
|
1103
1105
|
"group": "Components/Cta",
|
|
1104
1106
|
"name": "LeftAligned",
|
|
1105
|
-
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Learn More',\n
|
|
1107
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Learn More',\n url: '#'\n }\n ]}\n headline=\"Experience Our Design System\"\n image={{\n align: 'center',\n padding: true\n }}\n order={{\n desktopImageLast: true,\n mobileImageLast: false\n }}\n sub=\"Efficient, scalable, seamless.\"\n text=\"Our design system offers a seamless and efficient way to build scalable applications. Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.\"\n textAlign=\"left\"\n/>",
|
|
1106
1108
|
"args": {
|
|
1107
1109
|
"headline": "Experience Our Design System",
|
|
1108
1110
|
"sub": "Efficient, scalable, seamless.",
|
|
@@ -1111,7 +1113,7 @@
|
|
|
1111
1113
|
"buttons": [
|
|
1112
1114
|
{
|
|
1113
1115
|
"label": "Learn More",
|
|
1114
|
-
"
|
|
1116
|
+
"url": "#",
|
|
1115
1117
|
"icon": "person"
|
|
1116
1118
|
}
|
|
1117
1119
|
],
|
|
@@ -1135,7 +1137,7 @@
|
|
|
1135
1137
|
"id": "components-cta--product-advertisement",
|
|
1136
1138
|
"group": "Components/Cta",
|
|
1137
1139
|
"name": "ProductAdvertisement",
|
|
1138
|
-
"code": "<Cta\n align=\"center\"\n backgroundImage=\"img/bg_dot-carpet-blue.svg\"\n buttons={[\n {\n icon: 'chevron-right',\n label: 'Shop Now',\n
|
|
1140
|
+
"code": "<Cta\n align=\"center\"\n backgroundImage=\"img/bg_dot-carpet-blue.svg\"\n buttons={[\n {\n icon: 'chevron-right',\n label: 'Shop Now',\n url: '/shop'\n },\n {\n label: 'Learn More',\n url: '/product-info'\n }\n ]}\n headline=\"Experience Immersive Sound\"\n highlightText\n image={{\n align: 'center',\n alt: 'Over-Ear Headphones',\n padding: false,\n src: 'img/showcases/comp_audio04.png'\n }}\n order={{\n desktopImageLast: false,\n mobileImageLast: false\n }}\n padding\n sub=\"With Our Premium Over-Ear Headphones\"\n text=\"Our over-ear headphones provide an immersive audio experience. With noise-cancellation technology and high-quality sound.\"\n textAlign=\"left\"\n/>",
|
|
1139
1141
|
"args": {
|
|
1140
1142
|
"headline": "Experience Immersive Sound",
|
|
1141
1143
|
"sub": "With Our Premium Over-Ear Headphones",
|
|
@@ -1144,12 +1146,12 @@
|
|
|
1144
1146
|
"buttons": [
|
|
1145
1147
|
{
|
|
1146
1148
|
"label": "Shop Now",
|
|
1147
|
-
"
|
|
1149
|
+
"url": "/shop",
|
|
1148
1150
|
"icon": "chevron-right"
|
|
1149
1151
|
},
|
|
1150
1152
|
{
|
|
1151
1153
|
"label": "Learn More",
|
|
1152
|
-
"
|
|
1154
|
+
"url": "/product-info"
|
|
1153
1155
|
}
|
|
1154
1156
|
],
|
|
1155
1157
|
"image": {
|
|
@@ -1175,7 +1177,7 @@
|
|
|
1175
1177
|
"id": "components-cta--contact-banner",
|
|
1176
1178
|
"group": "Components/Cta",
|
|
1177
1179
|
"name": "ContactBanner",
|
|
1178
|
-
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n
|
|
1180
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n url: '#'\n }\n ]}\n headline=\"Get in touch\"\n image={{\n align: 'center',\n padding: false,\n src: 'img/contact-person.png'\n }}\n order={{\n desktopImageLast: false,\n mobileImageLast: false\n }}\n padding\n sub=\"Chat with us about getting your product or platform to market faster\"\n text=\"Our modular design approach allows for flexibility and scalability in your application's architecture.\"\n textAlign=\"left\"\n/>",
|
|
1179
1181
|
"args": {
|
|
1180
1182
|
"headline": "Get in touch",
|
|
1181
1183
|
"sub": "Chat with us about getting your product or platform to market faster",
|
|
@@ -1185,12 +1187,12 @@
|
|
|
1185
1187
|
{
|
|
1186
1188
|
"label": "Contact us",
|
|
1187
1189
|
"icon": "person",
|
|
1188
|
-
"
|
|
1190
|
+
"url": "#"
|
|
1189
1191
|
},
|
|
1190
1192
|
{
|
|
1191
1193
|
"label": "Book a meeting",
|
|
1192
1194
|
"icon": "date",
|
|
1193
|
-
"
|
|
1195
|
+
"url": "#"
|
|
1194
1196
|
}
|
|
1195
1197
|
],
|
|
1196
1198
|
"image": {
|
|
@@ -1214,7 +1216,7 @@
|
|
|
1214
1216
|
"id": "components-cta--split-banner",
|
|
1215
1217
|
"group": "Components/Cta",
|
|
1216
1218
|
"name": "SplitBanner",
|
|
1217
|
-
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#001856\"\n buttons={[\n {\n icon: 'person',\n label: 'What can we do for you?',\n
|
|
1219
|
+
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#001856\"\n buttons={[\n {\n icon: 'person',\n label: 'What can we do for you?',\n url: '#'\n }\n ]}\n colorNeutral\n headline=\"Design System Services\"\n image={{\n align: 'center',\n padding: false,\n src: 'img/colored-square.png'\n }}\n order={{\n desktopImageLast: false,\n mobileImageLast: false\n }}\n padding\n sub=\"Subheadline\"\n text=\"Here at Systemics, we bring a range of design system services that can make a difference.\"\n textAlign=\"left\"\n/>",
|
|
1218
1220
|
"args": {
|
|
1219
1221
|
"headline": "Design System Services",
|
|
1220
1222
|
"sub": "Subheadline",
|
|
@@ -1224,7 +1226,7 @@
|
|
|
1224
1226
|
{
|
|
1225
1227
|
"label": "What can we do for you?",
|
|
1226
1228
|
"icon": "person",
|
|
1227
|
-
"
|
|
1229
|
+
"url": "#"
|
|
1228
1230
|
}
|
|
1229
1231
|
],
|
|
1230
1232
|
"image": {
|
|
@@ -1249,7 +1251,7 @@
|
|
|
1249
1251
|
"id": "components-cta--angled-image",
|
|
1250
1252
|
"group": "Components/Cta",
|
|
1251
1253
|
"name": "AngledImage",
|
|
1252
|
-
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n
|
|
1254
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n url: '#'\n }\n ]}\n headline=\"Our **Approach** to Design Systems\"\n image={{\n align: 'center',\n padding: false,\n src: 'img/angled-image.png'\n }}\n order={{\n desktopImageLast: true,\n mobileImageLast: false\n }}\n padding\n sub=\"Subheadline\"\n text=\"We value efficiency without compromising quality. Our secret weapon? kickstartDS, a revolutionary code-first and open source framework for creating design systems.\n\nThis tool accelerates our development, saving you valuable time and helping us deliver top-notch results faster.\"\n textAlign=\"left\"\n/>",
|
|
1253
1255
|
"args": {
|
|
1254
1256
|
"headline": "Our **Approach** to Design Systems",
|
|
1255
1257
|
"sub": "Subheadline",
|
|
@@ -1259,12 +1261,12 @@
|
|
|
1259
1261
|
{
|
|
1260
1262
|
"label": "Contact us",
|
|
1261
1263
|
"icon": "person",
|
|
1262
|
-
"
|
|
1264
|
+
"url": "#"
|
|
1263
1265
|
},
|
|
1264
1266
|
{
|
|
1265
1267
|
"label": "Book a meeting",
|
|
1266
1268
|
"icon": "date",
|
|
1267
|
-
"
|
|
1269
|
+
"url": "#"
|
|
1268
1270
|
}
|
|
1269
1271
|
],
|
|
1270
1272
|
"image": {
|
|
@@ -1288,7 +1290,7 @@
|
|
|
1288
1290
|
"id": "components-cta--colored-banner",
|
|
1289
1291
|
"group": "Components/Cta",
|
|
1290
1292
|
"name": "ColoredBanner",
|
|
1291
|
-
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#a30051\"\n buttons={[\n {\n label: 'Learn More',\n
|
|
1293
|
+
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#a30051\"\n buttons={[\n {\n label: 'Learn More',\n url: '#'\n },\n {\n label: 'Contact Us',\n url: '#'\n }\n ]}\n colorNeutral\n headline=\"Expertise in Scalable Solutions\"\n highlightText\n image={{\n align: 'center',\n padding: true\n }}\n order={{\n desktopImageLast: true,\n mobileImageLast: false\n }}\n padding\n sub=\"Subheadline\"\n text=\"Leverage our expertise in creating scalable and robust applications using modern technologies.\"\n textAlign=\"left\"\n/>",
|
|
1292
1294
|
"args": {
|
|
1293
1295
|
"headline": "Expertise in Scalable Solutions",
|
|
1294
1296
|
"sub": "Subheadline",
|
|
@@ -1297,11 +1299,11 @@
|
|
|
1297
1299
|
"buttons": [
|
|
1298
1300
|
{
|
|
1299
1301
|
"label": "Learn More",
|
|
1300
|
-
"
|
|
1302
|
+
"url": "#"
|
|
1301
1303
|
},
|
|
1302
1304
|
{
|
|
1303
1305
|
"label": "Contact Us",
|
|
1304
|
-
"
|
|
1306
|
+
"url": "#"
|
|
1305
1307
|
}
|
|
1306
1308
|
],
|
|
1307
1309
|
"image": {
|
|
@@ -1325,7 +1327,7 @@
|
|
|
1325
1327
|
"id": "components-cta--align-bottom",
|
|
1326
1328
|
"group": "Components/Cta",
|
|
1327
1329
|
"name": "AlignBottom",
|
|
1328
|
-
"code": "<Cta\n align=\"bottom\"\n backgroundImage=\"img/grid-bg.svg\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n
|
|
1330
|
+
"code": "<Cta\n align=\"bottom\"\n backgroundImage=\"img/grid-bg.svg\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n url: '#'\n }\n ]}\n headline=\"Custom Solutions\"\n image={{\n align: 'center',\n padding: true,\n src: 'img/offset-image.png'\n }}\n order={{\n desktopImageLast: false,\n mobileImageLast: false\n }}\n sub=\"Subheadline\"\n text=\"At Systemics, we believe in the power of technology to transform businesses. Our team of experienced professionals is dedicated to providing innovative solutions that meet the unique needs of your business.\n\nWe understand that every business is different, and that's why we offer custom solutions tailored to your specific business needs and requirements.\"\n textAlign=\"left\"\n/>",
|
|
1329
1331
|
"args": {
|
|
1330
1332
|
"headline": "Custom Solutions",
|
|
1331
1333
|
"sub": "Subheadline",
|
|
@@ -1335,12 +1337,12 @@
|
|
|
1335
1337
|
{
|
|
1336
1338
|
"label": "Contact us",
|
|
1337
1339
|
"icon": "person",
|
|
1338
|
-
"
|
|
1340
|
+
"url": "#"
|
|
1339
1341
|
},
|
|
1340
1342
|
{
|
|
1341
1343
|
"label": "Book a meeting",
|
|
1342
1344
|
"icon": "date",
|
|
1343
|
-
"
|
|
1345
|
+
"url": "#"
|
|
1344
1346
|
}
|
|
1345
1347
|
],
|
|
1346
1348
|
"image": {
|
|
@@ -1518,6 +1520,21 @@
|
|
|
1518
1520
|
},
|
|
1519
1521
|
"screenshot": "img/screenshots/industry-downloads--mixed.png"
|
|
1520
1522
|
},
|
|
1523
|
+
{
|
|
1524
|
+
"id": "event-event-appointment--default",
|
|
1525
|
+
"group": "Event/ Event Appointment",
|
|
1526
|
+
"name": "Default",
|
|
1527
|
+
"code": "<EventAppointment\n ariaLabel=\"Register for the event on 18th September 2025 from 09:00 to 17:00\"\n date=\"2025-09-18\"\n label=\"Register\"\n newTab\n time=\"09:00 – 17:00\"\n url=\"#\"\n/>",
|
|
1528
|
+
"args": {
|
|
1529
|
+
"date": "2025-09-18",
|
|
1530
|
+
"time": "09:00 – 17:00",
|
|
1531
|
+
"label": "Register",
|
|
1532
|
+
"url": "#",
|
|
1533
|
+
"newTab": true,
|
|
1534
|
+
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
1535
|
+
},
|
|
1536
|
+
"screenshot": "img/screenshots/event-event-appointment--default.png"
|
|
1537
|
+
},
|
|
1521
1538
|
{
|
|
1522
1539
|
"id": "event-event-header--default",
|
|
1523
1540
|
"group": "Event/ Event Header",
|
|
@@ -1537,6 +1554,29 @@
|
|
|
1537
1554
|
},
|
|
1538
1555
|
"screenshot": "img/screenshots/event-event-header--default.png"
|
|
1539
1556
|
},
|
|
1557
|
+
{
|
|
1558
|
+
"id": "event-event-latest-teaser--default",
|
|
1559
|
+
"group": "Event/ Event Latest Teaser",
|
|
1560
|
+
"name": "Default",
|
|
1561
|
+
"code": "<EventLatestTeaser\n ariaLabel=\"Event teaser for \"\n calendar={{\n day: '30',\n month: 'Dec'\n }}\n cta=\"Show event\"\n date=\"12/30/2025\"\n link={{\n text: 'Show event',\n url: '#'\n }}\n location=\"Berlin, Germany\"\n title=\"The Future of AI\"\n url=\"https://example.com\"\n/>",
|
|
1562
|
+
"args": {
|
|
1563
|
+
"date": "12/30/2025",
|
|
1564
|
+
"calendar": {
|
|
1565
|
+
"month": "Dec",
|
|
1566
|
+
"day": "30"
|
|
1567
|
+
},
|
|
1568
|
+
"title": "The Future of AI",
|
|
1569
|
+
"location": "Berlin, Germany",
|
|
1570
|
+
"url": "https://example.com",
|
|
1571
|
+
"cta": "Show event",
|
|
1572
|
+
"ariaLabel": "Event teaser for ",
|
|
1573
|
+
"link": {
|
|
1574
|
+
"url": "#",
|
|
1575
|
+
"text": "Show event"
|
|
1576
|
+
}
|
|
1577
|
+
},
|
|
1578
|
+
"screenshot": "img/screenshots/event-event-latest-teaser--default.png"
|
|
1579
|
+
},
|
|
1540
1580
|
{
|
|
1541
1581
|
"id": "event-event-latest--default",
|
|
1542
1582
|
"group": "Event/ Event Latest",
|
|
@@ -1589,32 +1629,17 @@
|
|
|
1589
1629
|
"screenshot": "img/screenshots/event-event-latest--default.png"
|
|
1590
1630
|
},
|
|
1591
1631
|
{
|
|
1592
|
-
"id": "event-event-
|
|
1593
|
-
"group": "Event/ Event
|
|
1632
|
+
"id": "event-event-location--default",
|
|
1633
|
+
"group": "Event/ Event Location",
|
|
1594
1634
|
"name": "Default",
|
|
1595
|
-
"code": "<
|
|
1596
|
-
"args": {
|
|
1597
|
-
"date": "2025-09-18",
|
|
1598
|
-
"time": "09:00 – 17:00",
|
|
1599
|
-
"label": "Register",
|
|
1600
|
-
"href": "#",
|
|
1601
|
-
"newTab": true,
|
|
1602
|
-
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
1603
|
-
},
|
|
1604
|
-
"screenshot": "img/screenshots/event-event-list-appointment--default.png"
|
|
1605
|
-
},
|
|
1606
|
-
{
|
|
1607
|
-
"id": "event-event-list-location--default",
|
|
1608
|
-
"group": "Event/ Event List Location",
|
|
1609
|
-
"name": "Default",
|
|
1610
|
-
"code": "<EventListLocation\n address=\"Alexanderplatz 1<br />\n 10178 Berlin\"\n dates={[\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n href: '#',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00'\n },\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n href: '#',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00'\n }\n ]}\n links={[\n {\n href: 'https://maps.google.com/?q=Berlin+Congress+Center',\n label: 'Open in Google Maps',\n newTab: true\n },\n {\n href: 'https://maps.google.com/?q=Berlin+Congress+Center',\n label: 'Location Website',\n newTab: true\n }\n ]}\n locationName=\"Berlin Congress Center\"\n/>",
|
|
1635
|
+
"code": "<EventLocation\n address=\"Alexanderplatz 1<br />\n 10178 Berlin\"\n dates={[\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00',\n url: '#'\n },\n {\n ariaLabel: 'Register for the event on 18th September 2025 from 09:00 to 17:00',\n date: '2025-09-18',\n label: 'Register',\n newTab: true,\n time: '09:00 – 17:00',\n url: '#'\n }\n ]}\n links={[\n {\n label: 'Open in Google Maps',\n newTab: true,\n url: 'https://maps.google.com/?q=Berlin+Congress+Center'\n },\n {\n label: 'Location Website',\n newTab: true,\n url: 'https://maps.google.com/?q=Berlin+Congress+Center'\n }\n ]}\n locationName=\"Berlin Congress Center\"\n/>",
|
|
1611
1636
|
"args": {
|
|
1612
1637
|
"dates": [
|
|
1613
1638
|
{
|
|
1614
1639
|
"date": "2025-09-18",
|
|
1615
1640
|
"time": "09:00 – 17:00",
|
|
1616
1641
|
"label": "Register",
|
|
1617
|
-
"
|
|
1642
|
+
"url": "#",
|
|
1618
1643
|
"newTab": true,
|
|
1619
1644
|
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
1620
1645
|
},
|
|
@@ -1622,7 +1647,7 @@
|
|
|
1622
1647
|
"date": "2025-09-18",
|
|
1623
1648
|
"time": "09:00 – 17:00",
|
|
1624
1649
|
"label": "Register",
|
|
1625
|
-
"
|
|
1650
|
+
"url": "#",
|
|
1626
1651
|
"newTab": true,
|
|
1627
1652
|
"ariaLabel": "Register for the event on 18th September 2025 from 09:00 to 17:00"
|
|
1628
1653
|
}
|
|
@@ -1632,40 +1657,17 @@
|
|
|
1632
1657
|
"links": [
|
|
1633
1658
|
{
|
|
1634
1659
|
"newTab": true,
|
|
1635
|
-
"
|
|
1660
|
+
"url": "https://maps.google.com/?q=Berlin+Congress+Center",
|
|
1636
1661
|
"label": "Open in Google Maps"
|
|
1637
1662
|
},
|
|
1638
1663
|
{
|
|
1639
1664
|
"newTab": true,
|
|
1640
|
-
"
|
|
1665
|
+
"url": "https://maps.google.com/?q=Berlin+Congress+Center",
|
|
1641
1666
|
"label": "Location Website"
|
|
1642
1667
|
}
|
|
1643
1668
|
]
|
|
1644
1669
|
},
|
|
1645
|
-
"screenshot": "img/screenshots/event-event-
|
|
1646
|
-
},
|
|
1647
|
-
{
|
|
1648
|
-
"id": "event-event-teaser--default",
|
|
1649
|
-
"group": "Event/ Event Teaser",
|
|
1650
|
-
"name": "Default",
|
|
1651
|
-
"code": "<EventTeaser\n ariaLabel=\"Event teaser for \"\n calendar={{\n day: '30',\n month: 'Dec'\n }}\n cta=\"Show event\"\n date=\"12/30/2025\"\n link={{\n text: 'Show event',\n url: '#'\n }}\n location=\"Berlin, Germany\"\n title=\"The Future of AI\"\n url=\"https://example.com\"\n/>",
|
|
1652
|
-
"args": {
|
|
1653
|
-
"date": "12/30/2025",
|
|
1654
|
-
"calendar": {
|
|
1655
|
-
"month": "Dec",
|
|
1656
|
-
"day": "30"
|
|
1657
|
-
},
|
|
1658
|
-
"title": "The Future of AI",
|
|
1659
|
-
"location": "Berlin, Germany",
|
|
1660
|
-
"url": "https://example.com",
|
|
1661
|
-
"cta": "Show event",
|
|
1662
|
-
"ariaLabel": "Event teaser for ",
|
|
1663
|
-
"link": {
|
|
1664
|
-
"url": "#",
|
|
1665
|
-
"text": "Show event"
|
|
1666
|
-
}
|
|
1667
|
-
},
|
|
1668
|
-
"screenshot": "img/screenshots/event-event-teaser--default.png"
|
|
1670
|
+
"screenshot": "img/screenshots/event-event-location--default.png"
|
|
1669
1671
|
},
|
|
1670
1672
|
{
|
|
1671
1673
|
"id": "components-faq--dropdown-list",
|
|
@@ -1709,7 +1711,7 @@
|
|
|
1709
1711
|
"id": "components-features--icon-centered",
|
|
1710
1712
|
"group": "Components/Features",
|
|
1711
1713
|
"name": "IconCentered",
|
|
1712
|
-
"code": "<Features\n ctas={{\n style: 'link',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Learn more',\n
|
|
1714
|
+
"code": "<Features\n ctas={{\n style: 'link',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Learn more',\n url: '#'\n },\n icon: 'home',\n text: 'Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.',\n title: 'Scalable Architecture'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Get started',\n url: '#'\n },\n icon: 'map',\n text: 'Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.',\n title: 'Efficient Development'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n url: '#'\n },\n icon: 'person',\n text: 'Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.',\n title: 'Consistent UI'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n url: '#'\n },\n icon: 'star',\n text: 'Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.',\n title: 'Customizable Design'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Deploy',\n url: '#'\n },\n icon: 'upload',\n text: 'Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.',\n title: 'Cloud Ready'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Secure',\n url: '#'\n },\n icon: 'login',\n text: 'Security is our priority. Our design system is built with best security practices to keep your application safe.',\n title: 'Secure'\n }\n ]}\n layout=\"largeTiles\"\n style=\"centered\"\n/>",
|
|
1713
1715
|
"args": {
|
|
1714
1716
|
"layout": "largeTiles",
|
|
1715
1717
|
"style": "centered",
|
|
@@ -1723,7 +1725,7 @@
|
|
|
1723
1725
|
"title": "Scalable Architecture",
|
|
1724
1726
|
"text": "Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.",
|
|
1725
1727
|
"cta": {
|
|
1726
|
-
"
|
|
1728
|
+
"url": "#",
|
|
1727
1729
|
"label": "Learn more",
|
|
1728
1730
|
"icon": "arrow-right"
|
|
1729
1731
|
}
|
|
@@ -1733,7 +1735,7 @@
|
|
|
1733
1735
|
"title": "Efficient Development",
|
|
1734
1736
|
"text": "Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.",
|
|
1735
1737
|
"cta": {
|
|
1736
|
-
"
|
|
1738
|
+
"url": "#",
|
|
1737
1739
|
"label": "Get started",
|
|
1738
1740
|
"icon": "arrow-right"
|
|
1739
1741
|
}
|
|
@@ -1743,7 +1745,7 @@
|
|
|
1743
1745
|
"title": "Consistent UI",
|
|
1744
1746
|
"text": "Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.",
|
|
1745
1747
|
"cta": {
|
|
1746
|
-
"
|
|
1748
|
+
"url": "#",
|
|
1747
1749
|
"label": "Explore",
|
|
1748
1750
|
"icon": "arrow-right"
|
|
1749
1751
|
}
|
|
@@ -1753,7 +1755,7 @@
|
|
|
1753
1755
|
"title": "Customizable Design",
|
|
1754
1756
|
"text": "Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.",
|
|
1755
1757
|
"cta": {
|
|
1756
|
-
"
|
|
1758
|
+
"url": "#",
|
|
1757
1759
|
"label": "Customize",
|
|
1758
1760
|
"icon": "arrow-right"
|
|
1759
1761
|
}
|
|
@@ -1763,7 +1765,7 @@
|
|
|
1763
1765
|
"title": "Cloud Ready",
|
|
1764
1766
|
"text": "Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.",
|
|
1765
1767
|
"cta": {
|
|
1766
|
-
"
|
|
1768
|
+
"url": "#",
|
|
1767
1769
|
"label": "Deploy",
|
|
1768
1770
|
"icon": "arrow-right"
|
|
1769
1771
|
}
|
|
@@ -1773,7 +1775,7 @@
|
|
|
1773
1775
|
"title": "Secure",
|
|
1774
1776
|
"text": "Security is our priority. Our design system is built with best security practices to keep your application safe.",
|
|
1775
1777
|
"cta": {
|
|
1776
|
-
"
|
|
1778
|
+
"url": "#",
|
|
1777
1779
|
"label": "Secure",
|
|
1778
1780
|
"icon": "arrow-right"
|
|
1779
1781
|
}
|
|
@@ -1786,7 +1788,7 @@
|
|
|
1786
1788
|
"id": "components-features--stack-with-button",
|
|
1787
1789
|
"group": "Components/Features",
|
|
1788
1790
|
"name": "StackWithButton",
|
|
1789
|
-
"code": "<Features\n ctas={{\n style: 'button',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n
|
|
1791
|
+
"code": "<Features\n ctas={{\n style: 'button',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n url: '#'\n },\n icon: 'person',\n text: 'Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.',\n title: 'Consistent UI'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n url: '#'\n },\n icon: 'star',\n text: 'Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.',\n title: 'Customizable Design'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Deploy',\n url: '#'\n },\n icon: 'upload',\n text: 'Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.',\n title: 'Cloud Ready'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Secure',\n url: '#'\n },\n icon: 'login',\n text: 'Security is our priority. Our design system is built with best security practices to keep your application safe.',\n title: 'Secure'\n }\n ]}\n layout=\"smallTiles\"\n style=\"stack\"\n/>",
|
|
1790
1792
|
"args": {
|
|
1791
1793
|
"layout": "smallTiles",
|
|
1792
1794
|
"style": "stack",
|
|
@@ -1800,7 +1802,7 @@
|
|
|
1800
1802
|
"title": "Consistent UI",
|
|
1801
1803
|
"text": "Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.",
|
|
1802
1804
|
"cta": {
|
|
1803
|
-
"
|
|
1805
|
+
"url": "#",
|
|
1804
1806
|
"label": "Explore",
|
|
1805
1807
|
"icon": "arrow-right"
|
|
1806
1808
|
}
|
|
@@ -1810,7 +1812,7 @@
|
|
|
1810
1812
|
"title": "Customizable Design",
|
|
1811
1813
|
"text": "Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.",
|
|
1812
1814
|
"cta": {
|
|
1813
|
-
"
|
|
1815
|
+
"url": "#",
|
|
1814
1816
|
"label": "Customize",
|
|
1815
1817
|
"icon": "arrow-right"
|
|
1816
1818
|
}
|
|
@@ -1820,7 +1822,7 @@
|
|
|
1820
1822
|
"title": "Cloud Ready",
|
|
1821
1823
|
"text": "Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.",
|
|
1822
1824
|
"cta": {
|
|
1823
|
-
"
|
|
1825
|
+
"url": "#",
|
|
1824
1826
|
"label": "Deploy",
|
|
1825
1827
|
"icon": "arrow-right"
|
|
1826
1828
|
}
|
|
@@ -1830,7 +1832,7 @@
|
|
|
1830
1832
|
"title": "Secure",
|
|
1831
1833
|
"text": "Security is our priority. Our design system is built with best security practices to keep your application safe.",
|
|
1832
1834
|
"cta": {
|
|
1833
|
-
"
|
|
1835
|
+
"url": "#",
|
|
1834
1836
|
"label": "Secure",
|
|
1835
1837
|
"icon": "arrow-right"
|
|
1836
1838
|
}
|
|
@@ -1843,7 +1845,7 @@
|
|
|
1843
1845
|
"id": "components-features--list-view",
|
|
1844
1846
|
"group": "Components/Features",
|
|
1845
1847
|
"name": "ListView",
|
|
1846
|
-
"code": "<Features\n ctas={{\n style: 'intext',\n toggle: false\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n
|
|
1848
|
+
"code": "<Features\n ctas={{\n style: 'intext',\n toggle: false\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n url: '#'\n },\n icon: 'star',\n text: 'Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.',\n title: 'Customizable Design'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Get started',\n url: '#'\n },\n icon: 'map',\n text: 'Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.',\n title: 'Efficient Development'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n url: '#'\n },\n icon: 'person',\n text: 'Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.',\n title: 'Consistent UI'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Learn more',\n url: '#'\n },\n icon: 'home',\n text: 'Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.',\n title: 'Scalable Architecture'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Deploy',\n url: '#'\n },\n icon: 'upload',\n text: 'Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.',\n title: 'Cloud Ready'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Secure',\n url: '#'\n },\n icon: 'login',\n text: 'Security is our priority. Our design system is built with best security practices to keep your application safe.',\n title: 'Secure'\n }\n ]}\n layout=\"list\"\n style=\"besideLarge\"\n/>",
|
|
1847
1849
|
"args": {
|
|
1848
1850
|
"layout": "list",
|
|
1849
1851
|
"style": "besideLarge",
|
|
@@ -1857,7 +1859,7 @@
|
|
|
1857
1859
|
"title": "Customizable Design",
|
|
1858
1860
|
"text": "Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.",
|
|
1859
1861
|
"cta": {
|
|
1860
|
-
"
|
|
1862
|
+
"url": "#",
|
|
1861
1863
|
"label": "Customize",
|
|
1862
1864
|
"icon": "arrow-right"
|
|
1863
1865
|
}
|
|
@@ -1867,7 +1869,7 @@
|
|
|
1867
1869
|
"title": "Efficient Development",
|
|
1868
1870
|
"text": "Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.",
|
|
1869
1871
|
"cta": {
|
|
1870
|
-
"
|
|
1872
|
+
"url": "#",
|
|
1871
1873
|
"label": "Get started",
|
|
1872
1874
|
"icon": "arrow-right"
|
|
1873
1875
|
}
|
|
@@ -1877,7 +1879,7 @@
|
|
|
1877
1879
|
"title": "Consistent UI",
|
|
1878
1880
|
"text": "Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.",
|
|
1879
1881
|
"cta": {
|
|
1880
|
-
"
|
|
1882
|
+
"url": "#",
|
|
1881
1883
|
"label": "Explore",
|
|
1882
1884
|
"icon": "arrow-right"
|
|
1883
1885
|
}
|
|
@@ -1887,7 +1889,7 @@
|
|
|
1887
1889
|
"title": "Scalable Architecture",
|
|
1888
1890
|
"text": "Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.",
|
|
1889
1891
|
"cta": {
|
|
1890
|
-
"
|
|
1892
|
+
"url": "#",
|
|
1891
1893
|
"label": "Learn more",
|
|
1892
1894
|
"icon": "arrow-right"
|
|
1893
1895
|
}
|
|
@@ -1897,7 +1899,7 @@
|
|
|
1897
1899
|
"title": "Cloud Ready",
|
|
1898
1900
|
"text": "Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.",
|
|
1899
1901
|
"cta": {
|
|
1900
|
-
"
|
|
1902
|
+
"url": "#",
|
|
1901
1903
|
"label": "Deploy",
|
|
1902
1904
|
"icon": "arrow-right"
|
|
1903
1905
|
}
|
|
@@ -1907,7 +1909,7 @@
|
|
|
1907
1909
|
"title": "Secure",
|
|
1908
1910
|
"text": "Security is our priority. Our design system is built with best security practices to keep your application safe.",
|
|
1909
1911
|
"cta": {
|
|
1910
|
-
"
|
|
1912
|
+
"url": "#",
|
|
1911
1913
|
"label": "Secure",
|
|
1912
1914
|
"icon": "arrow-right"
|
|
1913
1915
|
}
|
|
@@ -1920,7 +1922,7 @@
|
|
|
1920
1922
|
"id": "components-features--icon-beside-with-link-in-text",
|
|
1921
1923
|
"group": "Components/Features",
|
|
1922
1924
|
"name": "IconBesideWithLinkInText",
|
|
1923
|
-
"code": "<Features\n ctas={{\n style: 'intext',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Learn more',\n
|
|
1925
|
+
"code": "<Features\n ctas={{\n style: 'intext',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Learn more',\n url: '#'\n },\n icon: 'home',\n text: 'Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.',\n title: 'Scalable Architecture'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Get started',\n url: '#'\n },\n icon: 'map',\n text: 'Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.',\n title: 'Efficient Development'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n url: '#'\n },\n icon: 'person',\n text: 'Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.',\n title: 'Consistent UI'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n url: '#'\n },\n icon: 'star',\n text: 'Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.',\n title: 'Customizable Design'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Deploy',\n url: '#'\n },\n icon: 'upload',\n text: 'Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.',\n title: 'Cloud Ready'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Secure',\n url: '#'\n },\n icon: 'login',\n text: 'Security is our priority. Our design system is built with best security practices to keep your application safe.',\n title: 'Secure'\n }\n ]}\n layout=\"smallTiles\"\n style=\"intext\"\n/>",
|
|
1924
1926
|
"args": {
|
|
1925
1927
|
"layout": "smallTiles",
|
|
1926
1928
|
"style": "intext",
|
|
@@ -1934,7 +1936,7 @@
|
|
|
1934
1936
|
"title": "Scalable Architecture",
|
|
1935
1937
|
"text": "Our design system allows for a scalable architecture, enabling you to build applications that can grow with your needs.",
|
|
1936
1938
|
"cta": {
|
|
1937
|
-
"
|
|
1939
|
+
"url": "#",
|
|
1938
1940
|
"label": "Learn more",
|
|
1939
1941
|
"icon": "arrow-right"
|
|
1940
1942
|
}
|
|
@@ -1944,7 +1946,7 @@
|
|
|
1944
1946
|
"title": "Efficient Development",
|
|
1945
1947
|
"text": "Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.",
|
|
1946
1948
|
"cta": {
|
|
1947
|
-
"
|
|
1949
|
+
"url": "#",
|
|
1948
1950
|
"label": "Get started",
|
|
1949
1951
|
"icon": "arrow-right"
|
|
1950
1952
|
}
|
|
@@ -1954,7 +1956,7 @@
|
|
|
1954
1956
|
"title": "Consistent UI",
|
|
1955
1957
|
"text": "Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.",
|
|
1956
1958
|
"cta": {
|
|
1957
|
-
"
|
|
1959
|
+
"url": "#",
|
|
1958
1960
|
"label": "Explore",
|
|
1959
1961
|
"icon": "arrow-right"
|
|
1960
1962
|
}
|
|
@@ -1964,7 +1966,7 @@
|
|
|
1964
1966
|
"title": "Customizable Design",
|
|
1965
1967
|
"text": "Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.",
|
|
1966
1968
|
"cta": {
|
|
1967
|
-
"
|
|
1969
|
+
"url": "#",
|
|
1968
1970
|
"label": "Customize",
|
|
1969
1971
|
"icon": "arrow-right"
|
|
1970
1972
|
}
|
|
@@ -1974,7 +1976,7 @@
|
|
|
1974
1976
|
"title": "Cloud Ready",
|
|
1975
1977
|
"text": "Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.",
|
|
1976
1978
|
"cta": {
|
|
1977
|
-
"
|
|
1979
|
+
"url": "#",
|
|
1978
1980
|
"label": "Deploy",
|
|
1979
1981
|
"icon": "arrow-right"
|
|
1980
1982
|
}
|
|
@@ -1984,7 +1986,7 @@
|
|
|
1984
1986
|
"title": "Secure",
|
|
1985
1987
|
"text": "Security is our priority. Our design system is built with best security practices to keep your application safe.",
|
|
1986
1988
|
"cta": {
|
|
1987
|
-
"
|
|
1989
|
+
"url": "#",
|
|
1988
1990
|
"label": "Secure",
|
|
1989
1991
|
"icon": "arrow-right"
|
|
1990
1992
|
}
|
|
@@ -1997,7 +1999,7 @@
|
|
|
1997
1999
|
"id": "components-features--icon-intext-with-link",
|
|
1998
2000
|
"group": "Components/Features",
|
|
1999
2001
|
"name": "IconIntextWithLink",
|
|
2000
|
-
"code": "<Features\n ctas={{\n style: 'link',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n
|
|
2002
|
+
"code": "<Features\n ctas={{\n style: 'link',\n toggle: true\n }}\n feature={[\n {\n cta: {\n icon: 'arrow-right',\n label: 'Customize',\n url: '#'\n },\n icon: 'star',\n text: 'Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.',\n title: 'Customizable Design'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Get started',\n url: '#'\n },\n icon: 'map',\n text: 'Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.',\n title: 'Efficient Development'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Explore',\n url: '#'\n },\n icon: 'person',\n text: 'Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.',\n title: 'Consistent UI'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Deploy',\n url: '#'\n },\n icon: 'upload',\n text: 'Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.',\n title: 'Cloud Ready'\n },\n {\n cta: {\n icon: 'arrow-right',\n label: 'Secure',\n url: '#'\n },\n icon: 'login',\n text: 'Security is our priority. Our design system is built with best security practices to keep your application safe.',\n title: 'Secure'\n }\n ]}\n layout=\"largeTiles\"\n style=\"intext\"\n/>",
|
|
2001
2003
|
"args": {
|
|
2002
2004
|
"layout": "largeTiles",
|
|
2003
2005
|
"style": "intext",
|
|
@@ -2011,7 +2013,7 @@
|
|
|
2011
2013
|
"title": "Customizable Design",
|
|
2012
2014
|
"text": "Our design system is fully customizable, allowing you to tailor the look and feel of your application to match your brand identity.",
|
|
2013
2015
|
"cta": {
|
|
2014
|
-
"
|
|
2016
|
+
"url": "#",
|
|
2015
2017
|
"label": "Customize",
|
|
2016
2018
|
"icon": "arrow-right"
|
|
2017
2019
|
}
|
|
@@ -2021,7 +2023,7 @@
|
|
|
2021
2023
|
"title": "Efficient Development",
|
|
2022
2024
|
"text": "Experience efficient development like never before. Our design system streamlines the development process, saving you time and resources.",
|
|
2023
2025
|
"cta": {
|
|
2024
|
-
"
|
|
2026
|
+
"url": "#",
|
|
2025
2027
|
"label": "Get started",
|
|
2026
2028
|
"icon": "arrow-right"
|
|
2027
2029
|
}
|
|
@@ -2031,7 +2033,7 @@
|
|
|
2031
2033
|
"title": "Consistent UI",
|
|
2032
2034
|
"text": "Achieve a consistent UI across different platforms. Our design system ensures your applications maintain a uniform look and feel.",
|
|
2033
2035
|
"cta": {
|
|
2034
|
-
"
|
|
2036
|
+
"url": "#",
|
|
2035
2037
|
"label": "Explore",
|
|
2036
2038
|
"icon": "arrow-right"
|
|
2037
2039
|
}
|
|
@@ -2041,7 +2043,7 @@
|
|
|
2041
2043
|
"title": "Cloud Ready",
|
|
2042
2044
|
"text": "Built with modern cloud architectures in mind, our design system is ready to be deployed on any cloud platform.",
|
|
2043
2045
|
"cta": {
|
|
2044
|
-
"
|
|
2046
|
+
"url": "#",
|
|
2045
2047
|
"label": "Deploy",
|
|
2046
2048
|
"icon": "arrow-right"
|
|
2047
2049
|
}
|
|
@@ -2051,7 +2053,7 @@
|
|
|
2051
2053
|
"title": "Secure",
|
|
2052
2054
|
"text": "Security is our priority. Our design system is built with best security practices to keep your application safe.",
|
|
2053
2055
|
"cta": {
|
|
2054
|
-
"
|
|
2056
|
+
"url": "#",
|
|
2055
2057
|
"label": "Secure",
|
|
2056
2058
|
"icon": "arrow-right"
|
|
2057
2059
|
}
|
|
@@ -2064,7 +2066,7 @@
|
|
|
2064
2066
|
"id": "layout-footer--footer",
|
|
2065
2067
|
"group": "Layout/Footer",
|
|
2066
2068
|
"name": "Footer",
|
|
2067
|
-
"code": "<Footer\n byline=\"© 2024 systemics Inc. All rights reserved.\"\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n inverted: false,\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n
|
|
2069
|
+
"code": "<Footer\n byline=\"© 2024 systemics Inc. All rights reserved.\"\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n inverted: false,\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: 'Active Item',\n url: '#'\n },\n {\n label: 'Navigation Item',\n url: '#'\n },\n {\n items: [\n {\n label: 'Level 2 Item',\n url: '#'\n },\n {\n active: true,\n label: 'Active Item',\n url: '#'\n },\n {\n label: 'An Item with a longer Label',\n url: '#'\n },\n {\n label: 'And One last one',\n url: '#'\n }\n ],\n label: 'Dropdown',\n url: '#'\n },\n {\n label: 'One more Item',\n url: '#'\n },\n {\n label: 'Last Item',\n url: '#'\n }\n ]}\n/>",
|
|
2068
2070
|
"args": {
|
|
2069
2071
|
"logo": {
|
|
2070
2072
|
"src": "/logo.svg",
|
|
@@ -2079,43 +2081,43 @@
|
|
|
2079
2081
|
"inverted": false,
|
|
2080
2082
|
"navItems": [
|
|
2081
2083
|
{
|
|
2082
|
-
"
|
|
2084
|
+
"url": "#",
|
|
2083
2085
|
"label": "Active Item",
|
|
2084
2086
|
"active": true
|
|
2085
2087
|
},
|
|
2086
2088
|
{
|
|
2087
|
-
"
|
|
2089
|
+
"url": "#",
|
|
2088
2090
|
"label": "Navigation Item"
|
|
2089
2091
|
},
|
|
2090
2092
|
{
|
|
2091
|
-
"
|
|
2093
|
+
"url": "#",
|
|
2092
2094
|
"label": "Dropdown",
|
|
2093
2095
|
"items": [
|
|
2094
2096
|
{
|
|
2095
|
-
"
|
|
2097
|
+
"url": "#",
|
|
2096
2098
|
"label": "Level 2 Item"
|
|
2097
2099
|
},
|
|
2098
2100
|
{
|
|
2099
|
-
"
|
|
2101
|
+
"url": "#",
|
|
2100
2102
|
"label": "Active Item",
|
|
2101
2103
|
"active": true
|
|
2102
2104
|
},
|
|
2103
2105
|
{
|
|
2104
|
-
"
|
|
2106
|
+
"url": "#",
|
|
2105
2107
|
"label": "An Item with a longer Label"
|
|
2106
2108
|
},
|
|
2107
2109
|
{
|
|
2108
|
-
"
|
|
2110
|
+
"url": "#",
|
|
2109
2111
|
"label": "And One last one"
|
|
2110
2112
|
}
|
|
2111
2113
|
]
|
|
2112
2114
|
},
|
|
2113
2115
|
{
|
|
2114
|
-
"
|
|
2116
|
+
"url": "#",
|
|
2115
2117
|
"label": "One more Item"
|
|
2116
2118
|
},
|
|
2117
2119
|
{
|
|
2118
|
-
"
|
|
2120
|
+
"url": "#",
|
|
2119
2121
|
"label": "Last Item"
|
|
2120
2122
|
}
|
|
2121
2123
|
]
|
|
@@ -2297,7 +2299,7 @@
|
|
|
2297
2299
|
"id": "layout-header--header",
|
|
2298
2300
|
"group": "Layout/Header",
|
|
2299
2301
|
"name": "Header",
|
|
2300
|
-
"code": "<Header\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n
|
|
2302
|
+
"code": "<Header\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: 'Active Item',\n url: '#'\n },\n {\n label: 'Navigation Item',\n url: '#'\n },\n {\n items: [\n {\n label: 'Level 2 Item',\n url: '#'\n },\n {\n active: true,\n label: 'Active Item',\n url: '#'\n },\n {\n label: 'An Item with a longer Label',\n url: '#'\n },\n {\n label: 'And One last one',\n url: '#'\n }\n ],\n label: 'Dropdown',\n url: '#'\n },\n {\n label: 'One more Item',\n url: '#'\n },\n {\n label: 'Last Item',\n url: '#'\n }\n ]}\n/>",
|
|
2301
2303
|
"args": {
|
|
2302
2304
|
"logo": {
|
|
2303
2305
|
"src": "/logo.svg",
|
|
@@ -2313,43 +2315,43 @@
|
|
|
2313
2315
|
"inverted": false,
|
|
2314
2316
|
"navItems": [
|
|
2315
2317
|
{
|
|
2316
|
-
"
|
|
2318
|
+
"url": "#",
|
|
2317
2319
|
"label": "Active Item",
|
|
2318
2320
|
"active": true
|
|
2319
2321
|
},
|
|
2320
2322
|
{
|
|
2321
|
-
"
|
|
2323
|
+
"url": "#",
|
|
2322
2324
|
"label": "Navigation Item"
|
|
2323
2325
|
},
|
|
2324
2326
|
{
|
|
2325
|
-
"
|
|
2327
|
+
"url": "#",
|
|
2326
2328
|
"label": "Dropdown",
|
|
2327
2329
|
"items": [
|
|
2328
2330
|
{
|
|
2329
|
-
"
|
|
2331
|
+
"url": "#",
|
|
2330
2332
|
"label": "Level 2 Item"
|
|
2331
2333
|
},
|
|
2332
2334
|
{
|
|
2333
|
-
"
|
|
2335
|
+
"url": "#",
|
|
2334
2336
|
"label": "Active Item",
|
|
2335
2337
|
"active": true
|
|
2336
2338
|
},
|
|
2337
2339
|
{
|
|
2338
|
-
"
|
|
2340
|
+
"url": "#",
|
|
2339
2341
|
"label": "An Item with a longer Label"
|
|
2340
2342
|
},
|
|
2341
2343
|
{
|
|
2342
|
-
"
|
|
2344
|
+
"url": "#",
|
|
2343
2345
|
"label": "And One last one"
|
|
2344
2346
|
}
|
|
2345
2347
|
]
|
|
2346
2348
|
},
|
|
2347
2349
|
{
|
|
2348
|
-
"
|
|
2350
|
+
"url": "#",
|
|
2349
2351
|
"label": "One more Item"
|
|
2350
2352
|
},
|
|
2351
2353
|
{
|
|
2352
|
-
"
|
|
2354
|
+
"url": "#",
|
|
2353
2355
|
"label": "Last Item"
|
|
2354
2356
|
}
|
|
2355
2357
|
]
|
|
@@ -2461,7 +2463,7 @@
|
|
|
2461
2463
|
"id": "components-hero--text-below-image",
|
|
2462
2464
|
"group": "Components/Hero",
|
|
2463
2465
|
"name": "TextBelowImage",
|
|
2464
|
-
"code": "<Hero\n buttons={[\n {\n icon: 'arrow-down',\n label: 'Explore further',\n
|
|
2466
|
+
"code": "<Hero\n buttons={[\n {\n icon: 'arrow-down',\n label: 'Explore further',\n url: '#'\n }\n ]}\n headline=\"Welcome to Our Dynamic Workplace\"\n height=\"default\"\n highlightText\n image={{\n indent: 'none',\n src: 'https://picsum.photos/seed/kdsvisual/640/270',\n srcDesktop: 'img/colleagues-work-office-using-computers-looking-aside.png',\n srcMobile: 'img/colleagues-work-office-using-computers-looking-aside.png',\n srcTablet: 'img/colleagues-work-office-using-computers-looking-aside.png'\n }}\n overlay\n sub=\"Where Creativity Meets Innovation\"\n text=\"Experience the perfect blend of creativity, innovation, and productivity in our modern office environment.\"\n textPosition=\"below\"\n/>",
|
|
2465
2467
|
"args": {
|
|
2466
2468
|
"highlightText": true,
|
|
2467
2469
|
"colorNeutral": false,
|
|
@@ -2471,7 +2473,7 @@
|
|
|
2471
2473
|
{
|
|
2472
2474
|
"label": "Explore further",
|
|
2473
2475
|
"icon": "arrow-down",
|
|
2474
|
-
"
|
|
2476
|
+
"url": "#"
|
|
2475
2477
|
}
|
|
2476
2478
|
],
|
|
2477
2479
|
"overlay": true,
|
|
@@ -2494,7 +2496,7 @@
|
|
|
2494
2496
|
"id": "components-hero--text-on-image-with-overlay",
|
|
2495
2497
|
"group": "Components/Hero",
|
|
2496
2498
|
"name": "TextOnImageWithOverlay",
|
|
2497
|
-
"code": "<Hero\n buttons={[\n {\n icon: 'person',\n label: 'Meet Us',\n
|
|
2499
|
+
"code": "<Hero\n buttons={[\n {\n icon: 'person',\n label: 'Meet Us',\n url: '#'\n },\n {\n icon: 'date',\n label: 'Schedule a Meeting',\n url: '#'\n }\n ]}\n colorNeutral\n headline=\"Master Scalable Solutions\"\n height=\"fullImage\"\n image={{\n indent: 'none',\n src: 'https://picsum.photos/seed/kdsvisual/640/270',\n srcDesktop: 'img/top-view-desk-with-keyboard-drawing-pad.png',\n srcMobile: 'img/top-view-desk-with-keyboard-drawing-pad.png',\n srcTablet: 'img/top-view-desk-with-keyboard-drawing-pad.png'\n }}\n overlay\n text=\"Harness our expertise in crafting scalable and robust applications using cutting-edge technologies.\"\n textPosition=\"center\"\n/>",
|
|
2498
2500
|
"args": {
|
|
2499
2501
|
"highlightText": false,
|
|
2500
2502
|
"colorNeutral": true,
|
|
@@ -2504,12 +2506,12 @@
|
|
|
2504
2506
|
{
|
|
2505
2507
|
"label": "Meet Us",
|
|
2506
2508
|
"icon": "person",
|
|
2507
|
-
"
|
|
2509
|
+
"url": "#"
|
|
2508
2510
|
},
|
|
2509
2511
|
{
|
|
2510
2512
|
"label": "Schedule a Meeting",
|
|
2511
2513
|
"icon": "date",
|
|
2512
|
-
"
|
|
2514
|
+
"url": "#"
|
|
2513
2515
|
}
|
|
2514
2516
|
],
|
|
2515
2517
|
"overlay": true,
|
|
@@ -2531,7 +2533,7 @@
|
|
|
2531
2533
|
"id": "components-hero--text-box-on-full-screen",
|
|
2532
2534
|
"group": "Components/Hero",
|
|
2533
2535
|
"name": "TextBoxOnFullScreen",
|
|
2534
|
-
"code": "<Hero\n buttons={[\n {\n icon: 'arrow-right',\n label: 'Discover More',\n
|
|
2536
|
+
"code": "<Hero\n buttons={[\n {\n icon: 'arrow-right',\n label: 'Discover More',\n url: '#'\n },\n {\n icon: 'phone',\n label: 'Reach Out',\n url: '#'\n }\n ]}\n headline=\"Discover Our Design System\"\n height=\"fullScreen\"\n image={{\n indent: 'none',\n src: 'https://picsum.photos/seed/kdsvisual/640/270',\n srcDesktop: 'img/people-brainstorming-work-meeting.png',\n srcMobile: 'img/people-brainstorming-work-meeting.png',\n srcTablet: 'img/people-brainstorming-work-meeting.png'\n }}\n sub=\"Scalable. Efficient. Seamless.\"\n text=\"Our design system provides a seamless and efficient framework for building scalable applications. Experience unprecedented speed and scalability with our Headless CMS powered websites, web apps & composable architecture.\"\n textPosition=\"left\"\n textbox\n/>",
|
|
2535
2537
|
"args": {
|
|
2536
2538
|
"highlightText": false,
|
|
2537
2539
|
"colorNeutral": false,
|
|
@@ -2541,12 +2543,12 @@
|
|
|
2541
2543
|
{
|
|
2542
2544
|
"label": "Discover More",
|
|
2543
2545
|
"icon": "arrow-right",
|
|
2544
|
-
"
|
|
2546
|
+
"url": "#"
|
|
2545
2547
|
},
|
|
2546
2548
|
{
|
|
2547
2549
|
"label": "Reach Out",
|
|
2548
2550
|
"icon": "phone",
|
|
2549
|
-
"
|
|
2551
|
+
"url": "#"
|
|
2550
2552
|
}
|
|
2551
2553
|
],
|
|
2552
2554
|
"overlay": false,
|
|
@@ -2612,7 +2614,7 @@
|
|
|
2612
2614
|
"id": "components-image-story--sticky-image-next-to-scrolling-text",
|
|
2613
2615
|
"group": "Components/Image Story",
|
|
2614
2616
|
"name": "StickyImageNextToScrollingText",
|
|
2615
|
-
"code": "<ImageStory\n buttons={[\n {\n disabled: false,\n label: 'Learn More',\n size: 'medium',\n
|
|
2617
|
+
"code": "<ImageStory\n buttons={[\n {\n disabled: false,\n label: 'Learn More',\n size: 'medium',\n url: '#',\n variant: 'secondary'\n },\n {\n disabled: false,\n label: 'Contact Us',\n size: 'medium',\n url: '#',\n variant: 'secondary'\n }\n ]}\n headline=\"The Sanity & Next.js Experts\"\n image={{\n aspectRatio: 'unset',\n src: 'img/full-shot-different-people-working-together.png',\n vAlign: 'top'\n }}\n largeHeadline\n layout=\"imageLeft\"\n sub=\"Subheadline\"\n text=\"\nHere at Systemics, we bring a range of design system services that can make a difference:\n\n### 1. Design System Consulting\nLet's work side by side to shape a design system strategy that aligns perfectly with your goals. It's not just about tools; it's about guiding principles, stakeholder management und making the right decisions at the right time.\n\n### 2. Design System Creation & Development\nWe'll bring your design system from concept to production, giving you consistent and engaging user experiences across different platforms. We will work together with your digital teams to transfer all complex Figma ideas into code using kickstartDS.\n\n### 3. Headless CMS & Websites\nWe leverage the power of headless CMSs to provide scalable, flexible, and versatile websites that drive your online presence.\n\n### 4. Design System Training\nWe empower your digital teams with the knowledge and skills to manage and evolve your design system effectively.\n\nReady to make your digital journey exceptional?\n \"\n textAlign=\"left\"\n/>",
|
|
2616
2618
|
"args": {
|
|
2617
2619
|
"headline": "The Sanity & Next.js Experts",
|
|
2618
2620
|
"largeHeadline": true,
|
|
@@ -2625,14 +2627,14 @@
|
|
|
2625
2627
|
"variant": "secondary",
|
|
2626
2628
|
"size": "medium",
|
|
2627
2629
|
"disabled": false,
|
|
2628
|
-
"
|
|
2630
|
+
"url": "#"
|
|
2629
2631
|
},
|
|
2630
2632
|
{
|
|
2631
2633
|
"label": "Contact Us",
|
|
2632
2634
|
"variant": "secondary",
|
|
2633
2635
|
"size": "medium",
|
|
2634
2636
|
"disabled": false,
|
|
2635
|
-
"
|
|
2637
|
+
"url": "#"
|
|
2636
2638
|
}
|
|
2637
2639
|
],
|
|
2638
2640
|
"image": {
|
|
@@ -2983,7 +2985,7 @@
|
|
|
2983
2985
|
"id": "layout-section--cards",
|
|
2984
2986
|
"group": "Layout/Section",
|
|
2985
2987
|
"name": "Cards",
|
|
2986
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'tile',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
2988
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'tile',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
2987
2989
|
"args": {
|
|
2988
2990
|
"width": "default",
|
|
2989
2991
|
"backgroundColor": "default",
|
|
@@ -3014,7 +3016,7 @@
|
|
|
3014
3016
|
"id": "layout-section--slider",
|
|
3015
3017
|
"group": "Layout/Section",
|
|
3016
3018
|
"name": "Slider",
|
|
3017
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'slider',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n text: 'Section headline',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3019
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'slider',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n text: 'Section headline',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3018
3020
|
"args": {
|
|
3019
3021
|
"width": "default",
|
|
3020
3022
|
"backgroundColor": "default",
|
|
@@ -3044,7 +3046,7 @@
|
|
|
3044
3046
|
"id": "layout-section--inverted",
|
|
3045
3047
|
"group": "Layout/Section",
|
|
3046
3048
|
"name": "Inverted",
|
|
3047
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n inverted\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3049
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n inverted\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3048
3050
|
"args": {
|
|
3049
3051
|
"width": "default",
|
|
3050
3052
|
"backgroundColor": "default",
|
|
@@ -3075,7 +3077,7 @@
|
|
|
3075
3077
|
"id": "layout-section--background-image",
|
|
3076
3078
|
"group": "Layout/Section",
|
|
3077
3079
|
"name": "BackgroundImage",
|
|
3078
|
-
"code": "<Section\n backgroundColor=\"default\"\n backgroundImage=\"/img/bg_dot-carpet-blue.svg\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'default',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3080
|
+
"code": "<Section\n backgroundColor=\"default\"\n backgroundImage=\"/img/bg_dot-carpet-blue.svg\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'default',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3079
3081
|
"args": {
|
|
3080
3082
|
"width": "default",
|
|
3081
3083
|
"backgroundColor": "default",
|
|
@@ -3107,7 +3109,7 @@
|
|
|
3107
3109
|
"id": "layout-section--spotlight",
|
|
3108
3110
|
"group": "Layout/Section",
|
|
3109
3111
|
"name": "Spotlight",
|
|
3110
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n spotlight\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3112
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n spotlight\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3111
3113
|
"args": {
|
|
3112
3114
|
"width": "default",
|
|
3113
3115
|
"backgroundColor": "default",
|
|
@@ -3138,7 +3140,7 @@
|
|
|
3138
3140
|
"id": "layout-section--stagelights",
|
|
3139
3141
|
"group": "Layout/Section",
|
|
3140
3142
|
"name": "Stagelights",
|
|
3141
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n style=\"stagelights\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3143
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n style=\"stagelights\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3142
3144
|
"args": {
|
|
3143
3145
|
"width": "default",
|
|
3144
3146
|
"backgroundColor": "default",
|
|
@@ -3171,7 +3173,7 @@
|
|
|
3171
3173
|
"id": "layout-section--accent-background",
|
|
3172
3174
|
"group": "Layout/Section",
|
|
3173
3175
|
"name": "AccentBackground",
|
|
3174
|
-
"code": "<Section\n backgroundColor=\"accent\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3176
|
+
"code": "<Section\n backgroundColor=\"accent\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3175
3177
|
"args": {
|
|
3176
3178
|
"width": "default",
|
|
3177
3179
|
"backgroundColor": "accent",
|
|
@@ -3203,7 +3205,7 @@
|
|
|
3203
3205
|
"id": "layout-section--bold-background",
|
|
3204
3206
|
"group": "Layout/Section",
|
|
3205
3207
|
"name": "BoldBackground",
|
|
3206
|
-
"code": "<Section\n backgroundColor=\"bold\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3208
|
+
"code": "<Section\n backgroundColor=\"bold\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3207
3209
|
"args": {
|
|
3208
3210
|
"width": "default",
|
|
3209
3211
|
"backgroundColor": "bold",
|
|
@@ -3235,7 +3237,7 @@
|
|
|
3235
3237
|
"id": "layout-section--colorful-gradient",
|
|
3236
3238
|
"group": "Layout/Section",
|
|
3237
3239
|
"name": "ColorfulGradient",
|
|
3238
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n style=\"horizontalGradient\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3240
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n style=\"horizontalGradient\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3239
3241
|
"args": {
|
|
3240
3242
|
"width": "default",
|
|
3241
3243
|
"backgroundColor": "default",
|
|
@@ -3268,7 +3270,7 @@
|
|
|
3268
3270
|
"id": "layout-section--with-buttons",
|
|
3269
3271
|
"group": "Layout/Section",
|
|
3270
3272
|
"name": "WithButtons",
|
|
3271
|
-
"code": "<Section\n backgroundColor=\"default\"\n buttons={[\n {\n disabled: false,\n icon: 'arrow-right',\n label: 'All Showcases',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n icon: 'date',\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ]}\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3273
|
+
"code": "<Section\n backgroundColor=\"default\"\n buttons={[\n {\n disabled: false,\n icon: 'arrow-right',\n label: 'All Showcases',\n size: 'medium',\n variant: 'secondary'\n },\n {\n disabled: false,\n icon: 'date',\n label: 'Book a meeting',\n size: 'medium',\n variant: 'secondary'\n }\n ]}\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3272
3274
|
"args": {
|
|
3273
3275
|
"width": "default",
|
|
3274
3276
|
"backgroundColor": "default",
|
|
@@ -3315,7 +3317,7 @@
|
|
|
3315
3317
|
"id": "layout-section--tile-layout",
|
|
3316
3318
|
"group": "Layout/Section",
|
|
3317
3319
|
"name": "TileLayout",
|
|
3318
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'tile',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"max\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3320
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'tile',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"max\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n</Section>",
|
|
3319
3321
|
"args": {
|
|
3320
3322
|
"width": "max",
|
|
3321
3323
|
"backgroundColor": "default",
|
|
@@ -3347,7 +3349,7 @@
|
|
|
3347
3349
|
"id": "layout-section--flex-layout",
|
|
3348
3350
|
"group": "Layout/Section",
|
|
3349
3351
|
"name": "FlexLayout",
|
|
3350
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"max\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3352
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"max\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n</Section>",
|
|
3351
3353
|
"args": {
|
|
3352
3354
|
"width": "max",
|
|
3353
3355
|
"backgroundColor": "default",
|
|
@@ -3379,7 +3381,7 @@
|
|
|
3379
3381
|
"id": "layout-section--list-layout",
|
|
3380
3382
|
"group": "Layout/Section",
|
|
3381
3383
|
"name": "ListLayout",
|
|
3382
|
-
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n
|
|
3384
|
+
"code": "<Section\n backgroundColor=\"default\"\n content={{\n align: 'center',\n gutter: 'default',\n mode: 'list',\n tileWidth: 'default',\n width: 'unset'\n }}\n headline={{\n align: 'center',\n large: false,\n sub: 'We can create something shining for you too!',\n text: 'Happy Customers Showcases',\n width: 'unset'\n }}\n spaceAfter=\"default\"\n spaceBefore=\"default\"\n transition=\"default\"\n width=\"default\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n label=\"Freshest Fruit\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'Go to Page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</Section>",
|
|
3383
3385
|
"args": {
|
|
3384
3386
|
"width": "default",
|
|
3385
3387
|
"backgroundColor": "default",
|
|
@@ -3411,7 +3413,7 @@
|
|
|
3411
3413
|
"id": "layout-slider--with-arrows",
|
|
3412
3414
|
"group": "Layout/Slider",
|
|
3413
3415
|
"name": "WithArrows",
|
|
3414
|
-
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n
|
|
3416
|
+
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</No Display Name>",
|
|
3415
3417
|
"args": {
|
|
3416
3418
|
"autoplay": false,
|
|
3417
3419
|
"nav": true,
|
|
@@ -3427,7 +3429,7 @@
|
|
|
3427
3429
|
"id": "layout-slider--with-teased-neighbours",
|
|
3428
3430
|
"group": "Layout/Slider",
|
|
3429
3431
|
"name": "WithTeasedNeighbours",
|
|
3430
|
-
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n teaseNeighbours\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n
|
|
3432
|
+
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n teaseNeighbours\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</No Display Name>",
|
|
3431
3433
|
"args": {
|
|
3432
3434
|
"autoplay": false,
|
|
3433
3435
|
"nav": true,
|
|
@@ -3443,7 +3445,7 @@
|
|
|
3443
3445
|
"id": "layout-slider--with-nav",
|
|
3444
3446
|
"group": "Layout/Slider",
|
|
3445
3447
|
"name": "WithNav",
|
|
3446
|
-
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n
|
|
3448
|
+
"code": "<No Display Name\n arrows\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</No Display Name>",
|
|
3447
3449
|
"args": {
|
|
3448
3450
|
"autoplay": false,
|
|
3449
3451
|
"nav": true,
|
|
@@ -3459,7 +3461,7 @@
|
|
|
3459
3461
|
"id": "layout-slider--with-autoplay",
|
|
3460
3462
|
"group": "Layout/Slider",
|
|
3461
3463
|
"name": "WithAutoplay",
|
|
3462
|
-
"code": "<No Display Name\n arrows\n autoplay\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n
|
|
3464
|
+
"code": "<No Display Name\n arrows\n autoplay\n equalHeight\n gap={15}\n nav\n typeProp=\"carousel\"\n>\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Transformation Love Story\"\n image=\"/img/showcases/comp_tfe01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Speed and Scale\"\n image=\"/img/showcases/comp_audio01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Thanks to rapid landing page creation for LaunchPad Audio Innovations\"\n url=\"#\"\n />\n <TeaserCard\n button={{\n hidden: true,\n label: 'View page'\n }}\n headline=\"Saving Time and Money\"\n image=\"/img/showcases/comp_eco01.jpg\"\n imageRatio=\"unset\"\n layout=\"row\"\n text=\"Navigating the Headless Frontier for EcoTech's 'Brand Consistency\"\n url=\"#\"\n />\n</No Display Name>",
|
|
3463
3465
|
"args": {
|
|
3464
3466
|
"autoplay": true,
|
|
3465
3467
|
"nav": true,
|
|
@@ -3522,7 +3524,7 @@
|
|
|
3522
3524
|
"id": "components-teaser-card--product-tiles",
|
|
3523
3525
|
"group": "Components/Teaser Card",
|
|
3524
3526
|
"name": "ProductTiles",
|
|
3525
|
-
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: true,\n label: 'Go to page'\n }}\n headline=\"Castaway\"\n image=\"img/logos/castaway.svg\"\n imageRatio=\"wide\"\n layout=\"stack\"\n
|
|
3527
|
+
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: true,\n label: 'Go to page'\n }}\n headline=\"Castaway\"\n image=\"img/logos/castaway.svg\"\n imageRatio=\"wide\"\n layout=\"stack\"\n text=\"Transforming Ideas into Code\"\n url=\"#\"\n/>",
|
|
3526
3528
|
"args": {
|
|
3527
3529
|
"layout": "stack",
|
|
3528
3530
|
"button": {
|
|
@@ -3534,7 +3536,7 @@
|
|
|
3534
3536
|
"headline": "Castaway",
|
|
3535
3537
|
"text": "Transforming Ideas into Code",
|
|
3536
3538
|
"image": "img/logos/castaway.svg",
|
|
3537
|
-
"
|
|
3539
|
+
"url": "#"
|
|
3538
3540
|
},
|
|
3539
3541
|
"screenshot": "img/screenshots/components-teaser-card--product-tiles.png"
|
|
3540
3542
|
},
|
|
@@ -3542,7 +3544,7 @@
|
|
|
3542
3544
|
"id": "components-teaser-card--page-navigation",
|
|
3543
3545
|
"group": "Components/Teaser Card",
|
|
3544
3546
|
"name": "PageNavigation",
|
|
3545
|
-
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: false,\n label: 'Read more'\n }}\n headline=\"Design System Services\"\n image=\"img/02.jpg\"\n imageRatio=\"landscape\"\n layout=\"stack\"\n
|
|
3547
|
+
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: false,\n label: 'Read more'\n }}\n headline=\"Design System Services\"\n image=\"img/02.jpg\"\n imageRatio=\"landscape\"\n layout=\"stack\"\n text=\"Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.\"\n url=\"#\"\n/>",
|
|
3546
3548
|
"args": {
|
|
3547
3549
|
"layout": "stack",
|
|
3548
3550
|
"button": {
|
|
@@ -3554,7 +3556,7 @@
|
|
|
3554
3556
|
"headline": "Design System Services",
|
|
3555
3557
|
"text": "Experience the speed & scalability unlike anything seen before with our Headless CMS powered websites, web apps & composable architecture.",
|
|
3556
3558
|
"image": "img/02.jpg",
|
|
3557
|
-
"
|
|
3559
|
+
"url": "#"
|
|
3558
3560
|
},
|
|
3559
3561
|
"screenshot": "img/screenshots/components-teaser-card--page-navigation.png"
|
|
3560
3562
|
},
|
|
@@ -3562,7 +3564,7 @@
|
|
|
3562
3564
|
"id": "components-teaser-card--showcase-preview",
|
|
3563
3565
|
"group": "Components/Teaser Card",
|
|
3564
3566
|
"name": "ShowcasePreview",
|
|
3565
|
-
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: false,\n label: 'View showcase'\n }}\n headline=\"Transformation Love Story\"\n image=\"img/showcases/comp_tfe01.jpg\"\n imageRatio=\"wide\"\n label=\"Tech\"\n layout=\"row\"\n
|
|
3567
|
+
"code": "<TeaserCard\n button={{\n chevron: false,\n hidden: false,\n label: 'View showcase'\n }}\n headline=\"Transformation Love Story\"\n image=\"img/showcases/comp_tfe01.jpg\"\n imageRatio=\"wide\"\n label=\"Tech\"\n layout=\"row\"\n text=\"See how we saved TechFusions a year's worth of development time\"\n url=\"#\"\n/>",
|
|
3566
3568
|
"args": {
|
|
3567
3569
|
"layout": "row",
|
|
3568
3570
|
"button": {
|
|
@@ -3575,7 +3577,7 @@
|
|
|
3575
3577
|
"headline": "Transformation Love Story",
|
|
3576
3578
|
"text": "See how we saved TechFusions a year's worth of development time",
|
|
3577
3579
|
"image": "img/showcases/comp_tfe01.jpg",
|
|
3578
|
-
"
|
|
3580
|
+
"url": "#"
|
|
3579
3581
|
},
|
|
3580
3582
|
"screenshot": "img/screenshots/components-teaser-card--showcase-preview.png"
|
|
3581
3583
|
},
|