add maps to contact page catalog_page added , email addres updated , remove page drop down

This commit is contained in:
nabijonovdavronbek619@gmail.com
2026-02-06 23:03:46 +05:00
parent 873bbb82a9
commit 66bf104cb7
13 changed files with 134 additions and 123 deletions

View File

@@ -6,12 +6,7 @@ export default function ContactHeader() {
const t = useTranslations();
return (
<div className="mb-8 text-center">
<div className="mb-4 flex items-center justify-center gap-2">
<DotAnimatsiya />
<span className="font-almarai text-sm font-semibold tracking-wider text-white">
{t("contact.banner.title")}
</span>
</div>
<h2
className="uppercase font-unbounded bg-linear-to-br from-white via-white to-black
text-transparent bg-clip-text text-4xl font-bold tracking-wide md:text-5xl"

View File

@@ -3,13 +3,15 @@ import { Mail, MapPin, Phone } from "lucide-react";
import ContactHeader from "./contactHeader";
import Form from "./form";
import { useTranslations } from "next-intl";
import Maps from "./maps";
import DotAnimatsiya from "@/components/dot/DotAnimatsiya";
export function Contact() {
const t = useTranslations();
const contactInfo = [
{
icon: Mail,
title:t("contact.form.email"),
title: t("contact.form.email"),
detail: t("contact.form.emailAddress"),
},
{
@@ -46,27 +48,40 @@ export function Contact() {
</div>
{/* Content */}
<div className="relative z-10 mx-auto max-w-4xl px-4 sm:px-6 lg:px-8">
<ContactHeader />
<div className="relative z-10 ">
<div className="flex items-center justify-center w-full">
<div className="mb-4 flex items-center justify-center gap-2">
<DotAnimatsiya />
<span className="font-almarai text-sm font-semibold tracking-wider text-white">
{t("contact.banner.title")}
</span>
</div>
</div>
<Maps />
<div className="relative z-10 mx-auto max-w-4xl px-4 sm:px-6 lg:px-8 space-y-5">
<ContactHeader />
<Form />
<Form />
{/* Contact Info */}
<div className="mt-12 grid grid-cols-1 gap-8 md:grid-cols-3">
{contactInfo.map((info) => (
<div
key={info.title}
className="flex flex-col items-center text-center"
>
<div className="mb-3 flex h-14 w-14 items-center justify-center rounded-xl bg-[#2c2b2a]">
<info.icon className="h-6 w-6 text-red-600" />
{/* Contact Info */}
<div className="mt-12 grid grid-cols-1 gap-8 md:grid-cols-3">
{contactInfo.map((info) => (
<div
key={info.title}
className="flex flex-col items-center text-center"
>
<div className="mb-3 flex h-14 w-14 items-center justify-center rounded-xl bg-[#2c2b2a]">
<info.icon className="h-6 w-6 text-red-600" />
</div>
<h3 className="font-almarai text-sm font-bold tracking-wider text-white">
{info.title}
</h3>
<p className="font-almarai mt-1 text-sm text-gray-400">
{info.detail}
</p>
</div>
<h3 className="font-almarai text-sm font-bold tracking-wider text-white">
{info.title}
</h3>
<p className="font-almarai mt-1 text-sm text-gray-400">{info.detail}</p>
</div>
))}
))}
</div>
</div>
</div>
</section>

View File

@@ -0,0 +1,31 @@
export default function Maps() {
return (
<section className="w-full px-4 py-10">
<div className="mx-auto max-w-7xl grid grid-cols-1 md:grid-cols-2 gap-10">
{/* Yandex Map */}
<div className="h-[300px] sm:h-[400px] md:h-[500px] rounded-2xl overflow-hidden shadow-lg border hover:shadow-xl transition">
<iframe
src="https://yandex.uz/map-widget/v1/?ll=69.288118%2C41.323186&mode=search&oid=56350803620&ol=biz&z=16.97"
className="w-full h-full"
frameBorder="0"
allowFullScreen
loading="lazy"
/>
</div>
{/* Google Map */}
<div className="h-[300px] sm:h-[400px] md:h-[500px] rounded-2xl overflow-hidden shadow-lg border hover:shadow-xl transition">
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2996.342450769356!2d69.28561627695484!3d41.323166199974985!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x38aef56f76215ce7%3A0xfd64c6a930fb1bbb!2sIGNUM!5e0!3m2!1sru!2s!4v1770203090924"
className="w-full h-full"
allowFullScreen
loading="lazy"
referrerPolicy="no-referrer-when-downgrade"
/>
</div>
</div>
</section>
);
}

View File

@@ -59,10 +59,10 @@ export function Banner() {
{/* Left side - Firefighters Image */}
<div className="flex items-end justify-center ">
<img
src="/images/homeBanner.png"
src="/images/homeBanner3.png"
alt="Firefighters"
loading="lazy"
className="lg:w-150 w-100 lg:h-150 max-[300px]:w-[80vw] object-cover object-right rounded-xl drop-shadow-2xl"
className="lg:w-150 w-100 lg:h-150 max-[300px]:w-[80vw] object-contain object-right rounded-xl drop-shadow-2xl"
/>
</div>

View File

@@ -9,7 +9,7 @@ import EmptyData from "@/components/EmptyData";
import { getRouteLang } from "@/request/getLang";
import { CategoryType } from "@/lib/types";
export default function Catalog() {
export default function Catalog() {
const language = getRouteLang();
const { data, isLoading } = useQuery({
queryKey: ["category", language],