add translatable string for artist>subscribers

src/components/Artist.vue

@@ -3,11 +3,14 @@ import { ref } from 'vue';
 import Btn from './Btn.vue';
 
 import { useStore } from '@/scripts/util.js';
+
 import { useResults, useArtist } from '@/stores/results.js';
+import { useI18n } from '@/stores/misc.js';
 
 const artist = useArtist(),
   results = useResults(),
-  store = useStore();
+  store = useStore(),
+  { t } = useI18n();
 
 const subs = JSON.parse(store.subs ? store.subs : '[]'),
   hash = artist.state.hash,
@@ -43,9 +46,9 @@ function Sub() {
           @click="
             results.getAlbum('/playlist?list=' + artist.state.playlistId)
           " />
-        <span class="us-box subs" :data-active="isSub" @click="Sub">{{
+        <span class="us-box subs" :data-active="isSub" @click="Sub">
-          artist.state.subscriberCount || 0
+          {{ artist.state.subscriberCount || 0 }} {{ t('artist.subscribers') }}
-        }}</span>
+        </span>
       </div>
     </div>
   </div>
@@ -106,10 +109,6 @@ p.more {
 .subs {
   transition: background-color 0.4s ease, color 0.4s ease;
 }
-.subs::after {
-  content: ' Subscribers';
-  font-weight: bold;
-}
 .subs:hover,
 .subs[data-active='true'] {
   background-color: var(--color-foreground);

src/locales/de.json

@@ -37,6 +37,9 @@
         "sync": "Wiedergabelisten synchronisieren",
         "select": "Hinzufügende Wiedergabeliste auswählen"
     },
+    "artist": {
+        "subscribers": "Abonnenten"
+    },
     "pref": {
         "worst": "am Schlechten",
         "theme": "Farbschema",

src/locales/en.json

@@ -37,6 +37,9 @@
     "sync": "Sync playlists",
     "select": "Select Playlist to Add"
   },
+  "artist": {
+    "subscribers": "Subscribers"
+  },
   "pref": {
     "theme": "Theme",
     "dark": "Dark (Default)",