diff --git a/src/assets/data/eventsData.js b/src/assets/data/eventsData.js index 5a20ddf..7a188c0 100644 --- a/src/assets/data/eventsData.js +++ b/src/assets/data/eventsData.js @@ -1,68 +1,68 @@ -import event1 from '../images/event1.png' -import event2 from '../images/event2.png' -import event3 from '../images/event3.png' -import event4 from '../images/event4.png' -import event5 from '../images/event5.png' -import event6 from '../images/event6.png' -import event7 from '../images/event7.png' -import event8 from '../images/event8.png' -import event9 from '../images/event9.png' +import event1 from "../images/event1.png"; +import event2 from "../images/event2.png"; +import event3 from "../images/event3.png"; +import event4 from "../images/event4.png"; +import event5 from "../images/event5.png"; +import event6 from "../images/event6.png"; +import event7 from "../images/event7.png"; +import event8 from "../images/event8.png"; +import event9 from "../images/event9.png"; const events = [ { title: "Codease", date: "10th February", img: event5, - link:"https://forms.gle/FmCBiEwB8Cx72sfB7", + link: "https://forms.gle/FmCBiEwB8Cx72sfB7", }, { title: "Code Riddles", date: "11th February", img: event6, - link:"", + link: "", }, { title: "IT Quiz", date: "11th February", img: event8, - link:"", + link: "", }, { title: "Logo Design", date: "12th February", img: event9, - link:"", + link: "", }, { title: "Ultimate Gaming", date: "11th and 12th February", img: event7, - link:"", + link: "", }, { title: "Cloud Techniques and Placement Tips", date: "14th and 15th January", img: event1, - link:"", + link: "", }, { title: "28 Hours Hackathon", date: "11th and 12th February", img: event2, - link:"", + link: "", }, { title: "CP and Algo Bootcamp", date: "21st and 22nd January", img: event3, - link:"", + link: "", }, { title: "AI and Machine Learning", date: "28th and 29th January", img: event4, - link:"https://forms.gle/zetADszoQMTad7JV8", + link: "https://forms.gle/zetADszoQMTad7JV8", }, ]; -export default events; \ No newline at end of file +export default events; diff --git a/src/assets/images/sahil.jpg b/src/assets/images/sahil.jpg deleted file mode 100644 index c67ee57..0000000 Binary files a/src/assets/images/sahil.jpg and /dev/null differ diff --git a/src/assets/images/samarth_batav.jpg b/src/assets/images/samarth_batav.jpg deleted file mode 100644 index 0390b85..0000000 Binary files a/src/assets/images/samarth_batav.jpg and /dev/null differ diff --git a/src/assets/images/sugandha.jpg b/src/assets/images/sugandha.jpg deleted file mode 100644 index 72be64f..0000000 Binary files a/src/assets/images/sugandha.jpg and /dev/null differ diff --git a/src/pages/home/sections/section1/Section1.css b/src/pages/home/sections/section1/Section1.css index b82a981..e408830 100644 --- a/src/pages/home/sections/section1/Section1.css +++ b/src/pages/home/sections/section1/Section1.css @@ -10,7 +10,7 @@ .codeutsava__section1-bg-canvas{ display: block !important; width: 100%; - height: 875px; + height: 900px; aspect-ratio: auto; position: absolute; z-index: -100; diff --git a/src/pages/home/sections/section1/Section1.js b/src/pages/home/sections/section1/Section1.js index 8b1375f..fa07059 100644 --- a/src/pages/home/sections/section1/Section1.js +++ b/src/pages/home/sections/section1/Section1.js @@ -168,8 +168,6 @@ const Section1 = () => { animate(); var isMouseDown = false; - setInterval(function () {isMouseDown =! isMouseDown;}, 5000); - window.addEventListener("mousedown", function () { isMouseDown = true; }); diff --git a/src/pages/home/sections/section15/Section15.css b/src/pages/home/sections/section15/Section15.css index 3539298..c0cce9c 100644 --- a/src/pages/home/sections/section15/Section15.css +++ b/src/pages/home/sections/section15/Section15.css @@ -34,7 +34,7 @@ background-color: rgb(230, 118, 20); overflow: hidden; opacity: 0; - transition: opacity 0.5s ease; + transition: opacity 0.5s ease; } .codeutsava__section15-glimpses-panel-oddoverlay { display: flex; @@ -46,13 +46,12 @@ right: 0; bottom: 0; margin: 9px; - background-color:var(--primary-c); + background-color: var(--primary-c); overflow: hidden; - opacity: 0; + opacity: 0; transition: opacity 0.5s ease; } - .codeutsava__section15-glimpses-container { display: flex; flex-wrap: wrap; @@ -84,17 +83,19 @@ background-image: inherit; background-size: cover; background-position: center; - transition: transform 0.3s ease; + transition: transform 0.3s ease; } .codeutsava__section15-glimpses-panel:hover::before { - transform: scale(1.2); + transform: scale(1.2); } -.codeutsava__section15-glimpses-panel:hover .codeutsava__section15-glimpses-panel-oddoverlay { - opacity: 0.5; +.codeutsava__section15-glimpses-panel:hover + .codeutsava__section15-glimpses-panel-oddoverlay { + opacity: 0.5; } -.codeutsava__section15-glimpses-panel:hover .codeutsava__section15-glimpses-panel-evenoverlay { - opacity: 0.5; +.codeutsava__section15-glimpses-panel:hover + .codeutsava__section15-glimpses-panel-evenoverlay { + opacity: 0.5; } .codeutsava__section15-glimpses-panel { @@ -111,5 +112,5 @@ position: relative; /* transition: flex 0.7s ease-in, transform 0.3s ease; */ overflow: hidden; - transform-origin: center; + transform-origin: center; } diff --git a/src/pages/home/sections/section15/Section15.js b/src/pages/home/sections/section15/Section15.js index 23fdb6b..bb7e24a 100644 --- a/src/pages/home/sections/section15/Section15.js +++ b/src/pages/home/sections/section15/Section15.js @@ -8,7 +8,7 @@ const Section15 = () => { const [activeId, setActiveId] = useState(1); const [selectedImage, setSelectedImage] = useState(null); const onClick = (id) => setActiveId(id); - //passing the clicked image to the modal + //passing the clicked image to the modal const openModal = (imgSrc) => { setSelectedImage(imgSrc); }; @@ -27,7 +27,6 @@ const Section15 = () => {
{glimpses.map((card) => ( -
{ onClick={() => onClick(card.id)} style={{ backgroundImage: `url(${card.imgSrc})` }} > -
openModal(card.imgSrc)} > +
openModal(card.imgSrc)} + > Click
@@ -44,7 +50,10 @@ const Section15 = () => {
{/* Rendering the modal,it is for that bigger image appearence with all that popping and closing functionality through a close button */} - setSelectedImage(null)}> + setSelectedImage(null)} + > {selectedImage && Larger Glimpse} @@ -52,9 +61,3 @@ const Section15 = () => { }; export default Section15; - - - - - - diff --git a/src/pages/home/sections/section15/modal.css b/src/pages/home/sections/section15/modal.css index e6f7e9a..1cf4a3b 100644 --- a/src/pages/home/sections/section15/modal.css +++ b/src/pages/home/sections/section15/modal.css @@ -1,51 +1,51 @@ .modal-overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.8); - display: flex; - justify-content: center; - align-items: center; - z-index: 9999; - opacity: 0; - transition: opacity 1s ease-in-out; - } - .modal-overlay.open { - opacity: 1; - } - + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.8); + display: flex; + justify-content: center; + align-items: center; + z-index: 9999; + opacity: 0; + transition: opacity 1s ease-in-out; +} +.modal-overlay.open { + opacity: 1; +} + .modal-content { - padding: 20px; - border-radius: 10px; - box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); - position: relative; - max-width: 80%; - text-align: center; - } + padding: 20px; + border-radius: 10px; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); + position: relative; + max-width: 80%; + text-align: center; +} .modal-content img { - max-width: 100%; - max-height: 80vh; - width: auto; - height: auto; - display: block; - margin: 0 auto; - position: relative; - top: 50%; - transform: translateY(5%); - } - .close-button { - position: absolute; - top: 90px; - right: 60px; - font-size: 70px; - cursor: pointer; - background: transparent; - border: none; - outline: none; - color: #e76909; - } - .close-button::before { - content: "×"; - } \ No newline at end of file + max-width: 100%; + max-height: 80vh; + width: auto; + height: auto; + display: block; + margin: 0 auto; + position: relative; + top: 50%; + transform: translateY(5%); +} +.close-button { + position: absolute; + top: 90px; + right: 60px; + font-size: 70px; + cursor: pointer; + background: transparent; + border: none; + outline: none; + color: white; +} +.close-button::before { + content: "×"; +} diff --git a/src/pages/home/sections/section15/modal.js b/src/pages/home/sections/section15/modal.js index d52410a..0d53b4b 100644 --- a/src/pages/home/sections/section15/modal.js +++ b/src/pages/home/sections/section15/modal.js @@ -1,5 +1,5 @@ import React, { useEffect } from "react"; -import "./modal.css"; +import "./modal.css"; const Modal = ({ isOpen, onClose, children }) => { //to hanle the outside clicks,image will close if user clicks outside of the image const handleOutsideClick = (event) => { @@ -18,14 +18,11 @@ const Modal = ({ isOpen, onClose, children }) => { // Render the modal only if isOpen is true if (!isOpen) return null; -const modalClassname=isOpen?"modal-overlay open":"modal-overlay" + const modalClassname = isOpen ? "modal-overlay open" : "modal-overlay"; return (
-
- {children} -
- +
{children}
+
); }; diff --git a/src/pages/home/sections/section3/Section3.js b/src/pages/home/sections/section3/Section3.js index 51ee3d5..af6faa8 100644 --- a/src/pages/home/sections/section3/Section3.js +++ b/src/pages/home/sections/section3/Section3.js @@ -9,6 +9,8 @@ import Slider from "react-slick"; import { sliderSettings } from "../../../../motionUtils"; import { motion } from "framer-motion"; +import Events from "../../../../assets/data/eventsData" + import { previousYear, baseUrl } from "../../../../constants"; import axios from "axios"; @@ -44,7 +46,7 @@ const Section3 = () => {
Events
- {state.data.map((event, index) => ( + {Events.map((event, index) => (