feat: add sponsors section to homepage with new sponsor data and assets
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
import { HomeHero } from "@/components/home-hero";
|
import { HomeHero } from "@/components/home-hero";
|
||||||
import { HomeVideosSection } from "@/components/home-videos-section";
|
import { HomeVideosSection } from "@/components/home-videos-section";
|
||||||
import { ReferencesSection } from "@/components/references-section";
|
import { ReferencesSection } from "@/components/references-section";
|
||||||
|
import { SponsorsSection } from "@/components/sponsors-section";
|
||||||
import { getHomeBlogNews } from "@/data/blog";
|
import { getHomeBlogNews } from "@/data/blog";
|
||||||
|
|
||||||
export default async function Home() {
|
export default async function Home() {
|
||||||
@@ -11,6 +12,7 @@ export default async function Home() {
|
|||||||
<HomeHero news={homeNews} />
|
<HomeHero news={homeNews} />
|
||||||
<ReferencesSection />
|
<ReferencesSection />
|
||||||
<HomeVideosSection />
|
<HomeVideosSection />
|
||||||
|
<SponsorsSection />
|
||||||
</section>
|
</section>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,44 @@
|
|||||||
|
import Image from "next/image";
|
||||||
|
import Link from "next/link";
|
||||||
|
import { Card } from "poyraz-ui/atoms";
|
||||||
|
import { SPONSORS } from "@/data/sponsors";
|
||||||
|
|
||||||
|
export function SponsorsSection() {
|
||||||
|
if (!SPONSORS || SPONSORS.length === 0) return null;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section>
|
||||||
|
<div className="grid grid-cols-2 justify-start gap-4 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6">
|
||||||
|
{SPONSORS.map((sponsor) => {
|
||||||
|
const logoContent = (
|
||||||
|
<Card className="flex h-20 w-full items-center justify-center rounded-sm border-border bg-card p-4 transition-all hover:bg-accent hover:shadow-sm">
|
||||||
|
<div className="relative h-full w-full grayscale transition-all duration-300 hover:grayscale-0">
|
||||||
|
<Image
|
||||||
|
src={sponsor.logo}
|
||||||
|
alt={sponsor.name}
|
||||||
|
fill
|
||||||
|
className="object-contain"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
|
||||||
|
if (sponsor.websiteUrl) {
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
key={sponsor.id}
|
||||||
|
href={sponsor.websiteUrl}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>
|
||||||
|
{logoContent}
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return <div key={sponsor.id}>{logoContent}</div>;
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
export type Sponsor = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
job: string;
|
||||||
|
logo: string;
|
||||||
|
websiteUrl?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const SPONSORS: Sponsor[] = [
|
||||||
|
{
|
||||||
|
id: "hostinger",
|
||||||
|
name: "Hostinger",
|
||||||
|
job: "Web Hosting",
|
||||||
|
logo: "/sponsors/hostinger.png",
|
||||||
|
websiteUrl: "https://hostinger.com",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "testsprite",
|
||||||
|
name: "TestSprite",
|
||||||
|
job: "Yazılım Test Otomasyonu",
|
||||||
|
logo: "/sponsors/testsprite.png",
|
||||||
|
websiteUrl: "https://testsprite.com",
|
||||||
|
},
|
||||||
|
];
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Reference in New Issue
Block a user