make it loog good

This commit is contained in:
2026-04-10 20:31:56 +01:00
parent 4c799f5cc5
commit ab3bf9e2bd
2 changed files with 56 additions and 33 deletions
+50 -31
View File
@@ -47,10 +47,11 @@ const footerSocialIconClass =
const destaques = [ const destaques = [
{ {
cat: "FAMOSOS", cat: "Musica",
catColor: "text-pink-600", catColor: "text-pink-600",
title: "Cerimónia reúne estrelas nacionais e internacionais em Lisboa.", title: "Cerimónia reúne estrelas nacionais e internacionais em Lisboa.",
date: "24 Mar 2025", date: "24 Mar 2025",
readTime: "24 Mar 2025",
img: "https://images.unsplash.com/photo-1524504388940-b1c1722653e1?w=600&q=80", img: "https://images.unsplash.com/photo-1524504388940-b1c1722653e1?w=600&q=80",
}, },
{ {
@@ -58,6 +59,7 @@ const destaques = [
catColor: "text-[#0066cc]", catColor: "text-[#0066cc]",
title: "Mercados reagem às novas projeções de crescimento para a região.", title: "Mercados reagem às novas projeções de crescimento para a região.",
date: "24 Mar 2025", date: "24 Mar 2025",
readTime: "24 Mar 2025",
img: "https://images.unsplash.com/photo-1518770660439-4636190af475?w=600&q=80", img: "https://images.unsplash.com/photo-1518770660439-4636190af475?w=600&q=80",
}, },
{ {
@@ -65,13 +67,15 @@ const destaques = [
catColor: "text-emerald-600", catColor: "text-emerald-600",
title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.", title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.",
date: "23 Mar 2025", date: "23 Mar 2025",
readTime: "24 Mar 2025",
img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=600&q=80", img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=600&q=80",
}, },
{ {
cat: "FAMOSOS", cat: "Musica",
catColor: "text-emerald-600", catColor: "text-emerald-600",
title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.", title: "Taça: equipa da casa garante lugar nas meias com exibição sólida.",
date: "23 Mar 2025", date: "23 Mar 2025",
readTime: "24 Mar 2025",
img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=600&q=80", img: "https://images.unsplash.com/photo-1574629810360-7efbbe195018?w=600&q=80",
}, },
]; ];
@@ -139,7 +143,7 @@ const aSeguir = [
export function TvoneDestaques() { export function TvoneDestaques() {
return ( return (
<section className="mx-auto w-full max-w-[1200px] px-4 pb-20"> <section className="mx-auto w-full max-w-[1200px] px-4 pb-10">
<div className="mb-10 flex items-end justify-between border-b border-neutral-100 pb-6"> <div className="mb-10 flex items-end justify-between border-b border-neutral-100 pb-6">
<h2 className="text-3xl font-bold tracking-tight text-neutral-900 md:text-4xl"> <h2 className="text-3xl font-bold tracking-tight text-neutral-900 md:text-4xl">
Destaques Destaques
@@ -182,22 +186,35 @@ export function TvoneDestaques() {
<div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-80" /> <div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-80" />
{/* NEW INTERNAL LABEL */} {/* NEW INTERNAL LABEL */}
<div className="absolute bottom-3 left-3 z-10"> {item.cat != 'Musica' && (
<span className="rounded-lg bg-black/50 px-2 py-1 text-[10px] font-bold uppercase tracking-widest text-white backdrop-blur-md border border-white/10"> <div className="absolute bottom-3 left-3 z-10">
{item.cat} <span className="rounded-lg bg-black/50 px-2 py-1 text-[10px] font-bold uppercase tracking-widest text-white backdrop-blur-md border border-white/10">
</span> {item.cat}
</div> </span>
</div>
)}
</div> </div>
{/* TEXT CONTENT (Simplified) */} {/* TEXT CONTENT (Simplified) */}
<div className="py-4"> <div className="mt-5 px-1">
<h3 className="line-clamp-2 text-[15px] font-bold leading-tight text-neutral-900 transition-colors group-hover:text-[#0066cc] md:text-[16px]">
{/* NEW INTERNAL LABEL */}
{item.cat == 'Musica' && (
<div className="flex items-center gap-3">
<span className="text-[10px] font-bold uppercase tracking-wider text-blue-600">{item.cat}</span>
<span className="h-1 w-1 rounded-full bg-neutral-300" />
<span className="text-[10px] font-semibold text-neutral-500 uppercase tracking-tight">{item.date}</span>
</div>
)}
<h3 className="mt-3 text-xl font-bold leading-snug text-neutral-900 group-hover:text-[#0066CC] transition-colors">
{item.title} {item.title}
</h3> </h3>
<div className="mt-2 flex items-center gap-2">
<p className="text-[11px] font-medium text-neutral-400">{item.date}</p>
</div>
</div> </div>
</Link> </Link>
</article> </article>
))} ))}
@@ -291,25 +308,27 @@ export function TvoneMainColumns() {
export function TvoneAdBanner() { export function TvoneAdBanner() {
return ( return (
<section className="mx-auto w-full max-w-[1200px] px-4 pb-20"> <section className="mx-auto w-full flex justify-center items-center px-4 pt-10 pb-10">
<div className="relative overflow-hidden rounded-xl bg-gradient-to-r from-[#0a4d8c] via-[#1e6fb8] to-[#e85c2a] px-6 py-8 text-white md:flex md:items-center md:justify-between md:py-10"> <div className="max-w-[1200px] w-full">
<div className="max-w-lg"> <div className="relative overflow-hidden rounded-xl bg-gradient-to-r from-[#0a4d8c] via-[#1e6fb8] to-[#e85c2a] px-6 py-8 text-white md:flex md:items-center md:justify-between md:py-10">
<p className="text-[11px] font-semibold uppercase tracking-widest text-white/90">BAI Directo</p> <div className="max-w-lg">
<h2 className="mt-2 text-3xl font-bold leading-tight tracking-tight md:text-4xl">Actualização do BAI Directo</h2> <p className="text-[11px] font-semibold uppercase tracking-widest text-white/90">BAI Directo</p>
<p className="mt-2 text-sm text-white/90">Faça as suas operações com mais rapidez e segurança em qualquer dispositivo.</p> <h2 className="mt-2 text-3xl font-bold leading-tight tracking-tight md:text-4xl">Actualização do BAI Directo</h2>
<p className="mt-2 text-sm text-white/90">Faça as suas operações com mais rapidez e segurança em qualquer dispositivo.</p>
</div>
<div className="relative mt-6 h-32 w-full max-w-xs shrink-0 md:mt-0 md:h-36">
<Image
src="https://images.unsplash.com/photo-1511707171634-5f897ff02aa9?w=400&q=80"
alt=""
fill
className="object-contain object-right"
sizes="320px"
/>
</div>
<span className="absolute right-6 top-1/2 hidden -translate-y-1/2 text-2xl font-black tracking-tight opacity-90 md:block">
BAI
</span>
</div> </div>
<div className="relative mt-6 h-32 w-full max-w-xs shrink-0 md:mt-0 md:h-36">
<Image
src="https://images.unsplash.com/photo-1511707171634-5f897ff02aa9?w=400&q=80"
alt=""
fill
className="object-contain object-right"
sizes="320px"
/>
</div>
<span className="absolute right-6 top-1/2 hidden -translate-y-1/2 text-2xl font-black tracking-tight opacity-90 md:block">
BAI
</span>
</div> </div>
</section> </section>
); );
+6 -2
View File
@@ -19,7 +19,9 @@ export default function Home() {
<TvoneSiteNav /> <TvoneSiteNav />
<TvoneHero /> <TvoneHero />
<TvoneDestaques /> <TvoneDestaques />
<TvoneAdBanner /> <div className="bg-[#f5f5f7] mb-10">
<TvoneAdBanner />
</div>
<TvoneMainColumns /> <TvoneMainColumns />
<TvoneNegocios /> <TvoneNegocios />
<TvoneEscolhaEditor /> <TvoneEscolhaEditor />
@@ -28,7 +30,9 @@ export default function Home() {
<TvoneDestaquesCultura /> <TvoneDestaquesCultura />
<TvoneEntrevistas /> <TvoneEntrevistas />
<TvoneAdBanner /> <div className=" mb-10">
<TvoneAdBanner />
</div>
<TvoneFooter /> <TvoneFooter />
</div> </div>
); );