48 lines
1.6 KiB
JavaScript
48 lines
1.6 KiB
JavaScript
import Image from 'next/image'
|
|
|
|
import { Button } from '@/components/Button'
|
|
import { Container } from '@/components/Container'
|
|
|
|
|
|
export function Logos() {
|
|
return (
|
|
<Container>
|
|
<div className="relative z-10 pt-10">
|
|
<p className="mt-10 font-display text-large lg:text-2xl font-semibold italic text-slate-900">
|
|
As seen and featured on
|
|
</p>
|
|
<ul
|
|
role="list"
|
|
className="mt-8 flex items-center flex-wrap justify-center gap-x-8 sm:flex-col sm:gap-x-0 sm:gap-y-10 xl:flex-row xl:gap-x-12 xl:gap-y-0"
|
|
>
|
|
{[
|
|
[
|
|
{ name: 'CNN', logo: '/images/logos/1.svg' },
|
|
{ name: 'HLS', logo: '/images/logos/2.svg' },
|
|
{ name: 'Bookretreats', logo: '/images/logos/3.svg' },
|
|
],
|
|
[
|
|
{ name: 'Beaviajera', logo: '/images/logos/4.svg' },
|
|
{ name: 'Egytalloyd', logo: '/images/logos/5.svg' },
|
|
{ name: 'AST', logo: '/images/logos/6.svg' },
|
|
],
|
|
].map((group, groupIndex) => (
|
|
<li key={groupIndex}>
|
|
<ul
|
|
role="list"
|
|
className="flex flex-col items-center gap-y-8 sm:flex-row sm:gap-x-12 sm:gap-y-0"
|
|
>
|
|
{group.map((company) => (
|
|
<li key={company.name} className="flex">
|
|
<Image src={company.logo} alt={company.name} width={120} height={40} unoptimized />
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</Container>
|
|
)
|
|
}
|