From 39bd420a1aba6ba62721d9ccc52a9385256f9de6 Mon Sep 17 00:00:00 2001 From: Kevin Monisit Date: Sat, 20 Jan 2024 12:39:43 -0500 Subject: [PATCH] responsive hero section --- app/(landing)/page.tsx | 12 ++- app/(landing)/sections/About.tsx | 10 +-- app/(landing)/sections/FAQ.tsx | 10 +-- app/(landing)/sections/Hero/Hero.tsx | 58 ++++++++------ app/(landing)/sections/Hero/Navbar.tsx | 104 +++++++++++-------------- app/(landing)/sections/Schedule.tsx | 41 +++++----- app/(landing)/sections/Sponsors.tsx | 10 +-- app/lib/data.ts | 52 +++++++------ package.json | 2 +- types/global.d.ts | 8 +- 10 files changed, 154 insertions(+), 153 deletions(-) diff --git a/app/(landing)/page.tsx b/app/(landing)/page.tsx index 7de55d9..31ca7b6 100644 --- a/app/(landing)/page.tsx +++ b/app/(landing)/page.tsx @@ -16,13 +16,11 @@ export default function Page() {
- { - /** - * We are using Suspense because Schedule and Sponsors will eventually - * pull from the backend. Also, we will need to replace the fallback - * component to a relevant loading component. - */ - } + {/** + * We are using Suspense because Schedule and Sponsors will eventually + * pull from the backend. Also, we will need to replace the fallback + * component to a relevant loading component. + */} Loading Schedule!}> diff --git a/app/(landing)/sections/About.tsx b/app/(landing)/sections/About.tsx index 1994344..f5500c1 100644 --- a/app/(landing)/sections/About.tsx +++ b/app/(landing)/sections/About.tsx @@ -1,12 +1,10 @@ export default function About() { return (
-

- About -

+

About

); -} \ No newline at end of file +} diff --git a/app/(landing)/sections/FAQ.tsx b/app/(landing)/sections/FAQ.tsx index 9208e70..376b0bd 100644 --- a/app/(landing)/sections/FAQ.tsx +++ b/app/(landing)/sections/FAQ.tsx @@ -1,12 +1,10 @@ export default function FAQ() { return (
-

- FAQ -

+

FAQ

); -} \ No newline at end of file +} diff --git a/app/(landing)/sections/Hero/Hero.tsx b/app/(landing)/sections/Hero/Hero.tsx index 3e2a6e8..4b50c22 100644 --- a/app/(landing)/sections/Hero/Hero.tsx +++ b/app/(landing)/sections/Hero/Hero.tsx @@ -3,29 +3,43 @@ import Navbar from './Navbar'; export default function Hero() { return ( -
+ <> - Fire +
-
-
WELCOME TO OUR
-
SCHOOL OF
-
CODECRAFT &
-
WIZARDRY!
-
-
+ {/*
+
*/} + +
+
+
WELCOME TO OUR
+
SCHOOL OF
+
CODECRAFT &
+
CIRCUITRY!
+
+
+ + Fire +
+ ); -} \ No newline at end of file +} diff --git a/app/(landing)/sections/Hero/Navbar.tsx b/app/(landing)/sections/Hero/Navbar.tsx index cf605fb..d51fbb9 100644 --- a/app/(landing)/sections/Hero/Navbar.tsx +++ b/app/(landing)/sections/Hero/Navbar.tsx @@ -1,18 +1,18 @@ 'use client'; -import React from "react"; -import { MdOutlineMenu } from "react-icons/md"; -import { Fragment } from "react"; +import React from 'react'; +import { MdOutlineMenu } from 'react-icons/md'; +import { Fragment } from 'react'; // import { scrollToSectionName } from "./utilities"; -import { usePathname, useRouter } from "next/navigation"; -import { Menu, Transition } from "@headlessui/react"; -import Image from "next/image"; -import Link from "next/link"; +import { usePathname, useRouter } from 'next/navigation'; +import { Menu, Transition } from '@headlessui/react'; +import Image from 'next/image'; +import Link from 'next/link'; function scrollToSectionName(sectionName: string) { const section = document.getElementById(sectionName); if (section) { - section.scrollIntoView({ behavior: "smooth" }); + section.scrollIntoView({ behavior: 'smooth' }); } } @@ -22,7 +22,9 @@ function MenuItem(props: { sectionName: string }) { {({ active }) => ( - - )} ); @@ -57,17 +58,11 @@ function OtherPageMenuItem(props: { sectionName: string }) { function CollapsedMenu() { return ( -
- + ); } - -export default Navbar; \ No newline at end of file +export default Navbar; diff --git a/app/(landing)/sections/Schedule.tsx b/app/(landing)/sections/Schedule.tsx index 21eb095..214ef57 100644 --- a/app/(landing)/sections/Schedule.tsx +++ b/app/(landing)/sections/Schedule.tsx @@ -1,43 +1,48 @@ -import { getSchedule } from "@/app/lib/data"; +import { getSchedule } from '@/app/lib/data'; function ScheduleOfTheDay(props: { dayInfo: DayInfo }) { const { dayInfo } = props; const { day, times } = dayInfo; return ( -
-
{dayInfo.day}
+
+
+ {dayInfo.day} +
{times.map((timeInfo, index) => ( -
-
{timeInfo.time}
-
- {timeInfo.event} +
+ {timeInfo.time}
- +
{timeInfo.event}
))}
); - } export default async function Schedule() { const schedule = await getSchedule(); return ( -
-
-
- -
- +
+
+
+ +
+
); -} \ No newline at end of file +} diff --git a/app/(landing)/sections/Sponsors.tsx b/app/(landing)/sections/Sponsors.tsx index 111008f..bcf59b9 100644 --- a/app/(landing)/sections/Sponsors.tsx +++ b/app/(landing)/sections/Sponsors.tsx @@ -1,12 +1,10 @@ export default function Sponsors() { return (
-

- Sponsors -

+

Sponsors

); -} \ No newline at end of file +} diff --git a/app/lib/data.ts b/app/lib/data.ts index 2dd4350..28deec7 100644 --- a/app/lib/data.ts +++ b/app/lib/data.ts @@ -16,38 +16,40 @@ export async function getSchedule() { await new Promise((resolve) => setTimeout(resolve, 1000)); const schedule: Schedule = { - "Saturday": { - "day": "Saturday", - "times": [ - { "time": "10:00 AM", "event": "Check-in starts" }, - { "time": "11:00 AM", "event": "Opening Ceremony", }, - { "time": "12:00 PM", "event": "Team Building Event" }, - { "time": "12:00 PM", "event": "Hacking Starts" }, - { "time": "12:30 PM", "event": "Lunch" }, - { "time": "1:30 PM", "event": "NJ TRANSIT API Demo" }, - { "time": "2:00 PM", "event": "Algorithms in Society Workshop by Ethitech" }, - { "time": "2:30 PM", "event": "MLH Mini Event" }, - { "time": "5:30 PM", "event": "Tech Talk by NJ TRANSIT" }, - { "time": "8:00 PM", "event": "Dinner" }, - + Saturday: { + day: 'Saturday', + times: [ + { time: '10:00 AM', event: 'Check-in starts' }, + { time: '11:00 AM', event: 'Opening Ceremony' }, + { time: '12:00 PM', event: 'Team Building Event' }, + { time: '12:00 PM', event: 'Hacking Starts' }, + { time: '12:30 PM', event: 'Lunch' }, + { time: '1:30 PM', event: 'NJ TRANSIT API Demo' }, + { + time: '2:00 PM', + event: 'Algorithms in Society Workshop by Ethitech', + }, + { time: '2:30 PM', event: 'MLH Mini Event' }, + { time: '5:30 PM', event: 'Tech Talk by NJ TRANSIT' }, + { time: '8:00 PM', event: 'Dinner' }, ], }, - "Sunday": { - "day": "Sunday", - "times": [ - { "time": "12:00 AM", "event": "Midnight Surprise" }, - { "time": "8:00 AM", "event": "Breakfast", }, + Sunday: { + day: 'Sunday', + times: [ + { time: '12:00 AM', event: 'Midnight Surprise' }, + { time: '8:00 AM', event: 'Breakfast' }, // { "time": "11:00 AM", "event": "Event" }, - { "time": "12:00 PM", "event": "Submissions Due" }, - { "time": "12:30 PM", "event": "Lunch", }, - { "time": "1:00 PM", "event": "Judging Begins" }, - { "time": "3:00 PM", "event": "Judging Ends" }, - { "time": "3:30 PM", "event": "Closing Ceremony", }, + { time: '12:00 PM', event: 'Submissions Due' }, + { time: '12:30 PM', event: 'Lunch' }, + { time: '1:00 PM', event: 'Judging Begins' }, + { time: '3:00 PM', event: 'Judging Ends' }, + { time: '3:30 PM', event: 'Closing Ceremony' }, // { "time": "7:00 PM", "event": "Dinner", "reactIcon": }, // { "time": "9:00 PM", "event": "Venue closes" }, ], - } + }, }; return schedule; diff --git a/package.json b/package.json index 68247e4..c1c2993 100644 --- a/package.json +++ b/package.json @@ -3,9 +3,9 @@ "scripts": { "build": "next build", "dev": "next dev", - "lint": "next lint", "format": "prettier --write --ignore-unknown . --max-warnings=0", "format:check": "prettier --check --ignore-unknown . --max-warnings=0", + "lint": "next lint", "seed": "node -r dotenv/config ./scripts/seed.js", "start": "next start", "tsc": "tsc -p tsconfig.json --noEmit" diff --git a/types/global.d.ts b/types/global.d.ts index de5997c..ab0f681 100644 --- a/types/global.d.ts +++ b/types/global.d.ts @@ -1,7 +1,7 @@ interface DayInfo { - day: string, - times: { time: string, event: string }[] + day: string; + times: { time: string; event: string }[]; } -type day = string -type Schedule = Record; \ No newline at end of file +type day = string; +type Schedule = Record;