feat: apply Chromatic viewport modes to HubHero story

Author: TylerAPfledderer

.storybook/modes.ts

@@ -0,0 +1,20 @@
+export const allModes = {
+  base: {
+    viewport: "base",
+  },
+  sm: {
+    viewport: "sm",
+  },
+  md: {
+    viewport: "md",
+  },
+  lg: {
+    viewport: "lg",
+  },
+  xl: {
+    viewport: "xl",
+  },
+  "2xl": {
+    viewport: "2xl",
+  },
+}

src/components/Hero/HubHero/HubHero.stories.tsx

@@ -3,6 +3,8 @@ import { useTranslation } from "next-i18next"
 import { Box } from "@chakra-ui/react"
 import { Meta, StoryObj } from "@storybook/react"
 
+import { allModes } from "../../../../.storybook/modes"
+
 import HubHeroComponent from "./"
 
 type HubHeroType = typeof HubHeroComponent
@@ -12,6 +14,11 @@ const meta = {
   component: HubHeroComponent,
   parameters: {
     layout: "none",
+    chromatic: {
+      modes: {
+        ...allModes,
+      },
+    },
   },
   decorators: [
     (Story) => (