carlos/almeira-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: finalize NewsCard edit button z-index layer and eliminate nested Server Component Links

Browse Source
This commit is contained in:
Carlos (Almeira) 2026-03-28 17:34:01 -05:00
parent a39c059ee2
commit b063109af6
1 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/NewsCard.tsx
View File

@ -45,6 +45,19 @@ export const NewsCard = ({
<span className="sr-only">Ver {titulo}</span>
</Link>
{/* Edit Button for Admins (Elevado en el stacking context) */}
{isAdmin && (
<div className="absolute top-4 right-4 z-30 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-auto">
<Link
href={`/dashboard/posts/${id}`}
className="flex items-center gap-2 px-3 py-1.5 rounded-full text-[10px] font-black uppercase tracking-wider bg-slate-950/80 backdrop-blur border border-cyan-500/50 text-cyan-400 hover:bg-cyan-500 hover:text-slate-950 transition-all shadow-lg cursor-pointer hover:scale-105"
title="Editar en Dashboard"
>
<span className="hidden sm:inline pointer-events-none">Editar</span>
</Link>
</div>
)}
{/* Imagen Destacada */}
<div className="relative aspect-[16/10] w-full overflow-hidden bg-slate-800 z-0">
<div className="absolute inset-0 bg-gradient-to-t from-slate-950 via-slate-950/20 to-transparent z-10 opacity-90 pointer-events-none"></div>
@ -65,18 +78,7 @@ export const NewsCard = ({
</div>
)}
{/* Edit Button for Admins */}
{isAdmin && (
<div className="absolute top-4 right-4 z-30 opacity-0 group-hover:opacity-100 transition-opacity">
<Link
href={`/dashboard/posts/${id}`}
className="flex items-center gap-2 px-3 py-1.5 rounded-full text-[10px] font-black uppercase tracking-wider bg-slate-950/80 backdrop-blur border border-cyan-500/50 text-cyan-400 hover:bg-cyan-500 hover:text-slate-950 transition-all shadow-lg"
title="Editar en Dashboard"
>
<span className="hidden sm:inline">Editar</span>
</Link>
</div>
)}
{/* No button here */}
</div>
{/* Contenido */}