update home page bg & style

components/layout/Footer.js

@@ -4,6 +4,7 @@ import Linkedin from "../icons/Linkedin";
 import Telegram from "../icons/Telegram";
 import Whatsapp from "../icons/Whatsapp";
 import Instagram from "../icons/Instagram";
+import Link from "next/link";
 
 const socialMedias = [
     <Linkedin />,
@@ -12,11 +13,17 @@ const socialMedias = [
     <Instagram />
 ]
 
+const Namads = [
+    '/assets/images/footer-etehadie.png',
+    '/assets/images/footer-r.png',
+    '/assets/images/footer-namad.png'
+]
+
 function Footer() {
     return (
         <div>
             <span className="h-px bg-[#D7D7D7] w-full block"></span>
-            <div className="pt-[30px] pb-[60px] flex items-center justify-between">
+            <div className="pt-[40px] pb-[60px] flex items-start justify-between">
                 {/* Right */}
                 <div className="flex gap-[30px] flex-col items-start">
                     {/* Icon */}
@@ -32,6 +39,18 @@ function Footer() {
                     <p
                         className="text-[#616161] text-[14px] font-normal"
                     >724 یک وبسایت نوبت دهی آنلاین می باشد که<br /> بستری آسان برای پزشکان و بیماران فراهم کرده<br /> است.     </p>
+                    <ul className="flex items-center gap-3">
+                        {Namads.map(src => (
+                            <li>
+                                <Image
+                                    alt="logo"
+                                    width={48}
+                                    height={48}
+                                    src={src}
+                                />
+                            </li>
+                        ))}
+                    </ul>
                 </div>
 
                 {/* Center */}
@@ -40,7 +59,8 @@ function Footer() {
                         <li
                             key={idx}
                             className={`
-                            ${idx === 0 ? 'text-[#3B3B3B] font-bold border-b border-b-[#EFEFEF] pb-1' : 'text-[#616161] font-normal'} 
+                            border-0 border-b-2 border-solid 
+                            ${idx === 0 ? 'text-[#3B3B3B] border-[#F17732] font-bold pb-1.5' : 'text-[#616161] border-transparent font-normal'} 
                             text-[16px] w-fit`}
                         >{item}</li>
                     ))}
@@ -50,7 +70,8 @@ function Footer() {
                         <li
                             key={idx}
                             className={`
-                            ${idx === 0 ? 'text-[#3B3B3B] font-bold border-b border-b-[#EFEFEF] pb-1' : 'text-[#616161] font-normal'} 
+                            border-0 border-b-2 border-solid 
+                            ${idx === 0 ? 'text-[#3B3B3B] border-[#F17732] font-bold pb-1.5' : 'text-[#616161] border-transparent font-normal'} 
                             text-[16px] w-fit`}
                         >{item}</li>
                     ))}
@@ -58,16 +79,21 @@ function Footer() {
 
                 {/* Left */}
                 <div className="flex flex-col justify-center gap-[50px]">
-                    <p className="text-[#3B3B3B] text-[16px] font-bold border-b border-b-[#EFEFEF] pb-1">
-                        ما را در شبکه های اجتماعی دنبال کنید:
+                    <p className="text-[#3B3B3B] w-fit text-[16px] border-[#F17732] font-bold border-0 border-b-2 border-solid pb-1.5">
+                        همراه با ما باشید:
                     </p>
                     <ul className="flex items-center gap-[15px]">
                         {socialMedias.map((item, idx) => (
                             <li
                                 key={idx}
-                                className="p-2.5 bg-[#A5B4D7] rounded-full w-fit"
+                                className="p-2.5 bg-[#EAECFA] rounded-full w-fit"
                             >
-                                {item}
+                                <Link
+                                    href='/'
+                                    className="min-h-fit"
+                                >
+                                    {item}
+                                </Link>
                             </li>
                         ))}
                     </ul>

components/layout/Header.js

@@ -35,7 +35,7 @@ function Header() {
                         </li>
                     ))}
                 </ul>
-                <Button variant="contained" color="primary">
+                <Button variant="outlined" color="primary">
                     ورود | ثبت نام
                 </Button>
             </div>