From a6819a01d65eed6f1c3726e34264ceb69e63025d Mon Sep 17 00:00:00 2001
From: geoffrey45 <geoffreymungai45@gmail.com>
Date: Sun, 11 Sep 2022 04:04:42 +0300
Subject: [PATCH] add hidden shortcut to clear localStorage

-
click the "general" button in the settings page 3 times
-
---
 src/components/LeftSidebar/NP/SongCard.vue    |  1 +
 src/components/PlaylistsList/PlaylistCard.vue |  7 +++----
 src/components/SettingsView/Nav.vue           | 20 ++++++++++++++++++-
 src/components/shared/SongItem.vue            |  9 ++++-----
 src/stores/content-width.ts                   |  1 -
 src/views/PlaylistList.vue                    |  1 -
 6 files changed, 27 insertions(+), 12 deletions(-)

diff --git a/src/components/LeftSidebar/NP/SongCard.vue b/src/components/LeftSidebar/NP/SongCard.vue
index 59f0fa9d..caa6a4de 100644
--- a/src/components/LeftSidebar/NP/SongCard.vue
+++ b/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 {
diff --git a/src/components/PlaylistsList/PlaylistCard.vue b/src/components/PlaylistsList/PlaylistCard.vue
index 7f206c04..a5595af3 100644
--- a/src/components/PlaylistsList/PlaylistCard.vue
+++ b/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;
     }
   }
 
diff --git a/src/components/SettingsView/Nav.vue b/src/components/SettingsView/Nav.vue
index 84346431..c4888ebf 100644
--- a/src/components/SettingsView/Nav.vue
+++ b/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">
diff --git a/src/components/shared/SongItem.vue b/src/components/shared/SongItem.vue
index fa7eeb1f..24b7cedb 100644
--- a/src/components/shared/SongItem.vue
+++ b/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;
diff --git a/src/stores/content-width.ts b/src/stores/content-width.ts
index d23b8a13..63092b6c 100644
--- a/src/stores/content-width.ts
+++ b/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 };
diff --git a/src/views/PlaylistList.vue b/src/views/PlaylistList.vue
index e156fe66..6dc44eef 100644
--- a/src/views/PlaylistList.vue
+++ b/src/views/PlaylistList.vue
@@ -19,7 +19,6 @@ const pStore = usePStore();
 
 <style lang="scss">
 #p-view {
-  overflow: auto;
   scrollbar-color: $gray2 transparent;
 
   .grid {