feat: use BaseButton where easily possible

This replaces links with BaseButton components. BaseButton will use `<button type="button">` inside for this case. This improves accessibility a lot. Also we might be able to remove the `.stop` modifiers in some places because AFAIK the button element stops propagation by default.

src/components/list/partials/list-card.vue

@@ -18,15 +18,16 @@
 			:style="{'background-image': background !== null ? `url(${background})` : false}"></div>
 		<div class="list-content">
 			<div class="is-archived-container">
-			<span class="is-archived" v-if="list.isArchived">
-				{{ $t('namespace.archived') }}
-			</span>
-				<span
+				<span class="is-archived" v-if="list.isArchived">
+					{{ $t('namespace.archived') }}
+				</span>
+				<BaseButton
 					:class="{'is-favorite': list.isFavorite, 'is-archived': list.isArchived}"
 					@click.stop="toggleFavoriteList(list)"
-					class="favorite">
-				<icon :icon="list.isFavorite ? 'star' : ['far', 'star']"/>
-			</span>
+					class="favorite"
+				>
+					<icon :icon="list.isFavorite ? 'star' : ['far', 'star']"/>
+				</BaseButton>
 			</div>
 			<div class="title">{{ list.title }}</div>
 		</div>
@@ -43,6 +44,8 @@ import {getBlobFromBlurHash} from '@/helpers/getBlobFromBlurHash'
 import {colorIsDark} from '@/helpers/color/colorIsDark'
 import ListModel from '@/models/list'
 
+import BaseButton from '@/components/base/BaseButton.vue'
+
 const background = ref<string | null>(null)
 const backgroundLoading = ref(false)
 const blurHashUrl = ref('')