initialize settings page

src/components/nav/Titles/APTitle.vue

@@ -15,7 +15,6 @@ import usePStore from "@/stores/pages/playlist";
 import { computed } from "@vue/reactivity";
 import { useRoute } from "vue-router";
 
-
 const things = computed(() => {
   const route = useRoute();
   let thing = {
@@ -24,18 +23,22 @@ const things = computed(() => {
     source: playSources.album,
   };
 
-  if (route.name == Routes.album) {
-    thing = {
-      source: playSources.album,
-      text: useAlbumStore().info.title,
-      store: useAlbumStore,
-    };
-  } else if (route.name == Routes.playlist) {
-    thing = {
-      source: playSources.playlist,
-      text: usePStore().info.name,
-      store: usePStore,
-    };
+  switch (route.name) {
+    case Routes.album:
+      thing = {
+        source: playSources.album,
+        text: useAlbumStore().info.title,
+        store: useAlbumStore,
+      };
+      break;
+    case Routes.playlist:
+      thing = {
+        source: playSources.playlist,
+        text: usePStore().info.name,
+        store: usePStore,
+      };
+      break;
+      break;
   }
 
   return thing;

src/components/nav/Titles/Folder.vue

@@ -62,14 +62,9 @@ onUpdated(() => {
       height: 2.25rem;
       display: flex;
       align-items: center;
-      margin-left: $smaller;
       overflow: auto;
       padding-right: $smaller;
 
-      // @include for-desktop-down {
-      //   max-width: 9rem;
-      // }
-
       .icon {
         height: 2rem;
         aspect-ratio: 1;

src/components/nav/Titles/Playlists.vue

@@ -1,7 +0,0 @@
-<template>
-  <div
-    class="title"
-  >
-    Playlists
-  </div>
-</template>

src/components/nav/Titles/SimpleTitle.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="title">{{ text }}</div>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  text: string;
+}>();
+</script>