Merge pull request #20 from rutgersesports/events

Scarlet Knightmare 2023 Prepartion

src/components/body-text.tsx

@@ -0,0 +1,13 @@
+import styles from '../styles/body-text.module.css'
+
+interface IBodyText {
+  children: any
+}
+
+export default function BodyText(props: IBodyText) {
+  return (
+    <div className={styles['body-text']}>
+      <div className={styles['body-content']}>{props.children}</div>
+    </div>
+  )
+}

src/components/image-header.tsx

@@ -1,14 +1,23 @@
 import React from 'react'
-import styles from '../styles/job-openings-header.module.css'
+import styles from '../styles/image-header.module.css'
+import { StaticImageData } from 'next/image'
 
 interface IImageHeader {
   title: string
+  subtitle?: string
+  backgroundImage: StaticImageData
 }
 
 export default function ImageHeader(props: IImageHeader) {
   return (
-    <div className={styles['job-openings-header']}>
-      <h1>{props.title}</h1>
+    <div
+      className={styles['image-header']}
+      style={{ backgroundImage: `url(${props.backgroundImage.src})`, backgroundRepeat: 'no-repeat' }}
+    >
+      <div>
+        <h1>{props.title}</h1>
+        {props.subtitle != null ? <h2>{props.subtitle}</h2> : <></>}
+      </div>
     </div>
   )
 }

src/components/navigation-bar.tsx

