Update create flow pages

2026-04-13 18:24:13 -06:00
parent a39b4aa04b
commit a0de78c020
66 changed files with 1028 additions and 538 deletions
@@ -0,0 +1,44 @@
+"use client";
+
+import NumberedList from "../../../components/type/NumberedList";
+import { useTranslation } from "../../../contexts/MessagesContext";
+import { useCreateFlowMdUp } from "../../hooks/useCreateFlowMdUp";
+import { CreateFlowHeaderLockup } from "../../components/CreateFlowHeaderLockup";
+import { CreateFlowStepShell } from "../../components/CreateFlowStepShell";
+
+/** Create Community — frame 1 (Figma 20094-16005). */
+export function InformationalScreen() {
+  const mdUp = useCreateFlowMdUp();
+  const t = useTranslation("create.informational");
+
+  const items = [
+    {
+      title: t("steps.0.title"),
+      description: t("steps.0.description"),
+    },
+    {
+      title: t("steps.1.title"),
+      description: t("steps.1.description"),
+    },
+    {
+      title: t("steps.2.title"),
+      description: t("steps.2.description"),
+    },
+  ];
+
+  return (
+    <CreateFlowStepShell
+      variant="centeredNarrow"
+      contentTopBelowMd="space-1400"
+    >
+      <div className="flex w-full max-w-[640px] flex-col items-center gap-12">
+        <CreateFlowHeaderLockup
+          title={t("title")}
+          description={t("description")}
+          justification="left"
+        />
+        <NumberedList items={items} size={mdUp ? "M" : "S"} />
+      </div>
+    </CreateFlowStepShell>
+  );
+}