updated directory structure to fix root Service Worker issues and performance improvements

components/sidebar.html

@@ -0,0 +1,76 @@
+<aside
+  id="sidebar"
+  class="bg-gray-900 text-white transition-transform duration-300 ease-in-out fixed top-0 left-0 w-64 h-full -translate-x-full hidden md:translate-x-0 md:block"
+>
+  <div class="flex flex-col h-full">
+    <div class="flex-1 overflow-y-auto">
+      <nav class="mt-4">
+        <a
+          href="#view=most-recent-videos"
+          class="flex items-center py-2 px-4 hover:bg-gray-800"
+        >
+          <img
+            src="assets/svg/home-icon.svg"
+            alt="Home"
+            class="w-6 h-6 mr-3 flex-shrink-0"
+          />
+          <span class="sidebar-text">Home</span>
+        </a>
+        <a
+          href="#view=explore"
+          class="flex items-center py-2 px-4 hover:bg-gray-800"
+        >
+          <img
+            src="assets/svg/explore-icon.svg"
+            alt="Explore"
+            class="w-6 h-6 mr-3 flex-shrink-0"
+          />
+          <span class="sidebar-text">Explore</span>
+        </a>
+        <a
+          href="#view=subscriptions"
+          class="flex items-center py-2 px-4 hover:bg-gray-800"
+        >
+          <img
+            src="assets/svg/subscriptions-icon.svg"
+            alt="Subscriptions"
+            class="w-6 h-6 mr-3 flex-shrink-0"
+          />
+          <span class="sidebar-text">Subscriptions</span>
+        </a>
+      </nav>
+    </div>
+
+    <div class="mt-auto">
+      <hr class="border-gray-700" />
+      <div class="p-4">
+        <nav class="space-y-2">
+          <a
+            href="about.html"
+            class="flex items-center hover:bg-gray-800 px-4 py-2 rounded"
+          >
+            <img
+              src="assets/svg/about-icon.svg"
+              alt="About"
+              class="w-5 h-5 mr-3"
+            />
+            <span class="sidebar-text">About</span>
+          </a>
+          <a
+            href="https://github.com/PR0M3TH3AN/bitvid"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="flex items-center hover:bg-gray-800 px-4 py-2 rounded"
+          >
+            <img
+              src="assets/svg/github-icon.svg"
+              alt="GitHub"
+              class="w-5 h-5 mr-3"
+            />
+            <span class="sidebar-text">GitHub</span>
+          </a>
+        </nav>
+      </div>
+    </div>
+  </div>
+</aside>