Davron/ignum
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

home page parts

Browse Source
This commit is contained in:
nabijonovdavronbek619@gmail.com
2026-01-22 20:45:26 +05:00
parent ff10553786
commit ff21ccb2af
16 changed files with 579 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
components/pages/home/ourService.tsx Normal file
View File

@@ -0,0 +1,117 @@
import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
import { ChevronRight } from "lucide-react";
import Image from "next/image";
export function OurService() {
return (
<div className="bg-[#1e1d1c] py-10">
<div className="max-w-[1200px] w-full mx-auto">
{/* header */}
<div className="space-y-4">
<div className="flex items-center w-full justify-center gap-2 text-white font-bold">
<DotAnimatsiya />
OUR SERVICES
</div>
<div className="text-5xl tracking-[5px] font-bold bg-linear-to-br text-center w-full from-white via-white to-black text-transparent bg-clip-text">
FIREFIGHTER RESPONSIBILITIES
</div>
<div className="text-center w-full text-gray-400 max-w-[600px] mx-auto">
Aliquam lorem ante dapibus in viverra quis feugiat a tellus
phasellus viverra nulla ut metus varius laoreet quisque rutrum.
</div>
</div>
{/* cards */}
<div className="max-w-250 w-full mx-auto flex items-center gap-5 my-10">
<div className="relative space-y-4 py-6 px-8 rounded-xl w-[55%] bg-[linear-gradient(to_bottom_right,#000000,#000000,#000000,#d2610a)]">
<p className="font-bold bg-linear-to-br from-white via-white to-black text-transparent bg-clip-text">
Operation Force
</p>
<p className="text-gray-400 max-w-80 w-full">
Aliquam lorem ante dapibus in viverra feugiat phasellus.
</p>
<button className="text-[#dc2626] font-semibold flex items-center gap-2 text-sm">
LEARN MORE <ChevronRight size={20} />
</button>
<Image
src="/images/home/gruop.png"
alt="images"
width={200}
height={100}
className="object-contain absolute bottom-0 right-2 z-50"
/>
</div>
<div className="relative overflow-hidden space-y-4 py-6 px-8 rounded-xl w-[45%] bg-[linear-gradient(to_bottom_right,#000000,#000000,#000000,#d2610a)]">
<p className="font-bold bg-linear-to-br from-white via-white to-black text-transparent bg-clip-text">
Operation Force
</p>
<p className="text-gray-400 max-w-70 w-full">
Aliquam lorem ante dapibus in viverra feugiat phasellus.
</p>
<button className="text-[#dc2626] font-semibold flex items-center gap-2 text-sm">
LEARN MORE <ChevronRight size={20} />
</button>
<Image
src="/images/home/redShlang.png"
alt="images"
width={200}
height={100}
className="object-contain absolute -bottom-4 -right-4 z-50"
/>
</div>
</div>
<div className="max-w-250 flex items-start justify-between gap-5 mt-5 w-full mx-auto">
<div className="relative rounded-xl w-[40%] bg-[linear-gradient(to_bottom_right,#d2610a,#000000,#000000)]">
<Image
src="/images/home/ambulance.png"
alt="images"
width={300}
height={200}
className="object-contain mt-5"
/>
<div className="space-y-4 py-6 px-8">
<p className="font-bold bg-linear-to-br from-white via-white to-black text-transparent bg-clip-text">
Operation Force
</p>
<p className="text-gray-400 max-w-80 w-full">
Aliquam lorem ante dapibus in viverra feugiat phasellus.
</p>
<button className="text-[#dc2626] font-semibold flex items-center gap-2 text-sm">
LEARN MORE <ChevronRight size={20} />
</button>
</div>
</div>
<div className="w-[60%]">
<div className="relative overflow-hidden space-y-4 py-6 px-8 rounded-xl w-full bg-[linear-gradient(to_bottom_right,#000000,#000000,#000000,#d2610a)]">
<p className="font-bold bg-linear-to-br from-white via-white to-black text-transparent bg-clip-text">
Operation Force
</p>
<p className="text-gray-400 max-w-70 w-full">
Aliquam lorem ante dapibus in viverra feugiat phasellus.
</p>
<button className="mt-38 text-[#dc2626] font-semibold flex items-center gap-2 text-sm">
LEARN MORE <ChevronRight size={20} />
</button>
<Image
src="/images/home/balon.png"
alt="images"
width={200}
height={100}
className="object-contain absolute -bottom-40 -right-4 z-50"
/>
</div>
<div className="py-8 px-8 rounded-xl mt-5 w-full p-5 bg-[linear-gradient(to_top_right,#000000,#000000,#d2610a)] flex items-center justify-between">
<h2 className="text-3xl font-semibold font-armanai text-white">
View more service
</h2>
<button className="shadow-[0px_0px_2px_6px_#a60404ad] bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 w-fit">
GET STARTED
</button>
</div>
</div>
</div>
</div>
</div>
);
}