Merge pull request #332 from biswajit-sarkar-007/biswajit-sarkar-007/…

…cards-animantion-fix UI fixed of cards
OkenHaha · Feb 14, 2025 · 12c1f75 · 12c1f75
2 parents 9296767 + 8ab01e1
commit 12c1f75
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/front-end/src/components/Centre.jsx b/front-end/src/components/Centre.jsx
@@ -103,7 +103,7 @@ function Centre() {
             Our Mission, Vision & Values
           </h2>
           <div className="grid grid-cols-1 md:grid-cols-3 gap-6 ">
-            <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg ">
+          <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg transform hover:translate-y-[-5px] hover:translate-x-[-5px] transition-transform duration-300 shadow-[0px_0px_10px_2px_rgba(0,112,255,0.5)] hover:shadow-[0px_0px_20px_4px_rgba(0,112,255,0.7)]">
               <img
                 src={mission}
                 alt="Our Mission"
@@ -121,7 +121,7 @@ function Centre() {
               </p>
             </div>
 
-            <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg">
+            <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg transform hover:translate-y-[-5px] hover:translate-x-[-5px] transition-transform duration-300 shadow-[0px_0px_10px_2px_rgba(0,112,255,0.5)] hover:shadow-[0px_0px_20px_4px_rgba(0,112,255,0.7)]">
               <img
                 src={vision}
                 alt="Our Vision"
@@ -139,7 +139,7 @@ function Centre() {
               </p>
             </div>
 
-            <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg ">
+            <div className="bg-white dark:bg-gray-800 p-6 border-2 border-gray-800 dark:border-gray-700 rounded-lg transform hover:translate-y-[-5px] hover:translate-x-[-5px] transition-transform duration-300 shadow-[0px_0px_10px_2px_rgba(0,112,255,0.5)] hover:shadow-[0px_0px_20px_4px_rgba(0,112,255,0.7)]">
               <img
                 src={values}
                 alt="Our Values"
@@ -157,6 +157,7 @@ function Centre() {
                 community.
               </p>
             </div>
+
           </div>
         </div>
       </section>