feat(web): afegir footer ampliat amb tots els links i pagina 404

This commit is contained in:
2026-07-14 13:46:04 +02:00
parent ed0cef279a
commit 02e40dd383
2 changed files with 60 additions and 7 deletions
+18 -7
View File
@@ -5,16 +5,27 @@ interface Props {
}
const { lang: langProp } = Astro.props;
const lang: Lang = langProp ?? "ca";
const year = new Date().getFullYear();
---
<footer class="border-t border-stone-200 bg-stone-50 mt-16">
<div class="max-w-6xl mx-auto px-4 py-6 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2">
<p class="text-xs text-stone-600">{t(lang, "site.footer_note")}</p>
<p class="text-xs text-stone-500">
<a href="/metodologia" class="hover:text-orange-700 underline underline-offset-2">
{t(lang, "nav.methodology")}
</a>
· CC BY-SA 4.0
<div class="max-w-6xl mx-auto px-4 py-8">
<div class="flex flex-col md:flex-row md:items-start md:justify-between gap-6">
<div class="max-w-xl">
<p class="text-xs text-stone-600 leading-relaxed">{t(lang, "site.footer_note")}</p>
</div>
<nav class="text-xs text-stone-500 flex flex-wrap gap-x-4 gap-y-1" aria-label="Footer">
<a href="/mapa" class="hover:text-orange-700">{t(lang, "nav.map")}</a>
<a href="/illes" class="hover:text-orange-700">{t(lang, "nav.islands")}</a>
<a href="/dades" class="hover:text-orange-700">{t(lang, "nav.data")}</a>
<a href="/premsa" class="hover:text-orange-700">{t(lang, "nav.press")}</a>
<a href="/qui-som" class="hover:text-orange-700">{t(lang, "nav.about")}</a>
<a href="/metodologia" class="hover:text-orange-700">{t(lang, "nav.methodology")}</a>
</nav>
</div>
<p class="text-xs text-stone-500 mt-6">
© {year} Cases Tancades · CC BY-SA 4.0 ·
<a href="https://github.com/itziarZG/Vivienda" class="hover:text-orange-700 underline underline-offset-2">codi font</a>
</p>
</div>
</footer>
+42
View File
@@ -0,0 +1,42 @@
---
export const prerender = false;
import Base from "../layouts/Base.astro";
import { getLangFromAstroCookies, t, type Lang } from "../i18n";
const lang: Lang = getLangFromAstroCookies(Astro.cookies);
const description = t(lang, "site.description");
---
<Base lang={lang} title="404" description={description}>
<section class="max-w-2xl mx-auto px-4 py-24 text-center">
<p class="text-8xl font-bold text-orange-700 mb-4">404</p>
<h1 class="text-2xl sm:text-3xl font-bold text-stone-900 mb-4">
{lang === "es" ? "Página no encontrada" : "Pàgina no trobada"}
</h1>
<p class="text-stone-600 mb-8 leading-relaxed">
{lang === "es"
? "La URL que buscas no existe o se ha movido. Aquí tienes algunos enlaces útiles:"
: "La URL que busques no existeix o s'ha mogut. Aquí tens alguns enllaços útils:"}
</p>
<div class="flex flex-col sm:flex-row gap-3 justify-center">
<a
href="/"
class="inline-flex items-center justify-center px-6 py-3 bg-orange-700 text-white font-medium rounded hover:bg-orange-800 transition-colors"
>
{t(lang, "nav.home")}
</a>
<a
href="/mapa"
class="inline-flex items-center justify-center px-6 py-3 border border-stone-300 text-stone-800 font-medium rounded hover:bg-stone-100 transition-colors"
>
{t(lang, "nav.map")}
</a>
<a
href="/metodologia"
class="inline-flex items-center justify-center px-6 py-3 border border-stone-300 text-stone-800 font-medium rounded hover:bg-stone-100 transition-colors"
>
{t(lang, "nav.methodology")}
</a>
</div>
</section>
</Base>