edit responsive & logo & pictures

src/app/[lang]/page.tsx

@@ -116,7 +116,7 @@ export default async function Page({
           <div className="grid grid-cols-3 gap-x-10 lg:gap-y-0 gap-y-4 mt-10 lg:h-[600px]">
             <div className="lg:col-span-1 col-span-3 rounded-2xl border-[1px] border-neutral-200 overflow-hidden relative">
               <div className="lg:h-[410px] h-[300px] relative before:absolute before:bottom-0 before:bg-gradient-to-t before:from-white before:to-transparent before:z-10 before:w-full before:h-full before:top-0 before:right-0">
-                <Image src="/doctor.jpg" fill alt="" className="object-fill" />
+                <Image src="/jafarian.jpg" fill alt="" className="object-fill" />
               </div>
               <div className=" h-full px-6 py-10 space-y-2 ">
                 <h3 className="lg:text-2xl text-lg font-black text-black">
@@ -135,7 +135,7 @@ export default async function Page({
               </div>
             </div>
             <div className="lg:col-span-1 col-span-3 rounded-2xl border-[1px] border-neutral-200 overflow-hidden relative">
-              <div className="lg:h-[410px] h-[200px] relative before:absolute before:bottom-0 before:bg-gradient-to-t before:from-white before:to-transparent before:z-10 before:w-full before:h-full before:top-0 before:right-0">
+              <div className="lg:h-[410px] h-[300px] relative before:absolute before:bottom-0 before:bg-gradient-to-t before:from-white before:to-transparent before:z-10 before:w-full before:h-full before:top-0 before:right-0">
                 <Image
                   src="/motamedi.jpg"
                   fill
@@ -161,7 +161,7 @@ export default async function Page({
             </div>
 
             <div className="lg:col-span-1 col-span-3 rounded-2xl border-[1px] border-neutral-200 overflow-hidden relative">
-              <div className="lg:h-[410px] h-[200px] relative before:absolute before:bottom-0 before:bg-gradient-to-t before:from-white before:to-transparent before:z-10 before:w-full before:h-full before:top-0 before:right-0">
+              <div className="lg:h-[410px] h-[300px] relative before:absolute before:bottom-0 before:bg-gradient-to-t before:from-white before:to-transparent before:z-10 before:w-full before:h-full before:top-0 before:right-0">
                 <Image
                   src="/heidarnejad.jpg"
                   fill
@@ -190,10 +190,10 @@ export default async function Page({
       </section>
       <section className="lg:mb-24 mb-10 lg:mt-10 mt-4 container ">
         <div className="bg-[#F8F9FA] rounded-4xl lg:px-40 lg:py-16 p-2">
-          <h3 className="lg:text-[3em] text-3xl font-black text-blue-primary text-center relative before:absolute before:w-[100px] before:block before:bg-secondary before:-bottom-5 before:h-[2px] before:left-[50%] before:translate-x-[-50%] ">
+          <h3 className="lg:text-[3em] text-3xl font-black text-blue-primary mb-10 text-center relative before:absolute before:w-[100px] before:block before:bg-secondary before:-bottom-5 before:h-[2px] before:left-[50%] before:translate-x-[-50%] ">
             {about_page?.form?.head_text}
           </h3>
-          <p className="text-center lg:text-[1.2rem] leading-8 text-[#454547] mt-10">
+          <p className="text-center lg:text-[1.2rem] leading-8 text-[#454547]">
             {about_page?.form?.sub_text}
           </p>
           <PatientConsultantForm lang={lang} dict={about_page} />

src/ui/components/LanguagesChanger.tsx

@@ -18,7 +18,7 @@ export default function LanguagesChanger({lang}: {lang: languages_types}) {
   };
   return (
     <>
-      <div className="text-white text-xs flex items-center justify-end gap-x-4 border-[1px] border-white px-4 py-1.5 rounded-full ">
+      <div className="md:text-white text-xs flex flex-wrap items-center md:justify-end justify-center gap-x-4 border-[1px] md:border-white md:px-4 py-1.5 rounded-full md:mt-0 mt-4">
         <span>
           <button
             type="button"

src/ui/components/menu/MobileMenu.tsx

@@ -1,10 +1,11 @@
 "use client";
-import {DefaultMenuLinks} from "@/constants/menu/menu.const";
+import {DefaultMenuLinks, Menu_buttons} from "@/constants/menu/menu.const";
 import React, {useState} from "react";
 import CustomLink from "../global/CustomLink";
 import {languages_types} from "@/types";
 import ChevronLeftSvg from "../icons/ChevronLeftSvg";
 import {getHref} from "@/utils/functions";
+import LanguagesChanger from "../LanguagesChanger";
 
 export default function MobileMenu({lang}: {lang: languages_types}) {
   const [open, setOpen] = useState(false);
@@ -13,6 +14,7 @@ export default function MobileMenu({lang}: {lang: languages_types}) {
   const toggle = (index: number) => {
     setOpenIndex(openIndex === index ? null : index);
   };
+
   return (
     <>
       <button
@@ -41,7 +43,6 @@ export default function MobileMenu({lang}: {lang: languages_types}) {
         <div
           className="lg:hidden fixed top-0 right-0 z-50 bg-black/30 backdrop-blur-sm w-full h-screen"
           onClick={(e) => {
-            
             setOpen(!open);
           }}
         >
@@ -71,23 +72,18 @@ export default function MobileMenu({lang}: {lang: languages_types}) {
                 </button>
               </div>
 
-              <div className="mt-5">
+              <div className="mt-5 h-[430px] overflow-auto">
                 {DefaultMenuLinks.map((link) => (
                   <div key={link.id} className="w-full h-fit">
                     {link.sub.length > 0 ? (
                       <div className="flex items-center justify-between">
                         <div className="w-full  space-y-4 overflow-hidden">
-                          <div
+                          <div key={link.id} className="rounded-2xl py-4">
-                            key={link.id}
-                            className="rounded-2xl py-4"
-                          >
                             <button
                               className="flex w-full items-center justify-between text-right h-full cursor-pointer"
                               onClick={() => toggle(link.id)}
                             >
-                              <span >
+                              <span>{link.label[lang]}</span>
-                                {link.label[lang]}
-                              </span>
                               <span
                                 className={`transition-all duration-300  ${
                                   openIndex === link.id
@@ -133,6 +129,31 @@ export default function MobileMenu({lang}: {lang: languages_types}) {
                     )}
                   </div>
                 ))}
+                <LanguagesChanger lang={lang} />
+                <div className="col-span-4 flex flex-col items-center justify-center gap-y-2 mt-3">
+                  
+
+                  <CustomLink
+                    href={getHref("/contact-us#request_accept", lang)}
+                    label={
+                      Menu_buttons.request_to_accept[lang as languages_types] ||
+                      ""
+                    }
+                    className={`bg-blue-primary text-white rounded-full w-full 
+                      py-4 px-6
+                    text-sm font-semibold shadow-lg flex items-center whitespace-nowrap  shadow-neutral-300 hover:shadow-none transition-all duration-200`}
+                  />
+                  <CustomLink
+                    href={getHref("/upload-documents", lang)}
+                    label={
+                      Menu_buttons.upload_document[lang as languages_types] ||
+                      ""
+                    }
+                    className={`bg-secondary text-white rounded-full 
+                      py-4 px-6
+                    text-sm font-semibold shadow-lg flex items-center w-full  whitespace-nowrap shadow-neutral-300 hover:shadow-none transition-all duration-200`}
+                  />
+                </div>
               </div>
             </div>
           </div>

src/ui/components/top-menu/TopMenu.tsx

@@ -40,7 +40,7 @@ export default function TopMenu({lang}: {lang: languages_types}) {
         {/* <div className="top-0 absolute h-[40px] bg-radial bg-secondary/30 backdrop-blur-2xl w-full">
 
       </div> */}
-        <div className="lg:w-[210px] flex gap-x-10 transition-all duration-300 items-center ">
+        <div className="lg:w-[210px] flex gap-x-3 transition-all duration-300 items-center ">
           <Link href={"/"} className="flex items-center gap-x-2">
             <div
               className={`relative ${
@@ -58,6 +58,23 @@ export default function TopMenu({lang}: {lang: languages_types}) {
               />
             </div>
           </Link>
+          <Link href={"/"} className="flex items-center gap-x-2">
+            <div
+              className={`relative ${
+                isSticky
+                  ? " h-[70px] w-[70px]"
+                  : "lg:h-[90px] h-[50px] lg:w-[97px] w-[40px]"
+              }`}
+            >
+              <Image
+                loading="lazy"
+                src="/main-logo-blue.png"
+                fill
+                alt="shomal hospital"
+                style={{color: "transparent", fill: "red", objectFit: "fill"}}
+              />
+            </div>
+          </Link>
         </div>
 
         <MobileMenu lang={lang} />