diff options
| author | zwlucas <lucas.oliveira1676@etec.sp.gov.br> | 2025-04-01 12:18:15 +0000 |
|---|---|---|
| committer | zwlucas <lucas.oliveira1676@etec.sp.gov.br> | 2025-04-01 12:18:15 +0000 |
| commit | dbf1f62ca81eafe13bf058ac94877f378c99114b (patch) | |
| tree | 118d901f2e4fa0640643cf94c9d913f526358541 /app/votar/page.tsx | |
| parent | 076a8f408dd3237546406c74c6a1d57d770ff78b (diff) | |
| download | eleicoes-dbf1f62ca81eafe13bf058ac94877f378c99114b.tar.gz eleicoes-dbf1f62ca81eafe13bf058ac94877f378c99114b.zip | |
responsive web
Diffstat (limited to 'app/votar/page.tsx')
| -rw-r--r-- | app/votar/page.tsx | 88 |
1 files changed, 44 insertions, 44 deletions
diff --git a/app/votar/page.tsx b/app/votar/page.tsx index 436c167..5ca0cb4 100644 --- a/app/votar/page.tsx +++ b/app/votar/page.tsx @@ -46,55 +46,55 @@ export default function VotarPage() { }; return ( - <div className="flex min-h-screen flex-col items-center justify-center bg-[#f0f5fa]"> - <div className="w-full max-w-md"> - <div className="mb-6 flex items-center justify-center"> - <div className="flex flex-col items-center"> - <div className="mb-2 text-center text-3xl font-bold text-[#004a93]"> - JUSTIÇA ELEITORAL - </div> - <div className="h-2 w-full bg-gradient-to-r from-[#009c3b] via-[#ffdf00] to-[#002776]"></div> - </div> + <div className="flex min-h-screen flex-col items-center justify-center bg-[#f0f5fa] p-4"> + <div className="w-full max-w-md md:max-w-2xl"> + <div className="mb-6 flex items-center justify-center"> + <div className="flex flex-col items-center"> + <div className="mb-2 text-center text-2xl font-bold text-[#004a93] md:text-3xl"> + JUSTIÇA ELEITORAL ESTUDANTIL </div> + <div className="h-2 w-full bg-gradient-to-r from-[#009c3b] via-[#ffdf00] to-[#002776]"></div> + </div> + </div> - <Card className="border-2 border-[#004a93] shadow-lg overflow-hidden"> - <CardHeader className="bg-[#004a93] text-center text-white"> - <CardTitle className="text-2xl">SEU VOTO PARA</CardTitle> - <CardDescription className="text-gray-100"> - CHAPA DO GREMIO ESTUDANTIL - </CardDescription> - </CardHeader> - <CardContent className="space-y-6 p-6 rounded-b-lg"> - <div className="grid grid-cols-2 gap-6"> - <Button - onClick={() => handleVote("SIE")} - className="flex h-40 flex-col items-center justify-center border-2 border-[#004a93] bg-white p-4 text-xl font-bold text-[#004a93] hover:bg-[#e6f0fa]" - variant="outline" - > - <div className="mb-2 text-4xl">1</div> - SIE - </Button> - <Button - onClick={() => handleVote("Liderança Jovem")} - className="flex h-40 flex-col items-center justify-center border-2 border-[#004a93] bg-white p-4 text-xl font-bold text-[#004a93] hover:bg-[#e6f0fa]" - variant="outline" - > - <div className="mb-2 text-4xl">2</div> - Liderança Jovem - </Button> - </div> - <div className="mt-4 text-center text-sm text-[#004a93]"> - Toque no quadro correspondente para VOTAR - </div> - </CardContent> - </Card> + <Card className="border-2 border-[#004a93] shadow-lg overflow-hidden"> + <CardHeader className="bg-[#004a93] text-center text-white"> + <CardTitle className="text-xl md:text-2xl">SEU VOTO PARA</CardTitle> + <CardDescription className="text-gray-100"> + CHAPA DO GREMIO ESTUDANTIL + </CardDescription> + </CardHeader> + <CardContent className="space-y-6 p-4 md:p-6 rounded-b-lg"> + <div className="grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6"> + <Button + onClick={() => handleVote("SIE")} + className="flex h-32 flex-col items-center justify-center border-2 border-[#004a93] bg-white p-4 text-lg font-bold text-[#004a93] hover:bg-[#e6f0fa] md:h-40 md:text-xl" + variant="outline" + > + <div className="mb-2 text-3xl md:text-4xl">1</div> + SIE + </Button> + <Button + onClick={() => handleVote("Liderança Jovem")} + className="flex h-32 flex-col items-center justify-center border-2 border-[#004a93] bg-white p-4 text-lg font-bold text-[#004a93] hover:bg-[#e6f0fa] md:h-40 md:text-xl" + variant="outline" + > + <div className="mb-2 text-3xl md:text-4xl">2</div> + Liderança Jovem + </Button> + </div> + <div className="mt-4 text-center text-sm text-[#004a93] md:text-base"> + Toque no quadro correspondente para VOTAR + </div> + </CardContent> + </Card> - <div className="mt-4 flex justify-center"> - <div className="text-center text-sm text-[#004a93]"> - © {new Date().getFullYear()} Justiça Eleitoral Estudantil - </div> + <div className="mt-4 flex justify-center"> + <div className="text-center text-sm text-[#004a93] md:text-base"> + © {new Date().getFullYear()} Justiça Eleitoral Estudantil </div> </div> + </div> </div> ); } |