diff --git a/bun.lockb b/bun.lockb
index db881bb..905e498 100644
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 03f3f51..d2ddef1 100644
--- a/package.json
+++ b/package.json
@@ -10,13 +10,13 @@
         "astro": "astro"
     },
     "dependencies": {
-        "@astrojs/svelte": "^5.7.2",
+        "@astrojs/svelte": "^6.0.2",
         "@astrojs/tailwind": "^5.0.0",
         "astro": "^4.16.8",
-        "caniuse-lite": "^1.0.30001669",
+        "caniuse-lite": "^1.0.30001684",
         "moment": "^2.30.1",
         "moment-timezone": "^0.5.45",
-        "svelte": "^5.1.9",
+        "svelte": "^5.2.11",
         "tailwindcss": "^3.3.3",
         "typescript": "^5.6.3"
     },
@@ -24,6 +24,6 @@
         "prettier": "^3.0.3",
         "prettier-plugin-astro": "^0.14.1",
         "prettier-plugin-svelte": "^3.0.3",
-        "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6"
+        "@sveltejs/vite-plugin-svelte": "5.0.1"
     }
 }
diff --git a/src/components/sections/BackToBlogs.astro b/src/components/sections/BackToBlogs.astro
new file mode 100644
index 0000000..b1c90c3
--- /dev/null
+++ b/src/components/sections/BackToBlogs.astro
@@ -0,0 +1,21 @@
+<a
+	class="sticky top-5 left-5 ml-10 text-xl bg-white w-fit px-5 py-1 rounded-lg flex justify-center items-center gap-2"
+	href="/blog"
+	style="color: black; text-decoration: none;"
+>
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		fill="none"
+		viewBox="0 0 24 24"
+		stroke-width="1.5"
+		stroke="currentColor"
+		class="size-5"
+	>
+		<path
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			d="M15.75 19.5 8.25 12l7.5-7.5"></path>
+	</svg>
+
+	Back
+</a>
diff --git a/src/components/sections/MoreProjects.svelte b/src/components/sections/MoreProjects.svelte
index b9831c2..b7f1432 100644
--- a/src/components/sections/MoreProjects.svelte
+++ b/src/components/sections/MoreProjects.svelte
@@ -39,6 +39,7 @@
                 if (window.innerWidth <= 768) {
                     video.muted = true;
                     video.autoplay = true;
+                    video.loop = true;
                     video.play();
                 }
             }
@@ -136,7 +137,7 @@
                     win32API to move the mouse and click.
                 </p>
                 <div
-                    class="w-full flex flex-row flex-wrap justify-center lg:justify-end mt-5"
+                    class="w-full flex flex-row flex-wrap justify-center lg:justify-end mt-5 mb-10 lg:mb-0"
                 >
                     <div
                         class="w-fit bg-[#3776AB] text-white
diff --git a/src/components/sections/NavBar.astro b/src/components/sections/NavBar.astro
index cb54d60..4a8d4a4 100644
--- a/src/components/sections/NavBar.astro
+++ b/src/components/sections/NavBar.astro
@@ -10,33 +10,32 @@
 		<span class="bottom-bun"></span>
 	</label>
 	<aside class="sidebar flex z-20">
-		<nav class="flex flex-col capitalize" role="navigation">
+		<nav
+			class="flex flex-col justify-center items-center capitalize w-full gap-5"
+			role="navigation"
+		>
 			<a
-				class="sidebar-url px-5 py-2 mt-10 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/">Home</a
 			>
 			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/what-i-do">What I Do</a
 			>
 			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/projects">Projects</a
 			>
 			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/skills">Skills</a
 			>
 			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/experience">Experience</a
 			>
 			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
-				href="/Blog">Blog</a
-			>
-			<a
-				class="sidebar-url px-5 py-2 mt-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
+				class="text-2xl sidebar-url px-5 py-2 text-center rounded-md hover:text-gray-600 hover:bg-gray-100 transition-colors duration-300"
 				href="/contact">Contact</a
 			>
 		</nav>
@@ -72,10 +71,6 @@
 				class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
 				href="/experience">experience</a
 			>
-			<a
-				class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
-				href="/blog">blog</a
-			>
 			<a
 				class="px-3 mx-2 py-1 text-white hover:bg-gray-200 hover:text-black transition-colors duration-300 rounded-md"
 				href="/contact">contact</a
@@ -92,7 +87,7 @@
 		--foreground: #141414;
 		--background: white;
 		--hamburger-margin: 20px;
-		--animation-timing: 200ms ease-in-out;
+		--animation-timing: 300ms ease-in-out;
 		--hamburger-height: calc(
 			var(--bar-height) * 3 + var(--hamburger-gap) * 2
 		);
@@ -103,7 +98,7 @@
 
 		display: none;
 
-		translate: 0 -20px;
+		translate: 0 20px;
 		flex-direction: column;
 
 		gap: var(--hamburger-gap);
@@ -182,7 +177,7 @@
 		);
 		background-color: var(--foreground);
 		color: var(--background);
-		max-width: 10rem;
+		width: 100vw;
 		min-height: 100vh;
 	}
 
diff --git a/src/components/sections/ProjectsComponent.astro b/src/components/sections/ProjectsComponent.astro
index 67203c4..c42d18b 100644
--- a/src/components/sections/ProjectsComponent.astro
+++ b/src/components/sections/ProjectsComponent.astro
@@ -161,7 +161,7 @@ import TwitchPlays from "./images/projects/twitchplays.webp";
 					>View repository</a
 				>
 			</div>
-			<TaskWidget client:load />
+			<TaskWidget client:visible />
 		</div>
 
 		<div
diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index f674e6b..ae7da9e 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -1,6 +1,6 @@
 ---
 import { getCollection } from "astro:content";
-import NavBar from "../../components/sections/NavBar.astro";
+import BackToBlogs from "../../components/sections/BackToBlogs.astro";
 import Layout from "../../layouts/Layout.astro";
 import Footer from "../../components/sections/FooterComponent.astro";
 
@@ -20,7 +20,7 @@ const { Content } = await entry.render();
 	title="Blog"
 	description="Find out how to contact RythonDev, for sponsorship offers or collaboration opportunities!"
 >
-	<NavBar />
+	<BackToBlogs />
 	<div id="blog-content-component" class="mt-10 pt-10 mx-auto">
 		<h1 class="text-left text-4xl">{entry.data.title}</h1>
 		<p class="text-gray-200 mt-3 text-lg">
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
index ba6fe08..ee1961a 100644
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@@ -12,8 +12,6 @@ const blogPosts = await getCollection("blog");
 	title="Blog"
 	description="Find out how to contact RythonDev, for sponsorship offers or collaboration opportunities!"
 >
-	<NavBar />
-
 	<div id="blog-component" class="mt-10 pt-20">
 		<h1 class="text-center text-5xl">Blog</h1>
 		<div class="mt-10 flex flex-col justify-center items-center">
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index ccef702..9a13481 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -34,7 +34,7 @@ import Footer from "../components/sections/FooterComponent.astro";
 			</div>
 		</div>
 		<div class="mt-10">
-			<ContactComponent client:only />
+			<ContactComponent />
 		</div>
 	</div>
 	<Footer />