-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
5faffba
commit 7c6582a
Showing
12 changed files
with
280 additions
and
54 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
"use client"; | ||
|
||
import { useState, useEffect } from "react"; | ||
import styles from "./style.module.scss"; | ||
|
||
const Banner = () => { | ||
const [days, setDays] = useState(0); | ||
const [hours, setHours] = useState(0); | ||
const [minutes, setMinutes] = useState(0); | ||
const [seconds, setSeconds] = useState(0); | ||
|
||
useEffect(() => { | ||
const target = new Date("04/02/2024 23:59:59"); | ||
|
||
const interval = setInterval(() => { | ||
const now = new Date(); | ||
const difference = target.getTime() - now.getTime(); | ||
|
||
if (difference <= 0) { | ||
// The target date has passed, set all values to zero | ||
setDays(0); | ||
setHours(0); | ||
setMinutes(0); | ||
setSeconds(0); | ||
clearInterval(interval); | ||
} else { | ||
const d = Math.floor(difference / (1000 * 60 * 60 * 24)); | ||
setDays(d); | ||
|
||
const h = Math.floor( | ||
(difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60) | ||
); | ||
setHours(h); | ||
|
||
const m = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60)); | ||
setMinutes(m); | ||
|
||
const s = Math.floor((difference % (1000 * 60)) / 1000); | ||
setSeconds(s); | ||
} | ||
}, 1000); | ||
|
||
return () => clearInterval(interval); | ||
}, []); | ||
|
||
return ( | ||
<div> | ||
<div className={styles.bannerbg}> | ||
Projects applications close in{" "} | ||
<text className={styles.date}> | ||
{days} days {hours} hours {minutes} minutes {seconds} seconds | ||
</text> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Banner; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
@use "../../styles/vars.scss" as v; // allows you to use pre-defined colors | ||
|
||
.bannerbg { | ||
background-color: v.$acm-blue-30 !important; | ||
text-align: center; | ||
padding: 0.3rem; | ||
} | ||
|
||
.date { | ||
font-weight: 700; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1 @@ | ||
@use "..\styles\vars.scss" as v; // allows you to use pre-defined colors | ||
@use "..\styles\vars.scss"as v; // allows you to use pre-defined colors |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
"use client"; | ||
import Image from "next/image"; | ||
import styles from "./style.module.scss"; | ||
import Description from "../description"; | ||
|
||
const Hero = () => { | ||
const projects_app = "https://acmurl.com/projects-app"; | ||
|
||
return ( | ||
<div className={styles.container}> | ||
<div className={styles.pageContent}> | ||
<div className={styles.hero}> | ||
<div className={styles.hero_left}> | ||
<h1 className={styles.title}>ACM Projects</h1> | ||
<p className={styles.description}> | ||
ACM Projects is our quarterly projects program where students work | ||
in a tight knit team. The program gives students the opportunity | ||
to be hands-on outside of courses in fields such as AI, design, | ||
and software engineering. The program culminates in a projects | ||
showcase and the finished product looks great on resumes. We | ||
welcome all skill levels to apply! | ||
</p> | ||
<div className={styles.application}> | ||
<a href={projects_app} target="_blank"> | ||
<button className={styles.button}> | ||
Apply Now! | ||
{/* Close */} | ||
</button> | ||
</a> | ||
<div> | ||
Applications Due <text>April 4th, 11:59PM!</text> | ||
</div> | ||
</div> | ||
</div> | ||
<img | ||
className={styles.image} | ||
src="/assets/nicole_team.jpg" | ||
alt="ACM Projects" | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
export default Hero; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
@use "../../styles/vars.scss" as v; // allows you to use pre-defined colors | ||
|
||
.container { | ||
height: 100vh; | ||
display: flex; | ||
align-items: center; | ||
justify-content: center; | ||
justify-self: start; | ||
flex-direction: column; | ||
|
||
@media screen and (max-width: 768px) { | ||
align-items: flex-start; | ||
} | ||
} | ||
|
||
.hero { | ||
margin: 0rem 10rem; | ||
font-size: 20px; | ||
word-wrap: normal; | ||
display: flex; | ||
justify-content: center; | ||
} | ||
|
||
.title { | ||
font-size: 64px; | ||
font-weight: 200; | ||
} | ||
|
||
.hero_left { | ||
padding-right: 100px; | ||
} | ||
|
||
.image { | ||
width: 50%; | ||
border-radius: 10px; | ||
} | ||
|
||
.button { | ||
background-color: v.$acm-blue; | ||
color: v.$white; | ||
padding: 12px 30px; | ||
border-radius: 10px; | ||
font-size: 16px; | ||
cursor: pointer; | ||
border-width: 0; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
"use client"; | ||
|
||
import s from "./style.module.scss"; | ||
|
||
const Description = () => { | ||
return ( | ||
<div className={s.projecttypes}> | ||
<div className={s.projectdescription}> | ||
<text className={s.ai}>AI</text> projects focus on building a project | ||
related to all things AI, from natural language processing to computer | ||
vision and more!{" "} | ||
</div> | ||
<div className={s.projectdescription}> | ||
<text className={s.hack}>Hack</text> projects works to build a full MERN | ||
stack website, emulating a software engineering team working on the | ||
Agile process! | ||
</div> | ||
|
||
<div className={s.projectdescription}> | ||
<text className={s.design}>Design</text> projects work on creating or | ||
redesigning a platform, working through the design process from research | ||
to prototyping and more! | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Description; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
@use "../../styles/vars.scss" as v; // allows you to use pre-defined colors | ||
|
||
.hack { | ||
font-weight: bold; | ||
color: #f9a857; | ||
} | ||
|
||
.ai { | ||
font-weight: bold; | ||
color: #ff6f6f; | ||
} | ||
|
||
.design { | ||
font-weight: bold; | ||
color: #ff94b4; | ||
} | ||
|
||
.projecttypes { | ||
display: flex; | ||
justify-content: space-between; | ||
text-align: left; | ||
flex-flow: row wrap; | ||
margin: 0rem 10rem; | ||
padding-top: 5rem; | ||
} | ||
|
||
.projectdescription { | ||
max-width: 33%; | ||
} |
Oops, something went wrong.