feat: Added zoom-in-up effect for entities in Staff & Previous Office…

… Bearers
tsg-iitkgp · Jan 6, 2024 · 289be9e · 289be9e
1 parent 03782f2
commit 289be9e
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 25 deletions.
diff --git a/src/pages/Contacts/PreviousOfficeBearers.js b/src/pages/Contacts/PreviousOfficeBearers.js
@@ -107,19 +107,23 @@ export default function PreviousOfficeBearers() {
               {currentTab !== "specialRecog"
                 ? senateData[currentYear][currentTab]["profs"]?.map(
                     (winner) => (
+                      <div data-aos="zoom-in-up">
+                        <ContactCard
+                          name={winner.Name}
+                          imgSrc={primg}
+                          designation={winner.Post}
+                        />
+                      </div>
+                    )
+                  )
+                : senateData[currentYear][currentTab].map((winner) => (
+                    <div data-aos="zoom-in-up">
                       <ContactCard
                         name={winner.Name}
-                        imgSrc={primg}
+                        imgSrc={"primg"}
                         designation={winner.Post}
                       />
-                    )
-                  )
-                : senateData[currentYear][currentTab].map((winner) => (
-                    <ContactCard
-                      name={winner.Name}
-                      imgSrc={"primg"}
-                      designation={winner.Post}
-                    />
+                    </div>
                   ))}
             </div>
           </>
@@ -128,17 +132,17 @@ export default function PreviousOfficeBearers() {
           <>
             <div className={Styles.senateCard}>
               {senateData[currentYear][currentTab]["honours"].map((winner) => (
-                <card className={Styles.card1}>
-                  <p>
-                    <span style={{ color: "rgb(190, 190, 190)" }}>
-                      {" "}
-                      {winner.Post}
-                    </span>
-                    <br />
+                  <card className={Styles.card1} data-aos="zoom-in-up">
+                    <p>
+                      <span style={{ color: "rgb(190, 190, 190)" }}>
+                        {" "}
+                        {winner.Post}
+                      </span>
+                      <br />
 
-                    {winner.Name}
-                  </p>
-                </card>
+                      {winner.Name}
+                    </p>
+                  </card>
               ))}
             </div>
           </>

diff --git a/src/pages/Contacts/Staff.js b/src/pages/Contacts/Staff.js
@@ -9,12 +9,14 @@ export default function Staff() {
       <div className={Styles.multipleCards}>
         {staffData.data.map((member, index) => {
           return (
-            <ContactCard
-              name={member.Name}
-              designation={member.Post}
-              email={member.Email}
-              imgSrc={`/data/media/images/staff/${member.RollNo}.png`}
-            />
+            <div data-aos="zoom-in-up">
+              <ContactCard
+                name={member.Name}
+                designation={member.Post}
+                email={member.Email}
+                imgSrc={`/data/media/images/staff/${member.RollNo}.png`}
+              />
+            </div>
           );
         })}
       </div>