diff --git a/src/assets/data/HeaderContent.js b/src/assets/data/HeaderContent.js index b073023..73c2b6b 100644 --- a/src/assets/data/HeaderContent.js +++ b/src/assets/data/HeaderContent.js @@ -6,6 +6,13 @@ const HeaderData = { frontWord: "Hackathon Prizes", frontWordMobile: "Prizes", }, + venue: { + backWord: "Venue", + backWordSize_mobile: "85px", + backWordSpacing_mobile: "0.2rem", + frontWord: "Location", + frontWordMobile: "Location", + }, timeline: { backWord: "Roadmap", backWordMobile: "Plan", diff --git a/src/assets/data/NavbarContent.js b/src/assets/data/NavbarContent.js index e1ec84b..b39c09d 100644 --- a/src/assets/data/NavbarContent.js +++ b/src/assets/data/NavbarContent.js @@ -11,6 +11,10 @@ const navbarContent = { text: "About", link: "about", }, + { + text: "Venue", + link: "venue", + }, { text: "Timeline", link: "timeline", diff --git a/src/components/private/venue/Venue.jsx b/src/components/private/venue/Venue.jsx new file mode 100644 index 0000000..c60cfe5 --- /dev/null +++ b/src/components/private/venue/Venue.jsx @@ -0,0 +1,35 @@ +import React from "react"; +import HeaderData from "../../../assets/data/HeaderContent"; +import { ComingSoon, Header } from "../../shared"; +import "./Venue.scss"; +import first from "../../../assets/images/PrizesImages/first.png"; +import second from "../../../assets/images/PrizesImages/second.png"; +import third from "../../../assets/images/PrizesImages/third.png"; +import agun from "../../../assets/images/PrizesImages/agun.png"; + +const Venue = () => { + return ( + <> +
+
+ + + +

+ {" "} + JIS College of Engineering Barrackpore +

+

+ Kalyani Expy, Block A5, Block A, Kalyani, West Bengal 741235, India +

+
+ + ); +}; + +export default Venue; diff --git a/src/components/private/venue/Venue.scss b/src/components/private/venue/Venue.scss new file mode 100644 index 0000000..93fc7f9 --- /dev/null +++ b/src/components/private/venue/Venue.scss @@ -0,0 +1,59 @@ +.venue_parent { + padding: 4rem 7rem; + padding-bottom: 0; + margin-top: 8rem; + position: relative; + overflow: hidden; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-family: var(--heading-font); + + @media screen and (max-width: 576px) { + padding: 2rem 1.5rem; + margin-top: 2rem; + } + + iframe { + width: 70%; + margin: 0 auto; + margin-top: 5rem; + height: 500px; + border: none; + border-radius: 20px; + border: 3px solid #ff1717; + + &:focus { + outline: none; + } + + @media screen and (max-width: 576px) { + width: 100%; + height: 200px; + margin-top: 3rem; + } + } + + .location_header { + margin-top: 2rem; + font-size: 2rem; + font-weight: 700; + + @media screen and (max-width: 576px) { + text-align: center; + font-size: 1.3rem; + } + } + + .location_subheader { + margin-top: 0.5rem; + font-size: 1rem; + font-weight: 500; + + @media screen and (max-width: 576px) { + text-align: center; + font-size: 17px; + } + } +} diff --git a/src/components/shared/navbar/Navbar.jsx b/src/components/shared/navbar/Navbar.jsx index eb172a2..d22ce9a 100644 --- a/src/components/shared/navbar/Navbar.jsx +++ b/src/components/shared/navbar/Navbar.jsx @@ -10,17 +10,6 @@ const Navbar = () => { const handleClick = () => { setIsActive((prevIsActive) => !prevIsActive); - - // if (isActive) { - // document.getElementsByClassName("main_parent")[0].style.height = "auto"; - // document.getElementsByClassName("main_parent")[0].style.overflow = "auto"; - // document.getElementsByClassName("footer")[0].style.display = "block"; - // } else { - // document.getElementsByClassName("main_parent")[0].style.height = "100vh"; - // document.getElementsByClassName("main_parent")[0].style.overflow = - // "hidden"; - // document.getElementsByClassName("footer")[0].style.display = "none"; - // } }; const navigate = useNavigate(); diff --git a/src/pages/home/Home.jsx b/src/pages/home/Home.jsx index 9d51a45..4faf660 100644 --- a/src/pages/home/Home.jsx +++ b/src/pages/home/Home.jsx @@ -12,6 +12,7 @@ import { import Timer from "../../components/private/timer/Timer"; import Timeline from "../../components/private/timeline/Timeline"; import "./Home.scss"; +import Venue from "../../components/private/venue/Venue"; const Home = () => { return ( @@ -21,6 +22,7 @@ const Home = () => { {/* */} +