feat(various): remove outdated components

kickstartDS · Nov 20, 2023 · 27e7259 · 27e7259
1 parent 5fd6d74
commit 27e7259
Show file tree

Hide file tree

Showing 14 changed files with 68 additions and 113 deletions.
diff --git a/src/about-us.tsx b/src/about-us.tsx
@@ -17,7 +17,7 @@ export const data = {
 
 export default (props) => (
   <PageWrapper floatingHeader>
-    <Section width="default" style="boldTransition">
+    <Section style="boldTransition">
       <Cta
         align="left"
         headline="Crafting Digital Brilliance at **Systemics**"
@@ -95,7 +95,6 @@ We're not just building design systems; we're building value. By combining our e
         text: "About & History",
       }}
       style="accentTransition"
-      width="default"
     >
       <Text
         text={`Founded by passionate digital enthusiasts, Systemics emerged from the desire to reshape the digital realm. With a history spanning over a decade, we've continuously evolved to stay at the forefront of design systems, headless CMSs, and cutting-edge development practices. Our journey is one of innovation, collaboration, and a relentless pursuit of excellence.`}

diff --git a/src/blog.tsx b/src/blog.tsx
@@ -56,7 +56,6 @@ export default (props) => (
         mode: "list",
         gutter: "large",
       }}
