Compare commits

..

6 Commits

Author SHA1 Message Date
peter e30f6e8b07 rounded
continuous-integration/drone Build is passing
2026-03-31 18:39:42 +01:00
peter b306fdad2c remove rounded 2026-03-31 18:39:35 +01:00
peter 0bc0149aa5 remove roundness 2026-03-31 18:39:22 +01:00
peter daa8bbac58 remove roundness 2026-03-31 18:39:01 +01:00
peter 07ac26270a change image container 2026-03-31 16:55:38 +01:00
peter 2d7da9f546 change header color 2026-03-30 11:46:59 +01:00
4 changed files with 21 additions and 28 deletions
+6 -13
View File
@@ -67,13 +67,6 @@ const destaques = [
date: "23 Mar 2025", date: "23 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: "TECNOLOGIA",
catColor: "text-violet-600",
title: "Novos dispositivos chegam às lojas com foco em sustentabilidade.",
date: "23 Mar 2025",
img: "https://images.unsplash.com/photo-1518770660439-4636190af475?w=600&q=80",
},
]; ];
const recentes = [ const recentes = [
@@ -137,14 +130,14 @@ export function TvoneDestaques() {
return ( return (
<section className="mx-auto w-full max-w-[1200px] px-4 pb-10"> <section className="mx-auto w-full max-w-[1200px] px-4 pb-10">
<h2 className="mb-6 text-2xl font-bold tracking-tight text-neutral-900 md:text-2xl">Destaques</h2> <h2 className="mb-6 text-2xl font-bold tracking-tight text-neutral-900 md:text-2xl">Destaques</h2>
<div className="grid gap-5 sm:grid-cols-2 lg:grid-cols-4"> <div className="grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
{destaques.map((item) => ( {destaques.map((item) => (
<article <article
key={item.title} key={item.title}
className="group overflow-hidden rounded-xl border border-neutral-200/80 bg-white shadow-sm transition hover:shadow-md" className="group overflow-hidden bg-white transition "
> >
<Link href="#" className="block"> <Link href="#" className="block">
<div className="relative aspect-[4/3] w-full overflow-hidden"> <div className="relative aspect-[16/9] w-full overflow-hidden">
<Image <Image
src={item.img} src={item.img}
alt="" alt=""
@@ -153,7 +146,7 @@ export function TvoneDestaques() {
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 25vw" sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 25vw"
/> />
</div> </div>
<div className="p-4"> <div className="py-4">
<p className={`mb-2 text-[11px] font-bold uppercase tracking-wide ${item.catColor}`}>{item.cat}</p> <p className={`mb-2 text-[11px] font-bold uppercase tracking-wide ${item.catColor}`}>{item.cat}</p>
<h3 className="text-base font-bold leading-snug text-neutral-900 md:text-lg">{item.title}</h3> <h3 className="text-base font-bold leading-snug text-neutral-900 md:text-lg">{item.title}</h3>
<p className="mt-3 text-xs text-neutral-500">{item.date}</p> <p className="mt-3 text-xs text-neutral-500">{item.date}</p>
@@ -174,8 +167,8 @@ export function TvoneMainColumns() {
<ul className="flex flex-col gap-6"> <ul className="flex flex-col gap-6">
{recentes.map((item) => ( {recentes.map((item) => (
<li key={item.title}> <li key={item.title}>
<Link href="#" className="group flex gap-4 rounded-xl border border-transparent p-1 transition hover:border-neutral-200 hover:bg-neutral-50"> <Link href="#" className="group flex gap-4 p-1 transition">
<div className="relative h-24 w-28 shrink-0 overflow-hidden rounded-lg sm:h-28 sm:w-36"> <div className="relative h-25 w-38 shrink-0 overflow-hidden sm:h-45 sm:w-76">
<Image src={item.img} alt="" fill className="object-cover" sizes="144px" /> <Image src={item.img} alt="" fill className="object-cover" sizes="144px" />
</div> </div>
<div className="min-w-0 flex-1"> <div className="min-w-0 flex-1">
+2 -2
View File
@@ -37,7 +37,7 @@ export function TvoneHero() {
return ( return (
<section className="mx-auto w-full max-w-[1200px] px-4 py-6"> <section className="mx-auto w-full max-w-[1200px] px-4 py-6">
<div className="relative overflow-hidden rounded-xl shadow-[0_12px_40px_rgba(0,0,0,0.12)]"> <div className="relative overflow-hidden shadow-[0_12px_40px_rgba(0,0,0,0.12)]">
<div className="relative aspect-[21/9] min-h-[280px] w-full md:aspect-[2.4/1]"> <div className="relative aspect-[21/9] min-h-[280px] w-full md:aspect-[2.4/1]">
<Image <Image
src={slide.image} src={slide.image}
@@ -49,7 +49,7 @@ export function TvoneHero() {
/> />
<div className="absolute inset-0 bg-gradient-to-t from-black/75 via-black/25 to-transparent" /> <div className="absolute inset-0 bg-gradient-to-t from-black/75 via-black/25 to-transparent" />
<div className="absolute inset-0 flex flex-col justify-end p-6 md:p-10"> <div className="absolute inset-0 flex flex-col justify-end p-6 md:p-10">
<span className="mb-2 inline-flex w-fit rounded bg-[#7c3aed] px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-white"> <span className="mb-2 inline-flex w-fit bg-[#7c3aed] px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-white">
{slide.tag} {slide.tag}
</span> </span>
<h1 className="max-w-3xl text-balance text-2xl font-bold leading-tight text-white md:text-3xl lg:text-4xl"> <h1 className="max-w-3xl text-balance text-2xl font-bold leading-tight text-white md:text-3xl lg:text-4xl">
+1 -1
View File
@@ -153,7 +153,7 @@ export function TvonePromoStrip() {
return ( return (
<div <div
className="relative w-full overflow-hidden border-y border-neutral-200/80 bg-neutral-100 dark:border-neutral-700 dark:bg-neutral-900" className="relative w-full overflow-hidden bg-neutral-100 dark:bg-neutral-900"
role="region" role="region"
aria-roledescription="carrossel" aria-roledescription="carrossel"
aria-label={regionLabel} aria-label={regionLabel}
+11 -11
View File
@@ -4,13 +4,13 @@ import Link from "next/link";
import { useCallback, useEffect, useId, useRef, useState } from "react"; import { useCallback, useEffect, useId, useRef, useState } from "react";
const primaryNav = [ const primaryNav = [
{ label: "Notícias", href: "#" }, { label: "Famosos", href: "#" },
{ label: "Europa", href: "#" }, { label: "Música", href: "#" },
{ label: "Mundo", href: "#" }, { label: "Em Foco", href: "#" },
{ label: "Lifestyle", href: "#" },
{ label: "Desporto", href: "#" }, { label: "Desporto", href: "#" },
{ label: "Economia", href: "#" }, { label: "Galaria", href: "#" },
{ label: "Cultura", href: "#" }, { label: "Contactos", href: "#" },
{ label: "Ciência", href: "#" },
]; ];
const secondaryNav = [ const secondaryNav = [
@@ -118,7 +118,7 @@ export function TvoneSiteNav() {
<div className="sticky top-0 z-50"> <div className="sticky top-0 z-50">
<nav <nav
className={`border-b border-white/15 bg-[#0066D4] pt-[env(safe-area-inset-top)] text-white transition-shadow duration-200 ${ className={`border-b border-white/15 bg-[#0066d3] pt-[env(safe-area-inset-top)] text-white transition-shadow duration-200 ${
navIsStuck ? "shadow-[0_4px_16px_rgba(0,0,0,0.18)]" : "shadow-none" navIsStuck ? "shadow-[0_4px_16px_rgba(0,0,0,0.18)]" : "shadow-none"
}`} }`}
aria-label="Navegação principal" aria-label="Navegação principal"
@@ -137,18 +137,18 @@ export function TvoneSiteNav() {
</button> </button>
<Link href="/" className="flex shrink-0 items-center gap-2 py-1.5 text-white" onClick={closeMenu}> <Link href="/" className="flex shrink-0 items-center gap-2 py-1.5 text-white" onClick={closeMenu}>
<span className="flex h-9 w-9 items-center justify-center rounded-full bg-white text-xs font-bold tracking-tight text-[#0066D4] sm:h-10 sm:w-10 sm:text-sm md:h-11 md:w-11"> <span className="flex h-9 w-9 items-center justify-center rounded-full bg-white text-xs font-bold tracking-tight text-[#0066d3] sm:h-10 sm:w-10 sm:text-sm md:h-11 md:w-11">
tv tv
</span> </span>
<span className="text-xl font-bold tracking-tight sm:text-2xl">tvone</span> <span className="text-xl font-bold tracking-tight sm:text-2xl">tvone</span>
</Link> </Link>
<ul className="hidden min-w-0 flex-1 items-center justify-center gap-0.5 lg:flex xl:gap-1"> <ul className="hidden min-w-0 flex-1 items-center justify-center gap-4 lg:flex xl:gap-4">
{primaryNav.map((item) => ( {primaryNav.map((item) => (
<li key={item.label}> <li key={item.label}>
<Link <Link
href={item.href} href={item.href}
className="block whitespace-nowrap rounded-md px-2 py-2.5 text-[13px] font-semibold uppercase tracking-wide text-white/95 transition hover:bg-white/10 xl:px-2.5 xl:text-[14px]" className="block whitespace-nowrap rounded-md px-2 py-2.5 text-[10px] font-semibold uppercase tracking-wide text-white/95 transition hover:bg-white/10 xl:px-2.5 xl:text-[14px]"
> >
{item.label} {item.label}
</Link> </Link>
@@ -202,7 +202,7 @@ export function TvoneSiteNav() {
/> />
<div <div
id={menuId} id={menuId}
className="fixed right-0 left-0 z-50 max-h-[min(75dvh,calc(100dvh-52px-env(safe-area-inset-top,0px)))] overflow-y-auto rounded-b-xl border-b border-white/15 bg-[#0066D4] shadow-xl top-[calc(env(safe-area-inset-top,0px)+52px)] sm:top-[calc(env(safe-area-inset-top,0px)+58px)] sm:max-h-[min(75dvh,calc(100dvh-58px-env(safe-area-inset-top,0px)))] md:top-[calc(env(safe-area-inset-top,0px)+64px)] md:max-h-[min(75dvh,calc(100dvh-64px-env(safe-area-inset-top,0px)))] lg:hidden" className="fixed right-0 left-0 z-50 max-h-[min(75dvh,calc(100dvh-52px-env(safe-area-inset-top,0px)))] overflow-y-auto rounded-b-xl border-b border-white/15 bg-[#0066d3] shadow-xl top-[calc(env(safe-area-inset-top,0px)+52px)] sm:top-[calc(env(safe-area-inset-top,0px)+58px)] sm:max-h-[min(75dvh,calc(100dvh-58px-env(safe-area-inset-top,0px)))] md:top-[calc(env(safe-area-inset-top,0px)+64px)] md:max-h-[min(75dvh,calc(100dvh-64px-env(safe-area-inset-top,0px)))] lg:hidden"
role="dialog" role="dialog"
aria-modal="true" aria-modal="true"
aria-label="Menu" aria-label="Menu"