adilallo
45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
"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>
|
|
);
|
|
}
|