From dab23c2fa0cd09fddeecacbd289c7052172c9172 Mon Sep 17 00:00:00 2001
From: Mathias Oterhals Myklebust <24361490+mathiazom@users.noreply.github.com>
Date: Fri, 20 Sep 2024 05:44:35 +0000
Subject: [PATCH] feat: remove theme option for Callout and CallToAction (#680)

---
 .../sections/callToAction/CallToAction.tsx         |  5 +----
 .../sections/callToAction/callToAction.module.css  |  9 +--------
 src/components/sections/callout/Callout.tsx        |  3 +--
 src/components/sections/callout/callout.module.css |  7 -------
 studio/lib/interfaces/pages.ts                     |  4 ----
 studio/schemas/fields/theme.ts                     | 14 --------------
 studio/schemas/objects/sections/callToAction.ts    |  2 --
 studio/schemas/objects/sections/callout.ts         |  3 +--
 8 files changed, 4 insertions(+), 43 deletions(-)
 delete mode 100644 studio/schemas/fields/theme.ts

diff --git a/src/components/sections/callToAction/CallToAction.tsx b/src/components/sections/callToAction/CallToAction.tsx
index e49544450..d68e5de9d 100644
--- a/src/components/sections/callToAction/CallToAction.tsx
+++ b/src/components/sections/callToAction/CallToAction.tsx
@@ -9,11 +9,8 @@ interface CallToActionProps {
 }
 
 const CallToAction = ({ callToAction }: CallToActionProps) => {
-  const theme =
-    callToAction.theme === "primary" ? styles.primary : styles.secondary;
-
   return (
-    <article className={`${styles.article} ${theme}`} id={callToAction._key}>
+    <article className={`${styles.article}`} id={callToAction._key}>
       <Text type="h2">{callToAction?.basicTitle}</Text>
       <ul className={styles.list}>
         {callToAction?.callToActions?.map((cta, index) => (
diff --git a/src/components/sections/callToAction/callToAction.module.css b/src/components/sections/callToAction/callToAction.module.css
index ddabec08d..de1c1f15a 100644
--- a/src/components/sections/callToAction/callToAction.module.css
+++ b/src/components/sections/callToAction/callToAction.module.css
@@ -1,11 +1,3 @@
-.primary {
-  background: var(--secondary-gradient-pink);
-}
-
-.secondary {
-  background-color: var(--secondary-yellow-1);
-}
-
 .article {
   display: flex;
   flex-direction: column;
@@ -13,6 +5,7 @@
   text-align: center;
   gap: 1.5rem;
   padding: 5rem 2rem;
+  background: var(--secondary-gradient-pink);
 
   @media (min-width: 640px) {
     padding: 5rem 3rem;
diff --git a/src/components/sections/callout/Callout.tsx b/src/components/sections/callout/Callout.tsx
index 850660211..98355f8a4 100644
--- a/src/components/sections/callout/Callout.tsx
+++ b/src/components/sections/callout/Callout.tsx
@@ -15,10 +15,9 @@ const myPortableTextComponents: Partial<PortableTextReactComponents> = {
 };
 
 const Callout = ({ callout }: CalloutProps) => {
-  const theme = callout.theme == "primary" ? styles.primary : styles.secondary;
   return (
     callout.richText && (
-      <article className={`${styles.shared} ${theme}`} id={callout._key}>
+      <article className={`${styles.shared}`} id={callout._key}>
         <div className={styles.callout}>
           <PortableText
             value={callout.richText}
diff --git a/src/components/sections/callout/callout.module.css b/src/components/sections/callout/callout.module.css
index 872f6b9a7..1b037658a 100644
--- a/src/components/sections/callout/callout.module.css
+++ b/src/components/sections/callout/callout.module.css
@@ -3,16 +3,9 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
-}
-
-.primary {
   background: var(--secondary-yellow1);
 }
 
-.secondary {
-  background: var(--primary-white-bright);
-}
-
 .callout {
   composes: shared;
   width: -webkit-fill-available;
diff --git a/studio/lib/interfaces/pages.ts b/studio/lib/interfaces/pages.ts
index 3bbf38fdb..b6615dc94 100644
--- a/studio/lib/interfaces/pages.ts
+++ b/studio/lib/interfaces/pages.ts
@@ -4,8 +4,6 @@ import { Slug } from "./global";
 import { IImage, ImageExtendedProps } from "./media";
 import { ILink } from "./navigation";
 
-export type ThemeType = "primary" | "secondary";
-
 export interface HeroSection {
   _key: string;
   _type: string;
@@ -37,7 +35,6 @@ export interface CalloutSection {
   _type: string;
   richText?: PortableTextBlock[];
   link?: ILink;
-  theme?: ThemeType;
 }
 
 export interface CallToActionSection {
@@ -45,7 +42,6 @@ export interface CallToActionSection {
   _type: string;
   basicTitle?: string;
   callToActions?: ILink[];
-  theme?: ThemeType;
 }
 
 export interface TestimonialsSection {
diff --git a/studio/schemas/fields/theme.ts b/studio/schemas/fields/theme.ts
deleted file mode 100644
index 4d9c3e05d..000000000
--- a/studio/schemas/fields/theme.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-export const theme = {
-  name: "theme",
-  title: "Theme",
-  description:
-    "Sets the section to either a primary or secondary component, mainly changing the background color of the component.",
-  type: "string",
-  options: {
-    list: [
-      { title: "Primary", value: "primary" },
-      { title: "Secondary", value: "secondary" },
-    ],
-  },
-  initialValue: "primary",
-};
diff --git a/studio/schemas/objects/sections/callToAction.ts b/studio/schemas/objects/sections/callToAction.ts
index 99e2cd6cc..1caecafb7 100644
--- a/studio/schemas/objects/sections/callToAction.ts
+++ b/studio/schemas/objects/sections/callToAction.ts
@@ -2,7 +2,6 @@ import { defineField } from "sanity";
 
 import callToActionField from "studio/schemas/fields/callToActionFields";
 import { title } from "studio/schemas/fields/text";
-import { theme } from "studio/schemas/fields/theme";
 
 export const callToActionSectionID = "ctaSection";
 
@@ -11,7 +10,6 @@ export const callToAction = defineField({
   title: "Call to Action",
   type: "object",
   fields: [
-    theme,
     {
       ...title,
       description:
diff --git a/studio/schemas/objects/sections/callout.ts b/studio/schemas/objects/sections/callout.ts
index cefa57771..1c97afbe7 100644
--- a/studio/schemas/objects/sections/callout.ts
+++ b/studio/schemas/objects/sections/callout.ts
@@ -1,7 +1,6 @@
 import { defineField } from "sanity";
 
 import { richText, richTextID } from "studio/schemas/fields/text";
-import { theme } from "studio/schemas/fields/theme";
 import { link } from "studio/schemas/objects/link";
 
 export const calloutID = "callout";
@@ -10,7 +9,7 @@ export const callout = defineField({
   name: calloutID,
   title: "Callout",
   type: "object",
-  fields: [theme, richText, link],
+  fields: [richText, link],
   initialValue: {
     theme: "primary",
   },