@kickstartds/ds-agency-premium 1.6.57--canary.1461.46964a6.0 → 1.6.58--canary.1470.8ef3793.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/BlogOverviewProps-9f207f1c.d.ts +1 -1
- package/dist/BlogPostProps-6b3cff22.d.ts +1 -1
- package/dist/{CtaProps-0931e9c1.d.ts → CtaProps-02e33bf1.d.ts} +8 -3
- package/dist/SectionProps-1cfcf6e8.d.ts +2 -2
- package/dist/{SliderProps-0931e9c1.d.ts → SliderProps-02e33bf1.d.ts} +1 -1
- package/dist/components/blog-overview/blog-overview.schema.dereffed.json +39 -6
- package/dist/components/blog-post/blog-post.schema.dereffed.json +39 -6
- package/dist/components/cta/cta.css +34 -48
- package/dist/components/cta/cta.schema.dereffed.json +13 -2
- package/dist/components/cta/cta.schema.json +9 -2
- package/dist/components/cta/index.d.ts +1 -1
- package/dist/components/cta/index.js +4 -6
- package/dist/components/footer/footer.css +1 -1
- package/dist/components/header/header.css +1 -1
- package/dist/components/hero/hero.css +1 -1
- package/dist/components/image-story/image-story.css +5 -2
- package/dist/components/mosaic/mosaic.css +1 -1
- package/dist/components/page/page.schema.dereffed.json +26 -4
- package/dist/components/page-wrapper/tokens.css +1 -1
- package/dist/components/presets.json +45 -39
- package/dist/components/section/section.css +2 -2
- package/dist/components/section/section.schema.dereffed.json +26 -4
- package/dist/components/slider/index.d.ts +1 -1
- package/dist/components/slider/slider.schema.dereffed.json +13 -2
- package/dist/components/split/split.css +2 -2
- package/dist/components/testimonials/index.d.ts +1 -1
- package/dist/global.css +3 -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
|
@@ -186,7 +186,7 @@
|
|
|
186
186
|
"id": "page-archetypes-blog-overview--blog-overview",
|
|
187
187
|
"group": "Page Archetypes/Blog Overview",
|
|
188
188
|
"name": "BlogOverview",
|
|
189
|
-
"code": "<BlogOverview\n cta={{\n buttons: [\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\n }\n ],\n colorNeutral: false,\n contentAlign: 'center',\n fullWidth: true,\n headline: 'Get in touch',\n highlightText: false,\n image: {\n padding: false,\n src: 'img/contact-person.png'\n },\n order: {\n desktopImageLast: false,\n mobileImageLast: false\n },\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 style: '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 style: '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 style: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
189
|
+
"code": "<BlogOverview\n cta={{\n align: 'center',\n buttons: [\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\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 order: {\n desktopImageLast: false,\n mobileImageLast: false\n },\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 style: '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 style: '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 style: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
190
190
|
"args": {
|
|
191
191
|
"section": [
|
|
192
192
|
{
|
|
@@ -486,6 +486,7 @@
|
|
|
486
486
|
],
|
|
487
487
|
"image": {
|
|
488
488
|
"padding": false,
|
|
489
|
+
"align": "center",
|
|
489
490
|
"src": "img/contact-person.png"
|
|
490
491
|
},
|
|
491
492
|
"order": {
|
|
@@ -493,8 +494,9 @@
|
|
|
493
494
|
"desktopImageLast": false
|
|
494
495
|
},
|
|
495
496
|
"textAlign": "left",
|
|
496
|
-
"
|
|
497
|
+
"align": "center",
|
|
497
498
|
"fullWidth": true,
|
|
499
|
+
"contentAlign": "center",
|
|
498
500
|
"text": "Our modular design approach allows for flexibility and scalability in your application's architecture.",
|
|
499
501
|
"width": "wide"
|
|
500
502
|
}
|
|
@@ -505,7 +507,7 @@
|
|
|
505
507
|
"id": "page-archetypes-blog-post--blog-post",
|
|
506
508
|
"group": "Page Archetypes/Blog Post",
|
|
507
509
|
"name": "BlogPost",
|
|
508
|
-
"code": "<BlogPost\n aside={{\n author: {\n byline: 'Senior Developer',\n email: 'Jane.doe@example.com',\n image: {\n alt: 'Picture of Jane Smith',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n href: 'tel:+4922868896620',\n icon: 'phone',\n label: '0228 / 688 966 20',\n newTab: false\n },\n {\n href: 'mailto:mail@example.com',\n icon: 'email',\n label: 'mail@example.com',\n newTab: false\n }\n ],\n name: 'Jane Doe',\n twitter: 'Janedoe'\n },\n date: '12/30/2022',\n readingTime: '5 min read',\n socialSharing: [\n {\n href: 'https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog',\n icon: 'twitter',\n title: 'Share on Twitter'\n },\n {\n href: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline',\n icon: 'linkedin',\n title: 'Share on LinkedIn'\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 href: 'mailto:mail@example.com',\n icon: 'xing',\n label: 'john.smith',\n newTab: false\n },\n {\n href: '#',\n icon: 'twitter',\n label: '@john_smith',\n newTab: false\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 buttons: [\n {\n icon: 'person',\n label: 'Contact Us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n target: '#'\n }\n ],\n colorNeutral: false,\n
|
|
510
|
+
"code": "<BlogPost\n aside={{\n author: {\n byline: 'Senior Developer',\n email: 'Jane.doe@example.com',\n image: {\n alt: 'Picture of Jane Smith',\n aspectRatio: 'square',\n fullWidth: false,\n src: 'img/people/author-emily.png'\n },\n links: [\n {\n href: 'tel:+4922868896620',\n icon: 'phone',\n label: '0228 / 688 966 20',\n newTab: false\n },\n {\n href: 'mailto:mail@example.com',\n icon: 'email',\n label: 'mail@example.com',\n newTab: false\n }\n ],\n name: 'Jane Doe',\n twitter: 'Janedoe'\n },\n date: '12/30/2022',\n readingTime: '5 min read',\n socialSharing: [\n {\n href: 'https://twitter.com/share?text=This%20is%20a%20blog%20post%20headline&url=https://example.com/blog',\n icon: 'twitter',\n title: 'Share on Twitter'\n },\n {\n href: 'https://www.linkedin.com/shareArticle?mini=true&url=https://example.com/blog&title=This%20is%20a%20blog%20post%20headline',\n icon: 'linkedin',\n title: 'Share on LinkedIn'\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 href: 'mailto:mail@example.com',\n icon: 'xing',\n label: 'john.smith',\n newTab: false\n },\n {\n href: '#',\n icon: 'twitter',\n label: '@john_smith',\n newTab: false\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 target: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n target: '#'\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 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 }}\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 style: '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 style: '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 style: 'default',\n width: 'default'\n }\n ]}\n/>",
|
|
509
511
|
"args": {
|
|
510
512
|
"head": {
|
|
511
513
|
"date": "12/30/2022",
|
|
@@ -709,14 +711,15 @@
|
|
|
709
711
|
}
|
|
710
712
|
],
|
|
711
713
|
"image": {
|
|
712
|
-
"padding": true
|
|
714
|
+
"padding": true,
|
|
715
|
+
"align": "center"
|
|
713
716
|
},
|
|
714
717
|
"order": {
|
|
715
718
|
"mobileImageLast": false,
|
|
716
719
|
"desktopImageLast": true
|
|
717
720
|
},
|
|
718
721
|
"textAlign": "center",
|
|
719
|
-
"
|
|
722
|
+
"align": "center",
|
|
720
723
|
"text": "Get started with our design system today and experience a new level of efficiency and consistency in your projects."
|
|
721
724
|
},
|
|
722
725
|
"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 ",
|
|
@@ -879,7 +882,7 @@
|
|
|
879
882
|
"id": "components-cta--banner",
|
|
880
883
|
"group": "Components/Cta",
|
|
881
884
|
"name": "Banner",
|
|
882
|
-
"code": "<Cta\n buttons={[\n {\n icon: 'person',\n label: 'Contact Us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n target: '#'\n }\n ]}\n
|
|
885
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact Us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Learn More',\n target: '#'\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/>",
|
|
883
886
|
"args": {
|
|
884
887
|
"headline": "Ready to Transform Your Development Process?",
|
|
885
888
|
"sub": "Start your journey today.",
|
|
@@ -898,14 +901,15 @@
|
|
|
898
901
|
}
|
|
899
902
|
],
|
|
900
903
|
"image": {
|
|
901
|
-
"padding": true
|
|
904
|
+
"padding": true,
|
|
905
|
+
"align": "center"
|
|
902
906
|
},
|
|
903
907
|
"order": {
|
|
904
908
|
"mobileImageLast": false,
|
|
905
909
|
"desktopImageLast": true
|
|
906
910
|
},
|
|
907
911
|
"textAlign": "center",
|
|
908
|
-
"
|
|
912
|
+
"align": "center",
|
|
909
913
|
"text": "Get started with our design system today and experience a new level of efficiency and consistency in your projects."
|
|
910
914
|
},
|
|
911
915
|
"screenshot": "img/screenshots/components-cta--banner.png"
|
|
@@ -914,7 +918,7 @@
|
|
|
914
918
|
"id": "components-cta--highlighted",
|
|
915
919
|
"group": "Components/Cta",
|
|
916
920
|
"name": "Highlighted",
|
|
917
|
-
"code": "<Cta\n buttons={[\n {\n icon: 'person',\n label: 'Get Started',\n target: '#'\n }\n ]}\n
|
|
921
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Get Started',\n target: '#'\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/>",
|
|
918
922
|
"args": {
|
|
919
923
|
"headline": "Why Choose Our Design System?",
|
|
920
924
|
"sub": "Built for consistency and speed.",
|
|
@@ -928,14 +932,15 @@
|
|
|
928
932
|
}
|
|
929
933
|
],
|
|
930
934
|
"image": {
|
|
931
|
-
"padding": true
|
|
935
|
+
"padding": true,
|
|
936
|
+
"align": "center"
|
|
932
937
|
},
|
|
933
938
|
"order": {
|
|
934
939
|
"mobileImageLast": false,
|
|
935
940
|
"desktopImageLast": true
|
|
936
941
|
},
|
|
937
942
|
"textAlign": "center",
|
|
938
|
-
"
|
|
943
|
+
"align": "center",
|
|
939
944
|
"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."
|
|
940
945
|
},
|
|
941
946
|
"screenshot": "img/screenshots/components-cta--highlighted.png"
|
|
@@ -944,7 +949,7 @@
|
|
|
944
949
|
"id": "components-cta--left-aligned",
|
|
945
950
|
"group": "Components/Cta",
|
|
946
951
|
"name": "LeftAligned",
|
|
947
|
-
"code": "<Cta\n buttons={[\n {\n icon: 'person',\n label: 'Learn More',\n target: '#'\n }\n ]}\n
|
|
952
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Learn More',\n target: '#'\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/>",
|
|
948
953
|
"args": {
|
|
949
954
|
"headline": "Experience Our Design System",
|
|
950
955
|
"sub": "Efficient, scalable, seamless.",
|
|
@@ -958,14 +963,15 @@
|
|
|
958
963
|
}
|
|
959
964
|
],
|
|
960
965
|
"image": {
|
|
961
|
-
"padding": true
|
|
966
|
+
"padding": true,
|
|
967
|
+
"align": "center"
|
|
962
968
|
},
|
|
963
969
|
"order": {
|
|
964
970
|
"mobileImageLast": false,
|
|
965
971
|
"desktopImageLast": true
|
|
966
972
|
},
|
|
967
973
|
"textAlign": "left",
|
|
968
|
-
"
|
|
974
|
+
"align": "center",
|
|
969
975
|
"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."
|
|
970
976
|
},
|
|
971
977
|
"screenshot": "img/screenshots/components-cta--left-aligned.png"
|
|
@@ -974,7 +980,7 @@
|
|
|
974
980
|
"id": "components-cta--product-advertisement",
|
|
975
981
|
"group": "Components/Cta",
|
|
976
982
|
"name": "ProductAdvertisement",
|
|
977
|
-
"code": "<Cta\n backgroundImage=\"img/bg_dot-carpet-blue.svg\"\n buttons={[\n {\n icon: 'chevron-right',\n label: 'Shop Now',\n target: '/shop'
|
|
983
|
+
"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 target: '/shop'\n },\n {\n label: 'Learn More',\n target: '/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 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/>",
|
|
978
984
|
"args": {
|
|
979
985
|
"headline": "Experience Immersive Sound",
|
|
980
986
|
"sub": "With Our Premium Over-Ear Headphones",
|
|
@@ -984,17 +990,16 @@
|
|
|
984
990
|
{
|
|
985
991
|
"label": "Shop Now",
|
|
986
992
|
"target": "/shop",
|
|
987
|
-
"variant": "primary",
|
|
988
993
|
"icon": "chevron-right"
|
|
989
994
|
},
|
|
990
995
|
{
|
|
991
996
|
"label": "Learn More",
|
|
992
|
-
"target": "/product-info"
|
|
993
|
-
"variant": "secondary"
|
|
997
|
+
"target": "/product-info"
|
|
994
998
|
}
|
|
995
999
|
],
|
|
996
1000
|
"image": {
|
|
997
1001
|
"padding": false,
|
|
1002
|
+
"align": "center",
|
|
998
1003
|
"src": "img/showcases/comp_audio04.png",
|
|
999
1004
|
"alt": "Over-Ear Headphones"
|
|
1000
1005
|
},
|
|
@@ -1003,10 +1008,9 @@
|
|
|
1003
1008
|
"desktopImageLast": false
|
|
1004
1009
|
},
|
|
1005
1010
|
"textAlign": "left",
|
|
1006
|
-
"
|
|
1011
|
+
"align": "center",
|
|
1007
1012
|
"text": "Our over-ear headphones provide an immersive audio experience. With noise-cancellation technology and high-quality sound.",
|
|
1008
|
-
"backgroundImage": "img/bg_dot-carpet-blue.svg"
|
|
1009
|
-
"width": "wide"
|
|
1013
|
+
"backgroundImage": "img/bg_dot-carpet-blue.svg"
|
|
1010
1014
|
},
|
|
1011
1015
|
"screenshot": "img/screenshots/components-cta--product-advertisement.png"
|
|
1012
1016
|
},
|
|
@@ -1014,7 +1018,7 @@
|
|
|
1014
1018
|
"id": "components-cta--contact-banner",
|
|
1015
1019
|
"group": "Components/Cta",
|
|
1016
1020
|
"name": "ContactBanner",
|
|
1017
|
-
"code": "<Cta\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\n }\n ]}\n
|
|
1021
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\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 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/>",
|
|
1018
1022
|
"args": {
|
|
1019
1023
|
"headline": "Get in touch",
|
|
1020
1024
|
"sub": "Chat with us about getting your product or platform to market faster",
|
|
@@ -1034,6 +1038,7 @@
|
|
|
1034
1038
|
],
|
|
1035
1039
|
"image": {
|
|
1036
1040
|
"padding": false,
|
|
1041
|
+
"align": "center",
|
|
1037
1042
|
"src": "img/contact-person.png"
|
|
1038
1043
|
},
|
|
1039
1044
|
"order": {
|
|
@@ -1041,9 +1046,8 @@
|
|
|
1041
1046
|
"desktopImageLast": false
|
|
1042
1047
|
},
|
|
1043
1048
|
"textAlign": "left",
|
|
1044
|
-
"
|
|
1045
|
-
"text": "Our modular design approach allows for flexibility and scalability in your application's architecture."
|
|
1046
|
-
"width": "wide"
|
|
1049
|
+
"align": "center",
|
|
1050
|
+
"text": "Our modular design approach allows for flexibility and scalability in your application's architecture."
|
|
1047
1051
|
},
|
|
1048
1052
|
"screenshot": "img/screenshots/components-cta--contact-banner.png"
|
|
1049
1053
|
},
|
|
@@ -1051,7 +1055,7 @@
|
|
|
1051
1055
|
"id": "components-cta--split-banner",
|
|
1052
1056
|
"group": "Components/Cta",
|
|
1053
1057
|
"name": "SplitBanner",
|
|
1054
|
-
"code": "<Cta\n backgroundColor=\"#001856\"\n buttons={[\n {\n icon: 'person',\n label: 'What can we do for you?',\n target: '#'\n }\n ]}\n colorNeutral\n
|
|
1058
|
+
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#001856\"\n buttons={[\n {\n icon: 'person',\n label: 'What can we do for you?',\n target: '#'\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 sub=\"Subheadline\"\n text=\"Here at Systemics, we bring a range of design system services that can make a difference.\"\n textAlign=\"left\"\n/>",
|
|
1055
1059
|
"args": {
|
|
1056
1060
|
"headline": "Design System Services",
|
|
1057
1061
|
"sub": "Subheadline",
|
|
@@ -1066,6 +1070,7 @@
|
|
|
1066
1070
|
],
|
|
1067
1071
|
"image": {
|
|
1068
1072
|
"padding": false,
|
|
1073
|
+
"align": "center",
|
|
1069
1074
|
"src": "img/colored-square.png"
|
|
1070
1075
|
},
|
|
1071
1076
|
"order": {
|
|
@@ -1073,10 +1078,9 @@
|
|
|
1073
1078
|
"desktopImageLast": false
|
|
1074
1079
|
},
|
|
1075
1080
|
"textAlign": "left",
|
|
1076
|
-
"
|
|
1081
|
+
"align": "center",
|
|
1077
1082
|
"text": "Here at Systemics, we bring a range of design system services that can make a difference.",
|
|
1078
|
-
"backgroundColor": "#001856"
|
|
1079
|
-
"width": "wide"
|
|
1083
|
+
"backgroundColor": "#001856"
|
|
1080
1084
|
},
|
|
1081
1085
|
"screenshot": "img/screenshots/components-cta--split-banner.png"
|
|
1082
1086
|
},
|
|
@@ -1084,7 +1088,7 @@
|
|
|
1084
1088
|
"id": "components-cta--angled-image",
|
|
1085
1089
|
"group": "Components/Cta",
|
|
1086
1090
|
"name": "AngledImage",
|
|
1087
|
-
"code": "<Cta\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\n }\n ]}\n
|
|
1091
|
+
"code": "<Cta\n align=\"center\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\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 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/>",
|
|
1088
1092
|
"args": {
|
|
1089
1093
|
"headline": "Our **Approach** to Design Systems",
|
|
1090
1094
|
"sub": "Subheadline",
|
|
@@ -1104,6 +1108,7 @@
|
|
|
1104
1108
|
],
|
|
1105
1109
|
"image": {
|
|
1106
1110
|
"padding": false,
|
|
1111
|
+
"align": "center",
|
|
1107
1112
|
"src": "img/angled-image.png"
|
|
1108
1113
|
},
|
|
1109
1114
|
"order": {
|
|
@@ -1111,9 +1116,8 @@
|
|
|
1111
1116
|
"desktopImageLast": true
|
|
1112
1117
|
},
|
|
1113
1118
|
"textAlign": "left",
|
|
1114
|
-
"
|
|
1115
|
-
"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."
|
|
1116
|
-
"width": "wide"
|
|
1119
|
+
"align": "center",
|
|
1120
|
+
"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."
|
|
1117
1121
|
},
|
|
1118
1122
|
"screenshot": "img/screenshots/components-cta--angled-image.png"
|
|
1119
1123
|
},
|
|
@@ -1121,7 +1125,7 @@
|
|
|
1121
1125
|
"id": "components-cta--colored-banner",
|
|
1122
1126
|
"group": "Components/Cta",
|
|
1123
1127
|
"name": "ColoredBanner",
|
|
1124
|
-
"code": "<Cta\n backgroundColor=\"#a30051\"\n buttons={[\n {\n label: 'Learn More',\n target: '#'\n },\n {\n label: 'Contact Us',\n target: '#'\n }\n ]}\n colorNeutral\n
|
|
1128
|
+
"code": "<Cta\n align=\"center\"\n backgroundColor=\"#a30051\"\n buttons={[\n {\n label: 'Learn More',\n target: '#'\n },\n {\n label: 'Contact Us',\n target: '#'\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 sub=\"Subheadline\"\n text=\"Leverage our expertise in creating scalable and robust applications using modern technologies.\"\n textAlign=\"left\"\n/>",
|
|
1125
1129
|
"args": {
|
|
1126
1130
|
"headline": "Expertise in Scalable Solutions",
|
|
1127
1131
|
"sub": "Subheadline",
|
|
@@ -1138,14 +1142,15 @@
|
|
|
1138
1142
|
}
|
|
1139
1143
|
],
|
|
1140
1144
|
"image": {
|
|
1141
|
-
"padding": true
|
|
1145
|
+
"padding": true,
|
|
1146
|
+
"align": "center"
|
|
1142
1147
|
},
|
|
1143
1148
|
"order": {
|
|
1144
1149
|
"mobileImageLast": false,
|
|
1145
1150
|
"desktopImageLast": true
|
|
1146
1151
|
},
|
|
1147
1152
|
"textAlign": "left",
|
|
1148
|
-
"
|
|
1153
|
+
"align": "center",
|
|
1149
1154
|
"text": "Leverage our expertise in creating scalable and robust applications using modern technologies.",
|
|
1150
1155
|
"backgroundColor": "#a30051"
|
|
1151
1156
|
},
|
|
@@ -1155,7 +1160,7 @@
|
|
|
1155
1160
|
"id": "components-cta--align-bottom",
|
|
1156
1161
|
"group": "Components/Cta",
|
|
1157
1162
|
"name": "AlignBottom",
|
|
1158
|
-
"code": "<Cta\n backgroundImage=\"img/grid-bg.svg\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\n }\n ]}\n contentAlign=\"bottom\"\n headline=\"Custom Solutions\"\n image={{\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
|
|
1163
|
+
"code": "<Cta\n align=\"center\"\n backgroundImage=\"img/grid-bg.svg\"\n buttons={[\n {\n icon: 'person',\n label: 'Contact us',\n target: '#'\n },\n {\n icon: 'date',\n label: 'Book a meeting',\n target: '#'\n }\n ]}\n contentAlign=\"bottom\"\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/>",
|
|
1159
1164
|
"args": {
|
|
1160
1165
|
"headline": "Custom Solutions",
|
|
1161
1166
|
"sub": "Subheadline",
|
|
@@ -1175,6 +1180,7 @@
|
|
|
1175
1180
|
],
|
|
1176
1181
|
"image": {
|
|
1177
1182
|
"padding": true,
|
|
1183
|
+
"align": "center",
|
|
1178
1184
|
"src": "img/offset-image.png"
|
|
1179
1185
|
},
|
|
1180
1186
|
"order": {
|
|
@@ -1182,10 +1188,10 @@
|
|
|
1182
1188
|
"desktopImageLast": false
|
|
1183
1189
|
},
|
|
1184
1190
|
"textAlign": "left",
|
|
1185
|
-
"
|
|
1191
|
+
"align": "center",
|
|
1186
1192
|
"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.",
|
|
1187
1193
|
"backgroundImage": "img/grid-bg.svg",
|
|
1188
|
-
"
|
|
1194
|
+
"contentAlign": "bottom"
|
|
1189
1195
|
},
|
|
1190
1196
|
"screenshot": "img/screenshots/components-cta--align-bottom.png"
|
|
1191
1197
|
},
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
--dsa-section__col--min-width_medium: var(--dsa-tile--width_medium);
|
|
12
12
|
--dsa-section__col--min-width_large: var(--dsa-tile--width_large);
|
|
13
13
|
--dsa-section__col--min-width_largest: var(--dsa-tile--width_largest);
|
|
14
|
-
--dsa-section--space_default: var(--
|
|
14
|
+
--dsa-section--space_default: var(--dsa-content--vertical-spacing);
|
|
15
15
|
--dsa-section--space_small: calc(var(--ks-spacing-xxl) / 2);
|
|
16
16
|
--dsa-section--gutter_small: var(--ks-spacing-s);
|
|
17
17
|
--dsa-section--gutter_default: var(--ks-spacing-m);
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
--dsa-section__content--width_wide: var(--dsa-content--width_wide);
|
|
23
23
|
--dsa-section__content--width_max: 100vw;
|
|
24
24
|
--dsa-section__content--width_full: 100vw;
|
|
25
|
-
--dsa-section__content--padding: var(--dsa-content--spacing);
|
|
25
|
+
--dsa-section__content--padding: var(--dsa-content--horizontal-spacing);
|
|
26
26
|
--dsa-section--background-color_default: var(--ks-background-color-default);
|
|
27
27
|
--dsa-section--background-color_accent: var(--ks-background-color-accent);
|
|
28
28
|
--dsa-section--background-color_bold: var(--ks-background-color-bold);
|
|
@@ -331,6 +331,17 @@
|
|
|
331
331
|
"title": "Alt text",
|
|
332
332
|
"description": "Image description",
|
|
333
333
|
"type": "string"
|
|
334
|
+
},
|
|
335
|
+
"align": {
|
|
336
|
+
"title": "Vertical alignment of the image",
|
|
337
|
+
"description": "Select a vertical alignment for the image",
|
|
338
|
+
"type": "string",
|
|
339
|
+
"enum": [
|
|
340
|
+
"center",
|
|
341
|
+
"top",
|
|
342
|
+
"bottom"
|
|
343
|
+
],
|
|
344
|
+
"default": "center"
|
|
334
345
|
}
|
|
335
346
|
},
|
|
336
347
|
"additionalProperties": false
|
|
@@ -365,9 +376,9 @@
|
|
|
365
376
|
"type": "string",
|
|
366
377
|
"default": "left"
|
|
367
378
|
},
|
|
368
|
-
"
|
|
379
|
+
"align": {
|
|
369
380
|
"title": "Vertical alignment of the content",
|
|
370
|
-
"description": "Select a vertical alignment for the
|
|
381
|
+
"description": "Select a vertical alignment for the content",
|
|
371
382
|
"type": "string",
|
|
372
383
|
"enum": [
|
|
373
384
|
"center",
|
|
@@ -1581,6 +1592,17 @@
|
|
|
1581
1592
|
"title": "Alt text",
|
|
1582
1593
|
"description": "Image description",
|
|
1583
1594
|
"type": "string"
|
|
1595
|
+
},
|
|
1596
|
+
"align": {
|
|
1597
|
+
"title": "Vertical alignment of the image",
|
|
1598
|
+
"description": "Select a vertical alignment for the image",
|
|
1599
|
+
"type": "string",
|
|
1600
|
+
"enum": [
|
|
1601
|
+
"center",
|
|
1602
|
+
"top",
|
|
1603
|
+
"bottom"
|
|
1604
|
+
],
|
|
1605
|
+
"default": "center"
|
|
1584
1606
|
}
|
|
1585
1607
|
},
|
|
1586
1608
|
"additionalProperties": false
|
|
@@ -1615,9 +1637,9 @@
|
|
|
1615
1637
|
"type": "string",
|
|
1616
1638
|
"default": "left"
|
|
1617
1639
|
},
|
|
1618
|
-
"
|
|
1640
|
+
"align": {
|
|
1619
1641
|
"title": "Vertical alignment of the content",
|
|
1620
|
-
"description": "Select a vertical alignment for the
|
|
1642
|
+
"description": "Select a vertical alignment for the content",
|
|
1621
1643
|
"type": "string",
|
|
1622
1644
|
"enum": [
|
|
1623
1645
|
"center",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { HTMLAttributes } from "react";
|
|
3
|
-
import { SliderProps } from "../../SliderProps-
|
|
3
|
+
import { SliderProps } from "../../SliderProps-02e33bf1.js";
|
|
4
4
|
declare const Slider: import("react").ForwardRefExoticComponent<SliderProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
|
|
5
5
|
export type { SliderProps };
|
|
6
6
|
export { Slider };
|
|
@@ -161,6 +161,17 @@
|
|
|
161
161
|
"title": "Alt text",
|
|
162
162
|
"description": "Image description",
|
|
163
163
|
"type": "string"
|
|
164
|
+
},
|
|
165
|
+
"align": {
|
|
166
|
+
"title": "Vertical alignment of the image",
|
|
167
|
+
"description": "Select a vertical alignment for the image",
|
|
168
|
+
"type": "string",
|
|
169
|
+
"enum": [
|
|
170
|
+
"center",
|
|
171
|
+
"top",
|
|
172
|
+
"bottom"
|
|
173
|
+
],
|
|
174
|
+
"default": "center"
|
|
164
175
|
}
|
|
165
176
|
},
|
|
166
177
|
"additionalProperties": false
|
|
@@ -195,9 +206,9 @@
|
|
|
195
206
|
"type": "string",
|
|
196
207
|
"default": "left"
|
|
197
208
|
},
|
|
198
|
-
"
|
|
209
|
+
"align": {
|
|
199
210
|
"title": "Vertical alignment of the content",
|
|
200
|
-
"description": "Select a vertical alignment for the
|
|
211
|
+
"description": "Select a vertical alignment for the content",
|
|
201
212
|
"type": "string",
|
|
202
213
|
"enum": [
|
|
203
214
|
"center",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
flex-shrink: 1;
|
|
31
31
|
}
|
|
32
32
|
.l-split--sidebar-right > :first-child {
|
|
33
|
-
flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--spacing) * 2);
|
|
33
|
+
flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--horizontal-spacing) * 2);
|
|
34
34
|
}
|
|
35
35
|
.l-split--sidebar-right > :last-child {
|
|
36
36
|
flex-basis: var(--dsa-split__side--flex-basis, 210px);
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
margin-top: var(--dsa-split__side-top-margin, var(--ks-spacing-stack-l));
|
|
42
42
|
}
|
|
43
43
|
.l-split--sidebar-left > :last-child {
|
|
44
|
-
flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--spacing) * 2);
|
|
44
|
+
flex-basis: calc(var(--split__main--flex-basis) - var(--dsa-content--horizontal-spacing) * 2);
|
|
45
45
|
}
|
|
46
46
|
.l-split--sidebar-left > :first-child {
|
|
47
47
|
flex-basis: var(--dsa-split__side--flex-basis, 210px);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { HTMLAttributes } from "react";
|
|
3
3
|
import { TestimonialsProps } from "../../TestimonialsProps-f7211553.js";
|
|
4
|
-
import { SliderProps } from "../../SliderProps-
|
|
4
|
+
import { SliderProps } from "../../SliderProps-02e33bf1.js";
|
|
5
5
|
interface ConditionalSliderProps extends SliderProps {
|
|
6
6
|
layout: "slider" | "list" | "alternating";
|
|
7
7
|
}
|
package/dist/global.css
CHANGED
|
@@ -304,7 +304,8 @@ h3 {
|
|
|
304
304
|
--dsa-link--text-decoration: underline;
|
|
305
305
|
--dsa-link--text-decoration_hover: underline;
|
|
306
306
|
--dsa-gradient--highlight: linear-gradient(135deg, var(--ks-color-primary) 0%, var(--ks-color-secondary) 100%);
|
|
307
|
-
--dsa-content--spacing: var(--ks-spacing-inset-l);
|
|
307
|
+
--dsa-content--horizontal-spacing: var(--ks-spacing-inset-l);
|
|
308
|
+
--dsa-content--vertical-spacing: var(--ks-spacing-xxl);
|
|
308
309
|
--dsa-content--width_narrow: calc(var(--ks-font-size-copy-m) * 34);
|
|
309
310
|
--dsa-content--width_default: calc(var(--ks-font-size-copy-m) * 50);
|
|
310
311
|
--dsa-content--width_wide: calc(var(--ks-font-size-copy-m) * 64);
|
|
@@ -320,7 +321,7 @@ h3 {
|
|
|
320
321
|
}
|
|
321
322
|
@media (min-width: 48em) {
|
|
322
323
|
:root, [ks-inverted], [ks-theme] {
|
|
323
|
-
--dsa-content--spacing: var(--ks-spacing-inset-xl);
|
|
324
|
+
--dsa-content--horizontal-spacing: var(--ks-spacing-inset-xl);
|
|
324
325
|
}
|
|
325
326
|
}
|
|
326
327
|
@media (min-width: 48em) {
|
package/dist/tokens/themes.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 10 Jan 2025 13:01:20 GMT
|
|
4
4
|
*/
|
|
5
5
|
:root [ks-theme=business] {
|
|
6
6
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -2727,7 +2727,7 @@
|
|
|
2727
2727
|
}
|
|
2728
2728
|
/**
|
|
2729
2729
|
* Do not edit directly
|
|
2730
|
-
* Generated on
|
|
2730
|
+
* Generated on Fri, 10 Jan 2025 13:01:25 GMT
|
|
2731
2731
|
*/
|
|
2732
2732
|
:root [ks-theme=google] {
|
|
2733
2733
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -5458,7 +5458,7 @@
|
|
|
5458
5458
|
}
|
|
5459
5459
|
/**
|
|
5460
5460
|
* Do not edit directly
|
|
5461
|
-
* Generated on
|
|
5461
|
+
* Generated on Fri, 10 Jan 2025 13:01:22 GMT
|
|
5462
5462
|
*/
|
|
5463
5463
|
:root [ks-theme=ngo] {
|
|
5464
5464
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -8459,7 +8459,7 @@
|
|
|
8459
8459
|
}
|
|
8460
8460
|
/**
|
|
8461
8461
|
* Do not edit directly
|
|
8462
|
-
* Generated on
|
|
8462
|
+
* Generated on Fri, 10 Jan 2025 13:01:27 GMT
|
|
8463
8463
|
*/
|
|
8464
8464
|
:root [ks-theme=telekom] {
|
|
8465
8465
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|