add hidden shortcut to clear localStorage

-
click the "general" button in the settings page 3 times
-

src/components/LeftSidebar/NP/SongCard.vue

@@ -61,6 +61,7 @@ const imguri = paths.images.thumb;
       height: auto;
       aspect-ratio: 1;
       object-fit: cover;
+      cursor: pointer;
     }
 
     #bitrate {

src/components/PlaylistsList/PlaylistCard.vue

@@ -28,7 +28,6 @@ const props = defineProps<{
 
 <style lang="scss">
 .p-card {
-  transition: all 0.25s ease;
   position: relative;
   background-color: $playlist-card-bg;
   height: 10rem;
@@ -38,7 +37,7 @@ const props = defineProps<{
     height: 100%;
     aspect-ratio: 1/1.2;
     object-fit: cover;
-    transition: all 0.25s ease;
+    transition: all 0.5s ease;
   }
 
   .overlay {
@@ -63,8 +62,8 @@ const props = defineProps<{
   }
 
   &:hover {
-    img {
-      transform: scale(1.1);
+    .p-name {
+      text-decoration: underline;
     }
   }
 

src/components/SettingsView/Nav.vue

@@ -1,7 +1,11 @@
 <template>
   <div class="settingsnav">
     <div class="buttongroup rounded-sm bg-primary">
-      <button v-for="(group, index) in settingGroups" :key="index">
+      <button
+        v-for="(group, index) in settingGroups"
+        :key="index"
+        @click="increment"
+      >
         {{ group.title }}
       </button>
     </div>
@@ -10,6 +14,20 @@
 
 <script setup lang="ts">
 import settingGroups from "@/settings";
+import { ref } from "vue";
+import { useRouter } from "vue-router";
+
+const router = useRouter();
+const clicks = ref(0);
+
+const increment = () => {
+  clicks.value++;
+
+  if (clicks.value === 3) {
+    localStorage.clear();
+    router.go(0);
+  }
+};
 </script>
 
 <style lang="scss">

src/components/shared/SongItem.vue

@@ -22,7 +22,7 @@
           :class="{ last_played: !isPlaying }"
         ></div>
       </div>
-      <div v-tooltip="track.title">
+      <div v-tooltip="track.title" class="song-title">
         <div class="title ellip" @click="emitUpdate(track)" ref="artisttitle">
           {{ track.title }}
         </div>
@@ -109,11 +109,10 @@ function showMenu(e: Event) {
   height: 3.75rem;
   gap: 1rem;
   user-select: none;
-  // background-color: $gray;
 
-  // &:nth-child(odd) {
-  //   background-color: rgba(26, 26, 26, 0.068);
-  // }
+  .song-title {
+    cursor: pointer;
+  }
 
   &:hover {
     background-color: $gray4;

src/stores/content-width.ts

@@ -7,5 +7,4 @@ const isSmall = computed(() => {
   return content_width.value < 700;
 });
 
-console.log(content_width);
 export { content_width, isSmall };

src/views/PlaylistList.vue

@@ -19,7 +19,6 @@ const pStore = usePStore();
 
 <style lang="scss">
 #p-view {
-  overflow: auto;
   scrollbar-color: $gray2 transparent;
 
   .grid {