diff --git a/.prettierrc b/.prettierrc index 9e26dfe..082bcdd 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1 +1,3 @@ -{} \ No newline at end of file +{ + "useTabs": true +} \ No newline at end of file diff --git a/apps/site/.eslintrc.json b/apps/site/.eslintrc.json index 580f3c9..843501c 100644 --- a/apps/site/.eslintrc.json +++ b/apps/site/.eslintrc.json @@ -1,7 +1,7 @@ { - "extends": "next/core-web-vitals", - "rules": { - "react/no-unescaped-entities": "off", - "@next/next/no-img-element": "off" - } + "extends": "next/core-web-vitals", + "rules": { + "react/no-unescaped-entities": "off", + "@next/next/no-img-element": "off" + } } diff --git a/apps/site/next.config.js b/apps/site/next.config.js index 4436b22..967d2c4 100644 --- a/apps/site/next.config.js +++ b/apps/site/next.config.js @@ -1,8 +1,8 @@ /** @type {import('next').NextConfig} */ const nextConfig = { - experimental: { - appDir: true, - }, + experimental: { + appDir: true, + }, }; module.exports = nextConfig; diff --git a/apps/site/package.json b/apps/site/package.json index d3d8ac8..ff196fd 100644 --- a/apps/site/package.json +++ b/apps/site/package.json @@ -1,36 +1,36 @@ { - "name": "site", - "version": "0.1.0", - "scripts": { - "dev": "next dev", - "build": "next build", - "start": "next start", - "lint": "next lint", - "format:write": "prettier --write .", - "format:check": "prettier --check ." - }, - "dependencies": { - "@radix-ui/react-icons": "^1.3.0", - "@radix-ui/react-navigation-menu": "^1.1.2", - "@sanity/client": "^6.1.2", - "@sanity/image-url": "^1.0.2", - "@types/node": "18.16.3", - "@types/react": "18.2.5", - "@types/react-dom": "18.2.3", - "bootstrap": "^5.2.3", - "eslint": "8.39.0", - "eslint-config-next": "13.4.0", - "lucide-react": "^0.240.0", - "next": "13.4.0", - "react": "18.2.0", - "react-bootstrap": "^2.7.4", - "react-dom": "18.2.0", - "sass": "^1.62.1", - "typescript": "5.0.4", - "zod": "^3.21.4" - }, - "devDependencies": { - "clsx": "^1.2.1", - "server-only": "^0.0.1" - } + "name": "site", + "version": "0.1.0", + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "next lint", + "format:write": "prettier --write .", + "format:check": "prettier --check ." + }, + "dependencies": { + "@radix-ui/react-icons": "^1.3.0", + "@radix-ui/react-navigation-menu": "^1.1.2", + "@sanity/client": "^6.1.2", + "@sanity/image-url": "^1.0.2", + "@types/node": "18.16.3", + "@types/react": "18.2.5", + "@types/react-dom": "18.2.3", + "bootstrap": "^5.2.3", + "eslint": "8.39.0", + "eslint-config-next": "13.4.0", + "lucide-react": "^0.240.0", + "next": "13.4.0", + "react": "18.2.0", + "react-bootstrap": "^2.7.4", + "react-dom": "18.2.0", + "sass": "^1.62.1", + "typescript": "5.0.4", + "zod": "^3.21.4" + }, + "devDependencies": { + "clsx": "^1.2.1", + "server-only": "^0.0.1" + } } diff --git a/apps/site/src/app/(landing)/page.module.scss b/apps/site/src/app/(landing)/page.module.scss index e8f3909..744d333 100644 --- a/apps/site/src/app/(landing)/page.module.scss +++ b/apps/site/src/app/(landing)/page.module.scss @@ -1,39 +1,39 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .involvedButton { - border-color: transparent; - border-radius: 30px; - font-size: 24px; - font-weight: 600; - padding: 10px 25px; - background-color: variables.$red; - color: white; - max-width: 10em; - position: relative; - z-index: 10; - text-decoration: none; + border-color: transparent; + border-radius: 30px; + font-size: 24px; + font-weight: 600; + padding: 10px 25px; + background-color: variables.$red; + color: white; + max-width: 10em; + position: relative; + z-index: 10; + text-decoration: none; } .homeContent { - font-size: 26px; + font-size: 26px; - a { - color: variables.$darkest-blue; - text-decoration: none; + a { + color: variables.$darkest-blue; + text-decoration: none; - &:hover { - text-decoration: underline; - } - } + &:hover { + text-decoration: underline; + } + } } .homeCards { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: center; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; } .events { - background-color: variables.$light-grey; + background-color: variables.$light-grey; } diff --git a/apps/site/src/app/(landing)/page.tsx b/apps/site/src/app/(landing)/page.tsx index 5528b7d..0002f29 100644 --- a/apps/site/src/app/(landing)/page.tsx +++ b/apps/site/src/app/(landing)/page.tsx @@ -5,59 +5,59 @@ import Header from "@/lib/common/components/Header"; import styles from "./page.module.scss"; export default function Home() { - return ( - <> -
- - Get Involved - -
+ return ( + <> +
+ + Get Involved + +
-
-
-
-

About Us

-

- Hack at UCI is a student-run organization established to provide - students with a platform to learn, grow, and develop technology of - the future. Established in 2013, our mission is to promote, - educate, and enhance the community around us by giving students - the platform to learn and create technology. -

- Read More About Us > -
+
+
+
+

About Us

+

+ Hack at UCI is a student-run organization established to provide + students with a platform to learn, grow, and develop technology of + the future. Established in 2013, our mission is to promote, + educate, and enhance the community around us by giving students + the platform to learn and create technology. +

+ Read More About Us > +
-
-
-

Our Events

-

- We aim to celebrate UC Irvine‘s spirit of innovation by - organizing ZotHacks, a beginner friendly hackathon, and HackUCI, - Orange County‘s largest hackathon. Furthermore, our - organization regularly host technical and professional - development workshops that teach students industry-relevant - skills. -

- View Upcoming Events > - {/* */} -
-
+
+
+

Our Events

+

+ We aim to celebrate UC Irvine‘s spirit of innovation by + organizing ZotHacks, a beginner friendly hackathon, and HackUCI, + Orange County‘s largest hackathon. Furthermore, our + organization regularly host technical and professional + development workshops that teach students industry-relevant + skills. +

+ View Upcoming Events > + {/* */} +
+
-
-

Thank you to Our Sponsors

-

- Hack at UCI‘s hackathons and events wouldn‘t be - possible without the aid from our amazing sponsors that have - helped us over the years. Each donation goes right back into - creating an outstanding experience for everyone who attends. -

- View Sponsorship Information > - {/* */} -
-
+
+

Thank you to Our Sponsors

+

+ Hack at UCI‘s hackathons and events wouldn‘t be + possible without the aid from our amazing sponsors that have + helped us over the years. Each donation goes right back into + creating an outstanding experience for everyone who attends. +

+ View Sponsorship Information > + {/* */} +
+
- {/* */} -
- - ); + {/* */} + + + ); } diff --git a/apps/site/src/app/about/TeamCard.module.scss b/apps/site/src/app/about/TeamCard.module.scss index 369dfa8..091f6a2 100644 --- a/apps/site/src/app/about/TeamCard.module.scss +++ b/apps/site/src/app/about/TeamCard.module.scss @@ -1,80 +1,80 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .teamCard { - height: 220px; - width: 110px; + height: 220px; + width: 110px; - .imagesContainer { - position: relative; + .imagesContainer { + position: relative; - .profilePicture { - height: 120px; - width: 110px; - border-radius: 3px; - overflow: hidden; - max-height: 110px; - object-fit: cover; - object-position: 0 0px; - } + .profilePicture { + height: 120px; + width: 110px; + border-radius: 3px; + overflow: hidden; + max-height: 110px; + object-fit: cover; + object-position: 0 0px; + } - .linkedinLogo { - position: absolute; - right: 0px; - z-index: 5; - height: 30px; - width: 30px; - } - } + .linkedinLogo { + position: absolute; + right: 0px; + z-index: 5; + height: 30px; + width: 30px; + } + } - .name { - font-size: 1.25rem; - font-weight: 500; - line-height: 1.2; - margin-top: 0; - margin-bottom: 0.5rem; - } + .name { + font-size: 1.25rem; + font-weight: 500; + line-height: 1.2; + margin-top: 0; + margin-bottom: 0.5rem; + } - .position { - font-size: 1rem; - font-weight: 500; - line-height: 1.2; - margin-top: 0; - margin-bottom: 0.5rem; - } + .position { + font-size: 1rem; + font-weight: 500; + line-height: 1.2; + margin-top: 0; + margin-bottom: 0.5rem; + } } @media screen and (min-width: 760px) { - .teamCard { - height: 300px; - width: 200px; - text-align: left; - margin-right: 20px; + .teamCard { + height: 300px; + width: 200px; + text-align: left; + margin-right: 20px; - .imagesContainer { - position: relative; - margin-bottom: 0.5rem; + .imagesContainer { + position: relative; + margin-bottom: 0.5rem; - .profilePicture { - height: 200px; - width: 200px; - border-radius: 3px; - overflow: hidden; - max-height: 200px; - object-fit: cover; - object-position: 0 0px; - } + .profilePicture { + height: 200px; + width: 200px; + border-radius: 3px; + overflow: hidden; + max-height: 200px; + object-fit: cover; + object-position: 0 0px; + } - .linkedinLogo { - position: absolute; - right: 0px; - z-index: 5; - height: 30px; - width: 30px; - } - } - } + .linkedinLogo { + position: absolute; + right: 0px; + z-index: 5; + height: 30px; + width: 30px; + } + } + } } .footer h1 { - margin-top: 0; + margin-top: 0; } diff --git a/apps/site/src/app/about/TeamCard.tsx b/apps/site/src/app/about/TeamCard.tsx index 4f2d7a8..a3c59b1 100644 --- a/apps/site/src/app/about/TeamCard.tsx +++ b/apps/site/src/app/about/TeamCard.tsx @@ -17,34 +17,34 @@ import styles from "./TeamCard.module.scss"; // interface TeamCardProps { - name: string; - position: string; - image: string; - linkedInUrl: string; + name: string; + position: string; + image: string; + linkedInUrl: string; } const TeamCard = ({ name, position, image, linkedInUrl }: TeamCardProps) => { - return ( -
-
- {name} - - LinkedIn - -
- -
{name}
- -
{position}
-
- ); + return ( +
+
+ {name} + + LinkedIn + +
+ +
{name}
+ +
{position}
+
+ ); }; export default TeamCard; diff --git a/apps/site/src/app/about/TeamSection.module.scss b/apps/site/src/app/about/TeamSection.module.scss index be12db6..0c1736b 100644 --- a/apps/site/src/app/about/TeamSection.module.scss +++ b/apps/site/src/app/about/TeamSection.module.scss @@ -1,21 +1,21 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .teamTitle { - margin-top: 20px; - text-align: center; - font-style: normal; - font-size: 48px; - font-weight: bold; - margin-bottom: 24px; - color: rgba(43, 43, 43, 1); + margin-top: 20px; + text-align: center; + font-style: normal; + font-size: 48px; + font-weight: bold; + margin-bottom: 24px; + color: rgba(43, 43, 43, 1); } .teamGrid { - display: grid; - grid-gap: 20px; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + display: grid; + grid-gap: 20px; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - @media screen and (max-width: 760px) { - grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); - } + @media screen and (max-width: 760px) { + grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); + } } diff --git a/apps/site/src/app/about/TeamSection.tsx b/apps/site/src/app/about/TeamSection.tsx index 6b6f087..bfb0dbb 100644 --- a/apps/site/src/app/about/TeamSection.tsx +++ b/apps/site/src/app/about/TeamSection.tsx @@ -4,33 +4,33 @@ import TeamCard from "./TeamCard"; import styles from "./TeamSection.module.scss"; type Member = { - name: string; - position: string; - image: string; - linkedInUrl: string; + name: string; + position: string; + image: string; + linkedInUrl: string; }; interface TeamSection { - team: string; - members: Member[]; + team: string; + members: Member[]; } const TeamSection = ({ team, members }: TeamSection) => { - return ( -
-

{team}

-
- {members.map((member) => ( - - ))} -
-
- ); + return ( +
+

{team}

+
+ {members.map((member) => ( + + ))} +
+
+ ); }; export default TeamSection; diff --git a/apps/site/src/app/about/getMembers.ts b/apps/site/src/app/about/getMembers.ts index 603b0c0..f763b47 100644 --- a/apps/site/src/app/about/getMembers.ts +++ b/apps/site/src/app/about/getMembers.ts @@ -6,23 +6,23 @@ const FORMAT = "output=tsv"; const dataURL = FEED_URL + SPREADSHEET_KEY + "/" + QUERY + "?" + FORMAT; const getSheetsData = async (page: string) => { - const response = await fetch(dataURL); + const response = await fetch(dataURL); - if (response.status !== 200) - console.warn( - "Error ocurred while fetching schedule data:", - response.statusText - ); + if (response.status !== 200) + console.warn( + "Error ocurred while fetching schedule data:", + response.statusText + ); - const csv = await response.text(); - for (const line of csv.split("\n")) { - const [key, value] = line.split("\t"); - if (key === page) { - return JSON.parse(value); - } - } + const csv = await response.text(); + for (const line of csv.split("\n")) { + const [key, value] = line.split("\t"); + if (key === page) { + return JSON.parse(value); + } + } - return null; + return null; }; export const getMembers = async () => await getSheetsData("members"); diff --git a/apps/site/src/app/about/page.module.scss b/apps/site/src/app/about/page.module.scss index 54f187d..2bf5688 100644 --- a/apps/site/src/app/about/page.module.scss +++ b/apps/site/src/app/about/page.module.scss @@ -1,54 +1,54 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .about { - h2 { - font-size: 2rem; - } - h3 { - font-size: 1.75rem; - } - .aboutContent { - margin: auto; + h2 { + font-size: 2rem; + } + h3 { + font-size: 1.75rem; + } + .aboutContent { + margin: auto; - .aboutDescription { - padding-top: 180px; - text-align: center; - h2 { - font-weight: 500; - margin-bottom: 24px; - } - p { - font-size: 20px; - } - } + .aboutDescription { + padding-top: 180px; + text-align: center; + h2 { + font-weight: 500; + margin-bottom: 24px; + } + p { + font-size: 20px; + } + } - .aboutTeams { - padding-top: 0; - } - } + .aboutTeams { + padding-top: 0; + } + } } .teamPhoto { - background: linear-gradient( - to bottom, - #ffffff 0%, - #ffffff 50%, - #f4f5f8 50%, - #f4f5f8 100% - ); - img { - filter: drop-shadow(0px 25px 50px rgba(0, 0, 0, 0.5)); - border-radius: 10px; - width: 85vw; - } + background: linear-gradient( + to bottom, + #ffffff 0%, + #ffffff 50%, + #f4f5f8 50%, + #f4f5f8 100% + ); + img { + filter: drop-shadow(0px 25px 50px rgba(0, 0, 0, 0.5)); + border-radius: 10px; + width: 85vw; + } } .grayBackground { - background-color: #f4f5f8; + background-color: #f4f5f8; } .halfGrayBackground { - position: relative; - height: 200px; - background-color: #f4f5f8; + position: relative; + height: 200px; + background-color: #f4f5f8; } diff --git a/apps/site/src/app/about/page.tsx b/apps/site/src/app/about/page.tsx index 4bed60e..0cd37c2 100644 --- a/apps/site/src/app/about/page.tsx +++ b/apps/site/src/app/about/page.tsx @@ -9,51 +9,51 @@ import styles from "./page.module.scss"; const title = "About — Hack at UCI"; export const metadata: Metadata = { - title, - openGraph: { - title, - // og description isn't inherited from layout - // might be an upstream bug, but shouldn't really matter either way for now - }, + title, + openGraph: { + title, + // og description isn't inherited from layout + // might be an upstream bug, but shouldn't really matter either way for now + }, }; export default async function Home() { - const teamMembers = await getMembers(); + const teamMembers = await getMembers(); - return ( -
-
+ return ( +
+
-
-
-

Our Mission Statement

-

- Promote, educate, and enhance the community around us by giving - students the platform to learn and create technology. -

-
-
- hackuci team -
-
-
-

Meet the Team

-

- We strive to provide students with a platform to learn, grow, and - develop technology of the future. With every event Hack at UCI - puts on, there is an outstanding team behind it composed of four - hardworking departments: Corporate, Marketing, Logistics, and - Tech. -

-
-
- {Object.entries(teamMembers).map(([team, members]) => ( - // @ts-expect-error - - ))} -
-
-
-
- ); +
+
+

Our Mission Statement

+

+ Promote, educate, and enhance the community around us by giving + students the platform to learn and create technology. +

+
+
+ hackuci team +
+
+
+

Meet the Team

+

+ We strive to provide students with a platform to learn, grow, and + develop technology of the future. With every event Hack at UCI + puts on, there is an outstanding team behind it composed of four + hardworking departments: Corporate, Marketing, Logistics, and + Tech. +

+
+
+ {Object.entries(teamMembers).map(([team, members]) => ( + // @ts-expect-error + + ))} +
+
+
+
+ ); } diff --git a/apps/site/src/app/contact/Icon.module.scss b/apps/site/src/app/contact/Icon.module.scss index 9a0d94b..7576382 100644 --- a/apps/site/src/app/contact/Icon.module.scss +++ b/apps/site/src/app/contact/Icon.module.scss @@ -1,23 +1,23 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .contactIcon { - text-align: center; - font-size: 24px; - font-weight: 600; - margin-bottom: 8rem; + text-align: center; + font-size: 24px; + font-weight: 600; + margin-bottom: 8rem; - .contactLabel { - margin-bottom: 1.5rem; - } + .contactLabel { + margin-bottom: 1.5rem; + } } .contactIcon img { - height: 6rem; - width: 6rem; + height: 6rem; + width: 6rem; } @media (min-width: 768px) { - .contactIcon { - margin: 0 0.65rem; - } + .contactIcon { + margin: 0 0.65rem; + } } diff --git a/apps/site/src/app/contact/Link.tsx b/apps/site/src/app/contact/Link.tsx index 6c9a9da..e19933a 100644 --- a/apps/site/src/app/contact/Link.tsx +++ b/apps/site/src/app/contact/Link.tsx @@ -1,19 +1,19 @@ import styles from "./Icon.module.scss"; interface IconProps { - title: string; - link: string; - image: string; + title: string; + link: string; + image: string; } const Link = ({ title, link, image }: IconProps) => { - return ( -
- -
{title}
- - -
- ); + return ( +
+ +
{title}
+ + +
+ ); }; export default Link; diff --git a/apps/site/src/app/contact/page.module.scss b/apps/site/src/app/contact/page.module.scss index 39472b6..f06058b 100644 --- a/apps/site/src/app/contact/page.module.scss +++ b/apps/site/src/app/contact/page.module.scss @@ -1,20 +1,20 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .contact a { - color: #233b92; - &:hover { - color: #233b92; - } + color: #233b92; + &:hover { + color: #233b92; + } } .contactIcons { - display: flex; - flex-direction: column; + display: flex; + flex-direction: column; } @media (min-width: 768px) { - .contactIcons { - flex-direction: row; - justify-content: space-between; - } + .contactIcons { + flex-direction: row; + justify-content: space-between; + } } diff --git a/apps/site/src/app/contact/page.tsx b/apps/site/src/app/contact/page.tsx index 2d60d0f..b6f5237 100644 --- a/apps/site/src/app/contact/page.tsx +++ b/apps/site/src/app/contact/page.tsx @@ -14,43 +14,43 @@ const title = "Events — Hack at UCI"; // TODO: write description for events page const description = ""; export const metadata: Metadata = { - title, - description, - openGraph: { - title, - description, - }, + title, + description, + openGraph: { + title, + description, + }, }; export default function Home() { - return ( -
-
+ return ( +
+
-
- - - - - -
- {/* */} -
- ); +
+ + + + + +
+ {/* */} +
+ ); } diff --git a/apps/site/src/app/events/EventCard.module.scss b/apps/site/src/app/events/EventCard.module.scss index a59cf4c..c56d064 100644 --- a/apps/site/src/app/events/EventCard.module.scss +++ b/apps/site/src/app/events/EventCard.module.scss @@ -1,27 +1,27 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; .eventCard { - background-color: #f3f3f3; + background-color: #f3f3f3; } .coverImage { - width: 480px; - height: 270px; - object-fit: cover; + width: 480px; + height: 270px; + object-fit: cover; } .details { - padding: 12px; - text-align: left; + padding: 12px; + text-align: left; - .title { - margin: 0.75rem 0; - font-weight: 600; - font-size: 1.5rem; - } + .title { + margin: 0.75rem 0; + font-weight: 600; + font-size: 1.5rem; + } - .time { - font-weight: normal; - font-size: 1rem; - } + .time { + font-weight: normal; + font-size: 1rem; + } } diff --git a/apps/site/src/app/events/EventCard.tsx b/apps/site/src/app/events/EventCard.tsx index 6fc2b70..0ae5dc9 100644 --- a/apps/site/src/app/events/EventCard.tsx +++ b/apps/site/src/app/events/EventCard.tsx @@ -8,36 +8,36 @@ const urlBuilder = imageUrlBuilder(client); import styles from "./EventCard.module.scss"; interface EventCard { - image: z.infer; - title: string; - startTime: string; - endTime?: string; + image: z.infer; + title: string; + startTime: string; + endTime?: string; } const EventCard = ({ image, title, startTime, endTime }: EventCard) => { - const dateTimeFormat = new Intl.DateTimeFormat("en", { - dateStyle: "medium", - timeStyle: "short", - }); + const dateTimeFormat = new Intl.DateTimeFormat("en", { + dateStyle: "medium", + timeStyle: "short", + }); - return ( -
- {image.alt} -
- -

{title}

-
- {/*
+ return ( +
+ {image.alt} +
+ +

{title}

+
+ {/*
{props.title}
@@ -71,8 +71,8 @@ const EventCard = ({ image, title, startTime, endTime }: EventCard) => { Close
*/} -
- ); +
+ ); }; export default EventCard; diff --git a/apps/site/src/app/events/PastEvents.module.scss b/apps/site/src/app/events/PastEvents.module.scss index 4963e5d..fe38a81 100644 --- a/apps/site/src/app/events/PastEvents.module.scss +++ b/apps/site/src/app/events/PastEvents.module.scss @@ -1,11 +1,11 @@ .events { - $card-width: 480px; - $gap-x: 24px; + $card-width: 480px; + $gap-x: 24px; - display: grid; - grid-template-columns: repeat(auto-fill, $card-width); - gap: 32px $gap-x; - justify-content: center; - max-width: $card-width * 3 + $gap-x * 2; - margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fill, $card-width); + gap: 32px $gap-x; + justify-content: center; + max-width: $card-width * 3 + $gap-x * 2; + margin: 0 auto; } diff --git a/apps/site/src/app/events/PastEvents.tsx b/apps/site/src/app/events/PastEvents.tsx index e6e3599..e3190da 100644 --- a/apps/site/src/app/events/PastEvents.tsx +++ b/apps/site/src/app/events/PastEvents.tsx @@ -4,30 +4,30 @@ import EventCard from "./EventCard"; import styles from "./PastEvents.module.scss"; const PastEvents = async () => { - const events = await getEventsDescending(); + const events = await getEventsDescending(); - const now = new Date(); - const pastEvents = events.filter(({ timeRange: { start, end } }) => - end ? new Date(end) < now : new Date(start) < now - ); + const now = new Date(); + const pastEvents = events.filter(({ timeRange: { start, end } }) => + end ? new Date(end) < now : new Date(start) < now + ); - if (pastEvents.length === 0) - return

No past events!

; + if (pastEvents.length === 0) + return

No past events!

; - return ( -
- {pastEvents.map((event) => ( - - ))} -
- ); + return ( +
+ {pastEvents.map((event) => ( + + ))} +
+ ); }; export default PastEvents; diff --git a/apps/site/src/app/events/UpcomingEvents.module.scss b/apps/site/src/app/events/UpcomingEvents.module.scss index 84307e8..2453671 100644 --- a/apps/site/src/app/events/UpcomingEvents.module.scss +++ b/apps/site/src/app/events/UpcomingEvents.module.scss @@ -1,34 +1,34 @@ .title { - font-size: 2.5rem; - text-align: center; - padding-top: 150px; - padding-bottom: 30px; + font-size: 2.5rem; + text-align: center; + padding-top: 150px; + padding-bottom: 30px; } .noEvents { - margin-top: 30px; + margin-top: 30px; - .calendarIcon { - width: 128px; - height: 146px; - margin-bottom: 20px; - } + .calendarIcon { + width: 128px; + height: 146px; + margin-bottom: 20px; + } - .stayTuned { - font-weight: 400; - margin-top: 14px; - font-size: 20px; - } + .stayTuned { + font-weight: 400; + margin-top: 14px; + font-size: 20px; + } } .events { - $card-width: 480px; - $gap-x: 24px; + $card-width: 480px; + $gap-x: 24px; - display: grid; - grid-template-columns: repeat(auto-fill, $card-width); - gap: 32px $gap-x; - justify-content: center; - max-width: $card-width * 3 + $gap-x * 2; - margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fill, $card-width); + gap: 32px $gap-x; + justify-content: center; + max-width: $card-width * 3 + $gap-x * 2; + margin: 0 auto; } diff --git a/apps/site/src/app/events/UpcomingEvents.tsx b/apps/site/src/app/events/UpcomingEvents.tsx index b9f5622..6906f07 100644 --- a/apps/site/src/app/events/UpcomingEvents.tsx +++ b/apps/site/src/app/events/UpcomingEvents.tsx @@ -5,41 +5,41 @@ import calendar from "./calendar-alt-regular.svg"; import styles from "./UpcomingEvents.module.scss"; const UpcomingEvents = async () => { - const events = await getEventsDescending(); + const events = await getEventsDescending(); - const now = new Date(); - const upcomingEvents = events.filter(({ timeRange: { start, end } }) => - end ? new Date(end) > now : new Date(start) > now - ); + const now = new Date(); + const upcomingEvents = events.filter(({ timeRange: { start, end } }) => + end ? new Date(end) > now : new Date(start) > now + ); - if (upcomingEvents.length === 0) - return ( -
- -

No Upcoming Events

- - Stay tuned for upcoming events! - -
- ); + if (upcomingEvents.length === 0) + return ( +
+ +

No Upcoming Events

+ + Stay tuned for upcoming events! + +
+ ); - return ( - <> -

Upcoming Events

-
- {upcomingEvents.reverse().map((event) => ( - - ))} -
- - ); + return ( + <> +

Upcoming Events

+
+ {upcomingEvents.reverse().map((event) => ( + + ))} +
+ + ); }; export default UpcomingEvents; diff --git a/apps/site/src/app/events/getEvents.ts b/apps/site/src/app/events/getEvents.ts index 760656c..830bcae 100644 --- a/apps/site/src/app/events/getEvents.ts +++ b/apps/site/src/app/events/getEvents.ts @@ -6,28 +6,28 @@ import { client } from "@/lib/sanity/sanityClient"; import { SanityDocument, SanityImageReference } from "@/lib/sanity/types"; export const Cover = SanityImageReference.extend({ - alt: z.string(), + alt: z.string(), }); const Events = z.array( - SanityDocument.extend({ - _type: z.literal("event"), - title: z.string(), - cover: Cover, - timeRange: z.object({ - timezone: z.string(), - start: z.string().datetime(), - end: z.string().datetime().optional(), - }), - description: z.string(), - location: z.string().optional(), - }) + SanityDocument.extend({ + _type: z.literal("event"), + title: z.string(), + cover: Cover, + timeRange: z.object({ + timezone: z.string(), + start: z.string().datetime(), + end: z.string().datetime().optional(), + }), + description: z.string(), + location: z.string().optional(), + }) ); export const getEventsDescending = cache(async () => { - return Events.parse( - await client.fetch( - "*[_type == 'event'] | order(timeRange.start desc, timeRange.end desc)" - ) - ); + return Events.parse( + await client.fetch( + "*[_type == 'event'] | order(timeRange.start desc, timeRange.end desc)" + ) + ); }); diff --git a/apps/site/src/app/events/page.tsx b/apps/site/src/app/events/page.tsx index 10183fb..0e1d725 100644 --- a/apps/site/src/app/events/page.tsx +++ b/apps/site/src/app/events/page.tsx @@ -12,29 +12,29 @@ const title = "Events — Hack at UCI"; // TODO: write description for events page const description = ""; export const metadata: Metadata = { - title, - description, - openGraph: { - title, - description, - }, + title, + description, + openGraph: { + title, + description, + }, }; export default async function Home() { - return ( -
-
-
- {/* https://nextjs.org/docs/app/building-your-application/data-fetching/fetching#:~:text=Async%20Server%20Component%20TypeScript%20Error */} - {/* @ts-expect-error Async Server Component */} - + return ( +
+
+
+ {/* https://nextjs.org/docs/app/building-your-application/data-fetching/fetching#:~:text=Async%20Server%20Component%20TypeScript%20Error */} + {/* @ts-expect-error Async Server Component */} + -
-

Past Events

- {/* @ts-expect-error Async Server Component */} - -
-
-
- ); +
+

Past Events

+ {/* @ts-expect-error Async Server Component */} + +
+
+
+ ); } diff --git a/apps/site/src/app/globals.scss b/apps/site/src/app/globals.scss index 6c0646f..dcc3bad 100644 --- a/apps/site/src/app/globals.scss +++ b/apps/site/src/app/globals.scss @@ -1,51 +1,51 @@ @use "~@/lib/common/styles/hack-variables.scss" as variables; html { - scroll-behavior: smooth; + scroll-behavior: smooth; } body { - margin: 0; + margin: 0; } body { - text-align: center; - background-color: variables.$white; - color: black; - - h1 { - font-size: 4.5rem; - font-weight: 700; - } - h2 { - font-size: 3rem; - font-weight: 500; - } - h3 { - font-size: 2.25rem; - } + text-align: center; + background-color: variables.$white; + color: black; + + h1 { + font-size: 4.5rem; + font-weight: 700; + } + h2 { + font-size: 3rem; + font-weight: 500; + } + h3 { + font-size: 2.25rem; + } } .bg-gray { - background-color: variables.$light-grey; + background-color: variables.$light-grey; } .container { - margin: auto; - padding-bottom: 7.5rem; - padding-top: 7.5rem; - - @media (min-width: 576px) { - max-width: 540px; - padding-bottom: 11.25rem; - padding-top: 11.25rem; - } - - @media (min-width: 768px) { - max-width: 720px; - } - - @media (min-width: 992px) { - max-width: 960px; - } + margin: auto; + padding-bottom: 7.5rem; + padding-top: 7.5rem; + + @media (min-width: 576px) { + max-width: 540px; + padding-bottom: 11.25rem; + padding-top: 11.25rem; + } + + @media (min-width: 768px) { + max-width: 720px; + } + + @media (min-width: 992px) { + max-width: 960px; + } } diff --git a/apps/site/src/app/layout.tsx b/apps/site/src/app/layout.tsx index 7c0b021..7978682 100644 --- a/apps/site/src/app/layout.tsx +++ b/apps/site/src/app/layout.tsx @@ -6,36 +6,36 @@ import Footer from "@/lib/common/components/Footer"; import "./globals.scss"; const poppins = Poppins({ - subsets: ["latin"], - weight: ["300", "400", "500", "600", "700"], + subsets: ["latin"], + weight: ["300", "400", "500", "600", "700"], }); const title = "Hack at UCI"; const description = - "Hack at UCI is a student-run organization established to provide students with a platform to learn, grow, and develop technology of the future. Established in 2013, our mission is to promote, educate, and enhance the community around us by giving students the platform to learn and create technology."; + "Hack at UCI is a student-run organization established to provide students with a platform to learn, grow, and develop technology of the future. Established in 2013, our mission is to promote, educate, and enhance the community around us by giving students the platform to learn and create technology."; export const metadata: Metadata = { - title, - description, - openGraph: { - title, - description, - }, + title, + description, + openGraph: { + title, + description, + }, }; export default function RootLayout({ - children, + children, }: { - children: React.ReactNode; + children: React.ReactNode; }) { - return ( - - -