add lottie animation; minor pwa change

website/app.vue

@@ -3,3 +3,7 @@
 		<NuxtPage />
 	</NuxtLayout>
 </template>
+
+<style lang="scss">
+@import "vue3-lottie/dist/style.css";
+</style>

website/components/Layout/LayoutHero.vue

@@ -1,12 +1,16 @@
+<script setup lang="ts">
+</script>
+
 <template>
-	<div id="hero">
-		<article>
-			<h1>MyFursona</h1>
-			<p>
-				MyFursona is an open-source platform where you can show off your fluffy
-				characters and show them off to your friends! Manage, store, and show
-				your fursonas in one place
-			</p>
-		</article>
+	<div class="bg-slate-800 h-screen">
+		<ClientOnly>
+			<Lottie
+				animationLink="/lottie-ae/myfursona-hero.json"
+				:height="500"
+				:width="500"
+        :loop="false"
+        :delay="800"
+			/>
+		</ClientOnly>
 	</div>
 </template>

website/components/Navbar/UserLoggedIn.vue

@@ -17,7 +17,7 @@
 			<span class="sr-only">Profile</span>
 			<nuxt-img
 				provider="cloudinary"
-				src="/projects/misc/ozzy-fp-banner.png"
+				src="/projects/myfursona/ozzy-fp-banner.png"
 				alt="Profile"
 				width="50"
 				height="50"

website/components/TheBaseNavbar.vue

@@ -9,7 +9,7 @@
 				</NuxtLink>
 				<NavbarSearchBox />
 			</div>
-			<NavbarUserLoggedIn />
+			<NavbarUserLoggedOut />
 		</div>
 	</header>
 </template>

website/package.json

@@ -22,5 +22,8 @@
 		"postcss": "^8.4.20",
 		"sass": "^1.57.1",
 		"tailwindcss": "^3.2.4"
+	},
+	"dependencies": {
+		"vue3-lottie": "^2.4.0"
 	}
 }

website/plugins/Vue3Lottie.client.ts

@@ -0,0 +1,5 @@
+import Vue3Lottie from "vue3-lottie"
+
+export default defineNuxtPlugin((nuxtApp) => {
+	nuxtApp.vueApp.use(Vue3Lottie, { name: "Lottie" })
+})

website/public/manifest.json

@@ -10,73 +10,73 @@
 	"display": "minimal-ui",
 	"icons": [
 		{
-			"src": "/icon-orig-32.png",
+			"src": "/icons/icon-orig-32.png",
 			"sizes": "32x32",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-orig-64.png",
+			"src": "/icons/icon-orig-64.png",
 			"sizes": "64x64",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-orig-128.png",
+			"src": "/icons/icon-orig-128.png",
 			"sizes": "128x128",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-orig-256.png",
+			"src": "/icons/icon-orig-256.png",
 			"sizes": "256x256",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-orig-512.png",
+			"src": "/icons/icon-orig-512.png",
 			"sizes": "512x512",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-orig-1024.png",
+			"src": "/icons/icon-orig-1024.png",
 			"sizes": "1024x1024",
 			"type": "image/png",
 			"purpose": "any"
 		},
 		{
-			"src": "/icon-mono-32.png",
+			"src": "/icons/icon-mono-32.png",
 			"sizes": "32x32",
 			"type": "image/png",
 			"purpose": "monochrome"
 		},
 		{
-			"src": "/icon-mono-64.png",
+			"src": "/icons/icon-mono-64.png",
 			"sizes": "64x64",
 			"type": "image/png",
 			"purpose": "monochrome"
 		},
 		{
-			"src": "/icon-mono-128.png",
+			"src": "/icons/icon-mono-128.png",
 			"sizes": "128x128",
 			"type": "image/png",
 			"purpose": "monochrome"
 		},
 		{
-			"src": "/icon-mono-256.png",
+			"src": "/icons/icon-mono-256.png",
 			"sizes": "256x256",
 			"type": "image/png",
 			"purpose": "monochrome"
 		},
 		{
-			"src": "/icon-mono-512.png",
+			"src": "/icons/icon-mono-512.png",
 			"sizes": "512x512",
 			"type": "image/png",
 			"purpose": "monochrome"
 		},
 		{
-			"src": "/icon-mono-1024.png",
+			"src": "/icons/icon-mono-1024.png",
 			"sizes": "1024x1024",
 			"type": "image/png",
 			"purpose": "monochrome"

yarn.lock

@@ -3570,6 +3570,11 @@ long@^4.0.0:
   resolved "https://registry.yarnpkg.com/long/-/long-4.0.0.tgz#9a7b71cfb7d361a194ea555241c92f7468d5bf28"
   integrity sha512-XsP+KhQif4bjX1kbuSiySJFNAehNxgLb6hPRGJ9QsUr8ajHkuXGdrHmFUTUUXhDwVX2R5bY4JNZEwbUiMhV+MA==
 
+lottie-web@^5.8.1:
+  version "5.10.2"
+  resolved "https://registry.yarnpkg.com/lottie-web/-/lottie-web-5.10.2.tgz#a1c952b6734759fcd369eba73b6b7e3d9a76ce0b"
+  integrity sha512-d0PFIGiwuMsJYaF4uPo+qG8dEorlI+xFI2zrrFtE1bGO4WoLIz+NjremxEq1swpR7juR10aeOtmNh3d6G3ub0A==
+
 "[email protected] - 7.13.1":
   version "7.13.1"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-7.13.1.tgz#267a81fbd0881327c46a81c5922606a2cfe336c4"
@@ -5526,6 +5531,14 @@ vue-router@^4.1.6:
   dependencies:
     "@vue/devtools-api" "^6.4.5"
 
+vue3-lottie@^2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/vue3-lottie/-/vue3-lottie-2.4.0.tgz#84fecd68d22beae808a9cc0ee89112435347e242"
+  integrity sha512-arNBADu3vW+1Lf+Pw32mU9T6X7c1bMn1tBvJ0/uo+W0G/0UxHyCwoXzyYIKZWB0WoeEvdo5x7HCf8VH0J7rLsw==
+  dependencies:
+    lodash "^4.17.21"
+    lottie-web "^5.8.1"
+
 vue@^3.2.47:
   version "3.2.47"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.47.tgz#3eb736cbc606fc87038dbba6a154707c8a34cff0"