ayrisdev/mugladijitalmedya
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit: project completion with proper gitignore

Browse Source
This commit is contained in:
AyrisAI
2026-05-16 00:43:22 +03:00
commit e708ba2156
84 changed files with 11035 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
components/PartnersList.tsx Normal file
View File

@@ -0,0 +1,92 @@
"use client";
import { motion } from "framer-motion";
import DynamicLogo from "./DynamicLogo";
import Link from "next/link";
interface Partner {
id: number;
name: string;
logo?: string;
url?: string;
project_slug?: string;
}
export default function PartnersList({ partners }: { partners: Partner[] }) {
return (
<section className="py-24 px-6 md:px-12">
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 border-t border-l border-black/10">
{partners.map((partner, index) => {
const card = (
<motion.div
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true }}
transition={{ delay: index * 0.05 }}
className="p-4 md:p-8 border-r border-b border-black/10 flex items-center justify-center transition-all group relative bg-white/10 overflow-hidden cursor-pointer"
>
<div className="relative h-[140px] md:h-[180px] w-full overflow-hidden">
<motion.div
whileHover={{ y: "-50%" }}
transition={{ duration: 0.4, ease: [0.16, 1, 0.3, 1] }}
className="flex flex-col items-center h-[200%]"
>
{/* First state */}
<div className="h-1/2 w-full flex items-center justify-center opacity-70 group-hover:opacity-100 transition-all">
{partner.logo ? (
<DynamicLogo
src={partner.logo}
color="black"
width="100%"
height="100%"
size="140%"
/>
) : (
<span className="editorial-headline text-xl md:text-2xl text-black uppercase">
{partner.name}
</span>
)}
</div>
{/* Second state (Slot effect) */}
<div className="h-1/2 w-full flex items-center justify-center">
{partner.logo ? (
<DynamicLogo
src={partner.logo}
color="#ff5c00" // primary color
width="100%"
height="100%"
size="140%"
/>
) : (
<span className="editorial-headline text-xl md:text-2xl text-primary uppercase">
{partner.name}
</span>
)}
</div>
</motion.div>
</div>
{/* Subtle diagonal hover effect */}
<div className="absolute top-0 right-0 w-8 h-8 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none">
<div className="absolute top-0 right-0 w-px h-12 bg-black/5 rotate-[-45deg] origin-top-right" />
</div>
</motion.div>
);
if (partner.project_slug) {
return (
<Link key={partner.id} href={`/works/${partner.project_slug}`} className="block">
{card}
</Link>
);
}
return <div key={partner.id}>{card}</div>;
})}
</div>
</div>
</section>
);
}