From 3f35a12e5fe185ea2ad2c1df725bb7d2fcc2bc2c Mon Sep 17 00:00:00 2001
From: Anirban Sarkar <137922245+Anirban780@users.noreply.github.com>
Date: Fri, 18 Oct 2024 23:40:17 +0530
Subject: [PATCH] updated some design parts

---
 Frontend/eslint.config.js          |  1 +
 Frontend/src/components/Footer.jsx | 10 +++++-----
 Frontend/src/components/Home.jsx   |  9 +++++----
 Frontend/src/index.css             | 14 +++++++++++++-
 Frontend/tailwind.config.js        |  3 +++
 5 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/Frontend/eslint.config.js b/Frontend/eslint.config.js
index 238d2e4..70cbdbc 100644
--- a/Frontend/eslint.config.js
+++ b/Frontend/eslint.config.js
@@ -32,6 +32,7 @@ export default [
       'react-refresh/only-export-components': [
         'warn',
         { allowConstantExport: true },
+        { noUnusedVars: true },
       ],
     },
   },
diff --git a/Frontend/src/components/Footer.jsx b/Frontend/src/components/Footer.jsx
index 7c759e3..2a68fea 100644
--- a/Frontend/src/components/Footer.jsx
+++ b/Frontend/src/components/Footer.jsx
@@ -22,12 +22,12 @@ const Footer = () => {
   ];
 
   return (
-    <footer className="bg-secondary text-light">
+    <footer className="bg-secondary text-light font-montserrat">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
         <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
           <div className="space-y-4">
             <h3 className="text-xl font-bold text-accent">Health Nest</h3>
-            <p className="text-sm">
+            <p className="text-[1rem]">
               Revolutionizing healthcare management with cutting-edge technology and compassionate care.
             </p>
             <div className="flex space-x-4">
@@ -44,13 +44,13 @@ const Footer = () => {
               ))}
             </div>
           </div>
-          <div className="md:col-span-2">
+          <div className="md:col-span-2 my-auto ml-8">
             <div className="grid grid-cols-2 sm:grid-cols-3 gap-4">
               {footerLinks.map((link, index) => (
-                <motion.div key={index} whileHover={{ x: 5 }}>
+                <motion.div key={index} whileHover={{ y: -3 }}>
                   <Link
                     to={link.to}
-                    className="text-light hover:text-accent transition-colors duration-300 text-sm"
+                    className="flex items-center text-light hover:text-accent transition-colors duration-300 text-[0.95rem]"
                   >
                     {link.title}
                   </Link>
diff --git a/Frontend/src/components/Home.jsx b/Frontend/src/components/Home.jsx
index cb4e7f6..39f017b 100644
--- a/Frontend/src/components/Home.jsx
+++ b/Frontend/src/components/Home.jsx
@@ -52,10 +52,11 @@ const Home = () => {
                         {features.map((feature, index) => (
                             <motion.div 
                                 key={index} 
-                                className="bg-white p-6 rounded-3xl shadow-lg text-center"
+                                className="bg-white p-6 rounded-3xl shadow-lg text-center feature-card"
                                 initial={{ opacity: 0, y: 20 }}
                                 animate={{ opacity: 1, y: 0 }}
-                                transition={{ duration: 0.5, delay: index * 0.1 }}
+                                transition={{ duration: 0.5, delay: index* 0.01}}
+                                whileHover={{ y: -10 }}
                             >
                                 <feature.icon className="text-4xl sm:text-5xl text-accent mb-4 mx-auto" />
                                 <h3 className="text-lg sm:text-xl font-semibold mb-2 text-primary">{feature.title}</h3>
@@ -74,10 +75,10 @@ const Home = () => {
                             <img src="https://images.unsplash.com/photo-1551076805-e1869033e561?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80" alt="Modern Hospital" className="rounded-3xl shadow-lg" />
                         </div>
                         <div className="md:w-1/2 md:pl-8">
-                            <p className="text-gray-600 mb-4">
+                            <p className="text-gray-600 mb-4 text-[1.1rem] font-montserrat ">
                                 Health Nest is a cutting-edge healthcare management system designed to streamline medical processes and enhance patient care. Our platform integrates advanced technology with medical expertise to provide a seamless experience for both healthcare providers and patients.
                             </p>
-                            <p className="text-gray-600 mb-4">
+                            <p className="text-gray-600 mb-4 text-[1.1rem] font-montserrat">
                                 With Health Nest, you can easily manage appointments, access medical records, and communicate with your healthcare team. We're committed to improving healthcare accessibility and efficiency, ensuring that you receive the best possible care.
                             </p>
                             <motion.button 
diff --git a/Frontend/src/index.css b/Frontend/src/index.css
index bd6213e..624263b 100644
--- a/Frontend/src/index.css
+++ b/Frontend/src/index.css
@@ -1,3 +1,15 @@
+@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
+
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+/*custom css*/
+@layer utilities {
+    .feature-card:hover {
+      box-shadow: rgba(240, 198, 46, 0.4) 5px 5px, 
+                  rgba(237, 204, 57, 0.3) 10px 10px, 
+                  rgba(248, 212, 50, 0.385) 15px 15px;
+                  
+    }
+  }
\ No newline at end of file
diff --git a/Frontend/tailwind.config.js b/Frontend/tailwind.config.js
index 9d088b7..54f61d1 100644
--- a/Frontend/tailwind.config.js
+++ b/Frontend/tailwind.config.js
@@ -11,6 +11,9 @@ export default {
         'light': '#F6F6F6',
         'accent': '#FFCB74',
       },
+      fontFamily: {
+        montserrat: ['Montserrat', 'sans-serif'],
+      },
     },
   },
   plugins: [],