diff --git a/app/page.tsx b/app/page.tsx index 8e5b94c..dbd29d5 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -2,19 +2,16 @@ import type { NextPage } from 'next'; import '../src/styles/reset.scss'; import About from '../src/sections/About-Projects'; +import Archive from '../src/sections/Archive'; import NavigationBar from '@/src/components/navbar'; import TimerHero from '@/src/sections/Timer'; - - // here we will compile all the sections of the website together const Home: NextPage = () => { return (
- - - +
); }; diff --git a/public/assets/embeds/figma.png b/public/assets/embeds/figma.png new file mode 100644 index 0000000..af87f6c Binary files /dev/null and b/public/assets/embeds/figma.png differ diff --git a/public/assets/embeds/github.png b/public/assets/embeds/github.png new file mode 100644 index 0000000..b89b10f Binary files /dev/null and b/public/assets/embeds/github.png differ diff --git a/public/assets/embeds/other_links.png b/public/assets/embeds/other_links.png new file mode 100644 index 0000000..5cd7967 Binary files /dev/null and b/public/assets/embeds/other_links.png differ diff --git a/public/assets/embeds/slides.png b/public/assets/embeds/slides.png new file mode 100644 index 0000000..bf81bf2 Binary files /dev/null and b/public/assets/embeds/slides.png differ diff --git a/public/assets/project_logos/eventify.png b/public/assets/project_logos/eventify.png new file mode 100644 index 0000000..e89d677 Binary files /dev/null and b/public/assets/project_logos/eventify.png differ diff --git a/public/assets/project_logos/gamed.png b/public/assets/project_logos/gamed.png new file mode 100644 index 0000000..7b7a6df Binary files /dev/null and b/public/assets/project_logos/gamed.png differ diff --git a/public/assets/project_logos/ig_food.svg b/public/assets/project_logos/ig_food.svg new file mode 100644 index 0000000..3134f52 --- /dev/null +++ b/public/assets/project_logos/ig_food.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/assets/project_logos/word_nerd.png b/public/assets/project_logos/word_nerd.png new file mode 100644 index 0000000..2979a38 Binary files /dev/null and b/public/assets/project_logos/word_nerd.png differ diff --git a/src/components/project-card/index.tsx b/src/components/project-card/index.tsx index e69de29..a6cbc34 100644 --- a/src/components/project-card/index.tsx +++ b/src/components/project-card/index.tsx @@ -0,0 +1,135 @@ +import s from "./style.module.scss"; + +// Images for embed links and other logos + +const default_pic = "/assets/acm_logo.svg"; +const figma = "/assets/embeds/figma.png"; +const github = "/assets/embeds/github.png"; +const slides = "/assets/embeds/slides.png"; +const other_links = "/assets/embeds/other_links.png"; + +const projects_data = [ + {"quarter": "Fall 2022", + "subgroup": "AI", + "project_title": "Supreme Court Predictor", + "team_name": "Team 1", + "description": "Using machine learning, predict the outcomes of Supreme Court Cases (whether they are conservative, liberal, or unspecifiable).", + "mentor": "Stephanie", + "members": ["Jenny Mar", "Nitya Pillai", "Ada He", "Han Hoang", "Rushil Chandrupatla", "Serena Chen"], + "slides": "https://docs.google.com/presentation/d/1qANpLZvhv5F0lOkbUxtlJU5UF4KqsDzuy0Dy6E2BG-0/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/fa22-ai-team-1", + "other_links": "https://deepnote.com/join-team?token=02d34e715c9e4f6" + }, + {"quarter": "Fall 2022", + "subgroup": "AI", + "project_title": "GAIN: Gamers for Artificial Intelligence and NLP", + "team_name": "Team 2", + "description": "Using NLP and Machine Learning, created a Political Sentiment Classifier that can address blocks of texts and determine whether they are politically charged and classify them as Liberal or Democratic. ", + "mentor": "Weiji Chen", + "members": ["Samvrit Srinath", "Calvin Nguyen", "Peter Gao", "Benjamin Johnson", "Skyler Goh", "Joon Kim"], + "slides": "https://docs.google.com/presentation/d/1s7W3E9Wv5RXAzmgQYjCN166xycIJuxyFnCbs_IpVBlw/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/fa22-ai-team-2", + "other_links": "https://colab.research.google.com/drive/1zfL2UtCyJnwAMzqeAAvfTigUU6rVxCca?usp=sharing" + }, + {"quarter": "Fall 2022", + "subgroup": "Design", + "project_title": "UCSD App Redesign", + "team_name": "Team 1", + "description": "We redesigned the UCSD mobile app to increase its functionality and aesthetic appeal, helping students navigate it with more ease, efficiency, and less confusion.", + "mentor": "Anthony Manrique", + "members": ["Tammy Ding","Khoi Nguyen", "Caitlyn Cielo", "Sashwat Nayak"], + "slides": "https://docs.google.com/presentation/d/1NBU4o8cFqalW_I9UUo_t_h7XsHVtjGcQ7hVZUzqO0qg/edit?usp=sharing", + "project_link": "https://www.figma.com/file/8kuHJXTZcIGVjm88OCYi1W/Final-Draft?type=design&node-id=1%3A2&t=K7vUmdAhPcQpWj6O-1" + }, + {"quarter": "Winter 2023", + "subgroup": "Hack", + "project_title": "IGFood", + "team_name": "Team 1", + "logo": "/assets/project_logos/ig_food.svg", + "description": "Yelp and Google Reviews are written by strangers that you cannot necessarily trust. Our solution is to create an application which creates a more personalized food-rating experience! The application connects you to your friends and allows you to see what/where your friends are eating via posts on a feed.", + "mentor": "Nikhil Dange", + "members": ["Angela Hu (Project Lead/Front-end)", "Nicholas Cheah (Front-end)", "Kinan Alatasi (Front-end)", "Alexis Vergnet (Back-end)", "Charvi Shukla (Back-end)", "Jason Wong (Back-end)"], + "slides": "https://docs.google.com/presentation/d/1g0pEKT7Rx_hoZDnC27zxxPs2UqipDLffgUC0Z0v5xUE/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/wi23-hack-team-1", + "other_links": "https://www.figma.com/file/lX9VzkvBHesJT4e2zK6LOr/IGFood-Web-App-Design?type=design&node-id=0%3A1&mode=design&t=Z6gg0vyLGspHj7r5-1" + }, + {"quarter": "Winter 2023", + "subgroup": "Design", + "project_title": "Triton2Go Redesign", + "team_name": "Team 1", + "description": "Recognizing the indispensable role of food ordering apps in the UCSD students’ daily lives, our team aimed to focus on the official food ordering mobile app Triton2Go (Mobile Order) by redesigning both the visual layouts and content layouts to optimize the user interface, streamline the ordering process, incorporate engaging gamification elements in rewards store to encourage user loyalty and satisfaction. We hope to help our target users and make the end process intelligent, enjoyable, and productive.", + "mentor": "Anmol", + "members": ["Cindy Peng (Project Lead)", "Thomas Wang", "Dianne Natanauan", "Amy To"], + "slides": "https://docs.google.com/presentation/d/1eCxEr19T1yPc1zffcvXHE9n0KPUSUy6G87tE_Ub_9Fk/edit?usp=sharing", + "project_link": "https://www.figma.com/file/0r2ncVSKHqBY9pOQCGrHvq/Mobile-Order-Prototypes?type=design&node-id=0%3A1&t=33a883iMHphAA1U1-1" + }, + {"quarter": "Spring 2023", + "subgroup": "Hack", + "project_title": "Word Nerd", + "team_name": "Team 1", + "logo": "/assets/project_logos/word_nerd.png", + "description": "We created a clone of the game CodeNames, except that users have the option to upload their own words so they can follow a theme or use it as a unique way to study vocab concepts with friends.", + "mentor": "Sujal", + "members": ["Greg Weber (Front-end)", "Julie Nguyen (Front-end)", "Josh Chen (Front-end)", "Tim Liu (Back-end)", "Gonzalo Allen-Perez (Back-end)", "Annie Ping (Back-end)"], + "slides": "https://docs.google.com/presentation/d/1xPRnYbfmZHW8l7_jo7gmTAxowV3PmLO39MvzfHht_Dk/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/sp23-hack-team-1", + "other_links": "https://codenames-acm.netlify.app/" + }, + {"quarter": "Spring 2023", + "subgroup": "Hack", + "project_title": "GAMED", + "team_name": "Team 2", + "logo": "/assets/project_logos/gamed.png", + "description": "We created a website where UCSD students can find other players to play video games with. They can do this by creating an account, creating cards, and sending cards to people!.", + "mentor": "Shreya Nagunuri and Kevin Wu", + "members": ["Calvin Nguyen (Front-end)", "Kane Li (Full-stack)"], + "slides": "https://docs.google.com/presentation/d/1W-3JfpnNEghKXsuuCe1638ZBUkyCkntRNy6yUnFhr_4/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/sp23-hack-team-2", + "other_links": "https://ucsdgamed.onrender.com/" + }, + {"quarter": "Spring 2023", + "subgroup": "Hack", + "project_title": "Eventify", + "team_name": "Team 3", + "logo": "/assets/project_logos/eventify.png", + "description": "We created a website that can track on-campus UCSD events.", + "mentor": "Angela Hu and Charvi Shukla", + "members": ["Gavyn Ezell", "Cho Jung (Angela) Tsai", "Qijun (Mary) Hu", "Jae Whan Lee", "Rachel Chau", "Willey Zhou"], + "slides": "https://docs.google.com/presentation/d/1U93WsdyVuFDbvgWZ931oakEpL7zgzbZz8vNolmMZtFI/edit?usp=sharing", + "project_link": "https://github.com/acmucsd-projects/sp23-hack-team-3", + "other_links": "https://www.figma.com/file/KqvP7N6lLUu8NnT2ZnYK3o/Eventify?type=design&node-id=0%3A1&mode=design&t=hnFUTSx4agxe4CNT-1" + }, +]; + +const ProjectCards: React.FC = () => { + return ( +
+ {projects_data.map((project, index) => ( +
+
+

{project.quarter} {project.subgroup} {project.team_name}

+

{project.project_title}

+
+ Project Logo +
+

Project Description: {project.description}

+

Members: {project.members.join(", ")}

+

Mentor: {project.mentor}

+
+
+ + Slides Logo + + Project Repo Logo + {project.other_links && ( + + )} +
+
+ ))} +
+ ) +} + +export default ProjectCards; \ No newline at end of file diff --git a/src/components/project-card/style.module.scss b/src/components/project-card/style.module.scss index 75bfb2f..d061f5d 100644 --- a/src/components/project-card/style.module.scss +++ b/src/components/project-card/style.module.scss @@ -1 +1,56 @@ -@use "..\styles\vars.scss" as v; // allows you to use pre-defined colors \ No newline at end of file +@use "../../styles/vars.scss" as vars; // allows you to use pre-defined colors + +.container { + display: grid; + max-width: 1440px; + margin: 0 auto; + grid-template-columns: repeat(auto-fit, minmax(24rem, 1fr)); + margin-top: 2rem; + margin-bottom: 2rem; + row-gap: 2rem; + column-gap: 2rem; + + .projectItem { + background-color: vars.$darker-white; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: center; + text-decoration: none; + border-radius: 0.5rem; + padding: 1.5rem; + box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); + } + .header { + text-align: center; + .AI { + color: vars.$red; + } + .Hack { + color: vars.$orange; + } + .Design { + color: vars.$pink; + } + } + .logo { + object-fit: contain; + width: 100%; + height: 200px; + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; + } + .description { + flex-grow: 1; + } + .project_links { + display: flex; + flex-direction: row; + gap: 1rem; + } + .links { + object-fit: contain; + width: 100%; + height: 4rem; + } +} \ No newline at end of file diff --git a/src/sections/Archive/index.tsx b/src/sections/Archive/index.tsx index e69de29..9da4b25 100644 --- a/src/sections/Archive/index.tsx +++ b/src/sections/Archive/index.tsx @@ -0,0 +1,13 @@ +import s from './style.module.scss'; +import ProjectCards from '../../components/project-card'; + +const Archive: React.FC = () => { + return ( +
+

Project Archives

+ +
+ ) +} + +export default Archive; \ No newline at end of file diff --git a/src/sections/Archive/style.module.scss b/src/sections/Archive/style.module.scss index 75bfb2f..d4e4b29 100644 --- a/src/sections/Archive/style.module.scss +++ b/src/sections/Archive/style.module.scss @@ -1 +1,9 @@ -@use "..\styles\vars.scss" as v; // allows you to use pre-defined colors \ No newline at end of file +@use "../../styles/vars.scss" as vars; // allows you to use pre-defined colors + +.container { + .header { + margin-top: 2rem; + margin-left: 2rem; + color: vars.$blue-ap; + } +} \ No newline at end of file