diff --git a/components/Banner/Banner.styles.ts b/components/Banner/Banner.styles.ts index 3aa8f077..1df8fd8e 100644 --- a/components/Banner/Banner.styles.ts +++ b/components/Banner/Banner.styles.ts @@ -1,6 +1,6 @@ export const wrapper = 'mr-0 au-ml-auto flex-col lg:flex-row'; export const contentWrapper = 'lg:rs-pr-9 ml-0'; export const heading = '2xl:whitespace-pre-line -mt-01em rs-mb-2 xl:max-w-1200'; -export const body = 'max-w-[50ch] rs-mb-3 children:children:leading-snug'; +export const body = 'max-w-[50ch] rs-mb-3 *:*:leading-snug'; export const imageWrapper = 'self-end lg:self-start shrink-0'; export const image = 'rs-mt-3 lg:mt-0 w-250 xl:w-[36rem]'; diff --git a/components/BlurryPoster/BlurryPoster.styles.tsx b/components/BlurryPoster/BlurryPoster.styles.tsx index 5edfdd8a..87e5bcc3 100644 --- a/components/BlurryPoster/BlurryPoster.styles.tsx +++ b/components/BlurryPoster/BlurryPoster.styles.tsx @@ -78,7 +78,7 @@ export const customHeading = ( imageOnLeft?: boolean, headingFont?: 'druk' | 'serif', isTwoCol?: boolean, -) => cnb('flex flex-wrap gap-x-[0.6em] md:gap-x-[1em] items-center mb-0 -mt-02em md:-mt-05em lg:-mt-08em children:inline-block', { +) => cnb('flex flex-wrap gap-x-[0.6em] md:gap-x-[1em] items-center mb-0 -mt-02em md:-mt-05em lg:-mt-08em *:inline-block', { '3xl:pl-[calc(100%-750px-40px)] lg:w-[140%] xl:w-[130%]': !imageOnLeft && headingFont === 'druk' && isTwoCol, }); export const customHeadingText = (font?: 'druk' | 'serif', isSmallHeading?: boolean) => cnb('hyphens-auto first:ml-0 last:mr-0', { @@ -92,7 +92,7 @@ export const customHeadingText = (font?: 'druk' | 'serif', isSmallHeading?: bool export const bodyWrapper = (imageOnLeft?: boolean, isTwoCol?: boolean) => cnb('cc w-full', { '3xl:pr-[calc(100%-750px)] lg:pl-40 2xl:pl-60': imageOnLeft && isTwoCol, '3xl:pl-[calc(100%-750px)] lg:pr-40 2xl:pr-60': !imageOnLeft && isTwoCol, - 'children:max-w-[50ch]': !isTwoCol, + '*:max-w-[50ch]': !isTwoCol, }); export const cta = 'rs-mt-4'; diff --git a/components/Bracket/Bracket.styles.ts b/components/Bracket/Bracket.styles.ts index bfbaae4a..adaf68b5 100644 --- a/components/Bracket/Bracket.styles.ts +++ b/components/Bracket/Bracket.styles.ts @@ -1,7 +1,7 @@ import { cnb } from 'cnbuilder'; // Bracket Curve styles -export const root = 'children:border-current backface-hidden'; +export const root = '*:border-current backface-hidden'; export type CornerType = 'tl' | 'bl' | 'tr' | 'br'; diff --git a/components/ChangemakerCard/ChangemakerCard.styles.ts b/components/ChangemakerCard/ChangemakerCard.styles.ts index 2097d844..a457fbda 100644 --- a/components/ChangemakerCard/ChangemakerCard.styles.ts +++ b/components/ChangemakerCard/ChangemakerCard.styles.ts @@ -6,7 +6,7 @@ export const imageWrapper = 'overflow-hidden aspect-w-1 aspect-h-2'; export const info = 'rs-px-1 pb-150 absolute w-full h-full bottom-0 left-0 mb-0'; export const heading = 'mb-02em mt-auto'; -export const cardContent = 'absolute w-full h-full top-0 left-0 px-20 py-30 3xl:py-48 3xl:px-36 aria-hidden:opacity-0 opacity-100 backdrop-blur-sm transition-opacity duration-500 bg-gradient-to-b from-gc-black/60 to-gc-black/90 gc-changemaker children:children:children:!mb-1em'; +export const cardContent = 'absolute w-full h-full top-0 left-0 px-20 py-30 3xl:py-48 3xl:px-36 aria-hidden:opacity-0 opacity-100 backdrop-blur-sm transition-opacity duration-500 bg-gradient-to-b from-gc-black/60 to-gc-black/90 gc-changemaker *:*:*:!mb-1em'; export const button = 'group absolute w-full h-full top-0 left-0'; export const icon = 'absolute bottom-40 right-36 text-white w-65 h-65 border-2 border-white rounded-full p-16 group-hocus-visible:border-dashed group-aria-expanded:rotate-45 transition-transform'; diff --git a/components/EmbedMedia/EmbedMedia.styles.ts b/components/EmbedMedia/EmbedMedia.styles.ts index 42f07014..b4cf4a41 100644 --- a/components/EmbedMedia/EmbedMedia.styles.ts +++ b/components/EmbedMedia/EmbedMedia.styles.ts @@ -1,2 +1,2 @@ -export const mediaWrapper = 'children:!w-full children:!h-full'; -export const caption = 'children:children:leading-display caption mt-1em max-w-prose-wide'; +export const mediaWrapper = '*:!w-full *:!h-full'; +export const caption = '*:*:leading-display caption mt-1em max-w-prose-wide'; diff --git a/components/FeaturedStories/FeatureMasonry.tsx b/components/FeaturedStories/FeatureMasonry.tsx index 80f183fa..6750842d 100644 --- a/components/FeaturedStories/FeatureMasonry.tsx +++ b/components/FeaturedStories/FeatureMasonry.tsx @@ -56,7 +56,7 @@ export const FeatureMasonry = ({
diff --git a/components/Hero/BasicHeroMvp.tsx b/components/Hero/BasicHeroMvp.tsx index 781ad8b5..f51ac484 100644 --- a/components/Hero/BasicHeroMvp.tsx +++ b/components/Hero/BasicHeroMvp.tsx @@ -39,7 +39,7 @@ export const BasicHeroMvp = ({ /> )} - + cnb( ); export const mobileImage = 'w-full h-full lg:hidden'; export const captionWrapper = 'mt-06em'; -export const caption = 'caption children:leading-display mt-08em max-w-prose-wide'; +export const caption = 'caption *:leading-display mt-08em max-w-prose-wide'; diff --git a/components/Homepage/IdealFellow.tsx b/components/Homepage/IdealFellow.tsx index 7fe2e64a..66800b7c 100644 --- a/components/Homepage/IdealFellow.tsx +++ b/components/Homepage/IdealFellow.tsx @@ -31,7 +31,7 @@ export const IdealFellow = () => { Untangling the web of racial inequality - + diff --git a/components/Homepage/Intro.tsx b/components/Homepage/Intro.tsx index aef49d58..5a781bb3 100644 --- a/components/Homepage/Intro.tsx +++ b/components/Homepage/Intro.tsx @@ -40,7 +40,7 @@ export const Intro = ({ text }: IntroProps) => { style={{ x: prefersReduceMotion ? '0' : bracketPosition, willChange }} > @@ -58,7 +58,7 @@ export const Intro = ({ text }: IntroProps) => { > diff --git a/components/Homepage/ThemeSection.tsx b/components/Homepage/ThemeSection.tsx index 0d40eea9..6f2e11a2 100644 --- a/components/Homepage/ThemeSection.tsx +++ b/components/Homepage/ThemeSection.tsx @@ -130,7 +130,7 @@ export const ThemeSection = ({
-
+
setShouldAnimate(false)}>Reveal themes visually
{/* This grid contains the 4 animated lines behind the theme cards */} diff --git a/components/LocalFooter/LocalFooter.tsx b/components/LocalFooter/LocalFooter.tsx index b7526264..2bc87a81 100644 --- a/components/LocalFooter/LocalFooter.tsx +++ b/components/LocalFooter/LocalFooter.tsx @@ -22,7 +22,7 @@ export const LocalFooter = () => ( (650) 724-0627
Tax ID: 94-1156365 -