fixed hamburger menu and edit link

src/components/blocks/CommunityLinks.astro

@@ -1,11 +1,11 @@
 ---
-const currentUrl = Astro.url.pathname;
+const currentUrl = Astro.url.pathname.slice(0, -1) + ".md";
 ---
 
 <ul class="list-none text-sm">
 	<li class="ml-[0.5rem] my-2">
 		<a
-			href={`https://github.com/liyunze-coding/coworking-website/edit/main/src/pages${currentUrl}.md`}
+			href={`https://github.com/liyunze-coding/coworking-website/edit/main/src/pages${currentUrl}`}
 			class="inline-flex gap-2 transition-colors duration-150 text-white hover:no-underline hover:text-blue-400"
 		>
 			<svg

src/components/blocks/navBar.astro

@@ -14,6 +14,7 @@ import SearchModal from "../ui/SearchModal.astro";
 		<label
 			class="hamburger-menu flex lg:hidden top-2 left-5"
 			aria-label="Menu"
+			transition:persist="hamburger-menu"
 		>
 			<input type="checkbox" aria-controls="navigation" />
 		</label>
@@ -174,20 +175,22 @@ import SearchModal from "../ui/SearchModal.astro";
 </style>
 
 <script is:inline>
+	const verticalNavBar = document.getElementById("vertical-navbar");
+	const hamburgerMenu = document.querySelector(".hamburger-menu input");
+
 	// JavaScript for toggling the menu
 	document.addEventListener("DOMContentLoaded", function () {
 		// Close the menu when a link is clicked
 		const navbarLinks = document.querySelectorAll("#vertical-navbar a");
+
 		navbarLinks.forEach((link) => {
 			link.addEventListener("click", function () {
-				if (verticalNavBar)
+				if (verticalNavBar) hamburgerMenu.checked = false;
-					verticalNavBar.classList.add("-translate-x-[200%]");
 			});
 		});
 	});
 
-	// comment this out if you don't want the search modal
+	document.addEventListener("astro:page-load", () => {
-	window.addEventListener("DOMContentLoaded", (event) => {
 		// @ts-ignore
 		new PagefindUI({
 			element: "#searchModal-search",
@@ -197,5 +200,7 @@ import SearchModal from "../ui/SearchModal.astro";
 			showImages: false,
 			autofocus: false,
 		});
+
+		if (hamburgerMenu) hamburgerMenu.checked = false;
 	});
 </script>

src/components/blocks/verticalNav.astro

@@ -164,9 +164,15 @@ const { showHome } = Astro.props;
 				link.classList.add("text-gray-400");
 			}
 		});
+
+		// close dialog
+		const dialog = document.querySelector("dialog");
+
+		if (dialog) {
+			dialog.close();
+		}
 	});
 
-	window.addEventListener("DOMContentLoaded", (event) => {
 	// @ts-ignore
 	new PagefindUI({
 		element: "#vertical-search",
@@ -176,5 +182,4 @@ const { showHome } = Astro.props;
 		showImages: false,
 		autofocus: false,
 	});
-	});
 </script>

src/components/ui/SearchModal.astro

@@ -50,11 +50,5 @@ const { id } = Astro.props;
 			</svg>
 		</button>
 	</form>
-	<div
+	<div id=`${id}-search` class="mt-2"></div>
-		id=`${id}-search`
-		class="mt-2"
-		transition:name="search"
-		transition:persist
-	>
-	</div>
 </dialog>