Skip to content

Commit

Permalink
feat(gtacodestorm):displaypage
Browse files Browse the repository at this point in the history
  • Loading branch information
AswinAsok committed Aug 24, 2023
1 parent 292a665 commit eaef0b7
Show file tree
Hide file tree
Showing 22 changed files with 431 additions and 3 deletions.
Binary file added public/assets/events/gtacodestorm/1.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/10.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/11.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/12.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/13.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/14.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/15.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/16.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/2.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/3.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/4.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/5.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/6.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/7.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/8.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/9.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/kkem.webp
Binary file not shown.
Binary file added public/assets/events/gtacodestorm/mainlogo.webp
Binary file not shown.
8 changes: 5 additions & 3 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,8 @@ import YIP2023 from "./Pages/YIP2023/YIP2023";
import BeWebDev from "./Pages/Events/BeWebDev/BeWebDev";
import YipForm from "./Pages/YIP/YIPAfterForm/YipForm";
import Journey from "./Pages/UserJourney/Journey";
import MutechLeaderboard from "./Pages/MutechLeaderBoard/MutechLeaderBoard";
import MutechLeaderboard from "./Pages/MutechLeaderBoard/MutechLeaderBoard";
import CodeStorm from "./Pages/Events/GTA/CodeStorm/CodeStorm";

function App() {
const [redirects, setRedirects] = useState([]);
Expand Down Expand Up @@ -81,7 +82,7 @@ function App() {
<Redirection link="https://yip.kerala.gov.in/" />
}
/> */}
<Route path='mutech/leaderboard' element={<MutechLeaderboard />} />
<Route path="mutech/leaderboard" element={<MutechLeaderboard />} />

