Split

import { SplitHero } from "@/components/email/split-hero";
import { defaultTheme } from "@/components/email/theme-default";

export function SplitHeroDemo() {
  return (
    <SplitHero
      treatment="contained"
      imagePosition="right"
      theme={{ ...defaultTheme, containerWidth: "640px" }}
    />
  );
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentOverlayVariantOverlayLeftExampleDemo() {
  return <SplitHero treatment="overlay" variant="overlay-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentOverlayVariantOverlayRightExampleDemo() {
  return <SplitHero treatment="overlay" variant="overlay-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedImagePositionRightExampleDemo() {
  return <SplitHero treatment="contained" imagePosition="right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantSingleImageRightExampleDemo() {
  return <SplitHero treatment="contained" variant="single-image-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantSquareImagesLeftExampleDemo() {
  return <SplitHero treatment="contained" variant="square-images-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantSquareImagesRightExampleDemo() {
  return <SplitHero treatment="contained" variant="square-images-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantPortraitTopLeftExampleDemo() {
  return <SplitHero treatment="contained" variant="portrait-top-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantPortraitTopRightExampleDemo() {
  return <SplitHero treatment="contained" variant="portrait-top-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantPortraitBottomLeftExampleDemo() {
  return <SplitHero treatment="contained" variant="portrait-bottom-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentContainedVariantPortraitBottomRightExampleDemo() {
  return <SplitHero treatment="contained" variant="portrait-bottom-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentFullBleedVariantImageLeftExampleDemo() {
  return <SplitHero treatment="full-bleed" variant="image-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentFullBleedVariantImageRightExampleDemo() {
  return <SplitHero treatment="full-bleed" variant="image-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroOverlayContentVariantDefaultExampleDemo() {
  return <SplitHero overlayContent variant="default" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroOverlayContentVariantSlantedLeftExampleDemo() {
  return <SplitHero overlayContent variant="slanted-left" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroOverlayContentVariantSlantedRightExampleDemo() {
  return <SplitHero overlayContent variant="slanted-right" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentSlantedVariantLeftSlantedUpExampleDemo() {
  return <SplitHero treatment="slanted" variant="left-slanted-up" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentSlantedVariantLeftSlantedDownExampleDemo() {
  return <SplitHero treatment="slanted" variant="left-slanted-down" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentSlantedVariantRightSlantedUpExampleDemo() {
  return <SplitHero treatment="slanted" variant="right-slanted-up" />;
}

import { SplitHero } from "@/components/email/split-hero";

export function SplitHeroTreatmentSlantedVariantRightSlantedDownExampleDemo() {
  return <SplitHero treatment="slanted" variant="right-slanted-down" />;
}