Changes:

- Scroll To Top for Albums and Artists ( closes #123 )
- Opt-in for Prefers Reduced Motion ( closes #124 )
- Thumbnails for local playlists
- Better SW caching

src/components/Prefs.vue

@@ -22,7 +22,8 @@ const { t, setupLocale } = useI18n(),
   instances = ref([]),
   hypInstances = ref([]),
   next = ref(false),
-  compact = ref(false);
+  compact = ref(false),
+  prm = ref(false);
 
 getJson('https://piped-instances.kavin.rocks')
   .then(i => i || getJson('https://instances.tokhmi.xyz'))
@@ -70,6 +71,12 @@ function setCodec(codec) {
     window.audioPlayer.configure('preferredAudioCodecs', codec.split(':'));
 }
 
+function setPRM(prm) {
+  setStore('prm', prm);
+  if (prm) document.body.classList.add('prm');
+  else document.body.classList.remove('prm');
+}
+
 function getStoreBool(key, ele, def) {
   ele.value = getStore(key) || def;
 }
@@ -108,6 +115,7 @@ const verifyApi = computed(() =>
 onMounted(() => {
   getStoreBool('next', next, true);
   getStoreBool('compact', compact, false);
+  getStoreBool('prm', prm, false);
 });
 </script>
 
@@ -137,6 +145,17 @@ onMounted(() => {
     <label for="pref-chk-compact">{{ t('pref.compact') }}</label>
   </div>
 
+  <div class="left">
+    <input
+      type="checkbox"
+      name="pref-chk-prm"
+      id="pref-chk-prm"
+      class="input"
+      @change="setPRM($event.target.checked)"
+      v-model="prm" />
+    <label for="pref-chk-prm">{{ t('pref.prm') }}</label>
+  </div>
+
   <h2>Language</h2>
 
   <select