-      width="default"
     >
       <BlogTeaser
         author={{

diff --git a/src/disclaimer.tsx b/src/disclaimer.tsx
@@ -1,7 +1,5 @@
 import { Section } from "@kickstartds/ds-agency/section";
-import { Button } from "@kickstartds/ds-agency/button";
 import { Cta } from "@kickstartds/ds-agency/cta";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Text } from "@kickstartds/ds-agency/text";
 import { Image } from "@kickstartds/ds-agency/image";
 import { Features } from "@kickstartds/ds-agency/features";
@@ -15,7 +13,7 @@ export const data = {
 
 export default (props) => (
   <PageWrapper floatingHeader>
-    <Section style="anchorGlow">
+    <Section backgroundColor="accent" style="boldTransition">
       <Cta
         align="left"
         headline="**This is a vibrant Simulation** designed to unveil the potential of **kickstartDS**"
@@ -32,32 +30,36 @@ export default (props) => (
     </Section>
 
     <Section
-      width="wide"
       content={{
         mode: "list",
       }}
+      headline={{
+        text: "Open Source vs. Premium Experience",
+        sub: "The Purpose of this Demo",
+      }}
       spaceAfter="small"
     >
-      <Headline
-        align="left"
-        text="Open Source vs. Premium Experience"
-        sub="The Purpose of this Demo"
-        level="h2"
-        style="h2"
-        spaceAfter="minimum"
-      />
       <Text
         text={`
 This demo is intended to provide a firsthand experience of the capabilities of [**kickstartDS**](https://www.kickstartds.com). It's not just a website; it’s a demonstration of how we can transform your digital landscape. Please note that while this demo represents a **Design System Agency**, the principles and techniques showcased are applicable to a wide range of industries and use cases.
           `}
       />
+    </Section>
+    <Section
+      width="wide"
+      content={{
+        mode: "list",
+      }}
+      spaceBefore="small"
+      spaceAfter="small"
+    >
       <Image
         src="/static/img/deco/disclaimer-devider-dotted.png"
         alt="Digital art of two friendly girls standing in front of each other, playing with a huge pile of toy bricks in their center. the scene is surrounded by horizontal light stripes in motion creating a ring around them, light blue, violet and purple colors, light neon-lights, laser-light, wide-angle "
       />
     </Section>
 
-    <Section spaceBefore="none" width="default">
+    <Section spaceBefore="none" spaceAfter="small">
       <Text
         text={`
 ## The two showcases in this demo represent the range of possibilities with kickstartDS.
@@ -76,12 +78,14 @@ It showcases how a modest monthly investment, equivalent to the cost of a develo
       style="boldTransition"
       spaceBefore="small"
       width="wide"
+      content={{
+        width: "default",
+      }}
       headline={{
         text: "By exploring both demos, you can **gain** a clear understanding of the **value** proposition offered by **kickstartDS**, from open source solutions to paid enhancements.",
+        large: true,
       }}
-    ></Section>
-
-    <Section backgroundColor="bold" spaceBefore="none">
+    >
       <Features
         ctas={{
           style: "button",

diff --git a/src/disclaimer_paid.tsx b/src/disclaimer_paid.tsx
@@ -1,8 +1,6 @@
 import { Section } from "@kickstartds/ds-agency/section";
-import { Button } from "@kickstartds/ds-agency/button";
 import { CtaPaid } from "@kickstartds/ds-agency/cta-paid";
 import { PageWrapper } from "./_includes/PageWrapper";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Text } from "@kickstartds/ds-agency/text";
 import { VideoCurtain } from "@kickstartds/ds-agency/video-curtain";
 
@@ -52,20 +50,14 @@ export default (props) => (
       width="wide"
       content={{
         mode: "list",
+        width: "default",
+      }}
+      headline={{
+        text: "Open Source vs. Premium Experience",
+        sub: "The two showcases in this demo represent the range of possibilities with kickstartDS. ",
+        large: true,
       }}
-      spaceAfter="small"
     >
-      <Headline
-        align="left"
-        text="Open Source vs. Premium Experience"
-        sub="The two showcases in this demo represent the range of possibilities with kickstartDS. "
-        level="h2"
-        style="h2"
-        spaceAfter="minimum"
-      />
-    </Section>
-
-    <Section backgroundColor="accent" width="narrow" spaceBefore="none">
       <Text
         text={`
 ### Premium Experience Demo
@@ -75,7 +67,7 @@ It showcases how a modest monthly investment - akin to the cost of a developer h
 
 ### Open Source Demo
 The other demo, built entirely using our [**open-source** modules](https://www.kickstartds.com/modules/), demonstrates the robust capabilities you can leverage at no cost. It stands as a testament to the value that kickstartDS can deliver even with zero investment.
-        `}
+    `}
       />
     </Section>
 
@@ -93,36 +85,27 @@ The other demo, built entirely using our [**open-source** modules](https://www.k
       <CtaPaid
         align="left"
         fullWidth
-        backgroundImage="/static/img/bg/bg_dot-carpet-blue.svg"
         headline="By exploring both demos, you can **gain** a clear understanding of the **value** proposition offered by **kickstartDS**, from open source solutions to paid enhancements."
         sub="Browse the different demos and Storybook to feel it yourself"
-      />
-    </Section>
-
-    <Section style="horizontalGradient" spaceBefore="none">
-      <Button
-        variant="primary"
-        label="Browse Premium Demo"
-        icon="chevron-right"
-        target="/index_paid"
-      />
-      <Button
-        variant="tertiary"
-        label="Explore Storybook"
-        icon="browser"
-        target="#"
-      />
-      <Button
-        variant="secondary"
-        label="See Open Source Components"
-        icon="chevron-right"
-        target="/index"
-      />
-      <Button
-        variant="tertiary"
-        label="Explore open source components"
-        icon="browser"
-        target="#"
+        buttons={[
+          {
+            label: "Browse Premium Demo",
+            icon: "chevron-right",
+            target: "/index_paid",
+          },
+          {
+            label: "Explore Storybook",
+            icon: "browser",
+          },
+          {
+            label: "See Open Source Components",
+            icon: "chevron-right",
+          },
+          {
+            label: "Explore open source components",
+            icon: "browser",
+          },
+        ]}
       />
     </Section>
 

diff --git a/src/index.tsx b/src/index.tsx
@@ -1,5 +1,4 @@
 import { Section } from "@kickstartds/ds-agency/section";
-import { Button } from "@kickstartds/ds-agency/button";
 import { Faq } from "@kickstartds/ds-agency/faq";
 import { TeaserCard } from "@kickstartds/ds-agency/teaser-card";
 import { Text } from "@kickstartds/ds-agency/text";
@@ -124,7 +123,7 @@ export default (props) => (
       />
     </Section>
 
-    <Section style="accentTransition" width="default">
+    <Section style="accentTransition">
       <Logos
         tagline="Orgs we've helped saving time & money"
         align="center"
@@ -342,10 +341,6 @@ We value efficiency without compromising quality. Our secret weapon? **kickstart
     </Section>
 
     <Section
-      width="default"
-      content={{
-        width: "default",
-      }}
       headline={{
         text: "Headless CMS for the modern web",
         sub: "Frequently asked questions",

diff --git a/src/index_paid.tsx b/src/index_paid.tsx
@@ -337,10 +337,6 @@ We empower your digital teams with the knowledge and skills to manage and evolve
     </Section>
 
     <Section
-      width="default"
-      content={{
-        width: "default",
-      }}
       headline={{
         text: "Headless CMS for the modern web",
         sub: "Frequently asked questions",

diff --git a/src/services.tsx b/src/services.tsx
@@ -1,6 +1,5 @@
 import { Section } from "@kickstartds/ds-agency/section";
 import { Cta } from "@kickstartds/ds-agency/cta";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Faq } from "@kickstartds/ds-agency/faq";
 import { Text } from "@kickstartds/ds-agency/text";
 import { ImageText } from "@kickstartds/ds-agency/image-text";
@@ -22,32 +21,31 @@ export default (props) => (
       width="wide"
       content={{
         mode: "list",
+        width: "default",
+      }}
+      headline={{
+        align: "left",
+        text: "**Headless** Web & **Design System** Services",
+        large: true,
+        width: "default",
+        sub: "Tailored Solutions for Seamless Digital Excellence",
       }}
-      spaceAfter="small"
     >
-      <Headline
-        align="left"
-        text="**Headless** Web & **Design System** Services"
-        sub="Tailored Solutions for Seamless Digital Excellence"
-        level="h2"
-        style="h1"
-        spaceAfter="minimum"
-      />
-    </Section>
-
-    <Section backgroundColor="accent" width="narrow" spaceBefore="none">
       <Text
+        style="highlight"
         text={`**We believe** that well-crafted design systems are the cornerstone of exceptional user experiences. Our team is dedicated to providing clients with tailored solutions that bridge the gap between creativity and functionality, ultimately reshaping the way users engage with brands.`}
       />
     </Section>
 
     <Section
       width="wide"
+      headline={{
+        text: "Our Services",
+      }}
       content={{
         mode: "list",
       }}
     >
-      <Headline align="left" text="Our Services" sub="" level="h2" style="h1" />
       <ImageText
         layout="beside-right"
         text={`

diff --git a/src/services_paid.tsx b/src/services_paid.tsx
@@ -1,6 +1,5 @@
 import { Section } from "@kickstartds/ds-agency/section";
 import { Cta } from "@kickstartds/ds-agency/cta";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Faq } from "@kickstartds/ds-agency/faq";
 import { Text } from "@kickstartds/ds-agency/text";
 import { ImageText } from "@kickstartds/ds-agency/image-text";
@@ -43,17 +42,15 @@ export default (props) => (
       />
     </Section>
 
-    <Section backgroundColor="accent" width="narrow" spaceBefore="none">
-      <Text text={``} />
-    </Section>
-
     <Section
       width="wide"
+      headline={{
+        text: "Our Services",
+      }}
       content={{
         mode: "list",
       }}
     >
-      <Headline align="left" text="Our Services" sub="" level="h2" style="h1" />
       <ImageText
         layout="beside-right"
         text={`

diff --git a/src/showcase-eco.tsx b/src/showcase-eco.tsx
@@ -1,6 +1,5 @@
 import { Section } from "@kickstartds/ds-agency/section";
 import { Cta } from "@kickstartds/ds-agency/cta";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Testimonials } from "@kickstartds/ds-agency/testimonials";
 import { TeaserCard } from "@kickstartds/ds-agency/teaser-card";
 import { Text } from "@kickstartds/ds-agency/text";
@@ -29,7 +28,6 @@ export default (props) => (
 
     <Section
       backgroundColor="accent"
-      width="default"
       content={{
         mode: "list",
       }}
@@ -64,7 +62,6 @@ EcoTech Solutions, a forward-thinking company in the sustainable PV and wind pow
     </Section>
 
     <Section
-      width="default"
       content={{
         mode: "list",
       }}

diff --git a/src/showcase-eco_paid.tsx b/src/showcase-eco_paid.tsx
@@ -51,7 +51,6 @@ export default (props) => (
       }}
       spaceBefore="none"
       spaceAfter="small"
-      width="default"
     >
       <Text
         align="center"

diff --git a/src/showcase-launchpad.tsx b/src/showcase-launchpad.tsx
@@ -1,6 +1,5 @@
 import { Section } from "@kickstartds/ds-agency/section";
 import { Cta } from "@kickstartds/ds-agency/cta";
-import { Headline } from "@kickstartds/ds-agency/headline";
 import { Testimonials } from "@kickstartds/ds-agency/testimonials";
 import { TeaserCard } from "@kickstartds/ds-agency/teaser-card";
 import { Text } from "@kickstartds/ds-agency/text";

diff --git a/src/showcase-launchpad_paid.tsx b/src/showcase-launchpad_paid.tsx
@@ -60,15 +60,13 @@ export default (props) => (
 
     <Section
       backgroundColor="bold"
-      width="default"
       headline={{
         text: "Briefing:",
         textAlign: "center",
       }}
       content={{
         mode: "list",
       }}
-      spaceAfter="default"
     >
       <Text
         style="highlight"

diff --git a/src/showcase-techfusion_paid.tsx b/src/showcase-techfusion_paid.tsx
@@ -59,7 +59,6 @@ export default (props) => (
     </Section>
 
     <Section
-      width="default"
       spaceBefore="none"
       spaceAfter="small"
       backgroundColor="accent"
@@ -116,7 +115,6 @@ TechFusion Enterprises, a leading player in the smart home industry, grappled wi
     </Section>
 
     <Section
-      width="default"
       content={{
         mode: "list",
       }}