design: botones de comunidad al header (siempre visibles, arriba) + footer simplificado
This commit is contained in:
+49
-49
@@ -19,14 +19,58 @@ export default function PublicLayout({ children }: { children: React.ReactNode }
|
||||
</div>
|
||||
<span className="text-sm font-bold tracking-tight">{SITE_NAME}</span>
|
||||
</Link>
|
||||
<nav className="flex items-center gap-2 sm:gap-4">
|
||||
|
||||
{/* Lupa + botones de comunidad (siempre visibles, arriba de todo) */}
|
||||
<nav className="flex items-center gap-1 sm:gap-1.5">
|
||||
<Link
|
||||
href="/buscar"
|
||||
className="flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 text-xs text-[var(--muted)] hover:bg-[var(--surface)] hover:text-[var(--foreground)] transition-colors"
|
||||
title="Buscar"
|
||||
>
|
||||
<Search className="h-4 w-4" />
|
||||
<span className="hidden sm:inline">Buscar</span>
|
||||
</Link>
|
||||
|
||||
<span className="mx-1 hidden h-4 w-px bg-[var(--border)] sm:block" />
|
||||
|
||||
{SITE_LINKS.twitter && (
|
||||
<a
|
||||
href={SITE_LINKS.twitter}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex h-8 w-8 items-center justify-center rounded-full text-[var(--muted)] transition-colors hover:bg-[var(--surface)] hover:text-[var(--accent)]"
|
||||
title="X / Twitter"
|
||||
>
|
||||
<X className="h-4 w-4" />
|
||||
</a>
|
||||
)}
|
||||
<a
|
||||
href={SITE_LINKS.discord}
|
||||
target={SITE_LINKS.discord.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="flex h-8 w-8 items-center justify-center rounded-full text-[var(--muted)] transition-colors hover:bg-[var(--surface)] hover:text-[#5865F2]"
|
||||
title={SITE_LINKS.discord === "#" ? "Discord (próximamente)" : "Discord"}
|
||||
>
|
||||
<MessageCircle className="h-4 w-4" />
|
||||
</a>
|
||||
<a
|
||||
href={SITE_LINKS.patreon}
|
||||
target={SITE_LINKS.patreon.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="flex h-8 w-8 items-center justify-center rounded-full text-[var(--muted)] transition-colors hover:bg-[var(--surface)] hover:text-[#FF424D]"
|
||||
title={SITE_LINKS.patreon === "#" ? "Patreon (próximamente)" : "Patreon"}
|
||||
>
|
||||
<Heart className="h-4 w-4" />
|
||||
</a>
|
||||
<a
|
||||
href="/rss.xml"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex h-8 w-8 items-center justify-center rounded-full text-[var(--muted)] transition-colors hover:bg-[var(--surface)] hover:text-[#f97316]"
|
||||
title="RSS feed"
|
||||
>
|
||||
<Rss className="h-4 w-4" />
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
@@ -39,57 +83,13 @@ export default function PublicLayout({ children }: { children: React.ReactNode }
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer className="border-t border-[var(--border)] pt-8 pb-24 sm:pb-8">
|
||||
<div className="mx-auto max-w-5xl px-3 flex flex-col items-center gap-5">
|
||||
{/* Footer simplificado: los botones de comunidad viven en el header
|
||||
(siempre visibles); acá solo marca + aviso legal */}
|
||||
<footer className="border-t border-[var(--border)] py-6 pb-16 sm:pb-6">
|
||||
<div className="mx-auto max-w-5xl px-3 flex flex-col items-center gap-3">
|
||||
<p className="text-xs text-[var(--muted)]">
|
||||
{SITE_NAME} · {SITE_TAGLINE}
|
||||
</p>
|
||||
|
||||
{/* Botones de comunidad: visibles y táctiles en móvil */}
|
||||
<div className="flex flex-wrap items-center justify-center gap-2.5 w-full max-w-md">
|
||||
{SITE_LINKS.twitter && (
|
||||
<a
|
||||
href={SITE_LINKS.twitter}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 rounded-full border border-[var(--border)] bg-[var(--surface)] px-4 py-2 text-xs font-medium text-[var(--foreground)] transition-colors hover:border-[var(--accent)] hover:text-[var(--accent)]"
|
||||
>
|
||||
<X className="h-3.5 w-3.5" />
|
||||
X / Twitter
|
||||
</a>
|
||||
)}
|
||||
<a
|
||||
href={SITE_LINKS.discord}
|
||||
target={SITE_LINKS.discord.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 rounded-full border border-[var(--border)] bg-[var(--surface)] px-4 py-2 text-xs font-medium text-[var(--foreground)] transition-colors hover:border-[#5865F2] hover:text-[#5865F2]"
|
||||
title={SITE_LINKS.discord === "#" ? "Discord (próximamente)" : "Discord"}
|
||||
>
|
||||
<MessageCircle className="h-3.5 w-3.5" />
|
||||
Discord
|
||||
</a>
|
||||
<a
|
||||
href={SITE_LINKS.patreon}
|
||||
target={SITE_LINKS.patreon.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 rounded-full border border-[var(--border)] bg-[var(--surface)] px-4 py-2 text-xs font-medium text-[var(--foreground)] transition-colors hover:border-[#FF424D] hover:text-[#FF424D]"
|
||||
title={SITE_LINKS.patreon === "#" ? "Patreon (próximamente)" : "Patreon"}
|
||||
>
|
||||
<Heart className="h-3.5 w-3.5" />
|
||||
Patreon
|
||||
</a>
|
||||
<a
|
||||
href="/rss.xml"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 rounded-full border border-[var(--border)] bg-[var(--surface)] px-4 py-2 text-xs font-medium text-[var(--foreground)] transition-colors hover:border-[#f97316] hover:text-[#f97316]"
|
||||
title="RSS feed"
|
||||
>
|
||||
<Rss className="h-3.5 w-3.5" />
|
||||
RSS
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<p className="text-[10px] text-[var(--muted)] opacity-60">
|
||||
Contenido para mayores de 18 años · Todos los derechos de las obras pertenecen a sus autores
|
||||
</p>
|
||||
|
||||
Reference in New Issue
Block a user