Dev

code-of-conduct.md

@@ -63,7 +63,7 @@ representative at an online or offline event.
 
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
 reported to the community leaders responsible for enforcement at
-uclaacmhack@gmail.com.
+hack@uclaacm.com.
 All complaints will be reviewed and investigated promptly and fairly.
 
 All community leaders are obligated to respect the privacy and security of the

package.json

@@ -5,19 +5,14 @@
   "version": "0.1.0",
   "author": "Timothy Rediehs <trediehs@g.ucla.edu>",
   "dependencies": {
-    "@emotion/react": "^11.10.5",
-    "@emotion/styled": "^11.10.5",
     "@material-ui/core": "^4.11.0",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/styles": "^4.10.0",
-    "@mui/material": "^5.11.6",
     "@svgr/webpack": "^5.4.0",
-    "browser-monads": "^1.0.0",
     "classnames": "^2.2.6",
     "gatsby": "2.24.80",
     "gatsby-cli": "^2.12.100",
     "gatsby-image": "^2.4.19",
-    "gatsby-plugin-anchor-links": "^1.2.1",
     "gatsby-plugin-manifest": "^2.4.31",
     "gatsby-plugin-material-ui": "^2.1.10",
     "gatsby-plugin-offline": "^3.2.28",
@@ -28,13 +23,12 @@
     "gatsby-transformer-yaml": "^4.7.0",
     "jquery": "^3.5.1",
     "prop-types": "^15.7.2",
-    "react": "^18.2.0",
+    "react": "^16.12.0",
     "react-countdown": "^2.2.1",
-    "react-dom": "^18.2.0",
+    "react-dom": "^16.12.0",
     "react-helmet": "^6.1.0",
     "react-player": "^2.8.2",
     "react-slick": "^0.27.11",
-    "react-sticky-box": "^1.0.2",
     "slick-carousel": "^1.8.1",
     "svgo": "^1.3.0",
     "svgo-loader": "^2.2.1"

src/components/HomePage/Banner.js

@@ -198,7 +198,7 @@ function Banner() {
 				<Typography component='h1' variant='h1' className={classes.text} style={{
 					fontWeight: 'bold'
 				}}>
-                    HOTH <span className={classes.hothNumber}>X</span>
+					HOTH <span className={classes.hothNumber}>XI</span>
 				</Typography>
 
 				<NoSsr>
@@ -209,7 +209,7 @@ function Banner() {
 				</NoSsr>
 
 				<Typography variant='h5' className={classes.text} component='h3'
-					style={{ fontWeight: 500, marginTop: 10 }}><b>Location:</b> Carnesale Commons Palisades Room
+					style={{ fontWeight: 500, marginTop: 10 }}><b>Location:</b> The Hill, room TBD
 				</Typography>
 
 				<Box display='flex' alignItems='left' color='white'>
@@ -227,15 +227,15 @@ function Banner() {
 							<time dateTime={hothStart.toISOString()} hidden>
 								{month} {startDay}{endDayString}, 2022
 							</time>
-							<b>Date:</b> Sunday, March 5, 2023
+							<b>Date:</b> Saturday, March 2, 2024
 						</Typography>
 					</Tooltip>
 				</Box>
 
 				{Date.now() > applicationOpen.getTime() && Date.now() < applyDeadline.getTime() &&
-                    <Button className={classes.apply} href={'https://forms.gle/4zSBeQh3cjRtqcg79'} target='_blank'>
-                        Apply Now
-                    </Button>
+					<Button className={classes.apply} href={'https://forms.gle/N7VHpwUMSkGLhBdd6'} target='_blank'>
+						Apply Now
+					</Button>
 				}
 			</>
 		);

src/components/HomePage/FAQSection.js

@@ -110,10 +110,10 @@ AccordionQA.propTypes = {
 };
 
 function FAQSection() {
-	const hothNum = 'X';
-	const appDeadline = 'Friday, February 24, 2023';
-	const hothDate = 'Sunday, March 5, 2023';
-	const hothLocation = 'Carnesale Commons Palisades Room';
+	const hothNum = 'XI';
+	const appDeadline = 'Monday, February 26, 2024';
+	const hothDate = 'Saturday, March 2, 2024';
+	const hothLocation = 'Hill';
 	const faqs = [
 		{
 			question: `What's a hackathon?`,
@@ -173,7 +173,7 @@ function FAQSection() {
 				<>
 					We would love to have you as a mentor to answer participants&apos; technical
 					questions and help them with their projects. If you are interested, send us an email
-					at <Link href='mailto:uclaacmhack@gmail.com'>uclaacmhack@gmail.com</Link> or dm us on
+					at <Link href='mailto:hack@uclaacm.com'>hack@uclaacm.com</Link> or dm us on
 					our <Link href='https://discord.gg/MStu2cnBV9'>discord server</Link>!
 				</>
 		},
@@ -189,7 +189,7 @@ function FAQSection() {
 			question: `I have some other questions.`,
 			answer:
 				<>
-					Send us an email at <Link href='mailto:uclaacmhack@gmail.com'>uclaacmhack@gmail.com</Link>!
+					Send us an email at <Link href='mailto:hack@uclaacm.com'>hack@uclaacm.com</Link>!
 				</>
 		}
 	];

src/components/HomePage/HothDescription.js

@@ -57,7 +57,7 @@ const useStyles = makeStyles(theme => ({
 const LeftGridItem = ({ children }) => <Grid item xs={12} sm={8} md={6}>{children}</Grid>;
 const RightGridItem = ({ children }) => <Grid item sm={10} md={6}>{children}</Grid>;
 
-const SideImage = ({ fluidImage }) => <Img fluid={fluidImage} width='100%' style={{ borderRadius: '14px' }}/>;
+const SideImage = ({ fluidImage }) => <Img fluid={fluidImage} width='100%' style={{ borderRadius: '14px' }} />;
 
 export default function HothDescription() {
 	const theme = useTheme();
@@ -106,18 +106,18 @@ export default function HothDescription() {
 				</hgroup>
 				<Grid container spacing={isSmall ? 3 : 8} alignItems='center' justify='center'>
 					<LeftGridItem>
-						<SideImage fluidImage={data.actionShot1.childImageSharp.fluid}/>
+						<SideImage fluidImage={data.actionShot1.childImageSharp.fluid} />
 					</LeftGridItem>
 					<RightGridItem>
 						<Typography variant='body1' style={{ paddingBottom: isSmall ? theme.spacing(2) : 0 }}>
-							Hack on the Hill (HOTH X) is a{' '}
+							Hack on the Hill (HOTH XI) is a{' '}
 							<strong>12-hour beginner-friendly</strong>
 							{' '}hackathon designed to be your first hackathon experience.
-							HOTH X will be in-person in Carnesale Commons Palisades Room. We hope to see you there!
+							HOTH XI will be in-person on the Hill with the specific room TBD. We hope to see you there!
 						</Typography>
 					</RightGridItem>
 				</Grid>
-				<Grid container spacing={ isSmall ? 3 : 8 } wrap='wrap-reverse' justify='center' alignItems='center'>
+				<Grid container spacing={isSmall ? 3 : 8} wrap='wrap-reverse' justify='center' alignItems='center'>
 					<LeftGridItem>
 						<Typography
 							variant='body1'
@@ -133,14 +133,14 @@ export default function HothDescription() {
 					<RightGridItem>
 						<SideImage fluidImage={data.actionShot2.childImageSharp.fluid} width='100%' style={{
 							borderRadius: '14px'
-						}}/>
+						}} />
 					</RightGridItem>
 				</Grid>
 				<Grid container spacing={isSmall ? 3 : 8} alignItems='center' justify='center'>
 					<LeftGridItem>
 						<SideImage fluidImage={data.hackBanner.childImageSharp.fluid} width='100%' style={{
 							borderRadius: '14px'
-						}}/>
+						}} />
 					</LeftGridItem>
 					<RightGridItem>
 						<Typography variant='body1' style={{ paddingBottom: isSmall ? theme.spacing(2) : 0 }}>

src/components/MenuBar/ButtonBar.js

@@ -83,7 +83,7 @@ function ButtonBar({ isMobile }) {
 			{
 				<BorderLink
 					disabled={Date.now() < applicationOpen.getTime() || Date.now() > applyDeadline.getTime()}
-					href={'https://forms.gle/4zSBeQh3cjRtqcg79'}
+					href={'https://forms.gle/VMhdCzMov8RvGUfP8'}
 					target='_blank'
 				>
 					Apply

src/components/PrizePage/Prizes.js

@@ -138,7 +138,7 @@ export default function Prizes() {
 		<>
 			<Container maxWidth='md'>
 				<Typography align='center' gutterBottom>
-					Below are the total prize amounts for each category :)
+					Below are the total prize amounts for each prize track! :)
 				</Typography>
 				{/* <Typography align='center' gutterBottom>
 					Due to current restrictions with the CS Department we are unable
@@ -152,7 +152,7 @@ export default function Prizes() {
 								<Box className={classes.imageBox}>
 									<Img fluid={iconImageMap.get(prize.img)}
 										style={{ height: '70%', width: '70%' }}
-										objectFit = "contain"
+										objectFit="contain"
 									/>
 								</Box>
 								<Box className={classes.prizeCard}>
@@ -163,9 +163,11 @@ export default function Prizes() {
 										<Squiggle />
 									</Box>
 									<Box className={classes.prizeDescription}>
-										<Typography style={{ color: '#a1a1a1',
+										<Typography style={{
+											color: '#a1a1a1',
 											fontSize: '14px',
-											textTransform: 'uppercase' }}>
+											textTransform: 'uppercase'
+										}}>
 											prize
 										</Typography>
 										<Typography style={{ paddingLeft: '10px', paddingRight: '10px' }}>

src/components/WorkshopPage/WorkshopPage.js

@@ -6,11 +6,12 @@ import useTheme from '@material-ui/core/styles/useTheme';
 import useMediaQuery from '@material-ui/core/useMediaQuery';
 import Workshop from './Workshop.js';
 import { makeStyles } from '@material-ui/core/styles';
-import { AnchorLink } from 'gatsby-plugin-anchor-links';
-import { Button } from '@material-ui/core';
-import StickyBox from 'react-sticky-box';
-import Divider from '@mui/material/Divider';
-
+import ComingSoon from '../ComingSoon/ComingSoon';
+// import { AnchorLink } from 'gatsby-plugin-anchor-links';
+// import { Button } from '@material-ui/core';
+// import StickyBox from 'react-sticky-box';
+// import Divider from '@mui/material/Divider';
+const workshopsAvailable = false;
 const useStyles = makeStyles(theme => ({
 	itemType: {
 		fontWeight: 'medium',
@@ -44,7 +45,6 @@ const useStyles = makeStyles(theme => ({
 	btn: {
 		fontWeight: 500,
 		marginRight: '30px'
-
 	},
 	anchor: {
 		textDecoration: 'none'
@@ -226,7 +226,7 @@ function WorkshopPage() {
 	const theme = useTheme();
 	const classes = useStyles();
 	const isSmall = useMediaQuery(theme.breakpoints.down('sm'));
-	const renderSidebar = true;
+	// const renderSidebar = true;
 
 	const workshopCards = workshops.map(item =>
 		<React.Fragment key={item.type}>
@@ -248,36 +248,39 @@ function WorkshopPage() {
 			</Grid>
 		</React.Fragment>);
 
-	const sectionLinks = workshops.map(item =>
-		<React.Fragment key={item.type}>
-			<AnchorLink to={'/workshops#id_' + item.type.replace(/ /g, '_')}
-				className={classes.anchor}>
-				<Button className={classes.btn} style={{ textDecoration: 'none',
-					display: 'flex', justifyContent: 'flex-start' }}>
-					<Typography variant='h6' component='h1' align='left' className={classes.anchorText}>
-						{item.abbrev}
-					</Typography>
-				</Button>
-			</AnchorLink>
-		</React.Fragment>);
+	// const sectionLinks = workshops.map(item =>
+	// 	<React.Fragment key={item.type}>
+	// 		<AnchorLink to={'/workshops#id_' + item.type.replace(/ /g, '_')}
+	// 			className={classes.anchor}>
+	// 			<Button className={classes.btn} style={{ textDecoration: 'none',
+	// 				display: 'flex', justifyContent: 'flex-start' }}>
+	// 				<Typography variant='h6' component='h1' align='left' className={classes.anchorText}>
+	// 					{item.abbrev}
+	// 				</Typography>
+	// 			</Button>
+	// 		</AnchorLink>
+	// 	</React.Fragment>);
 
 	return (
 		<React.Fragment>
 			<div style={{ display: 'flex', alignItems: 'flex-start' }}>
-				{renderSidebar ?
-					<StickyBox offsetTop={20} offsetBottom={20} className={classes.sections}>
-						<Typography variant='h4' component='h1' align='left' className={classes.topics}>
-							Topics
-						</Typography>
-						{sectionLinks}
-					</StickyBox> :
-					null }
-				<Divider orientation="vertical" variant="middle" flexItem className={classes.sideBarVertical} />
+				{/* {renderSidebar ? */}
+				{/* <StickyBox offsetTop={20} offsetBottom={20} className={classes.sections}> */}
+				{/* <Typography variant='h4' component='h1' align='left' className={classes.topics}> */}
+				{/* Topics */}
+				{/* </Typography> */}
+				{/* {sectionLinks} */}
+				{/* </StickyBox> : */}
+				{/* null } */}
+				{/* <Divider orientation="vertical" variant="middle" flexItem className={classes.sideBarVertical} /> */}
 				<Container maxWidth='md' style={{ marginBottom: theme.spacing(8) }}>
 					<Typography variant='h4' component='h1' className={classes.title}>
 						Workshops
 					</Typography>
-					{workshopCards}
+					{!workshopsAvailable ?
+						<ComingSoon alignment='left' /> :
+						{ workshopCards }
+					}
 				</Container>
 			</div>
 		</React.Fragment>

src/components/constants.js

@@ -1,5 +1,5 @@
-export const hothStart = new Date('2023-03-05T08:00:00-08:00');
-export const hothEnd = new Date('2023-03-05T21:00:00-08:00');
-export const applyDeadline = new Date('2023-02-24T23:59:59-08:00');
-export const applicationOpen = new Date('2023-01-30T12:00:00-08:00');
-export const scheduleAvailableTime = new Date('2023-02-26T23:59:59-08:00');
+export const hothStart = new Date('2024-03-02T08:00:00-08:00');
+export const hothEnd = new Date('2024-03-02T23:00:00-08:00');
+export const applyDeadline = new Date('2024-02-26T23:59:59-08:00');
+export const applicationOpen = new Date('2024-01-29T08:00:00-08:00');
+export const scheduleAvailableTime = new Date('2024-02-26T08:00:00-08:00');