Skip to content

Commit 514f6b9

Browse files
shansitadsshansitads
committed
projects and project pitch instr css reorganization
1 parent 5e15a40 commit 514f6b9

File tree

12 files changed

+367
-456
lines changed

12 files changed

+367
-456
lines changed

‎src/App.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
22
import LoadingAnimation from "../src/components/LoadingAnimation";
33
import Navbar from "./components/Navbar";
44
import Home from "./components/Home/Home";
5-
import Projects from "./components/Projects";
5+
import Projects from "./components/Projects/Projects";
66
import FAQ from "./components/Faq";
77
import Footer from "./components/Footer";
88
import Teams from './components/Team/Team';

‎src/components/Faq.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ const FAQ = () => {
104104
<section>
105105
<Container fluid className="faq-section" id="faq">
106106
<Container>
107-
<h1 className="project-heading">
107+
<h1 className="page-heading">
108108
Frequently Asked <strong className="purple">Questions</strong>
109109
</h1>
110110
<Row className="justify-content-center">

‎src/components/Home/ProjectPitch.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,15 @@ function ProjectPitch() {
88
<Container fluid="lg">
99
<Row className="justify-content-center">
1010
<Col md={10}>
11-
<h2 className="project-pitch-heading">
11+
<h2 className="page-heading">
1212
Project <span className="purple">Pitches</span>
1313
</h2>
1414

1515
<div className="project-pitch-container">
1616
<Row className="align-items-center">
1717
<Col lg={8}>
1818
<p className="project-pitch-text">
19-
Got a brilliant neuroscience idea brewing? Share it on our project board, then at BrainHack take the floor for a quick pitch that'll make your fellow brain enthusiasts want to join your crew. No need for a TED-worthy presentation; just bring your enthusiasm and watch as other curious minds gravitate toward your idea. Whether you're planning to revolutionize fMRI analysis or create the next big open-source neuroimaging tool, your future collaborators are in the room – they just don't know it yet!
19+
Got a brilliant neuroscience idea brewing? Share it on our project board, then at BrainHack take the floor for a quick pitch that'll make your fellow brain enthusiasts want to join your crew. No need for a TED-worthy presentation; just bring your enthusiasm and watch as other curious minds gravitate toward your idea. Whether you're planning to revolutionize fMRI analysis or create the next big open-source neuroimaging tool, your future collaborators are in the room – they just don't know it yet!
2020
</p>
2121
</Col>
2222
<Col lg={4} className="d-flex justify-content-center">

‎src/components/Home/Sponsors.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ function Sponsors() {
6565
<div className="sponsor-section">
6666
<Row className="justify-content-center">
6767
<Col xs={7} lg={10}>
68-
<h2 className="project-pitch-heading">
68+
<h2 className="page-heading">
6969
2025 <span className="purple">Sponsors</span>
7070
</h2>
7171
<Row style={{ justifyContent: "center", paddingBottom: "50px" }}>

‎src/components/Home/home.css‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -344,14 +344,6 @@
344344
border-radius: 8px;
345345
}
346346

347-
/* Project Pitch Section */
348-
.project-pitch-heading-wrapper {
349-
font-size: 2.3em;
350-
font-weight: 500;
351-
color: white;
352-
padding-top: 10px;
353-
margin-bottom: 40px;
354-
}
355347

356348
/* Sponsor Section */
357349
.sponsor-heading {

‎src/components/ProjectPitchInstr.js‎

Lines changed: 0 additions & 62 deletions
This file was deleted.

‎src/components/Projects.js‎

Lines changed: 0 additions & 82 deletions
This file was deleted.

src/components/ProjectCard.js renamed to src/components/Projects/ProjectCard.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import Card from "react-bootstrap/Card";
33
import Button from "react-bootstrap/Button";
44
import { CgWebsite } from "react-icons/cg";
55
import { BsGithub } from "react-icons/bs";
6+
import './projects.css';
67

78
function ProjectCards(props) {
89
return (

‎src/components/Projects/Projects.js‎

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
import React, { useState } from 'react';
2+
import { Container, Row, Col, Form } from 'react-bootstrap';
3+
import Particle from '../Particle';
4+
import ProjectCard from './ProjectCard';
5+
import projectsData from '../../data/data_utils';
6+
import './projects.css';
7+
8+
const ProjectPitchInstr = () => {
9+
return (
10+
<div className="project-pitch-instr-section py-5" id="project-pitch-instr">
11+
<Container fluid="lg">
12+
<Row className="justify-content-center align-items-start g-4">
13+
<Col md={6} className="text-start">
14+
<div className="project-pitch-container">
15+
<p className="project-pitch-text mb-4">
16+
BrainHack is an attendee-driven event. That means you get to bring
17+
the questions boggling your mind and we solve it together!
18+
</p>
19+
<div className="project-guidelines">
20+
<p className="mb-3">
21+
Your project can be anything you want, with just two general guidelines. Your project should:
22+
</p>
23+
<ul className="project-guidelines-list">
24+
<li className="project-guidelines-item">be broadly neuroscience related</li>
25+
<li className="project-guidelines-item">contribute to open science</li>
26+
</ul>
27+
</div>
28+
<div className="project-pitch-button-container mt-4">
29+
<a
30+
className="btn project-pitch-submit-button"
31+
href="https://docs.google.com/forms/d/e/1FAIpQLScLJXlY4obEaS8U5z4kiayC_9YKHTgxiPAfatZzvCMrW4Q_kQ/viewform"
32+
target="_blank"
33+
rel="noopener noreferrer"
34+
>
35+
Submit a Project Pitch
36+
</a>
37+
</div>
38+
<p className="project-pitch-text mt-4">
39+
Scroll down to see some examples from last year's BrainHack Vanderbilt.
40+
</p>
41+
</div>
42+
</Col>
43+
44+
<Col md={6} className="text-start">
45+
<div className="project-pitch-container">
46+
<h3 className="project-pitch-subheading mb-4">
47+
Why and How to Pitch a Project?
48+
</h3>
49+
<div className="ratio ratio-16x9">
50+
<iframe
51+
src="https://www.youtube.com/embed/Cu4kU7bE-JA"
52+
title="Why and How to Pitch a Project?"
53+
allowFullScreen
54+
className="rounded"
55+
style={{ border: '1px solid rgba(255, 255, 255, 0.1)' }}
56+
></iframe>
57+
</div>
58+
</div>
59+
</Col>
60+
</Row>
61+
</Container>
62+
</div>
63+
);
64+
}
65+
66+
const YearSelect = ({ years, currentYear, onYearChange }) => (
67+
<Form.Group className="year-select-container">
68+
<Form.Select
69+
value={currentYear}
70+
onChange={(e) => onYearChange(e.target.value)}
71+
aria-label="Select BrainHack Year"
72+
className="year-select"
73+
>
74+
{years.map((year) => (
75+
<option key={year} value={year.toString()}>
76+
{year}
77+
</option>
78+
))}
79+
</Form.Select>
80+
</Form.Group>
81+
);
82+
83+
const ComingSoon = () => (
84+
<div className="coming-soon">
85+
<h3 className="coming-soon-title">Coming Soon!</h3>
86+
<p className="coming-soon-text">
87+
Projects for BrainHack Vanderbilt will appear here soon.
88+
Stay tuned for exciting new projects!
89+
</p>
90+
</div>
91+
);
92+
93+
function Projects() {
94+
const [currentYear, setCurrentYear] = useState("2025");
95+
96+
console.log(`projectsData: ${projectsData}`);
97+
const years = Object.keys(projectsData).sort((a, b) => b - a);
98+
99+
return (
100+
<Container fluid className="project-section">
101+
<Particle />
102+
<Container>
103+
<h1 className="page-heading text-center">
104+
BrainHack <strong className="purple">Projects</strong>
105+
</h1>
106+
107+
<ProjectPitchInstr />
108+
109+
<div className="d-flex justify-content-center">
110+
<YearSelect
111+
years={years}
112+
currentYear={currentYear}
113+
onYearChange={setCurrentYear}
114+
/>
115+
</div>
116+
117+
{(projectsData[currentYear].length === 0) ? (
118+
<ComingSoon />
119+
) : (
120+
<Row className="project-card-row">
121+
{projectsData[currentYear].map((project, index) => (
122+
<Col md={4} className="project-card-col" key={index}>
123+
<ProjectCard
124+
title={project.title}
125+
description={project.description}
126+
imgPath={project.imgPath}
127+
ghLink={project.ghLink}
128+
demoLink={project.demoLink}
129+
/>
130+
</Col>
131+
))}
132+
</Row>
133+
)}
134+
</Container>
135+
</Container>
136+
);
137+
}
138+
139+
export default Projects;

0 commit comments

Comments
 (0)