Fix src path in build and updated watch view

src/App.vue

@@ -6,24 +6,7 @@ import { SpeedInsights } from '@vercel/speed-insights/vue'
 
 <template>
   <SpeedInsights />
-  <NavBar />
+  <NavBar v-if="$route.name !== 'watch'" />
 
   <RouterView />
 </template>
-
-<style scoped>
-.page-enter-active,
-.page-leave-active {
-  transition: all 0.2s ease;
-}
-
-.page-enter-from {
-  opacity: 0;
-  transform: translateX(20px);
-}
-
-.page-leave-to {
-  opacity: 0;
-  transform: translateX(-20px);
-}
-</style>

src/components/MediaList.vue

@@ -15,6 +15,16 @@ const emit = defineEmits<{
   (e: 'add-media', media: MediaType): void
   (e: 'remove-media', mediaId: number): void
 }>()
+
+window.addEventListener('scroll', () => {
+  const scrollTop = window.scrollY
+  const windowHeight = window.innerHeight
+  const docHeight = document.documentElement.scrollHeight
+  const scrollPercent = (scrollTop + windowHeight) / docHeight
+  if (scrollPercent >= 0.75 && !props.loadingMore && props.isSearch) {
+    emit('loadMore')
+  }
+})
 </script>
 
 <template>

src/views/WatchView.vue

@@ -9,43 +9,32 @@ const isLoaded = ref(false)
 </script>
 
 <template>
-  <div class="flex justify-center min-h-auto px-4 py-12 bg-linear-to-b from-gray-50 to-white">
-    <div
-      class="w-full max-w-6xl bg-white/70 backdrop-blur-md border border-gray-200/60 shadow-md rounded-xl p-4 lg:p-8 transition flex flex-col items-center"
-      v-motion-fade-visible-once
-    >
-      <!-- Title with Experimental badge -->
-      <div class="flex items-center gap-3 mb-6">
-        <h1 class="text-3xl font-bold text-gray-700">
-          Watch <br />
-          <span class="bg-linear-to-r from-indigo-500 to-cyan-400 bg-clip-text text-transparent">
-            {{ mediaName }}
-          </span>
-        </h1>
-        <span class="badge badge-warning">Experimental</span>
-      </div>
+  <div class="flex flex-col items-center w-full min-h-screen bg-black text-white">
+    <!-- Title -->
+    <h1 class="text-2xl md:text-3xl font-bold my-4">
+      {{ mediaName }}
+    </h1>
 
-      <!-- Loading spinner -->
-      <div v-if="!isLoaded" class="flex justify-center items-center h-64 w-full">
-        <span class="loading loading-ring loading-lg text-primary"></span>
-      </div>
-
-      <!-- Responsive iframe -->
-      <div v-show="isLoaded" class="w-full aspect-video rounded-lg overflow-hidden shadow-lg">
-        <iframe
-          :src="'https://vidlink.pro/movie/' + mediaId + '?autoplay=true&title=false'"
-          frameborder="0"
-          allowfullscreen
-          class="w-full h-full"
-          @load="isLoaded = true"
-        ></iframe>
-      </div>
-
-      <!-- Disclaimer -->
-      <p class="mt-6 text-sm text-gray-500 text-center max-w-2xl">
-        ⚠️ This player is provided by a <span class="font-semibold">third‑party service</span>. Ads
-        and pop‑ups may appear, and I do not control or endorse them.
-      </p>
+    <!-- Loading spinner -->
+    <div v-if="!isLoaded" class="flex justify-center items-center flex-1 w-full">
+      <span class="loading loading-ring loading-lg text-white"></span>
     </div>
+
+    <!-- Video player -->
+    <div v-show="isLoaded" class="w-full flex-1">
+      <iframe
+        :src="'https://vidlink.pro/movie/' + mediaId + '?autoplay=true&title=false'"
+        frameborder="0"
+        allowfullscreen
+        class="w-full h-[calc(100vh-5rem)]"
+        @load="isLoaded = true"
+      ></iframe>
+    </div>
+
+    <!-- Disclaimer -->
+    <p class="mt-4 text-xs text-gray-400 text-center px-4 max-w-xl">
+      ⚠️ This player is provided by a <span class="font-semibold">third‑party service</span>. Ads
+      and pop‑ups may appear, and I do not control or endorse them.
+    </p>
   </div>
 </template>

vite.config.ts

@@ -8,7 +8,6 @@ import tailwindcss from '@tailwindcss/vite'
 
 // https://vite.dev/config/
 export default defineConfig({
-  base: process.env.DEPLOY_ENV === 'GH_PAGES' ? '/TBW/' : './',
   plugins: [
     vue(),
     vueDevTools(),