add invidious embed for the video

package-lock.json

@@ -23,7 +23,6 @@
         "npm-run-all": "^4.1.5",
         "prettier": "^2.8.4",
         "typescript": "~4.8.4",
-        "vite": "^4.1.4",
         "vue-tsc": "^1.2.0"
       }
     },
@@ -485,6 +484,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -501,6 +501,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -517,6 +518,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -533,6 +535,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -549,6 +552,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -565,6 +569,7 @@
       "os": [
         "freebsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -581,6 +586,7 @@
       "os": [
         "freebsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -597,6 +603,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -613,6 +620,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -629,6 +637,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -645,6 +654,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -661,6 +671,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -677,6 +688,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -693,6 +705,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -709,6 +722,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -725,6 +739,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -741,6 +756,7 @@
       "os": [
         "netbsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -757,6 +773,7 @@
       "os": [
         "openbsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -773,6 +790,7 @@
       "os": [
         "sunos"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -789,6 +807,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -805,6 +824,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -821,6 +841,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -2073,6 +2094,7 @@
       "integrity": "sha512-/jUywtAymR8jR4qsa2RujlAF7Krpt5VWi72Q2yuLD4e/hvtNcFQ0I1j8m/bxq238pf3/0KO5yuXNpuLx8BE1KA==",
       "dev": true,
       "hasInstallScript": true,
+      "peer": true,
       "bin": {
         "esbuild": "bin/esbuild"
       },
@@ -2640,6 +2662,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
@@ -4000,6 +4023,7 @@
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.20.7.tgz",
       "integrity": "sha512-P7E2zezKSLhWnTz46XxjSmInrbOCiul1yf+kJccMxT56vxjHwCbDfoLbiqFgu+WQoo9ij2PkraYaBstgB2prBA==",
       "dev": true,
+      "peer": true,
       "bin": {
         "rollup": "dist/bin/rollup"
       },
@@ -4463,6 +4487,7 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-4.3.1.tgz",
       "integrity": "sha512-EPmfPLAI79Z/RofuMvkIS0Yr091T2ReUoXQqc5ppBX/sjFRhHKiPPF/R46cTdoci/XgeQpB23diiJxq5w30vdg==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.17.5",
         "postcss": "^8.4.21",

package.json

@@ -27,7 +27,6 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^2.8.4",
     "typescript": "~4.8.4",
-    "vite": "^4.1.4",
     "vue-tsc": "^1.2.0"
   }
 }

src/App.vue

@@ -1,19 +1,32 @@
 <script setup lang="ts">
 import HelloWorld from './components/HelloWorld.vue'
-import TheWelcome from './components/TheWelcome.vue'
+import Video from './components/Video.vue'
+
+// function alert() {
+//   console.log("lol hi")
+// }
 </script>
 
 <template>
+  <!-- <div class="navbar">
+    <button @click="alert()">Home</button>
+  </div> -->
   <header>
-    <img alt="my pfp, made with @greyfeu's picrew" class="logo" src="./assets/pfp.png" width="150" height="150" />
+    <img
+      alt="my pfp, made with @greyfeu's picrew"
+      class="logo"
+      src="./assets/pfp.png"
+      width="150"
+      height="150"
+    />
 
     <div class="wrapper">
-      <HelloWorld msg="Welcome to my shitass website!" />
+      <HelloWorld msg="SadlyNotSappho" />
     </div>
   </header>
 
   <main>
-    <TheWelcome />
+    <Video />
   </main>
 </template>
 

src/components/HelloWorld.vue

@@ -8,8 +8,12 @@ defineProps<{
   <div class="greetings">
     <h1 class="pink">{{ msg }}</h1>
     <h3>
-      If you came here for the video - which I previously said this site redirects to, it's 
+      If you came here for the video - which I previously said this site redirects to, it's
-      <a href="https://www.youtube.com/watch?v=wURbb6Tm1QM" target="_blank" rel="noopener">right here</a>.
+      <a href="https://www.youtube.com/watch?v=wURbb6Tm1QM" target="_blank" rel="noopener"
+        >over on YouTube</a
+      >, or, of course, you can just watch it embedded here (using
+      <a href="https://tube.catvibers.me" target="_blank" rel="noopener">an Invidious instance hosted on catvibers.me</a> instead
+      of YouTube)
     </h3>
   </div>
 </template>

src/components/TheWelcome.vue

@@ -1,5 +0,0 @@
-<template>
-  <img alt="a stock image of an orange, sorta chubby, cat, sitting on a wood table" class="cat"
-    src="../assets/stock-image-of-cat.webp" />
-  <img alt="A screenshot from a messaging platform" class="jankmobile" src="../assets/sorta-jank-on-mobile.png" />
-</template>

src/components/Video.vue

@@ -0,0 +1,9 @@
+<template>
+  <iframe
+    id="ivplayer"
+    width="640"
+    height="360"
+    src="https://tube.catvibers.me/embed/wURbb6Tm1QM"
+    style="border: none"
+  ></iframe>
+</template>