From ff1912db0acf05b75fde12e674db36460efd898d Mon Sep 17 00:00:00 2001 From: Jake Laderman Date: Tue, 5 Nov 2024 14:14:22 -0500 Subject: [PATCH] add theme to custom components --- src/components/Typography.tsx | 58 ++++---- src/components/custom-page/Hero.tsx | 2 +- src/components/custom-page/TwoColumnText.tsx | 4 +- src/components/custom-page/common.tsx | 70 ++++++--- src/generated/graphqlDirectus.ts | 141 ++++++++++++++----- src/graph/directus/customPages.graphql | 12 +- 6 files changed, 201 insertions(+), 86 deletions(-) diff --git a/src/components/Typography.tsx b/src/components/Typography.tsx index 16dfab60..dda6a233 100644 --- a/src/components/Typography.tsx +++ b/src/components/Typography.tsx @@ -103,30 +103,40 @@ export const ResponsiveText = styled.h2.withConfig(textPropFilter)<{ } }) -export const Hero1 = styled.h1<{ $color?: ColorKey }>(({ theme, $color }) => ({ - ...theme.partials.marketingText.hero1, - color: $color && (theme.colors[$color] as string), -})) +export const Hero1 = styled.h1<{ $color?: ColorKey }>( + ({ theme, $color = 'text' }) => ({ + ...theme.partials.marketingText.hero1, + color: $color && (theme.colors[$color] as string), + }) +) -export const Hero2 = styled.h2<{ $color?: ColorKey }>(({ theme, $color }) => ({ - ...theme.partials.marketingText.hero2, - color: $color && (theme.colors[$color] as string), -})) +export const Hero2 = styled.h2<{ $color?: ColorKey }>( + ({ theme, $color = 'text' }) => ({ + ...theme.partials.marketingText.hero2, + color: $color && (theme.colors[$color] as string), + }) +) -export const Title1 = styled.h3<{ $color?: ColorKey }>(({ theme, $color }) => ({ - ...theme.partials.marketingText.title1, - color: $color && (theme.colors[$color] as string), -})) +export const Title1 = styled.h3<{ $color?: ColorKey }>( + ({ theme, $color = 'text' }) => ({ + ...theme.partials.marketingText.title1, + color: $color && (theme.colors[$color] as string), + }) +) -export const Title2 = styled.h4<{ $color?: ColorKey }>(({ theme, $color }) => ({ - ...theme.partials.marketingText.title2, - color: $color && (theme.colors[$color] as string), -})) +export const Title2 = styled.h4<{ $color?: ColorKey }>( + ({ theme, $color = 'text' }) => ({ + ...theme.partials.marketingText.title2, + color: $color && (theme.colors[$color] as string), + }) +) -export const Body1 = styled.p<{ $color?: ColorKey }>(({ theme, $color }) => ({ - ...theme.partials.marketingText.body1, - color: $color && (theme.colors[$color] as string), -})) +export const Body1 = styled.p<{ $color?: ColorKey }>( + ({ theme, $color = 'text-light' }) => ({ + ...theme.partials.marketingText.body1, + color: theme.colors[$color] as string, + }) +) export const Body2 = styled.p<{ $color?: ColorKey }>( ({ theme, $color = 'text-light' }) => ({ @@ -136,16 +146,16 @@ export const Body2 = styled.p<{ $color?: ColorKey }>( ) export const Subtitle1 = styled.p<{ $color?: ColorKey }>( - ({ theme, $color }) => ({ + ({ theme, $color = 'text' }) => ({ ...theme.partials.marketingText.subtitle1, - color: $color && (theme.colors[$color] as string), + color: theme.colors[$color] as string, }) ) export const Subtitle2 = styled.p<{ $color?: ColorKey }>( - ({ theme, $color }) => ({ + ({ theme, $color = 'text' }) => ({ ...theme.partials.marketingText.subtitle2, - color: $color && (theme.colors[$color] as string), + color: theme.colors[$color] as string, }) ) diff --git a/src/components/custom-page/Hero.tsx b/src/components/custom-page/Hero.tsx index 4076e97e..6c709742 100644 --- a/src/components/custom-page/Hero.tsx +++ b/src/components/custom-page/Hero.tsx @@ -21,7 +21,7 @@ export function Hero({ form, }: HeroComponentFragment) { return ( -
+
-
+
-
+
diff --git a/src/components/custom-page/common.tsx b/src/components/custom-page/common.tsx index d5a82a13..b7050266 100644 --- a/src/components/custom-page/common.tsx +++ b/src/components/custom-page/common.tsx @@ -1,3 +1,10 @@ +import { type ReactElement } from 'react' + +import { styledThemeDark, styledThemeLight } from '@pluralsh/design-system' + +import { colorsToCSSVars } from '@pluralsh/design-system/dist/GlobalStyle' +import styled, { ThemeProvider } from 'styled-components' + import { type CustomPageFragment } from '@src/generated/graphqlDirectus' import { BlogCards } from './BlogCards' @@ -12,41 +19,66 @@ import { SectionHeader } from './SectionHeader' import { TwoColumnText } from './TwoColumnText' const spacingToClassName = { - relaxed: 'my-[192px]', - normal: 'my-[96px]', - compact: 'my-[48px]', + relaxed: 'py-[192px]', + normal: 'py-[96px]', + compact: 'py-[48px]', } export const getSpacingClassName = (spacing: Nullable) => spacingToClassName[spacing ?? 'normal'] ?? '' -export function renderComponent( - component: NonNullable< - NonNullable[number] - >['item'] -) { +export function renderComponent({ + theme, + ...component +}: NonNullable< + NonNullable[number]>['item'] +>) { + let renderedComponent: ReactElement | null = null + switch (component?.__typename) { case 'hero': - return + renderedComponent = + break case 'logo_strip': - return + renderedComponent = + break case 'section_header': - return + renderedComponent = + break case 'large_image': - return + renderedComponent = + break case 'cards': - return + renderedComponent = + break case 'blog_cards': - return + renderedComponent = + break case 'two_column_text': - return + renderedComponent = + break case 'multi_column_text': - return + renderedComponent = + break case 'customer_quote': - return + renderedComponent = + break case 'cta': - return + renderedComponent = + break default: - return null + break } + const styles = theme === 'light' ? styledThemeLight : styledThemeDark + + return ( + + {renderedComponent} + + ) } + +const ComponentWrapperSC = styled.div(({ theme }) => ({ + backgroundColor: theme.colors['fill-zero'], + ...colorsToCSSVars(theme.colors), +})) diff --git a/src/generated/graphqlDirectus.ts b/src/generated/graphqlDirectus.ts index 0e70f9ce..ed32c362 100644 --- a/src/generated/graphqlDirectus.ts +++ b/src/generated/graphqlDirectus.ts @@ -3899,6 +3899,7 @@ export type Article_Cards = { id: Scalars['ID']['output']; sort?: Maybe; status?: Maybe; + theme?: Maybe; thumbnail?: Maybe; url?: Maybe; user_created?: Maybe; @@ -3973,6 +3974,7 @@ export type Article_Cards_Aggregated_Count = { id?: Maybe; sort?: Maybe; status?: Maybe; + theme?: Maybe; thumbnail?: Maybe; url?: Maybe; user_created?: Maybe; @@ -4005,6 +4007,7 @@ export type Article_Cards_Filter = { id?: InputMaybe; sort?: InputMaybe; status?: InputMaybe; + theme?: InputMaybe; thumbnail?: InputMaybe; url?: InputMaybe; user_created?: InputMaybe; @@ -4020,6 +4023,7 @@ export type Blog_Cards = { date_updated_func?: Maybe; id: Scalars['ID']['output']; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -4064,6 +4068,7 @@ export type Blog_Cards_Aggregated_Count = { date_updated?: Maybe; id?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -4082,6 +4087,7 @@ export type Blog_Cards_Filter = { date_updated_func?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -4376,6 +4382,7 @@ export type Cards = { date_updated_func?: Maybe; id: Scalars['ID']['output']; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -4431,6 +4438,7 @@ export type Cards_Aggregated_Count = { date_updated?: Maybe; id?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -4514,6 +4522,7 @@ export type Cards_Filter = { date_updated_func?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5100,6 +5109,7 @@ export type Create_Article_Cards_Input = { id?: InputMaybe; sort?: InputMaybe; status?: InputMaybe; + theme?: InputMaybe; thumbnail?: InputMaybe; url?: InputMaybe; user_created?: InputMaybe; @@ -5112,6 +5122,7 @@ export type Create_Blog_Cards_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5162,6 +5173,7 @@ export type Create_Cards_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5245,6 +5257,7 @@ export type Create_Cta_Input = { heading?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5273,6 +5286,7 @@ export type Create_Customer_Quote_Input = { id?: InputMaybe; quote?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5377,6 +5391,7 @@ export type Create_Hero_Input = { image?: InputMaybe; media_type?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -5410,6 +5425,7 @@ export type Create_Large_Image_Input = { media_type?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -5421,6 +5437,7 @@ export type Create_Logo_Strip_Input = { id?: InputMaybe; logo_list?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; }; @@ -5445,6 +5462,7 @@ export type Create_Multi_Column_Text_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5562,6 +5580,7 @@ export type Create_Section_Header_Input = { id?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; title?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; @@ -5667,6 +5686,7 @@ export type Create_Two_Column_Text_Input = { main_content: Scalars['String']['input']; side_content: Scalars['String']['input']; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5683,6 +5703,7 @@ export type Cta = { heading?: Maybe; id: Scalars['ID']['output']; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -5731,6 +5752,7 @@ export type Cta_Aggregated_Count = { heading?: Maybe; id?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -5753,6 +5775,7 @@ export type Cta_Filter = { heading?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -5887,7 +5910,6 @@ export type Custom_Pages_Components_Filter = { id?: InputMaybe; item__article_cards?: InputMaybe; item__blog_cards?: InputMaybe; - item__card_with_image?: InputMaybe; item__cards?: InputMaybe; item__cta?: InputMaybe; item__customer_quote?: InputMaybe; @@ -5899,7 +5921,7 @@ export type Custom_Pages_Components_Filter = { item__two_column_text?: InputMaybe; }; -export type Custom_Pages_Components_Item_Union = Article_Cards | Blog_Cards | Card_With_Image | Cards | Cta | Customer_Quote | Hero | Large_Image | Logo_Strip | Multi_Column_Text | Section_Header | Two_Column_Text; +export type Custom_Pages_Components_Item_Union = Article_Cards | Blog_Cards | Cards | Cta | Customer_Quote | Hero | Large_Image | Logo_Strip | Multi_Column_Text | Section_Header | Two_Column_Text; export type Custom_Pages_Filter = { _and?: InputMaybe>>; @@ -5926,6 +5948,7 @@ export type Customer_Quote = { id: Scalars['ID']['output']; quote?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -5981,6 +6004,7 @@ export type Customer_Quote_Aggregated_Count = { id?: Maybe; quote?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -6001,6 +6025,7 @@ export type Customer_Quote_Filter = { id?: InputMaybe; quote?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -6439,6 +6464,7 @@ export type Hero = { image?: Maybe; media_type?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; video_url?: Maybe; @@ -6501,6 +6527,7 @@ export type Hero_Aggregated_Count = { image?: Maybe; media_type?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; video_url?: Maybe; @@ -6527,6 +6554,7 @@ export type Hero_Filter = { image?: InputMaybe; media_type?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -6642,6 +6670,7 @@ export type Large_Image = { media_type?: Maybe; overline?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; video_url?: Maybe; @@ -6705,6 +6734,7 @@ export type Large_Image_Aggregated_Count = { media_type?: Maybe; overline?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; video_url?: Maybe; @@ -6732,6 +6762,7 @@ export type Large_Image_Filter = { media_type?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -6746,6 +6777,7 @@ export type Logo_Strip = { id: Scalars['ID']['output']; logo_list?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; }; @@ -6790,6 +6822,7 @@ export type Logo_Strip_Aggregated_Count = { id?: Maybe; logo_list?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; }; @@ -6809,6 +6842,7 @@ export type Logo_Strip_Filter = { id?: InputMaybe; logo_list?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; }; @@ -6926,6 +6960,7 @@ export type Multi_Column_Text = { date_updated_func?: Maybe; id: Scalars['ID']['output']; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -6981,6 +7016,7 @@ export type Multi_Column_Text_Aggregated_Count = { date_updated?: Maybe; id?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -7001,6 +7037,7 @@ export type Multi_Column_Text_Filter = { date_updated_func?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -7875,6 +7912,7 @@ export type Section_Header = { id: Scalars['ID']['output']; overline?: Maybe; spacing?: Maybe; + theme?: Maybe; title?: Maybe; user_created?: Maybe; user_updated?: Maybe; @@ -7922,6 +7960,7 @@ export type Section_Header_Aggregated_Count = { id?: Maybe; overline?: Maybe; spacing?: Maybe; + theme?: Maybe; title?: Maybe; user_created?: Maybe; user_updated?: Maybe; @@ -7943,6 +7982,7 @@ export type Section_Header_Filter = { id?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; title?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; @@ -8628,6 +8668,7 @@ export type Two_Column_Text = { main_content: Scalars['String']['output']; side_content: Scalars['String']['output']; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -8674,6 +8715,7 @@ export type Two_Column_Text_Aggregated_Count = { main_content?: Maybe; side_content?: Maybe; spacing?: Maybe; + theme?: Maybe; user_created?: Maybe; user_updated?: Maybe; }; @@ -8694,6 +8736,7 @@ export type Two_Column_Text_Filter = { main_content?: InputMaybe; side_content?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -8710,6 +8753,7 @@ export type Update_Article_Cards_Input = { id?: InputMaybe; sort?: InputMaybe; status?: InputMaybe; + theme?: InputMaybe; thumbnail?: InputMaybe; url?: InputMaybe; user_created?: InputMaybe; @@ -8722,6 +8766,7 @@ export type Update_Blog_Cards_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -8772,6 +8817,7 @@ export type Update_Cards_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -8855,6 +8901,7 @@ export type Update_Cta_Input = { heading?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -8883,6 +8930,7 @@ export type Update_Customer_Quote_Input = { id?: InputMaybe; quote?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -8987,6 +9035,7 @@ export type Update_Hero_Input = { image?: InputMaybe; media_type?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -9020,6 +9069,7 @@ export type Update_Large_Image_Input = { media_type?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; video_url?: InputMaybe; @@ -9031,6 +9081,7 @@ export type Update_Logo_Strip_Input = { id?: InputMaybe; logo_list?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; }; @@ -9055,6 +9106,7 @@ export type Update_Multi_Column_Text_Input = { date_updated?: InputMaybe; id?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; @@ -9182,6 +9234,7 @@ export type Update_Section_Header_Input = { id?: InputMaybe; overline?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; title?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; @@ -9287,11 +9340,12 @@ export type Update_Two_Column_Text_Input = { main_content?: InputMaybe; side_content?: InputMaybe; spacing?: InputMaybe; + theme?: InputMaybe; user_created?: InputMaybe; user_updated?: InputMaybe; }; -export type CustomPageFragment = { __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'article_cards', id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'card_with_image', spacing?: string | null, theme: string, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, bullets?: Array<{ __typename?: 'card_with_image_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }; +export type CustomPageFragment = { __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'article_cards', theme?: string | null, id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'blog_cards', theme?: string | null, spacing?: string | null } | { __typename?: 'cards', theme?: string | null, spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', theme?: string | null, spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', theme?: string | null, spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', theme?: string | null, spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', theme?: string | null, spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', theme?: string | null, spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', theme?: string | null, spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }; export type CustomPageTinyFragment = { __typename?: 'custom_pages', id: string, slug: string }; @@ -9305,33 +9359,33 @@ export type CustomPageQueryVariables = Exact<{ }>; -export type CustomPageQuery = { __typename?: 'Query', custom_pages: Array<{ __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'article_cards', id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'card_with_image', spacing?: string | null, theme: string, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, bullets?: Array<{ __typename?: 'card_with_image_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }> }; +export type CustomPageQuery = { __typename?: 'Query', custom_pages: Array<{ __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'article_cards', theme?: string | null, id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'blog_cards', theme?: string | null, spacing?: string | null } | { __typename?: 'cards', theme?: string | null, spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', theme?: string | null, spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', theme?: string | null, spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', theme?: string | null, spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', theme?: string | null, spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', theme?: string | null, spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', theme?: string | null, spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }> }; -export type HeroComponentFragment = { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; +export type HeroComponentFragment = { __typename?: 'hero', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; -export type LogoStripComponentFragment = { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null }; +export type LogoStripComponentFragment = { __typename?: 'logo_strip', theme?: string | null, spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null }; -export type SectionHeaderComponentFragment = { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null }; +export type SectionHeaderComponentFragment = { __typename?: 'section_header', theme?: string | null, spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null }; -export type LargeImageComponentFragment = { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; +export type LargeImageComponentFragment = { __typename?: 'large_image', theme?: string | null, spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; export type CardFragment = { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; -export type CardsComponentFragment = { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null }; +export type CardsComponentFragment = { __typename?: 'cards', theme?: string | null, spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null }; -export type BlogCardsComponentFragment = { __typename?: 'blog_cards', spacing?: string | null }; +export type BlogCardsComponentFragment = { __typename?: 'blog_cards', theme?: string | null, spacing?: string | null }; export type RichTextColumnFragment = { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string }; -export type TwoColumnTextComponentFragment = { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string }; +export type TwoColumnTextComponentFragment = { __typename?: 'two_column_text', theme?: string | null, spacing?: string | null, main_content: string, side_content: string }; -export type MultiColumnTextComponentFragment = { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null }; +export type MultiColumnTextComponentFragment = { __typename?: 'multi_column_text', theme?: string | null, spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null }; -export type CustomerQuoteComponentFragment = { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null }; +export type CustomerQuoteComponentFragment = { __typename?: 'customer_quote', theme?: string | null, spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null }; -export type CtaComponentFragment = { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null }; +export type CtaComponentFragment = { __typename?: 'cta', theme?: string | null, spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null }; -export type MediaCardComponentFragment = { __typename?: 'article_cards', id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; +export type MediaCardComponentFragment = { __typename?: 'article_cards', theme?: string | null, id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; export type CardWithImageComponentFragment = { __typename?: 'card_with_image', spacing?: string | null, theme: string, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, bullets?: Array<{ __typename?: 'card_with_image_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null }; @@ -9459,12 +9513,12 @@ export type LegalPageSlugsQueryVariables = Exact<{ [key: string]: never; }>; export type LegalPageSlugsQuery = { __typename?: 'Query', page_legal?: { __typename?: 'page_legal', pages?: Array<{ __typename?: 'markdown_pages', slug?: string | null } | null> | null } | null }; -export type PageHomepageFragment = { __typename?: 'page_homepage', quotes?: { __typename?: 'quote_lists', slug: string, items?: Array<{ __typename?: 'quote_lists_items', item?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | null> | null } | null, article_cards?: Array<{ __typename?: 'article_cards', id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null> | null }; +export type PageHomepageFragment = { __typename?: 'page_homepage', quotes?: { __typename?: 'quote_lists', slug: string, items?: Array<{ __typename?: 'quote_lists_items', item?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | null> | null } | null, article_cards?: Array<{ __typename?: 'article_cards', theme?: string | null, id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null> | null }; export type PageHomepageQueryVariables = Exact<{ [key: string]: never; }>; -export type PageHomepageQuery = { __typename?: 'Query', page_homepage?: { __typename?: 'page_homepage', quotes?: { __typename?: 'quote_lists', slug: string, items?: Array<{ __typename?: 'quote_lists_items', item?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | null> | null } | null, article_cards?: Array<{ __typename?: 'article_cards', id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null> | null } | null }; +export type PageHomepageQuery = { __typename?: 'Query', page_homepage?: { __typename?: 'page_homepage', quotes?: { __typename?: 'quote_lists', slug: string, items?: Array<{ __typename?: 'quote_lists_items', item?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | null> | null } | null, article_cards?: Array<{ __typename?: 'article_cards', theme?: string | null, id: string, heading?: string | null, description?: string | null, videoUrl?: string | null, date?: any | null, author?: string | null, ctas?: any | null, url?: string | null, thumbnail?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null> | null } | null }; export const ImageFileFragmentDoc = gql` fragment ImageFile on directus_files { @@ -9481,6 +9535,7 @@ export const ImageFileFragmentDoc = gql` `; export const HeroComponentFragmentDoc = gql` fragment HeroComponent on hero { + theme spacing heading body_text @@ -9519,6 +9574,7 @@ export const LogoListFragmentDoc = gql` ${CompanyLogoFragmentDoc}`; export const LogoStripComponentFragmentDoc = gql` fragment LogoStripComponent on logo_strip { + theme spacing logo_list { ...LogoList @@ -9527,6 +9583,7 @@ export const LogoStripComponentFragmentDoc = gql` ${LogoListFragmentDoc}`; export const SectionHeaderComponentFragmentDoc = gql` fragment SectionHeaderComponent on section_header { + theme spacing overline title @@ -9535,6 +9592,7 @@ export const SectionHeaderComponentFragmentDoc = gql` `; export const LargeImageComponentFragmentDoc = gql` fragment LargeImageComponent on large_image { + theme spacing overline heading @@ -9551,6 +9609,7 @@ export const LargeImageComponentFragmentDoc = gql` ${ImageFileFragmentDoc}`; export const TwoColumnTextComponentFragmentDoc = gql` fragment TwoColumnTextComponent on two_column_text { + theme spacing main_content side_content @@ -9565,6 +9624,7 @@ export const RichTextColumnFragmentDoc = gql` `; export const MultiColumnTextComponentFragmentDoc = gql` fragment MultiColumnTextComponent on multi_column_text { + theme spacing columns { rich_text_columns_id { @@ -9585,6 +9645,7 @@ export const CardFragmentDoc = gql` ${ImageFileFragmentDoc}`; export const CardsComponentFragmentDoc = gql` fragment CardsComponent on cards { + theme spacing cards { card_id { @@ -9595,6 +9656,7 @@ export const CardsComponentFragmentDoc = gql` ${CardFragmentDoc}`; export const BlogCardsComponentFragmentDoc = gql` fragment BlogCardsComponent on blog_cards { + theme spacing } `; @@ -9607,6 +9669,7 @@ export const QuoteFragmentDoc = gql` `; export const CustomerQuoteComponentFragmentDoc = gql` fragment CustomerQuoteComponent on customer_quote { + theme spacing quote { ...Quote @@ -9615,6 +9678,7 @@ export const CustomerQuoteComponentFragmentDoc = gql` ${QuoteFragmentDoc}`; export const CtaComponentFragmentDoc = gql` fragment CTAComponent on cta { + theme spacing heading body_text @@ -9624,6 +9688,7 @@ export const CtaComponentFragmentDoc = gql` `; export const MediaCardComponentFragmentDoc = gql` fragment MediaCardComponent on article_cards { + theme id heading description @@ -9637,25 +9702,6 @@ export const MediaCardComponentFragmentDoc = gql` url } ${ImageFileFragmentDoc}`; -export const CardWithImageComponentFragmentDoc = gql` - fragment CardWithImageComponent on card_with_image { - spacing - theme - heading - body_text - image { - ...ImageFile - } - bullets { - rich_text_columns_id { - ...RichTextColumn - } - } - cta_text - cta_url -} - ${ImageFileFragmentDoc} -${RichTextColumnFragmentDoc}`; export const CustomPageFragmentDoc = gql` fragment CustomPage on custom_pages { id @@ -9674,7 +9720,6 @@ export const CustomPageFragmentDoc = gql` ...CustomerQuoteComponent ...CTAComponent ...MediaCardComponent - ...CardWithImageComponent } } } @@ -9688,14 +9733,32 @@ ${CardsComponentFragmentDoc} ${BlogCardsComponentFragmentDoc} ${CustomerQuoteComponentFragmentDoc} ${CtaComponentFragmentDoc} -${MediaCardComponentFragmentDoc} -${CardWithImageComponentFragmentDoc}`; +${MediaCardComponentFragmentDoc}`; export const CustomPageTinyFragmentDoc = gql` fragment CustomPageTiny on custom_pages { id slug } `; +export const CardWithImageComponentFragmentDoc = gql` + fragment CardWithImageComponent on card_with_image { + spacing + theme + heading + body_text + image { + ...ImageFile + } + bullets { + rich_text_columns_id { + ...RichTextColumn + } + } + cta_text + cta_url +} + ${ImageFileFragmentDoc} +${RichTextColumnFragmentDoc}`; export const MinJobListingFragmentDoc = gql` fragment MinJobListing on job_listings { id diff --git a/src/graph/directus/customPages.graphql b/src/graph/directus/customPages.graphql index 3be6ce44..7ccf3650 100644 --- a/src/graph/directus/customPages.graphql +++ b/src/graph/directus/customPages.graphql @@ -15,7 +15,6 @@ fragment CustomPage on custom_pages { ...CustomerQuoteComponent ...CTAComponent ...MediaCardComponent - ...CardWithImageComponent } } } @@ -38,6 +37,7 @@ query CustomPage($slug: String!) { } fragment HeroComponent on hero { + theme spacing heading body_text @@ -52,6 +52,7 @@ fragment HeroComponent on hero { } fragment LogoStripComponent on logo_strip { + theme spacing logo_list { ...LogoList @@ -59,6 +60,7 @@ fragment LogoStripComponent on logo_strip { } fragment SectionHeaderComponent on section_header { + theme spacing overline title @@ -66,6 +68,7 @@ fragment SectionHeaderComponent on section_header { } fragment LargeImageComponent on large_image { + theme spacing overline heading @@ -90,6 +93,7 @@ fragment Card on card { } fragment CardsComponent on cards { + theme spacing cards { card_id { @@ -99,6 +103,7 @@ fragment CardsComponent on cards { } fragment BlogCardsComponent on blog_cards { + theme spacing } @@ -109,12 +114,14 @@ fragment RichTextColumn on rich_text_columns { } fragment TwoColumnTextComponent on two_column_text { + theme spacing main_content side_content } fragment MultiColumnTextComponent on multi_column_text { + theme spacing columns { rich_text_columns_id { @@ -124,6 +131,7 @@ fragment MultiColumnTextComponent on multi_column_text { } fragment CustomerQuoteComponent on customer_quote { + theme spacing quote { ...Quote @@ -131,6 +139,7 @@ fragment CustomerQuoteComponent on customer_quote { } fragment CTAComponent on cta { + theme spacing heading body_text @@ -139,6 +148,7 @@ fragment CTAComponent on cta { } fragment MediaCardComponent on article_cards { + theme id heading description