feat: adiciona horario e icone de relogio na pagina de confirmacao

This commit is contained in:
Erik Silva
2026-02-04 19:38:51 -03:00
parent 2424fa9bb6
commit 4e6926f7a6
39 changed files with 4743 additions and 802 deletions

View File

@@ -1,34 +1,38 @@
'use client'
import { useState } from 'react'
import { MapPin, Palette, Briefcase } from 'lucide-react'
import { MapPin, Palette, Briefcase, Shirt, Zap } from 'lucide-react'
import { clsx } from 'clsx'
import { motion, AnimatePresence } from 'framer-motion'
interface SettingsTabsProps {
branding: React.ReactNode
teams: React.ReactNode
arenas: React.ReactNode
sponsors: React.ReactNode
voting: React.ReactNode
}
export function SettingsTabs({ branding, arenas, sponsors }: SettingsTabsProps) {
const [activeTab, setActiveTab] = useState<'branding' | 'arenas' | 'sponsors'>('branding')
export function SettingsTabs({ branding, teams, arenas, sponsors, voting }: SettingsTabsProps) {
const [activeTab, setActiveTab] = useState<'branding' | 'teams' | 'arenas' | 'sponsors' | 'voting'>('branding')
const tabs = [
{ id: 'branding', label: 'Identidade Visual', icon: Palette },
{ id: 'voting', label: 'Votação & Resenha', icon: Zap },
{ id: 'teams', label: 'Times', icon: Shirt },
{ id: 'arenas', label: 'Locais & Arenas', icon: MapPin },
{ id: 'sponsors', label: 'Patrocínios', icon: Briefcase },
] as const
return (
<div className="space-y-8">
<div className="flex p-1 bg-surface-raised rounded-xl border border-border w-full sm:w-fit">
<div className="flex p-1 bg-surface-raised rounded-xl border border-border w-full sm:w-fit overflow-x-auto">
{tabs.map((tab) => (
<button
key={tab.id}
onClick={() => setActiveTab(tab.id)}
className={clsx(
"flex items-center gap-2 px-6 py-2.5 rounded-lg text-sm font-bold transition-all flex-1 sm:flex-none justify-center",
"flex items-center gap-2 px-6 py-2.5 rounded-lg text-sm font-bold transition-all flex-1 sm:flex-none justify-center whitespace-nowrap",
activeTab === tab.id
? "bg-primary text-background shadow-lg shadow-emerald-500/10"
: "text-muted hover:text-foreground hover:bg-white/5"
@@ -53,6 +57,28 @@ export function SettingsTabs({ branding, arenas, sponsors }: SettingsTabsProps)
{branding}
</motion.div>
)}
{activeTab === 'voting' && (
<motion.div
key="voting"
initial={{ opacity: 0, y: 10 }}
animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0, y: -10 }}
transition={{ duration: 0.2 }}
>
{voting}
</motion.div>
)}
{activeTab === 'teams' && (
<motion.div
key="teams"
initial={{ opacity: 0, y: 10 }}
animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0, y: -10 }}
transition={{ duration: 0.2 }}
>
{teams}
</motion.div>
)}
{activeTab === 'arenas' && (
<motion.div
key="arenas"