diff --git a/public/old/rectangle_pfp.png b/public/old/rectangle_pfp.png new file mode 100644 index 0000000..4fa3bc5 Binary files /dev/null and b/public/old/rectangle_pfp.png differ diff --git a/src/app/about/AboutContent.tsx b/src/app/about/AboutContent.tsx index 3576fd2..64b6bb8 100644 --- a/src/app/about/AboutContent.tsx +++ b/src/app/about/AboutContent.tsx @@ -1,22 +1,118 @@ import ContentSection from "@/components/ContentSection"; +import GenericCard from "@/components/GenericCard"; +import BoardAlumniCard from "@/components/BoardAlumniCard"; +import UpcomingEventsCard from "@/components/UpcomingEventsCard"; + +const boardMembers = [ + { quote: "“Quick blurb about what Creative Labs community means to them, what their favorite part is, etc. Something short, nice, and cute!” - Joe Bruin", image: "/old/rectangle_pfp.png"}, + { quote: "“Quick blurb about what Creative Labs community means to them, what their favorite part is, etc. Something short, nice, and cute!” - Joe Bruin", image: "/old/rectangle_pfp.png" } +]; + +const alumniRecollections = [ + { quote: "“Quick blurb about their past experiences and memories from CL.” - Joe Bruin", image: "/old/rectangle_pfp.png" }, + { quote: "“Quick blurb about their past experiences and memories from CL.” - Joe Bruin", image: "/old/rectangle_pfp.png" }, + { quote: "“Quick blurb about their past experiences and memories from CL.” - Joe Bruin", image: "/old/rectangle_pfp.png" } +]; + +const upcomingEvents = [ + { title: "Fall 2022 Demo Day", time: "Thursday, December 1 @ 6pm", location: "Haines A18", imgSrc: "/old/f22_demo.png", description: "🍊DEMO DAY IS COMING🍊 come check out fall quarter’s demo day THIS THURSDAY!! @ 6PM in Haines A18!! hear about all the cool😎and creative😋projects and get inspired💡be there🫵or be square❎"}, + { title: "Bracelet Social", time: "Friday, October 21 @ 3pm", location: "Tongva Steps", imgSrc: "/old/f22_social.png", description: "Come make a bracelet, keychain, or phone charm at 🆑’s bracelet-making 🧵 social this Friday (10/21)! We’ll be at the Tongva Steps from 3PM - 5PM🪷 See you there! 🐸 Due to limited supplies, RSVP at tinycl.com/bracelet-social to guarantee your spot 🫶"}, + { title: "Spotify API Workshop", time: "Tuesday, October 18 @ 6pm", location: "Dodd 170", imgSrc: "/old/f22_workshop.png", description: "To start off our year we wanted to welcome everyone to our first workshop! Led by the Tech team, learn how to access your top fifty songs 🎶using the Spotify API Tuesday (10/18) at 6pm at Dodd 170! RSVP at tinycl.com/spotify-workshop."} +]; + +const pastEvents = [ + { title: "Spring 2022 Demo Day", imgSrc: "/old/s22_demo.png", description: "Demo Day is coming up this Friday, June 3rd from 6-8 PM @ Kinsey 1200B. Our project leads and members are super excited for you to see their projects this quarter!"}, + { title: "Sharetea Social", imgSrc: "/old/s22_social.png", description: "Need a pick-me-up??Get 🧋boba🧋 with us today!See you at De Neve turnaround at 7️ or meet us at Sharetea at 7:20pm‼️"}, + { title: "Spring 2022 First General Meeting", imgSrc: "/old/s22_gm.png", description: "Want to take part in some awesome 🌟projects? Meet cool 😎 people? Gain technical 👾 and non-technical 📝experience? Come to CL’s 🌸Spring General Meeting🌸... "} +]; export default function AboutContent() { - return ( -
- -

- We connect students from all disciplines and backgrounds together to bring any creative passion project to life! We offer various opportunities to students such as workshops and socials, which are available to everyone, and projects, which require an application process. A team of students will then work together to complete a project by the end of the quarter. Creative Labs started as a small group of friends and is founded on the idea that with the right group of people, any idea can come to life. Let's make something cool together! -

- - - Work in progress :D - - - Work in progress :D - - - Work in progress :D - -
- ) -} \ No newline at end of file + return ( +
+
+ About Page Cover +
+
+ +

+ We connect students from all disciplines and backgrounds together to bring any creative passion project to life! We offer various opportunities to students such as workshops and socials, which are available to everyone, and projects, which require an application process. A team of students will then work together to complete a project by the end of the quarter. Creative Labs started as a small group of friends and is founded on the idea that with the right group of people, any idea can come to life. Let’s make something cool together! +

+ + + +
+ {boardMembers.map((member, idx) => ( +
+ +
+ ))} +
+ + + +
+ {alumniRecollections.map((alumni, idx) => ( +
+ +
+ ))} +
+ + + +
+ {upcomingEvents.map((event, idx) => ( + + ))} +
+ + + {/* +
+ {upcomingEvents.map((event, idx) => ( + + ))} +
+ */} + + +
+ {pastEvents.map((event, idx) => ( + + ))} +
+ +
+
+ ); +} diff --git a/src/components/BoardAlumniCard.tsx b/src/components/BoardAlumniCard.tsx new file mode 100644 index 0000000..5b7aa90 --- /dev/null +++ b/src/components/BoardAlumniCard.tsx @@ -0,0 +1,25 @@ +import React from "react"; +import { Lato } from "next/font/google"; + +const lato = Lato({ weight: "700", subsets: ["latin"] }); + +interface BoardAlumniCardProps { + quote: string; + image: string; +} + +export default function PersonCard({quote, image }: BoardAlumniCardProps): JSX.Element { + return ( +
+ {image && ( +
+ +
+ )} +

"{quote}"

+
+ ); +} diff --git a/src/components/UpcomingEventsCard.tsx b/src/components/UpcomingEventsCard.tsx new file mode 100644 index 0000000..5cdbe8b --- /dev/null +++ b/src/components/UpcomingEventsCard.tsx @@ -0,0 +1,55 @@ +import { Lato } from "next/font/google"; +import Link from "next/link"; + +const lato = Lato({ weight: "700", subsets: ["latin"] }); + +interface UpcomingEventsCardProps { + title: string; + eventTime: string; + location: string; + description: string; + imgSrc?: string; + className?: string; + href?: string; +} + +export default function UpcomingEventsCard({ + title, + eventTime, + location, + description, + imgSrc = "/card_icons/what-we-do.svg", + className = "", + href = "/", +}: UpcomingEventsCardProps) { + return ( + +
+ Event Icon +
+ +
+

{title}

+
+

+ Event Time: {eventTime} +

+

+ Location: {location} +

+

+ Description: {description} +

+
+
+ + ); +}