<Route path="/careers" element={<Career />} />
<Route path="*" element={<NotFound isLoaded={isLoaded} />} />
Expand All @@ -108,6 +109,7 @@ function App() {
<Route path="/wikisyllabus" element={<WikiSyllabus />} />
<Route path="/yip" element={<YIP2023 />} />
<Route path="/events/bewebdev" element={<BeWebDev />} />
<Route path="events/gta/codestorm" element={<CodeStorm />} />
<Route path="/team">
<Route path="" element={<Teams />} />
</Route>
Expand All @@ -132,7 +134,7 @@ function App() {
element={<CampusLogoGenerator />}
/>
<Route path="/yipredirect" element={<YipForm />} />
<Route path="/journey" element={<Journey/>}/>
<Route path="/journey" element={<Journey />} />
</Route>
</Routes>
</Router>
Expand Down
115 changes: 115 additions & 0 deletions src/Pages/Events/GTA/CodeStorm/CodeStorm.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
import React from "react";
import styles from "./CodeStorm.module.css";
import Navbar from "../../../../Components/Navbar/Navbar";
import Footer from "../../../../Components/Footer/Footer";
import data from "./data.json";

const CodeStorm = () => {
console.log(data);
return (
<>
<Navbar />
<div className={styles.main_container}>
<div className={styles.first_view_container}>
<div className={styles.first_view}>
<div className={styles.fv_texts}>
<p className={styles.fv_heading}>
<span>Grand Tech Adventures</span> CodeStorm
</p>

<p className={styles.fv_tagline}>
GTA CodeStorm is a 24-hour hackathon which is organized in
partnership with the Kerala Knowledge Economy Mission. CodeStorm
has 3 tracks, namely, software, design, hardware.
</p>
<div className={styles.event_partners}>
<div className={styles.partners}>
<p className={styles.event_partners_heading}>
Event Partners
</p>
<div className={styles.partner}>
<img src="/assets/events/gtacodestorm/kkem.webp" alt="" className={styles.partner_image} />
</div>
</div>
</div>
</div>
<div className={styles.fv_images}>
<img
src="/assets/events/gtacodestorm/mainlogo.webp"
alt=""
className={styles.fv_img}
/>
</div>
</div>

{/* <div className={styles.second_view_container}>
<div className={styles.second_view}>
<div className={styles.image_container}>
{Array.from(Array(16).keys()).map((i) => {
return (
<img
src={`/assets/events/gtacodestorm/${i}.webp`}
alt=""
className={styles.image}
/>
);
})}
</div>
</div>
</div> */}

<div className={styles.third_view_container}>
<div className={styles.third_view}>
<div className={styles.tv_texts}>
<p className={styles.tv_heading}>
<span>GTA:CodeStorm</span> Winners
</p>
<p className={styles.tv_tagline}>
The winners of CodeStorm 2023 are as shown below. Each team
has put in a lot of effort and hardwork to achieve this feat.
We congratulate them on their success and wish them all the
best for their future endeavours.
</p>
</div>

<div className={styles.tv_listing_container}>
<div className={styles.tv_listing}>
{data &&
data.map((item) => (
<div className={styles.tv_card}>
<p className={styles.team_name}>
Team Name: {item.name}
</p>
<p className={styles.team_code}>
Team Code: {item.code}
</p>
<p className={styles.team_lead}>
Team Laed: {item.lead}
</p>
<p className={styles.team_place}>
{item.place} Position
</p>
<p className={styles.team_members}>{item.team}</p>
<a
href={item.link1}
target="_blank"
rel="noopener noreferrer"
>
<button className={styles.team_link}>
View Project
</button>
</a>
</div>
))}
</div>
</div>
</div>
</div>
</div>
</div>
<Footer />
</>
);
};

export default CodeStorm;
228 changes: 228 additions & 0 deletions src/Pages/Events/GTA/CodeStorm/CodeStorm.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,228 @@
* {
padding: 0;
margin: 0;
}

.first_view_container,
.second_view_container {
padding: 2rem;
background-color: #ffffff;
}

.first_view {
display: flex;
flex-direction: column-reverse;
}

.fv_img {
width: 18rem;
display: block;
margin: auto;
margin-top: 2rem;
}

.fv_texts {
text-align: center;
}

.fv_heading {
font-family: "Noto Sans", sans-serif;
font-size: 2.5rem;
font-weight: 600;
color: #303030;
}

.fv_heading span {
font-weight: 600;
color: #f78c40;
}

.fv_tagline {
margin-top: 0.5rem;
font-family: "Poppins", sans-serif;
}

.event_partners_heading {
font-family: "Noto Sans", sans-serif;
font-size: 1rem;
margin-top: 0.5rem;
font-weight: 500;
margin-right: 1rem;
}

.partners {
display: flex;
justify-content: center;
align-self: center;
margin: 1rem 0;
}

.partner_image {
height: 2rem;
margin-right: 0.5rem;
display: block;
}

.detailsbtn {
margin-top: 1rem;
}

@media only screen and (min-width: 1000px) {
.first_view_container,
.second_view_container {
padding: 3rem 3rem 0;
}

.partners {
justify-content: left;
align-self: left;
}

.first_view,
.second_view {
max-width: 1300px;
margin: auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 1rem;
}

.fv_img {
display: block;
margin: auto;
width: 35rem;
}

.fv_texts {
text-align: left;
width: 50%;
}

.fv_heading {
font-family: "Noto Sans", sans-serif;
font-size: 4.55rem;
line-height: 5rem;
font-weight: 600;
}

.fv_tagline {
margin-top: 1rem;
font-size: 1rem;
width: 80%;
}

.detailsbtn {
margin-right: 1rem;
}
}

.third_view {
margin-top: 2rem;
}

.image_container {
display: flex;
flex-wrap: nowrap;
overflow-x: auto;
margin-bottom: 1rem;
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}

.image_container::-webkit-scrollbar {
display: none; /* Chrome, Safari, and Opera */
}

.image_container img {
aspect-ratio: 3/2;
object-fit: contain;
width: 100%;
height: 15rem;
animation: move-left 15s linear infinite;
}

@keyframes move-left {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-100%);
}
}

.tv_heading {
font-family: "Noto Sans", sans-serif;
color: #404040;
font-size: 2.5rem;
font-weight: 600;
margin-bottom: 0.5rem;
}

.tv_text {
margin-top: 2rem;
}

.tv_heading span {
color: #f78c40;
}

.tv_tagline {
font-family: "Poppins";
max-width: 35rem;
}

.tv_listing {
display: flex;
flex-wrap: wrap;
margin-top: 2rem;
}

/* Assuming these styles are defined using CSS Modules */
.tv_card {
background-color: #ffffff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
padding: 1rem;
width: 25rem;
margin: 1rem;
display: flex;
flex-direction: column;
}

.tv_text {
margin-top: 1rem;
}

.team_name,
.team_code,
.team_lead,
.team_place,
.team_members {
margin: 0.25rem 0;
}

.team_link {
background-color: #f78c40;
color: white;
border: none;
border-radius: 4px;
padding: 0.5rem 0.75rem;
cursor: pointer;
transition: background-color 0.3s;
}

.team_link:hover {
background-color: #e57329;
}

.third_view_container {
max-width: 1300px;
margin: auto;
}

.third_view {
display: flex;
flex-direction: column;
}
Loading

0 comments on commit eaef0b7

Please sign in to comment.