181 lines
7.3 KiB
TypeScript
181 lines
7.3 KiB
TypeScript
import Image from "next/image";
|
|
import Text from "../lib_components/text";
|
|
import {
|
|
FaFacebookF,
|
|
FaTwitter,
|
|
FaLinkedinIn,
|
|
FaTelegramPlane,
|
|
FaPhone,
|
|
FaInstagram,
|
|
FaTelegram,
|
|
} from "react-icons/fa";
|
|
import { Ekxkavator_vektor, logoImg } from "@/assets";
|
|
import { FaLocationDot } from "react-icons/fa6";
|
|
|
|
// for gitea
|
|
|
|
export default function Footer() {
|
|
return (
|
|
<div dir="ltr" className="bg-primary relative">
|
|
<div className="max-w-[1200px] flex items-start justify-between w-full mx-auto pt-10 px-5">
|
|
<div className="flex flex-wrap items-start justify-between lg:gap-15 gap-10">
|
|
<div>
|
|
{/* logo */}
|
|
<div className="flex items-center gap-4">
|
|
<Image src={logoImg} alt="logo image" width={100} height={100} />
|
|
<p className="text-white text-2xl font-bold">SPES-TEXNIKA</p>
|
|
</div>
|
|
<div className="leading-[28px] text-white text-xl max-w-[430px] w-full mt-8">
|
|
<Text txt="footer-p" />
|
|
</div>
|
|
<div className="flex flex-col items-start gap-4 mt-10 ">
|
|
<div className="text-white text-xl font-semibold">
|
|
<Text txt="subscribe" />
|
|
</div>
|
|
<div className=" flex items-center justify-center gap-2">
|
|
<a
|
|
href="https://www.facebook.com/"
|
|
className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
|
|
>
|
|
<FaFacebookF />
|
|
</a>
|
|
<a
|
|
href="https://x.com/"
|
|
className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
|
|
>
|
|
<FaTwitter />
|
|
</a>
|
|
<a
|
|
href="https://www.linkedin.com/in/davron-chetin-959833246/"
|
|
className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
|
|
>
|
|
<FaLinkedinIn />
|
|
</a>
|
|
<a
|
|
href="https://t.me/@ndx_09"
|
|
className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
|
|
>
|
|
<FaTelegramPlane />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-5">
|
|
<div className="text-white text-2xl font-bold">
|
|
<Text txt="links" />
|
|
</div>
|
|
<div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
|
|
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
|
|
<Text txt="products" />
|
|
</div>
|
|
<div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
|
|
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
|
|
<Text txt="news" />
|
|
</div>
|
|
<div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
|
|
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
|
|
<Text txt="contact" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col justify-start">
|
|
<div className="text-white text-2xl font-bold">
|
|
<Text txt="contact-info" />
|
|
</div>
|
|
<div className="flex items-center gap-4 my-3">
|
|
<span className="bg-secondary p-3 text-xl text-white ">
|
|
<FaPhone />
|
|
</span>
|
|
<div className="flex flex-col gap-2">
|
|
<p className="hover:cursor-pointer hover:text-secondary text-white">
|
|
+998 33 252 00 00
|
|
</p>
|
|
<p className="hover:cursor-pointer hover:text-secondary text-white">
|
|
+998 33 805 55 55
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center gap-4 my-3">
|
|
<span className="bg-secondary p-3 text-xl text-white ">
|
|
<FaLocationDot />
|
|
</span>
|
|
<div className="flex flex-col gap-2">
|
|
<p className="hover:cursor-pointer hover:text-secondary text-white">
|
|
Yakkasaroy,
|
|
</p>
|
|
<p className="hover:cursor-pointer hover:text-secondary text-white">
|
|
Toshkent
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className=" max-[1200px]:absolute z-10 bottom-30 right-5 group flex flex-col items-end justify-end pt-15">
|
|
<div className="group relative">
|
|
<a
|
|
href="https://t.me/@ndx_09"
|
|
className="
|
|
flex gap-1 items-center text-white text-xl
|
|
opacity-0 translate-x-8 pointer-events-none
|
|
group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
|
|
transition-all duration-1000 ease-in-out delay-800 hover:cursor-pointer
|
|
"
|
|
>
|
|
<p className="bg-[#0e76a8] p-2 rounded-[8px]">Telegram</p>
|
|
<span className="rounded-full p-2 bg-[#0e76a8] ml-2">
|
|
<FaTelegram />
|
|
</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div className="group relative my-2 ">
|
|
<a href="https://instagram.com/temur_wariors"
|
|
className="
|
|
flex gap-1 items-center text-white text-xl
|
|
opacity-0 translate-x-6 pointer-events-none
|
|
group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
|
|
transition-all duration-500 ease-in-out delay-600 hover:cursor-pointer
|
|
"
|
|
>
|
|
<p className="bg-[#00900c] p-2 rounded-[8px] bg-linear-to-tr from-[#feda75] via-[#cc2980] to-[#9a2eba] ">
|
|
Instagram
|
|
</p>
|
|
<span className="bg-linear-to-tr from-[#feda75] via-[#cc2980] to-[#9a2eba] rounded-[50%] p-2 ">
|
|
<FaInstagram />
|
|
</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div className="group relative">
|
|
<a href="tel:+998917412920"
|
|
className="
|
|
flex gap-1 items-center text-white text-xl
|
|
opacity-0 translate-x-2 pointer-events-none
|
|
group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
|
|
transition-all duration-100 ease-in-out delay-200 hover:cursor-pointer
|
|
"
|
|
>
|
|
<p className="bg-[#00900c] p-2 rounded-[8px]">Phone</p>
|
|
<span className="rounded-[50%] p-2 bg-[#00900c] ">
|
|
<FaPhone />
|
|
</span>
|
|
</a>
|
|
</div>
|
|
<Image
|
|
src={Ekxkavator_vektor}
|
|
width={90}
|
|
height={90}
|
|
className="mt-3 hover:cursor-pointer icon_animation rounded-[50%] object-cover"
|
|
alt="icon image"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className=" py-5 text-white border-t-[1px] text-center border-gray-500 mt-20">
|
|
Ismoiljon Mirabdullayev © 2025. All rights reserved.
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|