From df6200929031c744a7225841a39ada4c170d8599 Mon Sep 17 00:00:00 2001 From: A-R-P-I-T-JAIN <116783129+A-R-P-I-T-JAIN@users.noreply.github.com> Date: Sun, 22 Oct 2023 21:54:48 +0530 Subject: [PATCH 1/2] another commit --- public/images/grid2.jpg | Bin 0 -> 3568 bytes src/App.jsx | 2 + src/components/Events/Events.css | 261 +++++++++++++++++++++++++++++++ src/components/Events/Events.jsx | 104 ++++++++++++ 4 files changed, 367 insertions(+) create mode 100644 public/images/grid2.jpg create mode 100644 src/components/Events/Events.css create mode 100644 src/components/Events/Events.jsx diff --git a/public/images/grid2.jpg b/public/images/grid2.jpg new file mode 100644 index 0000000000000000000000000000000000000000..9f7d25ac9380e174c88dd5227a41e858965acdc2 GIT binary patch literal 3568 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 }/> } /> + } /> diff --git a/src/components/Events/Events.css b/src/components/Events/Events.css new file mode 100644 index 0000000..4e23402 --- /dev/null +++ b/src/components/Events/Events.css @@ -0,0 +1,261 @@ +.evnt_cont { + display: flex; + flex-direction: column; + align-items: center; + gap: 100px; +} +.evnt_main { + margin-top: 100px; + position: relative; + width: 100%; + height: 100vh; + background: radial-gradient(rgba(4, 77, 77, 0.387),black); + background-size: cover; + display: flex; + align-items: center; + justify-content: space-evenly; +} +.evnt_card { + position: relative; + width: 519px; + height: 580px; + background: linear-gradient(rgba(255, 255, 255, 0.102),rgba(255, 255, 255, 0.093)); + border: 2px solid rgba(255, 255, 255, 0.3); + border-radius: 22px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-evenly; + margin: 100px 0; +} +.evnt_card > img { + width: 440px; + height: 340px; + border-radius: 16px; +} +.evnt_card > div { + width: 440px; + color: white; +} +.evnt_card > div h1 { + font-size: 20px; + font-weight: 600; +} +.evnt_card > button { + position: absolute; + width: 236px; + height: 46px; + border-radius: 40px; + background: linear-gradient(90deg,rgba(1, 179, 255, 1),rgba(56, 161, 187, 1),rgba(250, 255, 0, 1)); + bottom: 0; + left: 50%; + transform: translate(-50%,50%); + font-weight: 700; +} +.all_about_event { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; +} +.all_about_event h1 { + /* font-family: 'Bebas Neue'; */ + font-size: 80px; + font-weight: 900; + background: linear-gradient(90deg,rgba(250, 255, 0, 1),rgba(56, 161, 187, 1),rgba(1, 179, 255, 1)); + background-clip: text; + color: transparent; + display: flex; +} +.all_about_event h2 { + color: white; + font-size: 60px; + font-weight: 900; +} +.all_about_event p { + color: aliceblue; + text-align: center; + padding: 0 100px; +} +.evnt_main > img { + position: absolute; + width: 100%; + z-index: 0; + height: 100vh; + top: 0; + left: 0; + filter: opacity(0.2); +} +.upcoming_events { + display: flex; + flex-direction: column; + align-items: center; + gap: 40px; +} +.upcoming_events > h1 { + font-size: 120px; + background: linear-gradient(90deg,rgba(250, 255, 0, 1),rgba(0, 240, 255, 1)); + background-clip: text; + color: transparent; + font-weight: 800; +} +.upcoming_events_cont { + max-width: 1200px; + display: flex; + flex-wrap: wrap; + gap: 20px; +} +.upcoming_events_cont > div { + width: 384px; + height: 96px; + clip-path: polygon(100% 0, 100% 48%, 85% 100%, 0 100%, 0 0); + background: linear-gradient(45deg,rgba(250, 255, 0, 1),rgba(0, 240, 255, 1)); + display: flex; + align-items: center; + justify-content: center; + border-radius: 10px; +} +.upcoming_event_card { + width: 382px; + height: 94px; + clip-path: polygon(100% 0, 100% 48%, 85% 100%, 0 100%, 0 0); + background-color: black; + border-radius: 10px; + display: flex; + align-items: center; + gap: 20px; + padding: 20px; + /* justify-content: space-evenly; */ +} +.ue_circle { + width: 56px; + height: 56px; + background-color: white; + border-radius: 100%; +} +.ue_content h1 { + font-size: 20px; + color: white; +} +.ue_content p { + font-size: 15px; + color: white; +} +.upcoming_event_card > h2 { + font-size: 20px; + color: rgba(21, 191, 253, 1); + text-decoration: underline; + margin-left: 30px; +} +.ue_btn { + width: 214px; + height: 60px; + border-radius: 60px; + background: linear-gradient(270deg,rgba(250, 255, 0, 1),rgba(56, 161, 187, 1),rgba(0, 204, 255, 1)); + display: flex; + align-items: center; + justify-content: center; +} +.ue_btn button { + width: 210px; + height: 56px; + background-color: black; + font-size: 18px; + color: white; + border-radius: 60px; +} + +/* ////////////////////////////////////// */ + +@media screen and (max-width: 600px) { + .evnt_cont { + gap: 100px; + } + .evnt_main { + margin-top: 40px; + width: 100%; + height: 100vh; + flex-direction: column; + } + .evnt_card { + width: 250px; + height: 300px; + border-radius: 22px; + margin: 20px 0; + } + .evnt_card > img { + width: 220px; + height: 160px; + border-radius: 16px; + } + .evnt_card > div { + width: 220px; + } + .evnt_card > div h1 { + font-size: 13px; + font-weight: 600; + } + .evnt_card > div h3 { + font-size: 10px; + } + .evnt_card > button { + width: 100px; + height: 25px; + border-radius: 30px; + font-weight: 700; + font-size: 12px; + } + .all_about_event h1 { + font-size: 30px; + } + .all_about_event h2 { + font-size: 30px; + } + .all_about_event p { + padding: 0 20px; + } + .upcoming_events { + gap: 40px; + } + .upcoming_events > h1 { + font-size: 32px; + } + .upcoming_events_cont { + max-width:90%; + gap: 20px; + } + .upcoming_events_cont > div { + width: 300px; + height: 70px; + } + .upcoming_event_card { + width: 298px; + height: 68px; + gap: 20px; + padding: 20px; + } + .ue_circle { + width: 30px; + height: 30px; + } + .ue_content h1 { + font-size: 12px; + } + .ue_content p { + font-size: 8px; + } + .upcoming_event_card > h2 { + font-size: 10px; + } + .ue_btn { + width: 150px; + height: 40px; + border-radius: 40px; + } + .ue_btn button { + width: 146px; + height: 36px; + font-size: 15px; + border-radius: 40px; + } +} \ No newline at end of file diff --git a/src/components/Events/Events.jsx b/src/components/Events/Events.jsx new file mode 100644 index 0000000..e889839 --- /dev/null +++ b/src/components/Events/Events.jsx @@ -0,0 +1,104 @@ +import React from 'react' +import './Events.css' +import firstEvent from '../../../public/images/interactive session.jpg' +import secondEvent from '../../../public/images/java session.jpg' +import grid2 from '../../../public/images/grid2.jpg' + +const Event = () => { + + const upcomingEvents = [ + { + h1: "Codeathon", + p: "March 2024", + RSPV: true + }, + { + h1: "Republic Coders 3.0", + p: "January 2024", + RSPV: false + }, + { + h1: "HactoberFest 2023", + p: "October 2023", + RSPV: true + }, + { + h1: "Codepentry", + p: "March 2024", + RSPV: true + }, + { + h1: "Tech Trends Seminar", + p: "April 2024", + RSPV: false + }, + { + h1: "Interactive Session", + p: "May 2024", + RSPV: false + }, + ] + + return ( +
+
+ +
+ +
+

SAMEER BAMANHA

+

Guest Speaker

+
+
+

ONLINE

+

Google Meet

+
+ +
+
+ +
+

SAMEER BAMANHA

+

Guest Speaker

+
+
+

ONLINE

+

Google Meet

+
+ +
+
+ +
+

ALL ABOUT EVENTS

+

OF JEC ACM

+

Stay connected and informed about upcoming events and activities organized by ACM JEC Student Chapter. Our events are designed to enhance your knowledge, provide hands-on experience, and foster networking within the tech community. Join us for these exciting opportunities!

+
+ +
+

UPCOMING EVENTS

+
+ { + upcomingEvents.map((item) => ( +
+
+
+
+

{item.h1}

+

{item.p}

+
+ {item.RSPV ? (

RSPV

): null} +
+
+ )) + } +
+
+ +
+
+
+ ) +} + +export default Event From 53978cabffa55a41acf521ceb9d04bd391d54b62 Mon Sep 17 00:00:00 2001 From: A-R-P-I-T-JAIN <116783129+A-R-P-I-T-JAIN@users.noreply.github.com> Date: Sun, 22 Oct 2023 22:06:57 +0530 Subject: [PATCH 2/2] events section added --- src/App.jsx | 1 - src/components/MainLanding/MainLanding.css | 3 +-- src/components/MainLanding/MainLanding.jsx | 2 +- 3 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 97bcbec..e823181 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -6,7 +6,6 @@ import JoinUs from "./components/why_join_us/Join_us"; import Signup from "./components/SignupPage/Signup"; import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; import Event from "./components/Events/Events.jsx"; -import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; function App() { const [isLoading, setloading] = useState(true); diff --git a/src/components/MainLanding/MainLanding.css b/src/components/MainLanding/MainLanding.css index f9733e2..0382059 100644 --- a/src/components/MainLanding/MainLanding.css +++ b/src/components/MainLanding/MainLanding.css @@ -39,7 +39,6 @@ html { .content h1 { color: white; font-family: 'Bebas Neue'; - } .content h1 span { background: linear-gradient(90deg,yellow,rgba(0, 227, 241, 1)); @@ -73,7 +72,7 @@ html { left: 0; width: 100%; height: 100vh; - filter: opacity(0.15); + filter: opacity(0.1); } .temp { display: flex; diff --git a/src/components/MainLanding/MainLanding.jsx b/src/components/MainLanding/MainLanding.jsx index 96f5fd5..e6ad7f3 100644 --- a/src/components/MainLanding/MainLanding.jsx +++ b/src/components/MainLanding/MainLanding.jsx @@ -8,7 +8,7 @@ import lines from '../../../public/images/lines.png' const MainLanding = () => { return (
- + {/*
*/} {/*
*/}