Merge pull request #35 from hack-rpi/feature/splash-v2

Improving the Above the Fold
hack-rpi · Apr 22, 2024 · 6a4b85b · 6a4b85b
2 parents 97d622e + a8da56e
commit 6a4b85b
Show file tree

Hide file tree

Showing 8 changed files with 26 additions and 16 deletions.
diff --git a/components/footer/footer.tsx b/components/footer/footer.tsx
@@ -1,6 +1,6 @@
 import NextImage from "next/image";
 import logo from "@/public/HackRPI_Logo_Yellow_Arrow.png";
-import HackRPILink from "../themed_components/hackrpi-link";
+import HackRPILink from "../themed-components/hackrpi-link";
 import SocialLinks from "../socials-links/social-links";
 
 export default function Footer() {

diff --git a/components/nav-bar/nav-bar-desktop.tsx b/components/nav-bar/nav-bar-desktop.tsx
@@ -2,7 +2,7 @@ import NextImg from "next/image";
 import { NavBarLinkType } from "@/types/nav-bar-links";
 import NavBarLink from "./nav-bar-link";
 import logo from "@/public/HackRPI-logo-blue.png";
-import RegistrationButton from "./registration-button";
+import RegistrationButton from "@/components/themed-components/registration-link";
 
 export default function DesktopNavBar({ links }: { links: NavBarLinkType[] }) {
 	return (
@@ -13,16 +13,14 @@ export default function DesktopNavBar({ links }: { links: NavBarLinkType[] }) {
 						<NextImg alt="HackRPI Logo" aria-label="Home Page" src={logo} className="w-14 image-full" />
 					</NavBarLink>
 				</div>
-				<div className="w-1/2">
+				<div className="w-7/12">
 					{links.map((link) => (
 						<NavBarLink key={link.href} href={link.href}>
 							{link.children}
 						</NavBarLink>
 					))}
 				</div>
-				<div className="w-2/6">
-					<RegistrationButton />
-				</div>
+				<RegistrationButton />
 			</div>
 		</div>
 	);

diff --git a/...onents/themed_components/hackrpi-link.tsx → ...onents/themed-components/hackrpi-link.tsx b/...onents/themed_components/hackrpi-link.tsx → ...onents/themed-components/hackrpi-link.tsx
diff --git a/components/themed-components/registration-link.tsx b/components/themed-components/registration-link.tsx
@@ -0,0 +1,10 @@
+import HackRPILink from "./hackrpi-link";
+
+export default function RegistrationLink() {
+	return (
+		<HackRPILink href="https://hackrpi.com" className="text-xl">
+			{" "}
+			Register Now{" "}
+		</HackRPILink>
+	);
+}
diff --git a/components/title-components/desktop-title.tsx b/components/title-components/desktop-title.tsx
@@ -3,8 +3,8 @@ import TitleText from "./title-text";
 
 export default function DesktopTitleComponent() {
 	return (
-		<div className="flex w-full h-screen justify-around items-center mb-16">
-			<div className="flex flex-col w-1/2 items-center justify-around h-full ">
+		<div className="pl-4 pt-4 flex w-full h-screen justify-around items-center mb-8">
+			<div className="flex flex-col w-1/2 items-start justify-around h-full ">
 				<TitleText />
 				<Timer />
 			</div>

diff --git a/components/title-components/mobile-title.tsx b/components/title-components/mobile-title.tsx
@@ -3,7 +3,7 @@ import TitleText from "./title-text";
 
 export default function MobileTitleComponent() {
 	return (
-		<div className="w-full h-fit flex flex-col items-center justify-start mb-8">
+		<div className="w-full h-fit flex flex-col items-start justify-start mb-8">
 			<div className="h-28 w-full"></div>
 			<TitleText />
 			<Timer />

diff --git a/components/title-components/timer.tsx b/components/title-components/timer.tsx
@@ -50,7 +50,7 @@ export default function Timer() {
 	}
 
 	return (
-		<div className="w-full h-fit flex flex-col items-start justify-center">
+		<div className="w-11/12 desktop:w-full h-fit flex flex-col items-start ">
 			{hackathonStarted && !hackathonEnded ? <h1 className="text-4xl font-bold mb-2">SUBMISSIONS DUE: </h1> : null}
 			{hackathonEnded ? <h1 className="text-4xl font-bold mb-2">THANKS FOR JOINING US! </h1> : null}
 			<div className="flex items-center justify-between w-full mb-4">
@@ -94,7 +94,7 @@ export default function Timer() {
 function Circle({ bgColor, textColor, children }: { bgColor: string; textColor: string; children: React.ReactNode }) {
 	return (
 		<div
-			className={`w-1/6 aspect-square rounded-full flex items-center justify-center ${bgColor} ${textColor} text-3xl xs:text-5xl sm:text-6xl desktop:text-5xl lg:text-6xl xl:text-7xl font-bold shadow-lg`}
+			className={`w-1/6 aspect-square rounded-full flex items-center justify-center ${bgColor} ${textColor} text-3xl xs:text-5xl sm:text-6xl desktop:text-5xl lg:text-6xl font-bold shadow-lg`}
 			suppressHydrationWarning
 		>
 			{children}

diff --git a/components/title-components/title-text.tsx b/components/title-components/title-text.tsx
@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import RegistrationButton from "./registration-button";
+import RegistrationButton from "@/components/themed-components/registration-link";
 
 export default function TitleText() {
 	const [year, setYear] = useState(1824);
@@ -29,11 +29,13 @@ export default function TitleText() {
 	return (
 		<div className="w-full font-sans  text-left flex items-start justify-center flex-col mb-8">
 			<h1 className="w-full text-5xl 2xs:text-7xl sm:text-8xl font-bold">HACKRPI</h1>
-			<h2 className="w-full text-4xl sm:text-[4rem] mb-4 sm:mb-8 sm:h-20 whitespace-nowrap">Urban Upgrades</h2>
-			<p className="w-full text-3xl sm:text-4xl mb-8">
-				November 9-10, <span onMouseEnter={() => setYear(1824)}>{year}</span>
+			<h2 className="w-full text-4xl sm:text-[4rem] whitespace-nowrap h-14">Urban Upgrades</h2>
+			<p className={`w-full text-3xl sm:text-4xl mb-8`}>
+				November 9-10,{" "}
+				<span onMouseEnter={() => setYear(1824)} className={year < 2024 ? "text-[#d6001c]" : "text-base-content"}>
+					{year}
+				</span>
 			</p>
-
 			<RegistrationButton />
 		</div>
 	);