final

src/assets/data/eventsData.js

@@ -1,6 +1,6 @@
 import event1 from "../images/event1.png";
 import event2 from "../images/event2.jpeg";
-import e from '../images/dummye.jpeg';
+import e from '../images/dummye.png';
 
 const events = [
   {

src/components/eventCard/EventCard.css

@@ -6,13 +6,13 @@
 
 .codeutsava__section3-card {
   position: relative;
-  padding: 2rem;
+  padding: 1.5rem;
   background-image: url("../../assets/images/bg-eventCard.png");
   background-repeat: no-repeat;
   background-size: cover;
   display: flex;
   flex-direction: column;
-  margin: 1.5rem 2.5rem;
+  margin: 1.5rem 3rem;
   box-sizing: border-box;
   font-family: "Poppins", sans-serif;
   color: black;
@@ -121,13 +121,8 @@
   .codeutsava__section3-card {
     margin: 0;
   }
-  .codeutsava__section3-cardTitle{
-    font-weight: 700;
-    font-size:200 ;
-  }
-
   .codeutsava__section3-cardTitle {
-    font-size: large;
+    font-weight: 700;
     margin-top: 0.5rem;
   }
 

src/pages/home/sections/section1/Section1.css

@@ -66,7 +66,6 @@
 
 .codeutsava__section1-image {
   width: 100%;
-  z-index: 1;
   display: flex;
   justify-content: center;
 }

src/pages/home/sections/section3/Section3.js

@@ -14,6 +14,7 @@ import frank from "../../../../assets/images/frakenstein.png";
 
 import axios from "axios";
 
+import downArrow from "../../../../assets/images/downArrow.svg";
 
 const Section3 = () => {
   const url = baseUrl + "events/" + previousYear;
@@ -123,17 +124,17 @@ const Section3 = () => {
 
   const leftArrowStyle = {
     position: "absolute",
-    top: "40%",
-    opacity: "0.5",
+    top: "45%",
+    opacity: "0.8",
     cursor: "pointer",
     zIndex: 1,
     left: "32px",
   };
 
   const rightArrowStyles = {
     position: "absolute",
-    top: "40%",
-    opacity: "0.5",
+    top: "45%",
+    opacity: "0.8",
     cursor: "pointer",
     zIndex: 1,
     right: "32px",
@@ -169,20 +170,12 @@ const Section3 = () => {
               ))}
             </div>
           </div>
-          {/* <div style={leftArrowStyle} onClick={() => goToPrevious()}>
-            <AiOutlineLeft
-              className="hover:bg-black"
-              size={"60px"}
-              color={"grey"}
-            />
+          <div style={leftArrowStyle} onClick={() => goToPrevious()}>
+            <img src={downArrow} style={{height: '30px', transform: 'rotate(90deg)', transform: 'translateX(-30px) rotate(90deg)', filter: 'invert(80%)'}}/>
           </div>
           <div style={rightArrowStyles} onClick={() => goToNext()}>
-            <AiOutlineRight
-              className="hover:bg-black"
-              size={"60px"}
-              color={"grey"}
-            />
-          </div> */}
+          <img src={downArrow} style={{height: '30px', transform: 'rotate(90deg)', transform: 'translateX(30px) rotate(-90deg)', filter: 'invert(80%)'}}/>
+          </div>
         </div>
       </div>
     </div>