From 8f90a3b9c289554df8395b45931b99f347f68dba Mon Sep 17 00:00:00 2001
From: Jennifer <jennil38@uci.edu>
Date: Fri, 1 Nov 2024 20:28:49 -0700
Subject: [PATCH] background only transparent on large screens at the top

---
 .../src/components/NavBar/NavBar.module.scss  | 25 ++++++++-----------
 apps/site/src/components/NavBar/NavBar.tsx    |  8 +++---
 2 files changed, 15 insertions(+), 18 deletions(-)

diff --git a/apps/site/src/components/NavBar/NavBar.module.scss b/apps/site/src/components/NavBar/NavBar.module.scss
index 72c9890e..713d475a 100644
--- a/apps/site/src/components/NavBar/NavBar.module.scss
+++ b/apps/site/src/components/NavBar/NavBar.module.scss
@@ -4,15 +4,21 @@
 .nav {
 	width: 100%;
 	z-index: 101;
-	background-color: rgba(20, 20, 20, 0.7);
-	mix-blend-mode: hard-light;
-	@include utils.media-breakpoint-up(lg) {
-		backdrop-filter: none;
-	}
 	backdrop-filter: blur(7px);
 	position: fixed;
 	text-align: right;
 	transition: background-color 0.2s ease;
+	background-color: rgba(20, 20, 20, 0.7);
+
+	@include utils.media-breakpoint-up(lg) {
+		backdrop-filter: none;
+	}
+}
+
+.bg-no-scroll {
+	@include utils.media-breakpoint-up(lg) {
+		background-color: transparent !important;
+	}
 }
 
 .navbar {
@@ -60,12 +66,3 @@
 	text-underline-offset: 0.3rem;
 	text-decoration-thickness: 0.14rem;
 }
-
-.bg-transparent {
-	background-color: transparent;
-}
-
-.bg-scrolled {
-	background-color: rgba(20, 20, 20, 0.7);
-	mix-blend-mode: hard-light;
-}
diff --git a/apps/site/src/components/NavBar/NavBar.tsx b/apps/site/src/components/NavBar/NavBar.tsx
index fd3643a1..c9664141 100644
--- a/apps/site/src/components/NavBar/NavBar.tsx
+++ b/apps/site/src/components/NavBar/NavBar.tsx
@@ -30,7 +30,7 @@ export default function NavBar() {
 
 	return (
 		<div
-			className={`${styles.nav} fixed-top ${hasScrolled ? "bg-scrolled" : "bg-transparent"}`}
+			className={`${styles.nav} fixed-top ${hasScrolled ? "" : styles["bg-no-scroll"]}`}
 		>
 			<Navbar variant="dark" expand="lg" className={`${styles.navbar}`}>
 				<Container fluid>
@@ -68,7 +68,7 @@ export default function NavBar() {
 							>
 								SCHEDULE
 							</Link>
-							{/* <Link
+							<Link
 								href="https://forms.gle/cCixQqKR2gDXAUMLA"
 								className={styles.notActive}
 								target="_blank"
@@ -76,12 +76,12 @@ export default function NavBar() {
 								INCIDENT FORM
 							</Link>
 							<Link
-								href="https://zothacks-2023.devpost.com/"
+								href="https://zothacks-2024.devpost.com/"
 								className={styles.notActive}
 								target="_blank"
 							>
 								DEVPOST
-							</Link>	 */}
+							</Link>
 						</Nav>
 					</Navbar.Collapse>
 				</Container>