-
-
-
-
- 
-
- All Initiatives
-
-
-
+
+ );
+ return eventsPage;
+}
diff --git a/src/components/Home.css b/src/components/Home.css
index 318ecfd..70c623f 100644
--- a/src/components/Home.css
+++ b/src/components/Home.css
@@ -250,4 +250,4 @@ MISSION statement breaks at around 613 px; there should be some dyanmic stuff ha
font-style: normal;
font-weight: 400;
line-height: normal;
-}
\ No newline at end of file
+}
diff --git a/src/components/Home.jsx b/src/components/Home.jsx
index 8287222..74af6c4 100644
--- a/src/components/Home.jsx
+++ b/src/components/Home.jsx
@@ -3,7 +3,7 @@ import React from "react";
import CustomCursor from "./NonPage/Cursor";
import NavBar from "./NonPage/NavBar";
import Schedule from "./NonPage/Schedule";
-import "./Chars.css"
+import "./Chars.css";
import Border from "../Images/BorderImg.svg";
import TribecaBridge from "../Images/StuyBridgeDrawing.png";
import Texture from "./NonPage/Texture";
@@ -18,254 +18,284 @@ import Data from "../schedules.json";
import { useState, useEffect, useRef } from "react";
function cSpanning(text) {
- return text.split('').map((char, index) => (
- {char}
- ));
+ return text.split("").map((char, index) => (
+
+ {char}
+
+ ));
}
export default function Home() {
- const [minutes, setMinutes] = useState(5); //should be used for the schedule page
- const [currPeriod, setPeriod] = useState(0);
- const [dayType, setDayType] = useState("Regular");
- const [periodDuration, setPeriodDuration] = useState(40);
- const [minutesLeft, setMinutesLeft] = useState(0);
- const [AorBDay, setAorBDay] = useState("A");
- //fetch the sheets data
+ const [minutes, setMinutes] = useState(5); //should be used for the schedule page
+ const [currPeriod, setPeriod] = useState(0);
+ const [dayType, setDayType] = useState("Regular");
+ const [periodDuration, setPeriodDuration] = useState(40);
+ const [minutesLeft, setMinutesLeft] = useState(0);
+ const [AorBDay, setAorBDay] = useState("A");
+ //fetch the sheets data
+ const getCurrentPeriod = () => {
+ const now = new Date();
+ now.setHours(now.getHours());
+ now.setMinutes(now.getMinutes());
+ const schedule = getDayInfo(dayType);
+ const periods = getTimes(schedule);
+ for (let i = 0; i < periods.length; i++) {
+ const start = new Date();
+ start.setHours(parseInt(schedule[i].startTime.split(":")[0]));
+ start.setMinutes(parseInt(schedule[i].startTime.split(":")[1]));
+ const diff = now.getTime() - start.getTime();
+ if (diff > 0) {
+ setMinutes(diff / 60000);
+ setMinutesLeft(schedule[i].duration - diff / 60000);
+ setPeriod(periods[i]);
+ setPeriodDuration(schedule[i].duration);
+ } else {
+ break;
+ }
+ }
+ };
- const getCurrentPeriod = () => {
- const now = new Date();
- now.setHours(now.getHours())
- now.setMinutes(now.getMinutes());
- const schedule = getDayInfo(dayType);
- const periods = getTimes(schedule);
- for (let i = 0; i < periods.length; i++) {
- const start = new Date()
- start.setHours(parseInt(schedule[i].startTime.split(":")[0]));
- start.setMinutes(parseInt(schedule[i].startTime.split(":")[1]));
- const diff = now.getTime() - start.getTime();
- if (diff > 0) {
- setMinutes(diff / 60000);
- setMinutesLeft(schedule[i].duration - diff / 60000);
- setPeriod(periods[i]);
- setPeriodDuration(schedule[i].duration);
- } else {
- break;
- }
- }
+ const onScroll = () => {
+ if (scRef.current) {
+ const { top, bottom } = scRef.current.getBoundingClientRect();
+ const viewportHeight = window.innerHeight;
+ const isInView = bottom > -200 && bottom < viewportHeight;
+ const isOutOfView = bottom <= -200 || top >= viewportHeight;
+ document.querySelector(".mission-box").style.backgroundColor =
+ isInView || !isOutOfView ? "#051e4f" : "#fbe4df";
+ document.querySelector(".schedule-specifics").style.backgroundColor =
+ isInView || !isOutOfView ? "#051e4f" : "#fbe4df";
}
+ };
- const onScroll = () => {
- if (scRef.current) {
- const { top, bottom } = scRef.current.getBoundingClientRect();
- const viewportHeight = window.innerHeight;
- const isInView = bottom > -200 && bottom < viewportHeight;
- const isOutOfView = bottom <= -200 || top >= viewportHeight;
- document.querySelector('.mission-box').style.backgroundColor = isInView || !isOutOfView ? '#051e4f' : '#fbe4df';
- document.querySelector('.schedule-specifics').style.backgroundColor = isInView || !isOutOfView ? '#051e4f' : '#fbe4df';
- }
- };
+ const fetchSheetsData = async () => {
+ try {
+ const ID = "1yB7zzw0I3hUjLwgKZXMpBioQ9FNkTg2bp3skTwtatHk";
+ const sheet_name = "Schedule";
+ const response = await fetch(
+ `https://docs.google.com/spreadsheets/d/${ID}/gviz/tq?tqx=out:csv&sheet=${sheet_name}`,
+ );
+ const text = await response.text();
+ const today = new Date();
+ const parsedData = Papa.parse(text, { header: true }).data;
+ setDayType(parsedData[today.getDay()].DayType);
+ setAorBDay(parsedData[today.getDay()].AorBDay);
+ } catch (err) {
+ console.log(err);
+ }
+ };
- const fetchSheetsData = async () => {
- try {
- const ID = "1yB7zzw0I3hUjLwgKZXMpBioQ9FNkTg2bp3skTwtatHk";
- const sheet_name = "Schedule";
- const response = await fetch(`https://docs.google.com/spreadsheets/d/${ID}/gviz/tq?tqx=out:csv&sheet=${sheet_name}`);
- const text = await response.text();
- const today = new Date();
- const parsedData = Papa.parse(text, { header: true }).data;
- setDayType(parsedData[today.getDay()].DayType);
- setAorBDay(parsedData[today.getDay()].AorBDay);
- } catch (err) {
- console.log(err);
- }
+ useEffect(() => {
+ return () => {
+ window.removeEventListener("scroll", handleScroll);
};
+ }, []);
- useEffect(() => {
- return () => {
- window.removeEventListener('scroll', handleScroll);
- };
- }, []);
-
- useEffect(() => {
- fetchSheetsData();
- }, []);
+ useEffect(() => {
+ fetchSheetsData();
+ }, []);
- //get period
- useEffect(() => {
- //set an interval
- const timer = setInterval(() => {
- getCurrentPeriod();
- }, 1000);
- return () => clearInterval(timer);
- });
+ //get period
+ useEffect(() => {
+ //set an interval
+ const timer = setInterval(() => {
+ getCurrentPeriod();
+ }, 1000);
+ return () => clearInterval(timer);
+ });
- const scRef = useRef(null);
- useEffect(() => {
- window.addEventListener('scroll', onScroll);
- if (document.querySelector('.mission-box') && document.querySelector('.schedule-specifics')) {
- document.querySelector('.mission-box').style.backgroundColor = '#051e4f';
- document.querySelector('.schedule-specifics').style.backgroundColor = '#051e4f';
- }
- return () => window.removeEventListener('scroll', onScroll);
- }, []);
-
-
- const dayInfo = {
- dayType,
- minutes,
- minutesLeft,
- currPeriod,
- periodDuration,
- AorBDay
+ const scRef = useRef(null);
+ useEffect(() => {
+ window.addEventListener("scroll", onScroll);
+ if (
+ document.querySelector(".mission-box") &&
+ document.querySelector(".schedule-specifics")
+ ) {
+ document.querySelector(".mission-box").style.backgroundColor = "#051e4f";
+ document.querySelector(".schedule-specifics").style.backgroundColor =
+ "#051e4f";
}
+ return () => window.removeEventListener("scroll", onScroll);
+ }, []);
- const periodTimes = getPeriodTimes(dayType);
- return (<>
-
+
+
+
+
+
+
+ All Initiatives
+
+
- );
- return eventsPage;
-}
\ No newline at end of file
+
- 
-
-
-
-
-
-
-
- 
-
-
-
-
- 
- 
- 
- {getPeriods(getDayInfo(dayType)).map((period, index) => {
- return (
-
-
-
)
- })}
-
+ const dayInfo = {
+ dayType,
+ minutes,
+ minutesLeft,
+ currPeriod,
+ periodDuration,
+ AorBDay,
+ };
- {period === currPeriod ?
-
-
-
- b
- {period}
-
- a
-
- : {period}
}
-
- {periodTimes[index]}
-
-
- 
-
-
- View all schedules
+ const periodTimes = getPeriodTimes(dayType);
+ return (
+ <>
+
@@ -276,7 +351,15 @@ export default function People() {
+
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {getPeriods(getDayInfo(dayType)).map((period, index) => {
+ return (
+
-
+
-
+ {period === currPeriod ? (
+
+
+ b
+ {period}
+ a
+
+ ) : (
+ {period}
+ )}
+ {periodTimes[index]}
-
- - {cSpanning("Welcome to the Yoo-Rhee caucus. We are committed to delivering on our promises \n through well organized initiatives, including cabinet restructuring, enhancing \n college readiness, and meaningful themed events.")} -
-
-
-
-
-
+ );
+ })}
+ We'll stay with you this year
-
-
+
+
+
-
+
+
+
+ + {cSpanning( + "Welcome to the Yoo-Rhee caucus. We are committed to delivering on our promises \n through well organized initiatives, including cabinet restructuring, enhancing \n college readiness, and meaningful themed events.", + )} +
+
+
+
+
+
+
+ We'll stay with you this year
+
+
+
+
+
- );
+ );
}
-
const getTimes = (schedule) => {
- let final = [];
- for (let i = 0; i < schedule.length; i++) {
- final.push(schedule[i].name);
- }
- return final;
-}
+ let final = [];
+ for (let i = 0; i < schedule.length; i++) {
+ final.push(schedule[i].name);
+ }
+ return final;
+};
const getPeriods = (schedule) => {
- let final = [];
- for (let i = 0; i < schedule.length; i++) {
- if (!(schedule[i].name.includes("Before") && i !== 0)) {
- final.push(schedule[i].name);
- }
+ let final = [];
+ for (let i = 0; i < schedule.length; i++) {
+ if (!(schedule[i].name.includes("Before") && i !== 0)) {
+ final.push(schedule[i].name);
}
- return final;
-}
+ }
+ return final;
+};
const getDayInfo = (DayType) => {
- switch (DayType) {
- case "Conference":
- return Data.Conference.schedule;
- case "Homeroom":
- return Data.Homeroom.schedule;
- case "Extended":
- return Data["Extended Homeroom"].schedule;
- case "Regular":
- return Data.Regular.schedule;
- case "TF":
- return Data["Thurs-Fri"].schedule;
- default:
- return Data.Regular.schedule;
- }
-}
+ switch (DayType) {
+ case "Conference":
+ return Data.Conference.schedule;
+ case "Homeroom":
+ return Data.Homeroom.schedule;
+ case "Extended":
+ return Data["Extended Homeroom"].schedule;
+ case "Regular":
+ return Data.Regular.schedule;
+ case "TF":
+ return Data["Thurs-Fri"].schedule;
+ default:
+ return Data.Regular.schedule;
+ }
+};
const getPeriodTimes = (DayType) => {
- const info = getDayInfo(DayType);
- let final = [];
- for (let i = 0; i < info.length; i++) {
- if (!(info[i].name.includes("Before") && i !== 0)) {
- if (i === 0) {
- final.push(`Before ${info[i + 1].startTime}`)
- } else if (i === info.length - 1) {
- final.push(`After ${info[i].startTime}`)
- } else {
- const start = info[i].startTime;
- const end = new Date();
- end.setHours(parseInt(start.split(":")[0]));
- end.setMinutes(parseInt(start.split(":")[1]) + info[i].duration);
- final.push(`${start} - ${end.getHours()}:${end.getMinutes() < 10 ? "0" + end.getMinutes() : end.getMinutes()}`)
-
- }
- }
+ const info = getDayInfo(DayType);
+ let final = [];
+ for (let i = 0; i < info.length; i++) {
+ if (!(info[i].name.includes("Before") && i !== 0)) {
+ if (i === 0) {
+ final.push(`Before ${info[i + 1].startTime}`);
+ } else if (i === info.length - 1) {
+ final.push(`After ${info[i].startTime}`);
+ } else {
+ const start = info[i].startTime;
+ const end = new Date();
+ end.setHours(parseInt(start.split(":")[0]));
+ end.setMinutes(parseInt(start.split(":")[1]) + info[i].duration);
+ final.push(
+ `${start} - ${end.getHours()}:${
+ end.getMinutes() < 10 ? "0" + end.getMinutes() : end.getMinutes()
+ }`,
+ );
+ }
}
- return final;
-}
+ }
+ return final;
+};
const updateCharacterOpacity = () => {
- const chars = document.querySelectorAll('.mission-statement .character');
- const viewportHeight = window.innerHeight;
+ const chars = document.querySelectorAll(".mission-statement .character");
+ const viewportHeight = window.innerHeight;
- chars.forEach(char => {
- const charRect = char.getBoundingClientRect();
- const charCenter = charRect.top + charRect.height / 2;
- const distanceFromCenter = Math.abs(viewportHeight / 2 - charCenter);
- const opacity = Math.max(0, 1 - 2 * distanceFromCenter / viewportHeight);
- char.style.opacity = opacity;
- });
+ chars.forEach((char) => {
+ const charRect = char.getBoundingClientRect();
+ const charCenter = charRect.top + charRect.height / 2;
+ const distanceFromCenter = Math.abs(viewportHeight / 2 - charCenter);
+ const opacity = Math.max(0, 1 - (2 * distanceFromCenter) / viewportHeight);
+ char.style.opacity = opacity;
+ });
};
const handleScroll = () => {
- window.requestAnimationFrame(updateCharacterOpacity);
+ window.requestAnimationFrame(updateCharacterOpacity);
};
-window.addEventListener('scroll', handleScroll);
+window.addEventListener("scroll", handleScroll);
updateCharacterOpacity();
diff --git a/src/components/Jprom.css b/src/components/Jprom.css
index e395be9..fd8f396 100644
--- a/src/components/Jprom.css
+++ b/src/components/Jprom.css
@@ -1,4 +1,4 @@
.jprom-body {
min-width: 100vw;
min-height: 100vh;
-}
\ No newline at end of file
+}
diff --git a/src/components/Jprom.jsx b/src/components/Jprom.jsx
index 17f2d17..84ec796 100644
--- a/src/components/Jprom.jsx
+++ b/src/components/Jprom.jsx
@@ -5,14 +5,12 @@ import Cursor from "./NonPage/Cursor";
import Footer from "./NonPage/Footer";
export default function JProm() {
- return (
-
-
- );
-}
\ No newline at end of file
+ return (
+
-
-
-
-
+
+ );
+}
diff --git a/src/components/NonPage/Banner.jsx b/src/components/NonPage/Banner.jsx
index 2e53619..219f481 100644
--- a/src/components/NonPage/Banner.jsx
+++ b/src/components/NonPage/Banner.jsx
@@ -3,12 +3,18 @@ import "./Banner.css";
import Texture from "../../Images/LowerBannerTexture.png";
export default function Banner(props) {
- return (
-
- 
-
-);
-}
\ No newline at end of file
+ return (
+
-
- We’re raising money for Junior Prom 2024! Read our initiative here.
-
+
+
+ );
+}
diff --git a/src/components/NonPage/Carousel.jsx b/src/components/NonPage/Carousel.jsx
index 7636090..1db8051 100644
--- a/src/components/NonPage/Carousel.jsx
+++ b/src/components/NonPage/Carousel.jsx
@@ -1,82 +1,100 @@
-import React, { useState} from 'react';
+import React, { useState } from "react";
import "./Carousel.css";
-
function Carousel() {
- const [slide, setSlide] = useState(0)
- const [translate, setTranslate] = useState("0%")
- const [initialX, setInitialX] = useState(null)
- const [finalX, setFinalX] = useState(null)
- const [drag, setDrag] = useState(false)
- const [zoom, setZoom] = useState(false)
+ const [slide, setSlide] = useState(0);
+ const [translate, setTranslate] = useState("0%");
+ const [initialX, setInitialX] = useState(null);
+ const [finalX, setFinalX] = useState(null);
+ const [drag, setDrag] = useState(false);
+ const [zoom, setZoom] = useState(false);
const onMouseDown = (e) => {
- setInitialX(e.screenX)
- setDrag(true)
- }
+ setInitialX(e.screenX);
+ setDrag(true);
+ };
const onMouseUp = (e) => {
-
- setDrag(false)
- setFinalX(e.screenX)
+ setDrag(false);
+ setFinalX(e.screenX);
if (initialX === finalX) {
- setZoom(true)
+ setZoom(true);
if (slide === 0) {
- setTranslate("-100%")
- setSlide(1)
- }
- else {
- setTranslate("0%")
- setSlide(0)
+ setTranslate("-100%");
+ setSlide(1);
+ } else {
+ setTranslate("0%");
+ setSlide(0);
}
setTimeout(() => {
- setZoom(false)
- }, 80)
- return
+ setZoom(false);
+ }, 80);
+ return;
}
if (slide === 0 && translate.substring(0, translate.length - 2) < 0) {
- setTranslate("-100%")
- setSlide(1)
- }
- else if (slide === 0 && translate.substring(0, translate.length - 2) > 0) {
- setTranslate("0%")
+ setTranslate("-100%");
+ setSlide(1);
+ } else if (
+ slide === 0 &&
+ translate.substring(0, translate.length - 2) > 0
+ ) {
+ setTranslate("0%");
}
if (slide === 1 && translate.substring(0, translate.length - 2) > 0) {
- setTranslate("0%")
- setSlide(0)
- }
- else if (slide === 1 && translate.substring(0, translate.length - 2) < 0) {
- setTranslate("-100%")
+ setTranslate("0%");
+ setSlide(0);
+ } else if (
+ slide === 1 &&
+ translate.substring(0, translate.length - 2) < 0
+ ) {
+ setTranslate("-100%");
}
- setZoom(false)
- }
+ setZoom(false);
+ };
const onMouseMove = (e) => {
- const bodyWidth = document.getElementById("root").clientWidth
+ const bodyWidth = document.getElementById("root").clientWidth;
if (drag) {
- setFinalX(e.screenX)
+ setFinalX(e.screenX);
if (Math.abs(finalX - initialX) > 0.6 * bodyWidth) {
- return
+ return;
+ }
+ if (
+ ((slide === 0 && finalX - initialX < 0) ||
+ (slide === 1 && finalX - initialX > 0)) &&
+ finalX != null
+ ) {
+ setZoom(true);
+ setTranslate(finalX - initialX + "px");
}
- if (((slide === 0 && finalX - initialX < 0) || (slide === 1 && finalX - initialX > 0)) && (finalX != null)) {
- setZoom(true)
- setTranslate(finalX - initialX + "px")
- }
- }
}
-
+ };
+
return (
-
+
+ + We’re raising money for Junior Prom 2024! Read our initiative{" "} + + here + + . +
+
- 
-
@@ -268,7 +338,12 @@ export default function People() {
- 
Homecoming
Fundraiser
+ Fundraiser
+
);
}
-
export default Carousel;
-
diff --git a/src/components/NonPage/DateCrawler.jsx b/src/components/NonPage/DateCrawler.jsx
index 41f96bb..67a085a 100644
--- a/src/components/NonPage/DateCrawler.jsx
+++ b/src/components/NonPage/DateCrawler.jsx
@@ -4,52 +4,60 @@ import Crawl from "../../Images/EllipseCrawl.svg";
import lightCrawl from "../../Images/lightEllipseCrawl.svg";
export default function DateCrawler() {
- //fetch sheet data
- const [dayType, setDayTypes] = useState(["A1", "B1", "A2", "B2", "A3"]);
- const [date, setDate] = useState(new Date());
- useEffect(() => {
- const fetchSheetsData = async () => {
- try {
- const ID = "1yB7zzw0I3hUjLwgKZXMpBioQ9FNkTg2bp3skTwtatHk";
- const sheet_name = "Schedule";
- const response = await fetch(`https://docs.google.com/spreadsheets/d/${ID}/gviz/tq?tqx=out:csv&sheet=${sheet_name}`);
- const text = await response.text();
- let data = text.split("\n");
- data = data.map(x => {
- return x.replaceAll("\"", "").split(",");
- });
- data.shift();
- setDayTypes(data);
- } catch (err) {
- console.log(err);
- }
- };
- fetchSheetsData();
- }, []);
+ //fetch sheet data
+ const [dayType, setDayTypes] = useState(["A1", "B1", "A2", "B2", "A3"]);
+ const [date, setDate] = useState(new Date());
+ useEffect(() => {
+ const fetchSheetsData = async () => {
+ try {
+ const ID = "1yB7zzw0I3hUjLwgKZXMpBioQ9FNkTg2bp3skTwtatHk";
+ const sheet_name = "Schedule";
+ const response = await fetch(
+ `https://docs.google.com/spreadsheets/d/${ID}/gviz/tq?tqx=out:csv&sheet=${sheet_name}`,
+ );
+ const text = await response.text();
+ let data = text.split("\n");
+ data = data.map((x) => {
+ return x.replaceAll('"', "").split(",");
+ });
+ data.shift();
+ setDayTypes(data);
+ } catch (err) {
+ console.log(err);
+ }
+ };
+ fetchSheetsData();
+ }, []);
+ useEffect(() => {
+ const interval = setInterval(() => {
+ setDate(new Date());
+ }, 1000);
+ return () => clearInterval(interval);
+ }, []);
- useEffect(() => {
- const interval = setInterval(() => {
- setDate(new Date());
- }, 1000);
- return () => clearInterval(interval);
- }, [])
-
- return (
+
+
-
+
+ Homecoming
+
+ Fundraiser +
+ Fundraiser +
- {dayType.map((day, i) => (
- (i !== 0 && i !== 6) && (
);
+ return (
+
-
)
- ))}
-
- )
-
- {day[0]}
-- {day[1].trim()} - {" " + day[2]} -
-
+ {dayType.map(
+ (day, i) =>
+ i !== 0 &&
+ i !== 6 && (
+
+ );
}
diff --git a/src/components/NonPage/Footer.jsx b/src/components/NonPage/Footer.jsx
index e76510e..49ce6f4 100644
--- a/src/components/NonPage/Footer.jsx
+++ b/src/components/NonPage/Footer.jsx
@@ -1,58 +1,154 @@
-import React from 'react';
+import React from "react";
import "./Footer.css";
import Facebook from "../../Images/facebook.svg";
import Instagram from "../../Images/instagram.svg";
import Stuyvesant from "../../Images/stuyvesant.png";
export default function Footer() {
- return (
-
+
+ ),
+ )}
+
+
+
+ {day[0]}
++ {day[1].trim()} + {" " + day[2]} +
+
-
-
- < div className="leadership"> - The Junior Caucus is led by Josephine Yoo & Grace Rhee. - -
@@ -29,7 +37,7 @@ const ParallaxImages = () => {
},
]}
style={{
- height: '80vw',
+ height: "80vw",
}}
>
@@ -40,7 +48,7 @@ const ParallaxImages = () => {
width: "60vw",
display: "block",
marginLeft: "auto",
- marginRight: "auto"
+ marginRight: "auto",
}}
/>
@@ -62,8 +70,8 @@ const ParallaxImages = () => {
src={image.url}
alt={image.alt}
style={{
- position: 'inherit',
- width: '40%',
+ position: "inherit",
+ width: "40%",
}}
/>
@@ -75,4 +83,4 @@ const ParallaxImages = () => {
);
};
-export default ParallaxImages;
\ No newline at end of file
+export default ParallaxImages;
diff --git a/src/components/NonPage/Initiatives.css b/src/components/NonPage/Initiatives.css
index f9e1d1b..1b46c45 100644
--- a/src/components/NonPage/Initiatives.css
+++ b/src/components/NonPage/Initiatives.css
@@ -85,4 +85,4 @@ body {
.show-more {
color: var(--Main-Blue, #051e4f);
text-decoration: underline;
-}
+}
diff --git a/src/components/NonPage/Initiatives.jsx b/src/components/NonPage/Initiatives.jsx
index 06b20e2..002abf6 100644
--- a/src/components/NonPage/Initiatives.jsx
+++ b/src/components/NonPage/Initiatives.jsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect } from 'react';
-import Papa from 'papaparse';
-import './Initiatives.css';
+import React, { useState, useEffect } from "react";
+import Papa from "papaparse";
+import "./Initiatives.css";
export default function AllInitiatives(props) {
const [initiativesData, setEventsInfo] = useState([]);
@@ -23,32 +23,33 @@ export default function AllInitiatives(props) {
fetchSheetsData();
}, []);
+
const handleShowMoreToggle = (index) => {
setShowMore((prevShowMore) => {
const newShowMore = [...prevShowMore];
newShowMore[index] = !newShowMore[index];
return newShowMore;
});
- };
+ }
- return (
-
-
-
-
- Design Lead
-
-
- Development Lead
-
-
- Website Team
-
- Illustration
-
-
- Special Thanks
-
- - < div className="leadership"> - The Junior Caucus is led by Josephine Yoo & Grace Rhee. - -
- Chiefs of Staff John Jay Wang & Ethan Sie.
-
+ return (
+
+
+
+
+ +
+ );
+}
diff --git a/src/components/NonPage/HomeParallax.jsx b/src/components/NonPage/HomeParallax.jsx
index 45852a5..f1ea382 100644
--- a/src/components/NonPage/HomeParallax.jsx
+++ b/src/components/NonPage/HomeParallax.jsx
@@ -1,13 +1,22 @@
-import Homecoming from '../../Images/homecoming.png';
-import GloriousLeaders from '../../Images/gloriousLeaders.png';
-import ParallaxBackground from '../../Images/parallaxBackgound.png';
-import Battle from '../../Images/battle.png';
-import PhotoCapture from '../../Images/photoCapture.png'
-import React from 'react';
-import { ParallaxProvider, ParallaxBanner, ParallaxBannerLayer, Parallax } from 'react-scroll-parallax';
+import Homecoming from "../../Images/homecoming.png";
+import GloriousLeaders from "../../Images/gloriousLeaders.png";
+import ParallaxBackground from "../../Images/parallaxBackgound.png";
+import Battle from "../../Images/battle.png";
+import PhotoCapture from "../../Images/photoCapture.png";
+import React from "react";
+import {
+ ParallaxProvider,
+ ParallaxBanner,
+ ParallaxBannerLayer,
+ Parallax,
+} from "react-scroll-parallax";
const images = [
- { url: GloriousLeaders, scrollspeed: 5, alt: "polaroid josephine, grace, ryan" },
+ {
+ url: GloriousLeaders,
+ scrollspeed: 5,
+ alt: "polaroid josephine, grace, ryan",
+ },
{ url: Battle, scrollspeed: 10, alt: "battle" },
{ url: PhotoCapture, scrollspeed: 40, alt: "photocapture" },
];
@@ -15,7 +24,6 @@ const images = [
const offsets = [10, 64, 10];
const ParallaxImages = () => {
-
return (
+
+
+ Design Lead{" "}
+
+
+
+ Will Zhang
+
+
+
+ Development Lead{" "}
+
+
+
+ Elias Xu
+
+
+
+ Website Team{" "}
+
+
+
+ Otzar Jaffe
+
+ ,{" "}
+
+ Connor Yau
+
+ ,{" "}
+
+ Tony Chen
+
- -
+ - -
- 
-
+ Stuyvesant High School
-
+ Illustration
+
+
+
+ Chloe Wong
+ ,{" "}
+
+ Vicki Chen
+
+
+
+ Special Thanks{" "}
+
+
+
+ David Chen
+
+
+ +
+ The{" "}
+
+ Junior Caucus
+ {" "}
+ is led by{" "}
+
+ Josephine Yoo
+ {" "}
+ &{" "}
+
+ Grace Rhee
+
+ .{" "}
+
+
+ Chiefs of Staff{" "}
+
+ John Jay Wang
+ {" "}
+ &{" "}
+
+ Ethan Sie
+
+ .
+
+ + +
+
+
- )
-}
\ No newline at end of file
+
+ Stuyvesant High School
-
@@ -185,7 +224,6 @@ export default function People() {
- {initiativesData.map((initiative, index) => (
-
- );
-}
+ );
+ }
\ No newline at end of file
diff --git a/src/components/NonPage/NavBar.jsx b/src/components/NonPage/NavBar.jsx
index bd2c32f..6fe2ebd 100644
--- a/src/components/NonPage/NavBar.jsx
+++ b/src/components/NonPage/NavBar.jsx
@@ -1,70 +1,105 @@
-import React from 'react';
-import './Nav.css';
+import React from "react";
+import "./Nav.css";
import JuniorLogo from "../../Images/JuniorCaucusLogo.svg";
-import { useState, useEffect, useCallback } from 'react';
-import Banner from './Banner';
+import { useState, useEffect, useCallback } from "react";
+import Banner from "./Banner";
function NavBar(props) {
- const [menuOpen, setMenuOpen] = useState(false);
- const toggleMenu = useCallback(() => {
- setMenuOpen(prevMenuOpen => !prevMenuOpen);
- }, []);
- useEffect(() => {
- const hideMenu = () => {
- if (window.innerWidth > 768 && menuOpen) {
- toggleMenu();
- }
- }
- window.addEventListener('resize', hideMenu);
+ const [menuOpen, setMenuOpen] = useState(false);
+ const toggleMenu = useCallback(() => {
+ setMenuOpen((prevMenuOpen) => !prevMenuOpen);
+ }, []);
+ useEffect(() => {
+ const hideMenu = () => {
+ if (window.innerWidth > 768 && menuOpen) {
+ toggleMenu();
+ }
+ };
+ window.addEventListener("resize", hideMenu);
- return () => {
- window.removeEventListener('resize', hideMenu);
- }
- }, [menuOpen, toggleMenu])
+ return () => {
+ window.removeEventListener("resize", hideMenu);
+ };
+ }, [menuOpen, toggleMenu]);
- return (
-
- ))}
+ return (
+ {initiative.Date}
-{initiative.Title}
-- {showMore[index] ? initiative.Text : initiative.Text.substring(0, 100)} -
- {showMore[index] ? - : null - } -
+
-
+ {initiativesData.map((initiative, index) => (
+
+
+ ))}
+ {initiative.Date}
+{initiative.Title}
++ {showMore[index] ? initiative.Text : initiative.Text.substring(0, 100)} +
+ {showMore[index] ? + : null + } +
- 
-
-
-
- 
-
-
-
- {getText(props.page, "Home")}
- {getText(props.page, "People")}
- {getText(props.page, "Events")}
- {getText(props.page, "Resources")}
- {getText(props.page, "Socials")}
-
-
-
-
+ return (
+
- b Menu a
-
-
-
-
+
+ );
}
-
-
const currPageGet = (page, currPage) => {
- return currPage === page ? "nav-menu-item current-page" : "nav-menu-item";
-}
-
+ return currPage === page ? "nav-menu-item current-page" : "nav-menu-item";
+};
const getText = (page, currPage) => {
- return currPage === page ? (<>b {currPage} a) : <> {currPage} ;
-}
+ return currPage === page ? (
+ <>
+ b {currPage}{" "}
+ a
+
+ ) : (
+ <>
+ {currPage}
+
+
+ );
+};
-export default NavBar;
\ No newline at end of file
+export default NavBar;
diff --git a/src/components/NonPage/ResourceCard.css b/src/components/NonPage/ResourceCard.css
index 4f335db..57b23ee 100644
--- a/src/components/NonPage/ResourceCard.css
+++ b/src/components/NonPage/ResourceCard.css
@@ -34,4 +34,4 @@
.resource-links {
width: 100% !important;
all:unset;
-}
\ No newline at end of file
+}
diff --git a/src/components/NonPage/ResourceCard.jsx b/src/components/NonPage/ResourceCard.jsx
index 7b0aaf6..c40325b 100644
--- a/src/components/NonPage/ResourceCard.jsx
+++ b/src/components/NonPage/ResourceCard.jsx
@@ -1,20 +1,16 @@
-import React from 'react';
+import React from "react";
import "./ResourceCard.css";
-
export default function ResourceCard(props) {
- return (
-
-
-
diff --git a/src/components/People.jsx b/src/components/People.jsx
index b2ee31d..4d85cbb 100644
--- a/src/components/People.jsx
+++ b/src/components/People.jsx
@@ -4,36 +4,35 @@ import CustomCursor from "./NonPage/Cursor";
import Texture from "./NonPage/Texture";
import Footer from "./NonPage/Footer";
import "./People.css";
-import Ayla_Irshad from '../Images/people/Ayla_Irshad.jpg';
-import Chenming_Fang from '../Images/people/Chenming_Fang.jpg';
-import Chloe_Wong from '../Images/people/Chloe_Wong.jpeg';
-import Elias_Xu from '../Images/people/Elias_Xu.jpg';
-import Emily_Li from '../Images/people/Emily_Li.jpeg';
-import Ethan_Sie from '../Images/people/Ethan_Sie.jpg';
-import Grace_Rhee from '../Images/people/Grace_Rhee.jpeg';
-import Josephine_Gunawan from '../Images/people/Josephine_Gunawan.jpeg';
-import Maegan_Diep from '../Images/people/Maegan_Diep.jpeg';
-import Stacie_Au from '../Images/people/Stacie_Au.jpeg';
-import Josephine_Yoo from '../Images/people/Josephine_Yoo.png';
-import Will from '../Images/people/Will.jpeg';
-import John from '../Images/people/John.jpeg';
+import Ayla_Irshad from "../Images/people/Ayla_Irshad.jpg";
+import Chenming_Fang from "../Images/people/Chenming_Fang.jpg";
+import Chloe_Wong from "../Images/people/Chloe_Wong.jpeg";
+import Elias_Xu from "../Images/people/Elias_Xu.jpg";
+import Emily_Li from "../Images/people/Emily_Li.jpeg";
+import Ethan_Sie from "../Images/people/Ethan_Sie.jpg";
+import Grace_Rhee from "../Images/people/Grace_Rhee.jpeg";
+import Josephine_Gunawan from "../Images/people/Josephine_Gunawan.jpeg";
+import Maegan_Diep from "../Images/people/Maegan_Diep.jpeg";
+import Stacie_Au from "../Images/people/Stacie_Au.jpeg";
+import Josephine_Yoo from "../Images/people/Josephine_Yoo.png";
+import Will from "../Images/people/Will.jpeg";
+import John from "../Images/people/John.jpeg";
import Vicki_Chen from "../Images/people/Vicki_Chen.png";
export default function People() {
-
useEffect(() => {
const handleScroll = () => {
- const meetText = document.querySelector('.meet');
- const teamText = document.querySelector('.the-team');
+ const meetText = document.querySelector(".meet");
+ const teamText = document.querySelector(".the-team");
const screenHeight = window.innerHeight;
const scrollY = window.scrollY;
let transformPercentage = Math.min(scrollY / (screenHeight * 0.5), 1);
meetText.style.transform = `translateX(${transformPercentage * 100}%)`;
teamText.style.transform = `translateX(-${transformPercentage * 100}%)`;
};
- window.addEventListener('scroll', handleScroll);
+ window.addEventListener("scroll", handleScroll);
return () => {
- window.removeEventListener('scroll', handleScroll);
+ window.removeEventListener("scroll", handleScroll);
};
}, []);
@@ -48,12 +47,12 @@ export default function People() {
} else {
element.target.classList.remove("show");
}
- })
- })
+ });
+ });
hiddenElements.forEach((entry) => {
observer.observe(entry);
- })
- })
+ });
+ });
//flying in from left
useEffect(() => {
@@ -66,12 +65,12 @@ export default function People() {
} else {
element.target.classList.remove("show");
}
- })
- })
+ });
+ });
hiddenElements.forEach((entry) => {
observer.observe(entry);
- })
- })
+ });
+ });
useEffect(() => {
const hiddenElements = document.querySelectorAll(".to-fade-in");
@@ -83,19 +82,19 @@ export default function People() {
} else {
element.target.classList.remove("show");
}
- })
- })
+ });
+ });
hiddenElements.forEach((entry) => {
observer.observe(entry);
- })
- })
+ });
+ });
const pres1Ref = useRef(null);
const pres2Ref = useRef(null);
useEffect(() => {
const handleScroll = () => {
- [pres1Ref, pres2Ref].forEach(ref => {
+ [pres1Ref, pres2Ref].forEach((ref) => {
if (ref.current) {
// Calculate the width of the screen
//let screenWidth = window.innerWidth;
@@ -109,16 +108,14 @@ export default function People() {
});
};
- window.addEventListener('scroll', handleScroll);
+ window.addEventListener("scroll", handleScroll);
handleScroll(); // Call it once initially
return () => {
- window.removeEventListener('scroll', handleScroll);
+ window.removeEventListener("scroll", handleScroll);
};
}, []);
-
-
let peoplePage = (
-
- {props.title}
-- {props.release} -
-
-
-
+ return (
+
+ );
}
diff --git a/src/components/NonPage/Schedule.css b/src/components/NonPage/Schedule.css
index 541d49d..1c7ec25 100644
--- a/src/components/NonPage/Schedule.css
+++ b/src/components/NonPage/Schedule.css
@@ -143,7 +143,7 @@
.period.dupe {
font-family: 'neue-haas-grotesk-display', sans-serif;
transform: translateY(100%);
- font-size: 8.5rem;
+ font-size: 9.5rem;
}
.period-container:hover .period {
@@ -160,7 +160,7 @@
}
.period.dupe {
- font-size:6rem;
+ font-size:6.5rem;
}
}
@@ -170,6 +170,6 @@
}
.period.dupe {
- font-size: 4rem;
+ font-size: 6.5rem;
}
-}
\ No newline at end of file
+}
diff --git a/src/components/NonPage/Schedule.jsx b/src/components/NonPage/Schedule.jsx
index 5a02949..415f578 100644
--- a/src/components/NonPage/Schedule.jsx
+++ b/src/components/NonPage/Schedule.jsx
@@ -1,10 +1,15 @@
-import React, { useState, useMemo, useEffect } from 'react';
-import './Schedule.css';
+import React, { useState, useMemo, useEffect } from "react";
+import "./Schedule.css";
const dateFormat = {
- longWK: { weekday: 'long', month: 'long', day: 'numeric' },
- shortWK: { weekday: 'short' },
- timeHMS: { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false }
+ longWK: { weekday: "long", month: "long", day: "numeric" },
+ shortWK: { weekday: "short" },
+ timeHMS: {
+ hour: "2-digit",
+ minute: "2-digit",
+ second: "2-digit",
+ hour12: false,
+ },
};
export default function ScheduleBanner(props) {
@@ -12,18 +17,26 @@ export default function ScheduleBanner(props) {
useEffect(() => {
const timer = setInterval(() => setCurrentDateTime(new Date()), 1000);
return () => clearInterval(timer);
- }, [])
+ }, []);
- const isWeekend = useMemo(() => currentDateTime.getDay() === 0 || currentDateTime.getDay() === 6, [currentDateTime]);
+ const isWeekend = useMemo(
+ () => currentDateTime.getDay() === 0 || currentDateTime.getDay() === 6,
+ [currentDateTime],
+ );
const timeCircleClassName = isWeekend ? "time-circle hide" : "time-circle";
- const timeString = currentDateTime.toLocaleTimeString('en-US', dateFormat.timeHMS);
- const dateString = currentDateTime.toLocaleDateString('en-US', dateFormat.longWK);
-
+ const timeString = currentDateTime.toLocaleTimeString(
+ "en-US",
+ dateFormat.timeHMS,
+ );
+ const dateString = currentDateTime.toLocaleDateString(
+ "en-US",
+ dateFormat.longWK,
+ );
const circumference = 2 * Math.PI * 50;
const progress = isWeekend ? 0 : props.minutes / (props.periodDuration || 1);
const strokeDashoffset = circumference * (1 - progress);
- const text = isWeekend ? 'Weekend' : `${props.dayType} ${props.AorBDay}`;
+ const text = isWeekend ? "Weekend" : `${props.dayType} ${props.AorBDay}`;
return (
@@ -42,24 +55,34 @@ export default function ScheduleBanner(props) {
fill="transparent"
strokeDasharray={circumference}
strokeDashoffset={strokeDashoffset}
- style={{ transition: 'stroke-dashoffset 0.5s linear' }}
+ style={{ transition: "stroke-dashoffset 0.5s linear" }}
/>
- {isWeekend ? "0/0" : (
-
- {Math.round(props.minutes)}
-
- {Math.round(props.minutesLeft)} -
- )}
+ {isWeekend ? (
+ "0/0"
+ ) : (
+
+ {Math.round(props.minutes)}
+
+ {Math.round(props.minutesLeft)} +
+ )}
- {Math.round(props.minutesLeft)} -
+ {Math.round(props.minutesLeft)} +
{timeString}
- {isWeekend ? "No School" : props.currPeriod}
- 10? "large-schedule-text":""}`}>{text}
+
+ {isWeekend ? "No School" : props.currPeriod}
+
+ 10 ? "large-schedule-text" : ""
+ }`}
+ >
+ {text}
+
Presidents
+
-
@@ -161,19 +185,34 @@ export default function People() {
- 
+
Josephine
- Hi everyone! I'm Josephine, one of your Co-Presidents this year, and I'm so excited to be working with you all to make the most of our junior year! One of my biggest goals for the year are to make sure there's constant and clear communication between the Junior Caucus and the student body. We want to make sure that your voices are heard and taken into consideration! Whether your worries are about college or general high school lifestyle, I hope to alleviate your stress and foster a positive and supportive junior student body. A fun fact about me is that I once dropped my phone in pasta sauce trying to take a picture of my food! 🍽
+ Hi everyone! I'm Josephine, one of your Co-Presidents this year,
+ and I'm so excited to be working with you all to make the most of
+ our junior year! One of my biggest goals for the year are to make
+ sure there's constant and clear communication between the Junior
+ Caucus and the student body. We want to make sure that your voices
+ are heard and taken into consideration! Whether your worries are
+ about college or general high school lifestyle, I hope to
+ alleviate your stress and foster a positive and supportive junior
+ student body. A fun fact about me is that I once dropped my phone
+ in pasta sauce trying to take a picture of my food! 🍽
+
+
-
+ Grace
- Hi! I'm Grace, and it is my pleasure to be your Junior Caucus co-president this year. I am super excited to work with everybody to bring you the best Junior year possible! My biggest goal this year is to make this year less stressful and more enjoyable. This includes planning an affordable and exciting JProm and providing the most relatable and accessible resources for both general academics and college! One fun fact about me is that I love to go try different restaurants’ nachos around the city! 🌮
+ Hi! I'm Grace, and it is my pleasure to be your Junior Caucus
+ co-president this year. I am super excited to work with everybody
+ to bring you the best Junior year possible! My biggest goal this
+ year is to make this year less stressful and more enjoyable. This
+ includes planning an affordable and exciting JProm and providing
+ the most relatable and accessible resources for both general
+ academics and college! One fun fact about me is that I love to go
+ try different restaurants’ nachos around the city! 🌮
John J. Wang
- Hi! I’m John Jay, and I’m so excited to be working as the Chief of Staff! My goals this year are to help plan the best Junior Prom possible, help guide the junior grade through courses and tests, and provide accessible college resources, amidst all the junior year stress. We want your voices to be heard, and with your help, we hope to make this year the best year for all of our juniors! We can’t wait to work with you all! One fun fact about me is that I can play three instruments.
+ Hi! I’m John Jay, and I’m so excited to be working as the Chief of
+ Staff! My goals this year are to help plan the best Junior Prom
+ possible, help guide the junior grade through courses and tests,
+ and provide accessible college resources, amidst all the junior
+ year stress. We want your voices to be heard, and with your help,
+ we hope to make this year the best year for all of our juniors! We
+ can’t wait to work with you all! One fun fact about me is that I
+ can play three instruments.
Ethan Sie
- Hey! I’m Ethan, and I work as one of the Chiefs of Staff alongside John Jay. I can’t wait to get started on all of the projects we have planned for this year, and I hope you guys are excited for everything to come (especially Jprom!). In my free time, I like to play my Saxophone, and I'm still working on 3D modeling and building a lightsaber (if I ever get around to it). Stay tuned for more fun events, internals resources/guides, and college events!
+ Hey! I’m Ethan, and I work as one of the Chiefs of Staff alongside
+ John Jay. I can’t wait to get started on all of the projects we
+ have planned for this year, and I hope you guys are excited for
+ everything to come (especially Jprom!). In my free time, I like to
+ play my Saxophone, and I'm still working on 3D modeling and
+ building a lightsaber (if I ever get around to it). Stay tuned for
+ more fun events, internals resources/guides, and college events!
-
Chiefs of Staff
+
+ Chiefs of Staff
+
-
-
-
@@ -230,13 +280,21 @@ export default function People() {
@@ -248,14 +306,26 @@ export default function People() {
Events
@@ -194,13 +232,15 @@ export default function People() {
Emily Li
- Hello! I’m Emily, director of events for Junior Caucus. I love eating at new restaurants, taking pretty pictures and listening to music. I run on the XC and track and field team. Lastly, I am very excited to help plan this year’s events and J-Prom.
+ Hello! I’m Emily, director of events for Junior Caucus. I love
+ eating at new restaurants, taking pretty pictures and
+ listening to music. I run on the XC and track and field team.
+ Lastly, I am very excited to help plan this year’s events and
+ J-Prom.
@@ -209,14 +249,24 @@ export default function People() {
Chenming Fang
- Hi I'm Chenming, co-director for Internals Department. I like exercising and discovering new music and food. I run long distance for track and cross country. I'm excited to help in creating more useful resources for everyone!
+ Hi I'm Chenming, co-director for Internals Department. I
+ like exercising and discovering new music and food. I run
+ long distance for track and cross country. I'm excited to
+ help in creating more useful resources for everyone!
- 
+
Josephine Gunawan
- Hi, I'm Josephine, and I am so excited to be one of your Internals Directors this year! I love literature and history, but when I have free time, my favorite thing to do is bake pecan pie tarts.
+ Hi, I'm Josephine, and I am so excited to be one of your
+ Internals Directors this year! I love literature and
+ history, but when I have free time, my favorite thing to
+ do is bake pecan pie tarts.
Elias Xu
- Hi! I’m Elias! I’m a beekeeper, book enthusiast, and programmer. Even though I mainly come from a background in Artificial Intelligence and Competitive Programming, I’ve been deemed competent enough to run (with Will Zhang) the I/T department. Cheers!
+ Hi! I’m Elias! I’m a beekeeper, book enthusiast, and
+ programmer. Even though I mainly come from a background in
+ Artificial Intelligence and Competitive Programming, I’ve
+ been deemed competent enough to run (with Will Zhang) the
+ I/T department. Cheers!
Will Zhang
- Hi! I'm Will. I love having a good steak, telling stories, and designing websites. I am thrilled to hold up the caucus infrastructure this year with Elias!
+
+ Hi! I'm Will. I love having a good steak, telling stories,
+ and designing websites. I am thrilled to hold up the caucus
+ infrastructure this year with Elias!
+
Stacie Au
- Hi I’m Stacie, this year’s Junior Caucus finance director, and I look forward to making JProm cheaper (or at least a little more affordable)! I’ve worked in this department for 2 years now and have been in the finance space for 3/4 years. Other than being interested in finance and business, I often enjoy doing different sports such as diving or stunt.
+ Hi I’m Stacie, this year’s Junior Caucus finance director,
+ and I look forward to making JProm cheaper (or at least a
+ little more affordable)! I’ve worked in this department for
+ 2 years now and have been in the finance space for 3/4
+ years. Other than being interested in finance and business,
+ I often enjoy doing different sports such as diving or
+ stunt.
Ayla Irshad
- Hi, I'm Ayla! This is my third year as finance director, and this year I am excited to be working on fundraisers and budgeting for events! In particular, I look forward to helping make JProm as successful and accessible as possible. Aside from caucus I also work in the SU Finance Department. In my free time, I enjoy going on bike rides as well as traveling to experience new cultures!
+ Hi, I'm Ayla! This is my third year as finance director, and
+ this year I am excited to be working on fundraisers and
+ budgeting for events! In particular, I look forward to
+ helping make JProm as successful and accessible as possible.
+ Aside from caucus I also work in the SU Finance Department.
+ In my free time, I enjoy going on bike rides as well as
+ traveling to experience new cultures!
Chloe Wong
- Hey! I'm Chloe, and I've been in Caucus Graphics since my freshman year. I'm extremely passionate about graphic design, and I enjoy exploring its applications both within and outside digital media. I look forward to bringing my creative vision for the Junior Caucus to life this school year!
+ Hey! I'm Chloe, and I've been in Caucus Graphics since my
+ freshman year. I'm extremely passionate about graphic
+ design, and I enjoy exploring its applications both within
+ and outside digital media. I look forward to bringing my
+ creative vision for the Junior Caucus to life this school
+ year!
Vicki Chen
- Hi! I’m Vicki, this year’s Junior Caucus Graphics Department Co-director. Besides the Junior Caucus, I’m also the Co-director for the Student Union’s Social Media Department and a member of Stuy’s Varsity Girls Fencing Team. On my free time, my favorite thing to do is baking and gifting what I bake to my friends. My specialty is matcha brownies! I’m so excited to be working with all our departments this year to bring you guys the best events, opportunities, and energy for our junior year at Stuy!
+ Hi! I’m Vicki, this year’s Junior Caucus Graphics Department
+ Co-director. Besides the Junior Caucus, I’m also the
+ Co-director for the Student Union’s Social Media Department
+ and a member of Stuy’s Varsity Girls Fencing Team. On my free
+ time, my favorite thing to do is baking and gifting what I
+ bake to my friends. My specialty is matcha brownies! I’m so
+ excited to be working with all our departments this year to
+ bring you guys the best events, opportunities, and energy for
+ our junior year at Stuy!
@@ -285,16 +368,19 @@ export default function People() {
Maegan Diep
- Hi! I'm Maegan, but I also go by Mae. This is my second year as the Social Media Director, and I'm excited to be working on our main project, the Junior Athlete Spotlight, and promoting events/information. Aside from running social media, I also enjoy baking, making art, and traveling! Fun fact: I've been to Dominican Republic four times... (I highly recommend visiting though.)
+ Hi! I'm Maegan, but I also go by Mae. This is my second year
+ as the Social Media Director, and I'm excited to be working
+ on our main project, the Junior Athlete Spotlight, and
+ promoting events/information. Aside from running social
+ media, I also enjoy baking, making art, and traveling! Fun
+ fact: I've been to Dominican Republic four times... (I
+ highly recommend visiting though.)