feat: sponsor logos in footer, fix Corbins Runners web link

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-17 15:09:20 +02:00
parent 50a9ca2c39
commit c1922140a9
2 changed files with 36 additions and 77 deletions
-36
View File
@@ -760,42 +760,6 @@ export default function HomePage() {
<TrustSection /> <TrustSection />
{/* ─── PATROCINADORS ────────────────────────────────────── */}
<section className="max-w-6xl mx-auto px-4 sm:px-6 py-12 border-t border-dark-border">
<p className="text-xs text-slate-500 uppercase tracking-widest text-center mb-10">Amb el suport de</p>
<div className="flex flex-col items-center gap-10">
<div className="flex flex-col items-center gap-2">
<span className="text-[10px] text-slate-600 uppercase tracking-widest">Patrocinador principal</span>
<Image
src="/assets/finques-prats.png"
alt="Finques Prats"
width={220}
height={110}
className="object-contain"
/>
</div>
<div className="flex flex-col items-center gap-4">
<span className="text-[10px] text-slate-600 uppercase tracking-widest">Col·laboradors</span>
<div className="flex flex-wrap justify-center items-center gap-10">
<Image
src="/assets/runners-corbins.png"
alt="Corbins Runners"
width={160}
height={90}
className="object-contain"
/>
<Image
src="/assets/ajuntament-de-corbins.png"
alt="Ajuntament de Corbins"
width={110}
height={110}
className="object-contain brightness-90"
/>
</div>
</div>
</div>
</section>
{/* CTA if nothing selected yet */} {/* CTA if nothing selected yet */}
{!selectedProduct && ( {!selectedProduct && (
<div className="text-center py-8 pb-16"> <div className="text-center py-8 pb-16">
+36 -41
View File
@@ -12,8 +12,8 @@ const SPONSORS = [
{ {
name: 'Runners Corbins', name: 'Runners Corbins',
role: 'Partner', role: 'Partner',
instagram: 'https://www.instagram.com/runnerscorbins/', instagram: null,
web: null, web: 'https://cursacorbins.cat/',
highlight: false, highlight: false,
}, },
{ {
@@ -35,50 +35,45 @@ export default function Footer() {
Amb el suport de Amb el suport de
</p> </p>
</div> </div>
<div className="flex flex-wrap items-center justify-center gap-6 sm:gap-10"> {/* Patrocinador principal */}
{SPONSORS.map((s) => ( <div className="flex flex-col items-center gap-3 w-full">
<div key={s.name} className="flex flex-col items-center gap-2"> <span className="text-[10px] text-slate-600 uppercase tracking-widest">Patrocinador principal</span>
<div <a href="https://www.finquesprats.com" target="_blank" rel="noopener noreferrer" className="flex flex-col items-center gap-2 group">
className={`flex items-center gap-3 px-5 py-3 rounded-xl border transition-colors <Image src="/assets/finques-prats.png" alt="Finques Prats" width={200} height={80} className="object-contain opacity-80 group-hover:opacity-100 transition-opacity" />
${s.highlight <div className="flex items-center gap-2">
? 'border-teal/30 bg-teal/5 hover:bg-teal/10' <a href="https://www.instagram.com/finquesprats/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Instagram de Finques Prats">
: 'border-dark-border bg-dark-card hover:border-dark-muted' <Instagram size={15} />
}`} </a>
>
<span className={`font-bold text-sm ${s.highlight ? 'text-white' : 'text-slate-400'}`}>
{s.name}
</span>
{s.highlight && (
<span className="badge badge-teal text-[10px]">Patrocinador</span>
)}
</div> </div>
<div className="flex items-center gap-3"> </a>
{s.instagram && ( </div>
<a {/* Col·laboradors */}
href={s.instagram} <div className="flex flex-col items-center gap-3 w-full mt-4">
target="_blank" <span className="text-[10px] text-slate-600 uppercase tracking-widest">Col·laboradors</span>
rel="noopener noreferrer" <div className="flex flex-wrap justify-center items-center gap-10">
className="text-slate-600 hover:text-teal transition-colors" <div className="flex flex-col items-center gap-2">
aria-label={`Instagram de ${s.name}`} <a href="https://cursacorbins.cat/" target="_blank" rel="noopener noreferrer">
> <Image src="/assets/runners-corbins.png" alt="Corbins Runners" width={150} height={80} className="object-contain opacity-80 hover:opacity-100 transition-opacity" />
<Instagram size={16} /> </a>
<a href="https://cursacorbins.cat/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Web Corbins Runners">
<Globe size={15} />
</a>
</div>
<div className="flex flex-col items-center gap-2">
<a href="https://www.corbins.cat" target="_blank" rel="noopener noreferrer">
<Image src="/assets/ajuntament-de-corbins.png" alt="Ajuntament de Corbins" width={100} height={100} className="object-contain opacity-80 hover:opacity-100 transition-opacity brightness-90" />
</a>
<div className="flex items-center gap-2">
<a href="https://www.instagram.com/viu_corbins/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Instagram Ajuntament de Corbins">
<Instagram size={15} />
</a> </a>
)} <a href="https://www.corbins.cat" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Web Ajuntament de Corbins">
{s.web && ( <Globe size={15} />
<a
href={s.web}
target="_blank"
rel="noopener noreferrer"
className="text-slate-600 hover:text-teal transition-colors"
aria-label={`Web de ${s.name}`}
>
<Globe size={16} />
</a> </a>
)} </div>
</div> </div>
</div> </div>
))} </div>
</div>
</div> </div>
{/* Bottom bar */} {/* Bottom bar */}