feat: cards de projetos totalmente clicaveis com cursor-pointer

This commit is contained in:
Erik
2025-11-27 17:54:56 -03:00
parent 61d8f707dc
commit 7fb9d88b5b
4 changed files with 12 additions and 12 deletions

View File

@@ -287,7 +287,7 @@ export default function Home() {
}))
: FALLBACK_PROJECTS
).map((project) => (
<div key={project.id} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer">
<Link key={project.id} href={`/projetos/${project.id}`} className="group relative overflow-hidden rounded-xl h-[400px] cursor-pointer block">
<div className="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-110" style={{ backgroundImage: `url('${project.image}')` }}></div>
<div className="absolute inset-0 bg-linear-to-t from-black/90 via-black/20 to-transparent opacity-80 group-hover:opacity-90 transition-opacity"></div>
<div className="absolute bottom-0 left-0 p-8 w-full transform translate-y-4 group-hover:translate-y-0 transition-transform">
@@ -299,7 +299,7 @@ export default function Home() {
</span>
</div>
</div>
</div>
</Link>
))}
</div>
</div>

View File

@@ -168,7 +168,7 @@ export default function ProjetosPage() {
{!loading && filteredProjects.length > 0 && (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{filteredProjects.map((project) => (
<div key={project.id} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col">
<Link key={project.id} href={`/projetos/${project.id}`} className="group bg-white dark:bg-secondary rounded-xl overflow-hidden shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 dark:border-white/10 flex flex-col cursor-pointer">
<div className="relative h-64 overflow-hidden">
<div
className="absolute inset-0 bg-cover bg-center transition-transform duration-700 group-hover:scale-110"
@@ -196,11 +196,11 @@ export default function ProjetosPage() {
{project.description}
</p>
)}
<Link href={`/projetos/${project.id}`} className="inline-flex items-center gap-2 text-primary font-bold hover:gap-3 transition-all mt-auto">
<span className="inline-flex items-center gap-2 text-primary font-bold group-hover:gap-3 transition-all mt-auto">
<T>Ver Detalhes</T> <i className="ri-arrow-right-line"></i>
</Link>
</span>
</div>
</div>
</Link>
))}
</div>
)}