70 lines
2.9 KiB
TypeScript
70 lines
2.9 KiB
TypeScript
import { ArrowRight, CheckCircle2, FileText, ShieldCheck } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Progress } from "@/components/ui/progress";
|
|
|
|
const etapas = [
|
|
"Cadastro seguro",
|
|
"Briefing guiado",
|
|
"Ajuda por pergunta",
|
|
"Envio para análise"
|
|
];
|
|
|
|
export default function Home() {
|
|
return (
|
|
<main className="min-h-screen">
|
|
<section className="container grid min-h-screen gap-10 py-8 lg:grid-cols-[1fr_420px] lg:items-center lg:py-14">
|
|
<div className="max-w-3xl">
|
|
<div className="mb-6 inline-flex items-center gap-2 rounded-full border bg-card px-3 py-1 text-sm text-muted-foreground">
|
|
<ShieldCheck className="h-4 w-4 text-primary" />
|
|
Dados organizados, rascunho salvo e sem envio de senhas.
|
|
</div>
|
|
<h1 className="text-4xl font-semibold tracking-normal text-foreground sm:text-5xl lg:text-6xl">
|
|
Briefing de Site SeConectai
|
|
</h1>
|
|
<p className="mt-5 max-w-2xl text-lg leading-8 text-muted-foreground">
|
|
Um formulário guiado para reunir as informações do projeto com clareza,
|
|
contexto e segurança antes do desenvolvimento do site.
|
|
</p>
|
|
<div className="mt-8 flex flex-col gap-3 sm:flex-row">
|
|
<Button size="lg" className="gap-2" asChild>
|
|
<Link href="/login">
|
|
Entrar no sistema
|
|
<ArrowRight className="h-4 w-4" />
|
|
</Link>
|
|
</Button>
|
|
<Button size="lg" variant="outline" asChild>
|
|
<Link href="/cadastro">Criar cadastro</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
|
|
<Card className="border bg-card shadow-sm">
|
|
<CardHeader>
|
|
<div className="mb-3 flex h-11 w-11 items-center justify-center rounded-md bg-accent text-primary">
|
|
<FileText className="h-6 w-6" />
|
|
</div>
|
|
<CardTitle className="text-2xl">Como o briefing avança</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="space-y-6">
|
|
<Progress value={25} aria-label="Progresso demonstrativo do briefing" />
|
|
<div className="space-y-4">
|
|
{etapas.map((etapa) => (
|
|
<div key={etapa} className="flex items-center gap-3">
|
|
<CheckCircle2 className="h-5 w-5 flex-none text-primary" />
|
|
<span className="text-sm font-medium">{etapa}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<p className="rounded-md bg-muted p-4 text-sm leading-6 text-muted-foreground">
|
|
A estrutura inicial está pronta para evoluir em etapas: banco,
|
|
autenticação, formulário dirigido por dados, anexos e painel admin.
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
</section>
|
|
</main>
|
|
);
|
|
}
|