From 9c9d5dbc2c257885f59b1a089262f7977550517c Mon Sep 17 00:00:00 2001
From: Davron Chetin <nabijonovdavronbek619@gmail.com>
Date: Wed, 8 Oct 2025 19:09:54 +0500
Subject: [PATCH] contact

---
 app/globals.css                  | 15 ++++++++
 app/page.tsx                     |  6 ++++
 components/nav_foot/footer.tsx   | 59 ++++++++++++++++++++++++++++++++
 components/pageParts/contact.tsx | 24 +++++++++++++
 4 files changed, 104 insertions(+)
 create mode 100644 components/nav_foot/footer.tsx
 create mode 100644 components/pageParts/contact.tsx

diff --git a/app/globals.css b/app/globals.css
index 6018852..33f2de3 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -32,3 +32,18 @@ body {
   transition: 0.1s ease-in-out all;
   font-family: "Roboto", sans-serif;
 }
+
+/* 🟠 Sariq blok trapezoid shakl */
+.clip-trapezoid {
+  clip-path: polygon(16% 0, 100% 0, 84% 100%, 0% 100%);
+}
+
+/* Input blokining shakli */
+.clip-input {
+  clip-path: polygon(16% 0, 100% 0, 84% 100%, 0% 100%);
+}
+
+/* Tugma blokining shakli */
+.clip-button {
+  clip-path: polygon(16% 0, 100% 0, 84% 100%, 0% 100%);
+}
diff --git a/app/page.tsx b/app/page.tsx
index 3571fd1..e8b8c34 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -7,6 +7,8 @@ import Offer from "@/components/pageParts/offer";
 import Faq from "@/components/pageParts/faq";
 import Partners from "@/components/pageParts/partners";
 import Map from "@/components/pageParts/map";
+import Contact from "@/components/pageParts/contact/contact";
+import Footer from "@/components/nav_foot/footer";
 
 export default function Home() {
   return (
@@ -21,6 +23,10 @@ export default function Home() {
       <Faq/>
       <Partners/>
       <Map/>
+      <section id="contact" className="my-20" >
+        <Contact/>
+      </section>
+      <Footer/>
     </div>
   );
 }
diff --git a/components/nav_foot/footer.tsx b/components/nav_foot/footer.tsx
new file mode 100644
index 0000000..c8a4d1c
--- /dev/null
+++ b/components/nav_foot/footer.tsx
@@ -0,0 +1,59 @@
+import Text from "../text";
+import { FaFacebookF , FaTwitter , FaLinkedinIn , FaTelegramPlane } from "react-icons/fa";
+
+export default function Footer() {
+  return (
+    <div dir="ltr" className="bg-primary">
+
+      <div className="max-w-[1200px] w-full mx-auto pt-10 ">
+
+        <div></div>
+        
+        <div className="flex items-center justify-between my-4 mt-10">
+          <div className="flex flex-col items-start gap-4 ">
+            <div className="text-white text-xl font-semibold">
+              <Text txt="subscribe" />
+            </div>
+            <div className="  flex items-center justify-center gap-2">
+              <a
+                href=""
+                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+              >
+                <FaFacebookF />
+              </a>
+              <a
+                href=""
+                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+              >
+                <FaTwitter />
+              </a>
+              <a
+                href=""
+                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+              >
+                <FaLinkedinIn />
+              </a>
+              <a
+                href=""
+                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+              >
+                <FaTelegramPlane />
+              </a>
+            </div>
+          </div>
+
+            <div>
+                
+            </div>
+
+        </div>
+
+      </div>
+
+      <div className=" py-5 text-white border-t-[1px] text-center border-gray-500">
+        Ismoiljon Mirabdullayev © 2025. All rights reserved.
+      </div>
+
+    </div>
+  );
+}
diff --git a/components/pageParts/contact.tsx b/components/pageParts/contact.tsx
new file mode 100644
index 0000000..ad86644
--- /dev/null
+++ b/components/pageParts/contact.tsx
@@ -0,0 +1,24 @@
+
+export default function Contact() {
+  return (
+    <section dir="ltr" className="relative w-full bg-primary py-10 flex justify-center">
+      <div className=" bg-secondary max-w-[1200px] w-full py-10 flex flex-col items-center clip-trapezoid">
+        <h2 className="text-2xl md:text-3xl font-bold text-primary mb-5 text-center">
+          Qo'ng'iroqni buyurtma qiling
+        </h2>
+
+        {/* Input va Button bloki */}
+        <div className="flex w-full max-w-2xl">
+          <input
+            type="text"
+            placeholder="Your phone number"
+            className="flex-1 py-3 px-5 bg-white text-gray-600 placeholder-gray-400 text-lg clip-input focus:outline-none"
+          />
+          <button className="bg-primary text-white px-6 py-3 text-lg font-medium clip-button">
+            Menga qo'ng'iroq qiling
+          </button>
+        </div>
+      </div>
+    </section>
+  );
+}