45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { motion } from "framer-motion";
|
|
import React from "react";
|
|
|
|
import { VideoText } from "@/components/magicui/video-text";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Hero220Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Hero220 = ({ className }: Hero220Props) => {
|
|
return (
|
|
<section
|
|
className={cn(
|
|
"relative flex h-svh max-h-[1400px] min-h-[600px] w-full flex-col items-center justify-center overflow-hidden",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="absolute inset-0 bg-[url('/block-media/shadcnblocks/block/lummi/landscape6.jpeg')] bg-cover bg-top bg-no-repeat opacity-20" />
|
|
<div className="relative z-10 container flex w-full flex-col items-center justify-center">
|
|
<motion.div
|
|
initial={{ opacity: 0, scale: 1.1 }}
|
|
animate={{ opacity: 1, scale: 1 }}
|
|
transition={{ duration: 0.3, ease: "easeOut" }}
|
|
className="relative flex h-[220px] w-full max-w-5xl items-center sm:h-[250px]"
|
|
>
|
|
<VideoText
|
|
src="/block-media/shadcnblocks/block/landscape.mp4"
|
|
className="font-bold tracking-tighter"
|
|
fontFamily="IRANSansX, Tahoma, sans-serif"
|
|
fontWeight={700}
|
|
fontSize={18}
|
|
>
|
|
کامپوننتها
|
|
</VideoText>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Hero220 };
|