footer navbar linkes change with work asyn lamguage

components/layout/footer.tsx

@@ -4,10 +4,12 @@ import React from "react";
 
 import { useState } from "react";
 import { Mail, Phone, MapPin } from "lucide-react";
-import { useTranslations } from "next-intl";
+import { useLocale, useTranslations } from "next-intl";
 import Image from "next/image";
+import Link from "next/link";
 
 export function Footer() {
+  const locale = useLocale();
   const t = useTranslations();
   const [email, setEmail] = useState("");
   const [subscribed, setSubscribed] = useState(false);
@@ -35,10 +37,10 @@ export function Footer() {
           <div className="rounded-2xl bg-[#fa1d1d] px-6 py-8 md:flex lg:flex-row flex-col max-lg:gap-5 md:items-center lg:justify-between justify-center md:px-10 md:py-12">
             <div className="mb-8 md:mb-0">
               <h2 className="font-unbounded text-2xl font-bold text-white md:text-3xl">
-                SUBSCRIBE OUR NEWSLETTER
+                {t("contactTitle")}
               </h2>
               <p className="font-almarai mt-2 text-gray-100">
-                Expect a friendly letter from us once a week. No spam.
+                {t("contactSubTitle")}
               </p>
             </div>
 
@@ -48,7 +50,7 @@ export function Footer() {
             >
               <input
                 type="email"
-                placeholder="Enter your email address"
+                placeholder={t("enterPhone")}
                 value={email}
                 onChange={(e) => setEmail(e.target.value)}
                 className="font-almarai flex-1 rounded-full bg-white px-6 py-3 text-gray-800 placeholder-gray-400 focus:outline-none md:w-64"
@@ -58,7 +60,7 @@ export function Footer() {
                 type="submit"
                 className="font-almarai rounded-full bg-gray-800 px-6 py-3 font-bold text-white transition hover:bg-gray-700"
               >
-                {subscribed ? "✓ Sent" : "SIGN UP"}
+                {subscribed ? "✓ Sent" : t("send")}
               </button>
             </form>
           </div>
@@ -94,27 +96,36 @@ export function Footer() {
               </h3>
               <ul className="space-y-3 text-gray-300">
                 <li>
-                  <a href="#home" className="font-almarai transition hover:text-[#fa1d1d]">
+                  <Link
+                    href={`/${locale}/home`}
+                    className="font-almarai transition hover:text-[#fa1d1d]"
+                  >
                     {t("footer.quickLinks.home")}
-                  </a>
+                  </Link>
                 </li>
                 <li>
-                  <a href="#about" className="font-almarai transition hover:text-[#fa1d1d]">
+                  <Link
+                    href={`/${locale}/about`}
+                    className="font-almarai transition hover:text-[#fa1d1d]"
+                  >
                     {t("footer.quickLinks.about")}
-                  </a>
+                  </Link>
                 </li>
                 <li>
-                  <a
+                  <Link
-                    href="#services"
+                    href={`/${locale}/services`}
                     className="font-almarai transition hover:text-[#fa1d1d]"
                   >
                     {t("footer.quickLinks.services")}
-                  </a>
+                  </Link>
                 </li>
                 <li>
-                  <a href="#blog" className="font-almarai transition hover:text-[#fa1d1d]">
+                  <Link
+                    href={`/${locale}/blog`}
+                    className="font-almarai transition hover:text-[#fa1d1d]"
+                  >
                     {t("footer.quickLinks.products")}
-                  </a>
+                  </Link>
                 </li>
               </ul>
             </div>
@@ -135,12 +146,14 @@ export function Footer() {
 
             {/* Contact */}
             <div>
-              <h3 className="font-unbounded uppercase mb-6 text-lg font-bold text-white">{t("footer.support.contact")}</h3>
+              <h3 className="font-unbounded uppercase mb-6 text-lg font-bold text-white">
+                {t("footer.support.contact")}
+              </h3>
               <ul className="font-almarai space-y-4 text-gray-300">
                 <li className="flex items-start gap-3">
                   <Phone className="mt-1 h-5 w-5 shrink-0 text-white" />
-                  <a href="tel:+1234567890" className="hover:text-[#fa1d1d]">
+                  <a href="tel:+998773722121" className="hover:text-[#fa1d1d]">
-                    +123-456-7890
+                    +998-77-372-21-21
                   </a>
                 </li>
                 <li className="flex items-start gap-3">

components/layout/navbar.tsx

@@ -4,9 +4,10 @@ import Link from "next/link";
 import { ChevronDown, Phone, Menu, X } from "lucide-react";
 import Image from "next/image";
 import LanguageSelectRadix from "../languageSwitcher";
-import { useTranslations } from "next-intl";
+import { useLocale, useTranslations } from "next-intl";
 
 export function Navbar() {
+  const locale = useLocale();
   const t = useTranslations();
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
@@ -37,7 +38,7 @@ export function Navbar() {
         <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
           <div className="flex justify-between items-center h-20">
             {/* Logo */}
-            <Link href="/" className="hover:cursor-pointer">
+            <Link href={`/${locale}/home`} className="hover:cursor-pointer">
               <div className="flex items-center gap-2">
                 <div className=" flex items-center justify-center">
                   <Image
@@ -54,13 +55,13 @@ export function Navbar() {
             {/* Desktop Navigation Menu */}
             <div className="hidden h-full lg:flex items-center gap-8">
               <Link
-                href="/"
+                href={`/${locale}/home`}
                 className="font-unbounded uppercase text-white text-sm h-full flex items-center font-semibold hover:cursor-pointer hover:text-red-500 transition"
               >
                 {t("navbar.home")}
               </Link>
               <Link
-                href="/about"
+                href={`/${locale}/about`}
                 className="font-unbounded uppercase text-white text-sm h-full flex items-center font-semibold hover:cursor-pointer hover:text-red-500 transition"
               >
                 {t("navbar.about")}
@@ -88,21 +89,21 @@ export function Navbar() {
                pointer-events-none group-hover:pointer-events-auto overflow-hidden"
                 >
                   <Link
-                    href="/faq"
+                    href={`/${locale}/faq`}
                     className="font-unbounded uppercase block px-4 py-2 text-black text-sm hover:bg-red-600 
                  hover:text-white transition-colors"
                   >
                     {t("navbar.faq")}
                   </Link>
                   <Link
-                    href="/services"
+                    href={`/${locale}/services`}
                     className="font-unbounded uppercase block px-4 py-2 text-black text-sm hover:bg-red-600 
                  hover:text-white transition-colors"
                   >
                     {t("navbar.services")}
                   </Link>
                   {/* <Link
-                    href="/blog"
+                    href={`/${locale}/blog`}
                     className="font-unbounded uppercase block px-4 py-2 text-black text-sm hover:bg-red-600 
                  hover:text-white transition-colors rounded-b-md"
                   >
@@ -112,13 +113,13 @@ export function Navbar() {
               </div>
 
               <Link
-                href="/products"
+                href={`/${locale}/products`}
                 className="font-unbounded uppercase text-white text-sm h-full flex items-center font-semibold hover:cursor-pointer hover:text-red-500 transition"
               >
                 {t("navbar.products")}
               </Link>
               <Link
-                href="/contact"
+                href={`/${locale}/contact`}
                 className="font-unbounded uppercase text-white text-sm h-full flex items-center font-semibold hover:cursor-pointer hover:text-red-500 transition"
               >
                 {t("navbar.contact")}
@@ -130,14 +131,16 @@ export function Navbar() {
               <LanguageSelectRadix />
 
               {/* Emergency Call Button - Hidden on mobile */}
-              <div className="hidden lg:flex items-center gap-3 bg-red-600 px-4 py-2 rounded-full">
+              <div className="hidden lg:flex items-center hover:cursor-pointer gap-3 px-4 py-2 rounded-full">
-                <Phone size={20} className="text-white" />
+                <span
+                  className="shrink-0 w-10 h-10 bg-red-600 rounded-full flex items-center justify-center
+                  shadow-[0_0_0px_4px_rgba(239,68,68,0.1)]"
+                >
+                  <Phone size={20} className="text-white" />
+                </span>
                 <div>
-                  <div className="font-unbounded uppercase text-white text-xs font-semibold">
-                    {t("navbar.emergency")}
-                  </div>
                   <div className="text-white text-sm font-bold">
-                    +123-456-7890
+                    <div>+998-98-099-21-21</div> <div>+998-77-372-21-21</div>
                   </div>
                 </div>
               </div>
@@ -173,7 +176,7 @@ export function Navbar() {
         {/* Mobile Menu Header */}
         <div className="flex justify-between items-center p-6 border-b border-gray-700">
           {/* Logo */}
-          <Link href="/" className="hover:cursor-pointer">
+          <Link href={`/${locale}/home`} className="hover:cursor-pointer">
             <div className="font-unbounded uppercase flex flex-col items-center text-2xl gap-2 text-white font-bold">
               <div className=" flex items-center justify-center">
                 <Image
@@ -197,14 +200,14 @@ export function Navbar() {
         {/* Mobile Menu Links */}
         <div className="flex flex-col p-6 gap-4">
           <Link
-            href="/"
+            href={`/${locale}/home`}
             className="font-unbounded uppercase text-white text-base font-semibold hover:text-red-500 transition py-2"
             onClick={() => setIsMobileMenuOpen(false)}
           >
             {t("navbar.home")}
           </Link>
           <Link
-            href="/about"
+            href={`/${locale}/about`}
             className="font-unbounded uppercase text-white text-base font-semibold hover:text-red-500 transition py-2"
             onClick={() => setIsMobileMenuOpen(false)}
           >
@@ -226,14 +229,14 @@ export function Navbar() {
             {isDropdownOpen && (
               <div className="ml-4 mt-2 flex flex-col gap-2">
                 <Link
-                  href="/faq"
+                  href={`/${locale}/faq`}
                   className="font-unbounded uppercase text-white/80 text-sm hover:text-red-500 transition py-2"
                   onClick={() => setIsMobileMenuOpen(false)}
                 >
                   {t("navbar.faq")}
                 </Link>
                 <Link
-                  href="/services"
+                  href={`/${locale}/services`}
                   className="font-unbounded uppercase text-white/80 text-sm hover:text-red-500 transition py-2"
                   onClick={() => setIsMobileMenuOpen(false)}
                 >
@@ -244,14 +247,14 @@ export function Navbar() {
           </div>
 
           <Link
-            href="/products"
+            href={`/${locale}/products`}
             className="font-unbounded uppercase text-white text-base font-semibold hover:text-red-500 transition py-2"
             onClick={() => setIsMobileMenuOpen(false)}
           >
             {t("navbar.products")}
           </Link>
           <Link
-            href="/contact"
+            href={`/${locale}/contact`}
             className="font-unbounded uppercase text-white text-base font-semibold hover:text-red-500 transition py-2"
             onClick={() => setIsMobileMenuOpen(false)}
           >

components/pages/contact/main.tsx

@@ -9,18 +9,18 @@ export function Contact() {
   const contactInfo = [
     {
       icon: Mail,
-      title:t("contact.email"),
+      title:t("contact.form.email"),
-      detail: t("contact.emailAddress"),
+      detail: t("contact.form.emailAddress"),
     },
     {
       icon: MapPin,
-      title: t("contact.location"),
+      title: t("contact.form.location"),
-      detail: t("contact.address"),
+      detail: t("contact.form.address"),
     },
     {
       icon: Phone,
-      title: t("contact.phone"),
+      title: t("contact.form.phone"),
-      detail: "+123-456-7890",
+      detail: "+998-77-372-21-21",
     },
   ];
 
@@ -40,7 +40,7 @@ export function Contact() {
           className="absolute inset-0"
           style={{
             background:
-              "radial-gradient(ellipse at bottom center, #d2610ab0 0%, #1e1d1ce3 70%)",
+              "radial-gradient(ellipse at bottom center, #d2610a 0%, #1e1d1ce9 70% , #1e1d1ce9 70%)",
           }}
         />
       </div>

components/pages/home/banner.tsx

@@ -67,17 +67,18 @@ export function Banner() {
             </div>
 
             {/* Right side - Text Content */}
-            <div className="lg:inline-block hidden space-y-6 text-white mb-20">
+            <div className="lg:inline-block hidden space-y-6 mb-20">
               {/* Badge */}
               <div className="flex items-center gap-2 w-fit">
                 <DotAnimatsiya />
-                <span className="text-sm font-semibold tracking-wide font-almarai">
+                <span className="text-sm font-semibold text-white tracking-wide font-almarai">
                   {t("home.banner.title1")}
                 </span>
               </div>
 
               {/* Main Heading */}
-              <h1 className="font-unbounded gradient-text text-4xl sm:text-5xl lg:text-6xl font-bold leading-tight text-pretty">
+              <h1 className="font-unbounded uppercase text-4xl bg-linear-to-br from-white via-white to-black
+  text-transparent bg-clip-text sm:text-5xl lg:text-6xl font-bold leading-tight text-pretty">
                 {t("home.banner.title2")}
               </h1>
 

components/pages/home/video.tsx

@@ -1,15 +1,27 @@
+import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
 import HomeMarquee from "@/components/HomeMarquee";
 import { Play } from "lucide-react";
+import { useTranslations } from "next-intl";
 
 export function Video() {
+  const t = useTranslations();
   return (
     <>
       <div
         className="bg-[#1e1d1c] bg-fixed max-sm:bg-center"
         style={{ backgroundImage: "url(/images/img7.jpg)" }}
       >
-        <div className="flex items-center justify-center bg-linear-to-t from-[#1e1d1c] to-[#1e1d1c02] h-80 w-full relative">
+        <div className="flex flex-col items-center justify-center bg-linear-to-t from-[#1e1d1c] to-[#1e1d1c02] h-80 w-full relative">
-          
+          <div className="flex items-center gap-2 w-fit text-white ">
+            <DotAnimatsiya />
+            <span className="text-sm font-semibold tracking-wide font-almarai">
+              {t("rasmlar")}
+            </span>
+          </div>
+          <h1 className="font-unbounded uppercase text-4xl bg-linear-to-br from-white via-white to-black
+  text-transparent bg-clip-text sm:text-5xl lg:text-6xl font-bold leading-tight text-pretty">
+            {t("fotogalereya")}
+          </h1>
         </div>
       </div>
       <div>

messages/en.json

@@ -217,5 +217,11 @@
       "contact": "Contact",
       "help": "Help"
     }
-  }
+  },
+  "rasmlar": "Images",
+  "fotogalereya": "Photo Gallery",
+  "contactTitle": "Send us your phone number",
+  "contactSubTitle": "Our staff will contact you",
+  "enterPhone": "Enter your phone number",
+  "send": "Send"
 }

messages/ru.json

@@ -217,5 +217,11 @@
       "contact": "Контакты",
       "help": "Помощь"
     }
-  }
+  },
+  "rasmlar": "Изображения",
+  "fotogalereya": "Фотогалерея",
+  "contactTitle": "Отправьте нам свой номер",
+  "contactSubTitle": "Наши сотрудники свяжутся с вами",
+  "enterPhone": "Введите ваш номер телефона",
+  "send": "Отправить"
 }

messages/uz.json

@@ -151,7 +151,7 @@
       "subtitle": "Ignum Texnologiyasi Tayyor",
       "description": "Biz nafaqat uskunalar yetkazib beramiz, balki har bir mijozning muvaffaqiyatli hamkoriga aylanamiz."
     },
-    "ourproducts":"Bizning mahsulotlarimiz"
+    "ourproducts": "Bizning mahsulotlarimiz"
   },
   "faq": {
     "banner": {
@@ -179,10 +179,10 @@
       "question": "Qanday ob'ektlar uchun mos?",
       "answer": "Ofis binalari, omborxonalar, sanoat korxonalari, savdo markazlari, turar-joy binolari va barcha turdagi jamoat joylari uchun mos yechimlarimiz mavjud."
     },
-    "ask":{
+    "ask": {
-      "question":"Hali ham savolingiz bormi?",
+      "question": "Hali ham savolingiz bormi?",
-      "subtitle":"Bizga bo'glaning va bizni hodilarimiz sizga javob berishadi",
+      "subtitle": "Bizga bo'glaning va bizni hodilarimiz sizga javob berishadi",
-      "btn":"Savollingizni yo'llang"
+      "btn": "Savollingizni yo'llang"
     }
   },
   "services": {
@@ -217,5 +217,11 @@
       "contact": "Aloqa",
       "help": "Yordam"
     }
-  }
+  },
+  "rasmlar": "Rasmlar",
+  "fotogalereya": "Fotogalereya",
+  "contactTitle": "Bizga raqamingizni yuboring",
+  "contactSubTitle": "Xodimlarimiz siz bilan bog'lanishadi",
+  "enterPhone":"Telefon raqamingiz kiriting",
+  "send":"Yuborish"
 }