Merge branch 'main' into updated

Luson045 · Oct 27, 2024 · eeae59b · eeae59b
2 parents 07088c3 + 55d5834
commit eeae59b
Show file tree

Hide file tree

Showing 17 changed files with 913 additions and 498 deletions.
diff --git a/README.md b/README.md
@@ -2,6 +2,9 @@
     <img src="logo.svg" width="328" alt="" />
 </div>
 
+<img  src="https://readme-typing-svg.herokuapp.com?color=458EEC&center=true&vCenter=true&size=40&width=900&height=80&lines=Know+More+Waiting+In+Long+Queue" />
+
+
 # Med-Space (Appointment Booking System)
 
 ![License](https://img.shields.io/badge/license-MIT-blue.svg)
@@ -20,7 +23,7 @@
 
 <div align="center">
   <img src="https://raw.githubusercontent.com/SwanandD121/FeatherPerfect_fe/refs/heads/main/Untitled%20design.png" alt="GSSoC 2024 Extd" width="80%">
-  <img src="https://cdn.discordapp.com/attachments/657543125190967316/1294560786114674748/Screenshot_2024-10-12_122347.png?ex=670b752f&is=670a23af&hm=26ddd7f41740b8b19ee4985e7568b3892091384b3b85e7165770a4b10f4d1050&" alt="Hacktoberfest 2024" width="80%">
+  <img src="https://hacktoberfest.com/_next/static/media/opengraph.9dc60c9d.png" alt="HACTOBERFEST" alt="Hacktoberfest 2024" width="80%">
 </div>
 <br>
 
@@ -259,6 +262,23 @@ Make sure to run these commands in both the `client` and `server` directories.
 <!--Line-->
 <img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
 
+
+## Stargazers ❤️
+
+<div align='left'>
+
+[![Stargazers repo roster for @Luson045/medi-connect](https://reporoster.com/stars/dark/Luson045/medi-connect)](https://github.com/Luson045/medi-connect/stargazers)
+
+
+</div>
+
+## Forkers ❤️
+
+[![Forkers repo roster for @Luson045/medi-connect](https://reporoster.com/forks/dark/Luson045/medi-connect)](https://github.com/Luson045/medi-connect/network/members)
+
+
+<img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
+
 ## License
 
 This project is licensed under the [MIT License](LICENSE).
@@ -282,3 +302,6 @@ For any inquiries or feedback, please contact. Happy Contributing 🫡
 
 ## ⭐️ Support the Project
 If you find this project helpful, please consider giving it a ⭐ on GitHub! Your support helps to grow the project and reach more contributors.
+<img src="https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif" width="900">
+
+
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/package.json b/client/package.json
@@ -9,7 +9,7 @@
     "@fortawesome/free-brands-svg-icons": "^6.6.0",
     "@fortawesome/free-solid-svg-icons": "^6.6.0",
     "@fortawesome/react-fontawesome": "^0.2.2",
-    "@mui/material": "^6.1.3",
+    "@mui/material": "^6.1.5",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",

diff --git a/client/src/App.js b/client/src/App.js
@@ -5,16 +5,35 @@ import { UserProvider } from './store/userContext';
 import { ToastContainer } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 import Layout from './components/Layout';
+import { useState, useEffect } from 'react';
+import Preloader from './components/PreLoader';
 
 function App() {
+  // Preloader state
+  const [isPreloaderVisible, setIsPreloaderVisible] = useState(true);
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setIsPreloaderVisible(false);
+    }, 5000);
+
+    return () => clearTimeout(timer);
+  }, []);
+
   return (
     <div className="App">
-      <Router>
-        <UserProvider>
-          <Layout />
-        </UserProvider>
-      </Router>
-      <ToastContainer />
+      {isPreloaderVisible ? (
+        <Preloader />
+      ) : (
+        <>
+          <Router>
+            <UserProvider>
+              <Layout />
+            </UserProvider>
+          </Router>
+          <ToastContainer />
+        </>
+      )}
     </div>
   );
 }

diff --git a/client/src/components/Footer.jsx b/client/src/components/Footer.jsx
@@ -86,22 +86,27 @@ const Footer = () => {
   // };
 
   return (
-    <footer className="bg-gradient-to-r from-[#1f2937] via-[#133859] to-[#1f2937]  p-8 text-white">
+    <footer className="bg-gradient-to-r from-[#b6dbfc] via-[#8faed9] to-[#b6dbfc] p-8 text-white shadow-lg shadow-black">
       <div className="container mx-auto">
+
         <div className="container mx-auto flex flex-wrap justify-between">
           {/* Company Section */}
           <div className="space-y-4">
+
+        <div className="flex flex-wrap justify-between space-x-4">
+          {/* Med Space Section */}
+          <div className="space-y-4 w-full md:w-auto">
+
             <Link
               to="/"
               className="flex items-center gap-2 group transition-all duration-300 ease-in-out transform hover:scale-105"
             >
-              {/* Adjusted hover text colors */}
               <img
                 src="../favicon.png"
                 className="h-10 w-10 transition-transform duration-300 group-hover:rotate-6"
                 alt="AgroTech AI Logo"
               />
-              <span className="text-2xl font-bold bg-gradient-to-r from-[#b6dbfc] to-[#b6dbfc] bg-clip-text text-transparent group-hover:from-[#133859] group-hover:to-[#b6dbfc] transition-all duration-300">
+              <span className="text-2xl font-bold bg-gradient-to-r from-[#1f2937] to-[#b6dbfc] bg-clip-text text-transparent group-hover:from-[#133859] group-hover:to-[#b6dbfc] transition-all duration-300">
                 Med Space
               </span>
             </Link>
@@ -112,9 +117,15 @@ const Footer = () => {
             </p>
           </div>
 
+
           {/* Company Links */}
           <div className="-ml-40">
             <h3 className='text-lg font-semibold mb-4 relative inline-block after:content-[""] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full'>
+
+          {/* About Section */}
+          <div className="space-y-4 w-full md:w-auto">
+            <h3 className="text-lg font-semibold mb-4 relative inline-block after:content-[''] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full">
+
               About
             </h3>
             <ul className="space-y-2">
@@ -128,7 +139,7 @@ const Footer = () => {
                       <span className="inline-block transition-transform duration-300 group-hover:-translate-y-full">
                         {link.name}
                       </span>
-                      <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#b6dbfc]">
+                      <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#1f2937]">
                         {link.name}
                       </span>
                     </span>
@@ -138,14 +149,20 @@ const Footer = () => {
             </ul>
           </div>
 
+
           {/* Quick Links */}
           <div className="-ml-40">
             <h3 className='text-lg font-semibold mb-4 relative inline-block after:content-[""] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full'>
+
+          {/* Services Section */}
+          <div className="space-y-4 w-full md:w-auto">
+            <h3 className="text-lg font-semibold mb-4 relative inline-block after:content-[''] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full">
+
               Services
             </h3>
             <ul className="space-y-2">
               {servicesLinks.map((link) => (
-                <li key={link.name} className="w-full">
+                <li key={link.name}>
                   <Link to={link.path} className="flex items-center group">
                     <span className="mr-2 transition-transform duration-300 group-hover:translate-x-1">
                       ›
@@ -154,7 +171,7 @@ const Footer = () => {
                       <span className="inline-block transition-transform duration-300 group-hover:-translate-y-full">
                         {link.name}
                       </span>
-                      <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#b6dbfc]">
+                      <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#1f2937]">
                         {link.name}
                       </span>
                     </span>
@@ -164,8 +181,14 @@ const Footer = () => {
             </ul>
           </div>
 
+
           <div className="-ml-40 -mt-6">
             <h3 className='text-lg font-semibold mt-6 mb-4 relative inline-block after:content-[""] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full text-yellow'>
+
+          {/* Contact Us Section */}
+          <div className="space-y-4 w-full md:w-auto">
+            <h3 className="text-lg font-semibold mb-4 relative inline-block after:content-[''] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full">
+
               Contact Us
             </h3>
             <ul className="space-y-2">
@@ -179,7 +202,11 @@ const Footer = () => {
                       <span className="inline-block transition-transform duration-300 group-hover:-translate-y-full">
                         {item.name}
                       </span>
+
                       <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#b6dbfc]">
+
+                      <span className="absolute top-0 left-0 inline-block transition-transform duration-300 translate-y-full group-hover:translate-y-0 text-[#1f2937]">
+
                         {item.name}
                       </span>
                     </span>
@@ -188,10 +215,17 @@ const Footer = () => {
               ))}
             </ul>
           </div>
+
           {/* Connect with Us and Legal */}
           <div className="-ml-40">
             {/* Social Media Links */}
             <h3 className='text-lg font-semibold mb-4 relative inline-block after:content-[""] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full'>
+
+
+          {/* Follow Us Section */}
+          <div className="space-y-4 w-full md:w-auto">
+            <h3 className="text-lg font-semibold mb-4 relative inline-block after:content-[''] after:absolute after:w-0 after:h-0.5 after:bg-[#b6dbfc] after:left-0 after:-bottom-1 after:transition-all after:duration-300 hover:after:w-full">
+
               Follow us on
             </h3>
             <div className="flex space-x-4 mb-6">
@@ -218,14 +252,18 @@ const Footer = () => {
                     e.currentTarget.style.boxShadow =
                       '0 0 0 0 rgba(255,255,255,0.7)';
                   }}
-                  aria-label={`Social media link ${index + 1}`}
                 >
                   <Icon size={15} />
                 </a>
               ))}
             </div>
 
+
             <div className="flex items-center mt-6 relative">
+
+            {/* Google Translate Section */}
+            <div className="flex items-center mt-6">
+
               <img
                 src="/google.png"
                 alt="Google Translate"
@@ -240,7 +278,9 @@ const Footer = () => {
               </div>
             </div>
 
+
             {/* Legal Links */}
+
           </div>
         </div>