Fix banner visibility, rotation timers, and logo distortion

This commit is contained in:
Carlos (Almeira) 2026-07-09 09:52:54 -05:00
parent c0926a3857
commit a17f989ba1
4 changed files with 14 additions and 8 deletions

View File

@ -15,7 +15,7 @@ export default async function LoginPage() {
<div className="p-8">
<div className="flex flex-col items-center justify-center text-center mb-8 relative z-10">
{entity?.logotipo ? (
<img src={entity.logotipo} alt={entity?.razon_social || "Logo"} className="h-20 w-auto object-contain mb-4 drop-shadow-[0_0_15px_rgba(255,255,255,0.1)]" />
<img src={entity.logotipo} alt={entity?.razon_social || "Logo"} className="h-20 w-auto max-w-full shrink-0 object-contain mb-4 drop-shadow-[0_0_15px_rgba(255,255,255,0.1)]" />
) : (
<div className="bg-gradient-to-br from-cyan-500 to-blue-600 p-4 rounded-2xl text-white shadow-lg mb-4 border border-white/20">
<Radio size={32} className="animate-pulse" />

View File

@ -30,9 +30,11 @@ function ClientCarouselGroup({ eslogan, ads, rotationSeconds }: { eslogan: strin
useEffect(() => {
if (!ads || ads.length <= 1) return;
const delay = (rotationSeconds && rotationSeconds > 0) ? rotationSeconds * 1000 : 5000;
const interval = setInterval(() => {
setCurrentIndex(prev => (prev + 1) % ads.length);
}, rotationSeconds * 1000);
}, delay);
return () => clearInterval(interval);
}, [ads, rotationSeconds]);
@ -81,6 +83,7 @@ function ClientCarouselGroup({ eslogan, ads, rotationSeconds }: { eslogan: strin
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
key={activeAd.$id}
src={imgUrl}
alt={activeAd.titulo}
className="w-full h-full object-cover animate-fade-in"

View File

@ -42,9 +42,9 @@ export const Navbar = ({ entity }: { entity?: any }) => {
{/* Brand Logo Holográfico */}
<Link href="/" className="flex items-center gap-3 group">
{entity?.logotipo ? (
<div className="relative">
<div className="relative flex items-center shrink-0">
<div className="absolute inset-0 bg-transparent blur-md opacity-50 group-hover:opacity-100 transition-opacity rounded-xl"></div>
<img src={entity.logotipo} alt={entity?.razon_social || "Logo"} className="h-10 w-auto object-contain relative z-10 group-hover:scale-105 transition-transform drop-shadow-lg" />
<img src={entity.logotipo} alt={entity?.razon_social || "Logo"} className="h-10 md:h-12 w-auto max-w-[180px] md:max-w-[240px] object-contain relative z-10 group-hover:scale-105 transition-transform drop-shadow-lg shrink-0" />
</div>
) : (
<div className="relative">

View File

@ -11,9 +11,11 @@ export default function TopBanner({ initialBanners, rotationSeconds }: { initial
useEffect(() => {
if (!initialBanners || initialBanners.length <= 1) return;
const delay = (rotationSeconds && rotationSeconds > 0) ? rotationSeconds * 1000 : 5000;
const interval = setInterval(() => {
setCurrentIndex(prev => (prev + 1) % initialBanners.length);
}, rotationSeconds * 1000);
}, delay);
return () => clearInterval(interval);
}, [initialBanners, rotationSeconds]);
@ -51,17 +53,18 @@ export default function TopBanner({ initialBanners, rotationSeconds }: { initial
};
return (
<div className="w-full relative h-[120px] md:h-[180px] lg:h-[220px] bg-slate-900 border-b border-cyan-500/30 overflow-hidden group">
<div className="w-full relative bg-slate-900 border-b border-cyan-500/30 overflow-hidden group">
{/* Metric Impression Observer resets key on change to fire new impression */}
<MetricObserver key={activeBanner.$id} postId={activeBanner.$id} />
<div onClick={recordClickAndGo} className={`w-full h-full ${activeBanner.url_destino ? 'cursor-pointer' : ''}`}>
<div onClick={recordClickAndGo} className={`w-full h-auto flex ${activeBanner.url_destino ? 'cursor-pointer' : ''}`}>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
key={activeBanner.$id}
src={imgUrl}
alt={activeBanner.titulo}
className="w-full h-full object-cover animate-fade-in"
className="w-full h-auto object-contain animate-fade-in"
/>
{activeBanner.url_destino && (