fixed navbar and shadow

Author: liyunze-coding

src/components/global/Card.astro

@@ -63,7 +63,7 @@ const {
 	.card {
 		/* background: #1c1c1c; */
 		/* background: linear-gradient(135deg, rgb(38, 38, 38)#101010 20%,  100%); */
-		box-shadow: 0 20px 25px 0px var(--shadowColor);
+		box-shadow: 0 10px 25px 10px var(--shadowColor);
 		padding: 0.5rem;
 	}
 </style>

src/components/global/NavBar.astro

@@ -25,8 +25,4 @@ const navLinks = [
 ];
 ---
 
-<HoverNavigation
-	items={navLinks}
-	client:load
-	transition:name="hover-navigation"
-/>
+<HoverNavigation items={navLinks} client:load />

src/components/home/Intro.astro

@@ -8,7 +8,7 @@ import { Image } from "astro:assets";
 
 <div class="w-[90%] md:w-[600px] lg:w-1/2">
 	<Card
-		shadowColor="rgb(4, 57, 57)"
+		shadowColor="rgba(4, 57, 57, 0.5)"
 		className="animate-fadeIn bg-gradient-to-br from-[#101010] to-[#202020]"
 	>
 		<div id="intro" class="flex h-fit flex-col text-white">

src/components/socials/StreamSchedule.svelte

@@ -2,14 +2,19 @@
 	import moment from "moment-timezone";
 	import { onMount } from "svelte";
 
-	const myLocation = "Australia/Melbourne";
+	const myLocation = "Asia/Singapore";
 
 	type StreamScheduleDay = {
 		start: moment.Moment;
 		end: moment.Moment;
 	};
 
-	const myStreamSchedule: null | StreamScheduleDay[] = [];
+	const myStreamSchedule: null | StreamScheduleDay[] = [
+		// {
+		// 	start: getUpcomingTimeDevTZ(4, "11:00"),
+		// 	end: getUpcomingTimeDevTZ(4, "16:00"),
+		// },
+	];
 
 	/**
 	 * Calculates the upcoming specified time for a given day of the week in my timezone.

src/components/ui/NavigationBar.tsx

@@ -57,6 +57,13 @@ export const HoverNavigation = ({
 			observers.push(observer);
 		});
 
+		// set hover index on projects when on "/projects"
+		const splittedURL = window.location.href.split("/");
+
+		if (splittedURL[splittedURL.length - 1]) {
+			setActiveIndex(2);
+		}
+
 		return () => {
 			observers.forEach((observer) => observer.disconnect());
 		};
@@ -76,13 +83,6 @@ export const HoverNavigation = ({
 			}
 		};
 
-		// set hover index on projects when on "/projects"
-		const splittedURL = window.location.href.split("/");
-
-		if (splittedURL[splittedURL.length - 1]) {
-			setHoveredIndex(2);
-		}
-
 		document.addEventListener("mousedown", handleClickOutside);
 		return () => {
 			document.removeEventListener("mousedown", handleClickOutside);