Files
kakawa/src/components/spotlight.tsx
2024-09-24 12:47:02 +05:30

49 lines
1.9 KiB
TypeScript

// components/Spotlight.tsx
import Image from 'next/image';
const logos = [
{ src: '/images/logo.png', alt: 'TOI' }, // Replace with actual logo path
{ src: '/images/logo.png', alt: 'The Tribune' }, // Replace with actual logo path
{ src: '/images/logo.png', alt: 'ET' }, // Replace with actual logo path
{ src: '/images/logo.png', alt: 'The Hindu' }, // Replace with actual logo path
];
// { src: '/images/logos/toi-logo.png', alt: 'TOI' }, // Replace with actual logo path
// { src: '/images/logos/tribune-logo.png', alt: 'The Tribune' }, // Replace with actual logo path
// { src: '/images/logos/et-logo.png', alt: 'ET' }, // Replace with actual logo path
// { src: '/images/logos/hindu-logo.png', alt: 'The Hindu' }, // Replace with actual logo path
export function Spotlight() {
return (
<div className='flex flex-row justify-center items-center space-x-8 py-16'>
{logos.map((logo, index) => (
<div key={index} className='flex flex-col items-center'>
<div className='w-32 h-32 bg-white rounded-full shadow-lg flex items-center justify-center'>
<Image
src={logo.src}
alt={logo.alt}
width={80}
height={80}
className='object-contain'
/>
</div>
</div>
))}
</div>
);
}
// return (
// <div className="flex flex-col items-center py-16">
// <h2 className="text-3xl font-semibold mb-8">In the Spotlight</h2>
// <div className="flex justify-center space-x-8">
// {logos.map((logo, index) => (
// <div key={index} className="flex flex-col items-center">
// <div className="w-32 h-32 bg-white rounded-full shadow-lg flex items-center justify-center">
// <Image src={logo.src} alt={logo.alt} width={80} height={80} className="object-contain" />
// </div>
// </div>
// ))}
// </div>
// </div>
// );