Spaces:
Build error
Build error
File size: 4,619 Bytes
ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 ccf2b04 4a51505 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 |
import { motion } from 'framer-motion'
import Link from 'next/link'
import { useState } from 'react'
import { HiBookOpen, HiLightningBolt, HiDocumentText, HiAcademicCap } from 'react-icons/hi'
export default function QuickAccess() {
const [hoveredIndex, setHoveredIndex] = useState(null)
const quickAccessItems = [
{
title: 'Biblioteca de Prompts',
description: 'Mais de 50 prompts organizados por categoria',
icon: HiBookOpen,
href: '/prompts',
color: 'bg-blue-500',
highlight: true,
stats: '50+ prompts'
},
{
title: 'Prompts Jurídicos',
description: 'Peticionamento, contratos e análises legais',
icon: HiDocumentText,
href: '/prompts?tag=juridico',
color: 'bg-green-500',
stats: '20+ prompts'
},
{
title: 'Concursos Públicos',
description: 'Estratégias de estudo e simulados com IA',
icon: HiAcademicCap,
href: '/prompts?tag=concurso',
color: 'bg-purple-500',
stats: '15+ prompts'
},
{
title: 'Gestão Administrativa',
description: 'Organização e otimização de processos',
icon: HiLightningBolt,
href: '/prompts?tag=administrativo',
color: 'bg-orange-500',
stats: '15+ prompts'
}
]
return (
<section className="py-16 bg-white">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<motion.div
className="text-center mb-12"
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
viewport={{ once: true }}
>
<h2 className="text-3xl lg:text-4xl font-bold text-gray-900 mb-4">
Acesso Rápido aos Melhores Recursos
</h2>
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
Encontre rapidamente o que você precisa para transformar sua prática profissional
</p>
</motion.div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
{quickAccessItems.map((item, index) => (
<motion.div
key={index}
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6, delay: index * 0.1 }}
viewport={{ once: true }}
whileHover={{ y: -8 }}
className={`group ${item.highlight ? 'md:col-span-2 lg:col-span-1' : ''}`}
>
<Link
href={item.href}
className={`block ${item.highlight ? 'md:flex md:items-center' : ''}`}
onMouseEnter={() => setHoveredIndex(index)}
onMouseLeave={() => setHoveredIndex(null)}
>
<div className={`category-card ${item.highlight ? 'md:flex-1' : ''}`}>
<div className="text-center">
<motion.div
className={`${item.color} w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:scale-110 transition-transform duration-300`}
animate={hoveredIndex === index ? { scale: 1.1, rotate: 5 } : { scale: 1, rotate: 0 }}
transition={{ duration: 0.3 }}
>
<item.icon className="h-8 w-8 text-white" aria-hidden="true" />
</motion.div>
<div className="flex items-center justify-center space-x-2 mb-2">
<h3 className="text-lg font-semibold text-gray-900 group-hover:text-primary-600 transition-colors duration-200">
{item.title}
</h3>
{item.highlight && (
<span className="bg-accent-100 text-accent-700 text-xs font-medium px-2 py-1 rounded-full">
Destaque
</span>
)}
</div>
<p className="text-gray-600 text-sm leading-relaxed mb-3">
{item.description}
</p>
<div className="flex items-center justify-center space-x-2 text-xs text-gray-500">
<span>{item.stats}</span>
<span>•</span>
<span>Clique para acessar</span>
</div>
</div>
</div>
</Link>
</motion.div>
))}
</div>
</div>
</section>
)
} |