update home page

This commit is contained in:
2026-06-18 16:32:31 +05:30
parent d9cc83aa82
commit 8e0d704438
57 changed files with 2813 additions and 301 deletions

View File

@@ -1,29 +1,29 @@
export function MarqueeStrip() {
interface MarqueeStripProps {
text?: string;
className?: string;
}
export function MarqueeStrip({
text = "Artificial Intelligence",
className = ""
}: MarqueeStripProps) {
const marqueeItems = Array.from({ length: 6 });
return (
<div className="relative z-10 mx-[-5px] mb-[-90px] mt-[20px] overflow-hidden bg-gradient-to-r from-[#45D0BD] to-[#44B6E9] py-[42px]" style={{ transform: "rotate(-2.07deg)" }}>
<div className="flex w-[200%] whitespace-nowrap">
{/* Marquee track 1 */}
<div className="animate-marquee flex gap-8">
{[...Array(6)].map((_, i) => (
<div key={i} className="flex items-center gap-8">
<span className="text-[60px] font-bold leading-none text-white" style={{ fontFamily: "var(--font-sora)" }}>
Artificial Intelligence
</span>
<span className="flex h-3 w-3 rounded-full bg-white opacity-50" />
</div>
))}
</div>
{/* Marquee track 2 (seamless loop) */}
<div className="animate-marquee flex gap-8">
{[...Array(6)].map((_, i) => (
<div key={`dup-${i}`} className="flex items-center gap-8">
<span className="text-[60px] font-bold leading-none text-white" style={{ fontFamily: "var(--font-sora)" }}>
Artificial Intelligence
</span>
<span className="flex h-3 w-3 rounded-full bg-white opacity-50" />
</div>
))}
</div>
<div className={`relative z-10 mx-[-5px] mb-[-90px] mt-[20px] overflow-hidden bg-gradient-to-r from-aiero-teal to-aiero-blue py-[42px] ${className}`} style={{ transform: "rotate(-2.07deg)" }}>
<div className="marquee-track flex w-max whitespace-nowrap">
{[0, 1].map((track) => (
<div key={track} className="flex shrink-0 items-center">
{marqueeItems.map((_, i) => (
<div key={`${track}-${i}`} className="flex items-center gap-8 pr-8">
<span className="marquee-text text-white" style={{ fontFamily: "var(--font-sora)" }}>
{text}
</span>
<span className="flex h-3 w-3 rounded-full bg-white opacity-50" />
</div>
))}
</div>
))}
</div>
</div>
);