@@ -48,7 +48,7 @@ export default function NavigationBar() {
               <Link href="/">Home</Link>
             </li>
             <li>
-              <Link href="events">Events</Link>
+              <Link href="scarlet-knightmare">Scarlet Knightmare</Link>
             </li>
             <li>
               <Link href="members">Members</Link>

src/components/schedule.tsx

@@ -0,0 +1,65 @@
+import styles from '../styles/schedule.module.css'
+
+export type ScheduleEvent = {
+  name: string
+  location: string
+  startTime?: Date
+  endTime?: Date
+  isHourly?: boolean
+}
+
+interface IScheduleRow {
+  event: ScheduleEvent
+}
+
+function ScheduleRow(props: IScheduleRow) {
+  let displayTime = 'All Day'
+
+  if (props.event.startTime) {
+    const startTime = props.event.startTime.toLocaleTimeString('en-US', { hour: 'numeric', hour12: true })
+    const endTime = props.event.endTime?.toLocaleTimeString('en-US', { hour: 'numeric', hour12: true })
+    displayTime = `${startTime} - ${endTime}`
+  } else if (props.event.isHourly) {
+    displayTime = 'Hourly'
+  }
+
+  return (
+    <tr>
+      <th>
+        <div style={{ fontWeight: 'bold' }}>
+          {props.event.startTime != undefined ? (
+            <p style={{ margin: 0 }}>{displayTime}</p>
+          ) : (
+            <p style={{ margin: 0 }}>All Day</p>
+          )}
+        </div>
+      </th>
+      <th>
+        <div style={{ marginTop: '10px', marginBottom: '10px' }}>
+          <p style={{ margin: 0, fontWeight: 'bold' }}>{props.event.name}</p>
+          <p style={{ margin: 0 }}>{props.event.location}</p>
+        </div>
+      </th>
+    </tr>
+  )
+}
+
+interface ISchedule {
+  title: string
+  events: Array<ScheduleEvent>
+}
+
+export default function Schedule(props: ISchedule) {
+  return (
+    <div>
+      <h1>{props.title}</h1>
+      <table className={styles['schedule']}>
+        <tbody>
+          {props.events.map((data, key) => {
+            return <ScheduleRow key={key} event={data} />
+          })}
+        </tbody>
+      </table>
+    </div>
+  )
+}

src/data/artist-alley-info.ts

@@ -0,0 +1,218 @@
+import { StaticImageData } from 'next/image'
+import { SocialMediaData } from './members-info'
+
+import cogsAvatar from '../images/artist-alley/2023/COGS.png'
+import choombieAvatar from '../images/artist-alley/2023/Choombie.png'
+import disequilAvatar from '../images/artist-alley/2023/DISEQUIL.png'
+import doodleCatAvatar from '../images/artist-alley/2023/DoodleCat Creations.png'
+import envirhoeAvatar from '../images/artist-alley/2023/envirhoe.jpg'
+import hannahAvatar from '../images/artist-alley/2023/Hannah.jpeg'
+import isekaiAvatar from '../images/artist-alley/2023/Isekai Crew.png'
+import juliaAvatar from '../images/artist-alley/2023/Julia_Catbat.png'
+import lunic77Avatar from '../images/artist-alley/2023/Lunic77.jpg'
+import pinkFlourAvatar from '../images/artist-alley/2023/PinkFlour.png'
+import puddingNailsAvatar from '../images/artist-alley/2023/Pudding Nails.png'
+import ruAnimationAvatar from '../images/artist-alley/2023/RU Animation.png'
+import s0IRAvatar from '../images/artist-alley/2023/S0IR Art.jpg'
+import vanvnvAvatar from '../images/artist-alley/2023/Vanvnv.jpeg'
+import absoluteLimeAvatar from '../images/artist-alley/2023/absolutelime_.png'
+import bileAvatar from '../images/artist-alley/2023/bile.gif.png'
+import izzyykAvatar from '../images/artist-alley/2023/i.zzyyk.jpeg'
+import kittenAvatar from '../images/artist-alley/2023/kittenmobile.png'
+import maxsmarvelousmakesAvatar from '../images/artist-alley/2023/maxsmarvelousmakes.jpg'
+import moralitycallsAvatar from '../images/artist-alley/2023/moralitycalls.png'
+import parisAvatar from '../images/artist-alley/2023/paris.png'
+import pupchansAvatar from '../images/artist-alley/2023/pupchans.jpeg'
+import reorannAvatar from '../images/artist-alley/2023/reorann.png'
+import sunseamsAvatar from '../images/artist-alley/2023/sunseams.jpeg'
+import tokenplzAvatar from '../images/artist-alley/2023/tokenplz.png'
+
+export type Artist = {
+  username: string
+  socialMedia: SocialMediaData
+  avatar?: StaticImageData
+}
+
+export const artists2023: Array<Artist> = [
+  {
+    username: 'Paris Arts',
+    socialMedia: {
+      instagram: 'paris.arts',
+      twitter: 'paris_comics',
+    },
+    avatar: parisAvatar,
+  },
+  {
+    username: 'sunseams',
+    socialMedia: {
+      instagram: 'sunseams.shop',
+    },
+    avatar: sunseamsAvatar,
+  },
+  {
+    username: 'DoodleCat Creations',
+    socialMedia: {
+      instagram: 'doodlecatcreations',
+    },
+    avatar: doodleCatAvatar,
+  },
+  {
+    username: 'Vanvnv',
+    socialMedia: {
+      instagram: 'vanvnv',
+    },
+    avatar: vanvnvAvatar,
+  },
+  {
+    username: 'PinkFlour',
+    socialMedia: {
+      instagram: 'I.shoulddraw',
+    },
+    avatar: pinkFlourAvatar,
+  },
+  {
+    username: 'Julia_Catbat',
+    socialMedia: {
+      instagram: 'julia_catbat',
+    },
+    avatar: juliaAvatar,
+  },
+  {
+    username: 'moralitycalls',
+    socialMedia: {
+      instagram: 'moralitycalls',
+    },
+    avatar: moralitycallsAvatar,
+  },
+  {
+    username: 'Creation of Games Society',
+    socialMedia: {
+      instagram: 'rutgerscogs',
+    },
+    avatar: cogsAvatar,
+  },
+  {
+    username: 'Lunic77',
+    socialMedia: {
+      instagram: 'lunic77',
+    },
+    avatar: lunic77Avatar,
+  },
+  {
+    username: 'kittenmobile',
+    socialMedia: {
+      instagram: 'kittenmobile',
+      twitter: 'kittenmobile',
+    },
+    avatar: kittenAvatar,
+  },
+  {
+    username: 'tokenplz',
+    socialMedia: {
+      instagram: 'tokenplz',
+    },
+    avatar: tokenplzAvatar,
+  },
+  {
+    username: 'Choombie',
+    socialMedia: {
+      instagram: 'choombie',
+    },
+    avatar: choombieAvatar,
+  },
+  {
+    username: 'Pudding Nails',
+    socialMedia: {
+      instagram: 'pudding.nails',
+    },
+    avatar: puddingNailsAvatar,
+  },
+  {
+    username: 'S0IR Art',
+    socialMedia: {
+      instagram: 's0ir',
+    },
+    avatar: s0IRAvatar,
+  },
+  {
+    username: 'pupchans',
+    socialMedia: {
+      instagram: 'pupchans_',
+      twitter: 'pupchans',
+    },
+    avatar: pupchansAvatar,
+  },
+  {
+    username: 'DISEQUIL',
+    socialMedia: {
+      instagram: 'dissumerch',
+      twitter: 'disequil',
+    },
+    avatar: disequilAvatar,
+  },
+  {
+    username: 'Isekai Crew',
+    socialMedia: {
+      instagram: 'isekai.crew',
+    },
+    avatar: isekaiAvatar,
+  },
+  {
+    username: 'RU Animation',
+    socialMedia: {
+      instagram: 'ruanimation',
+    },
+    avatar: ruAnimationAvatar,
+  },
+  {
+    username: 'i.zzyyk',
+    socialMedia: {
+      instagram: 'i.zzyyk',
+    },
+    avatar: izzyykAvatar,
+  },
+  {
+    username: 'reorann',
+    socialMedia: {
+      instagram: 'reorann',
+    },
+    avatar: reorannAvatar,
+  },
+  {
+    username: 'absolutelime_',
+    socialMedia: {
+      instagram: 'absolutelime',
+      twitter: 'absolutelime_',
+    },
+    avatar: absoluteLimeAvatar,
+  },
+  {
+    username: 'Hannah',
+    socialMedia: {
+      instagram: 'hannubananu110',
+    },
+    avatar: hannahAvatar,
+  },
+  {
+    username: 'maxsmarvelousmakes',
+    socialMedia: {
+      instagram: 'maxsmarvelousmakes',
+    },
+    avatar: maxsmarvelousmakesAvatar,
+  },
+  {
+    username: 'bile.gif',
+    socialMedia: {
+      instagram: 'bile.gif',
+      twitter: 'bile.gif',
+    },
+    avatar: bileAvatar,
+  },
+  {
+    username: 'envirhoe',
+    socialMedia: {
+      instagram: 'envirhoe',
+    },
+    avatar: envirhoeAvatar,
+  },
+]

src/pages/apply.tsx

@@ -4,12 +4,13 @@ import NavigationBar from '../components/navigation-bar'
 import Footer from '../components/footer'
 import JobOpenings from '../components/job-openings'
 import ImageHeader from '../components/image-header'
+import recruitmentImage from '../images/job-openings.jpg'
 
 export default function Apply() {
   return (
     <div className={styles['base']}>
       <NavigationBar />
-      <ImageHeader title="Recruitment" />
+      <ImageHeader title="Recruitment" backgroundImage={recruitmentImage} />
       <JobOpenings />
       <Footer />
     </div>