fix: replace a tag with NuxtLink (#906)

This commit is contained in:
三咲智子 Kevin Deng 2023-01-09 21:22:19 +08:00 committed by GitHub
parent 2de0974d6b
commit 675a14db80
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 37 additions and 24 deletions

View file

@ -8,5 +8,11 @@
"jsonc/sort-keys": "error"
}
}
]
],
"rules": {
"vue/no-restricted-syntax":["error", {
"selector": "VElement[name='a']",
"message": "Use NuxtLink instead."
}]
}
}

View file

@ -28,9 +28,9 @@ defineOptions({
<div w-17 h-17 rounded-full border-4 border-bg-base z-2 mt--2 ms--1>
<AccountAvatar :account="account" />
</div>
<a block sm:hidden href="javascript:;" @click.stop>
<NuxtLink block sm:hidden href="javascript:;" @click.stop>
<AccountFollowButton :account="account" />
</a>
</NuxtLink>
</div>
<div sm:mt-2>
<AccountDisplayName :account="account" font-bold text-lg line-clamp-1 ws-pre-wrap break-all />
@ -46,9 +46,9 @@ defineOptions({
<!-- Follow info -->
<div flex justify-between items-center>
<AccountPostsFollowers text-sm :account="account" />
<a sm:block hidden href="javascript:;" @click.stop>
<NuxtLink sm:block hidden href="javascript:;" @click.stop>
<AccountFollowButton :account="account" />
</a>
</NuxtLink>
</div>
</div>
</component>

View file

@ -23,17 +23,17 @@ const emit = defineEmits<{
</p>
<p>
{{ $t('help.desc_para4') }}
<a font-bold text-primary href="/m.webtoo.ls/@elk" target="_blank">
<NuxtLink font-bold text-primary href="/m.webtoo.ls/@elk" target="_blank">
{{ $t('help.desc_para5') }}
</a>
</NuxtLink>
{{ $t('help.desc_para6') }}
</p>
{{ $t('help.desc_para3') }}
<p flex="~ gap-2 wrap" mxa>
<template v-for="team of teams" :key="team.github">
<a :href="`https://github.com/sponsors/${team.github}`" target="_blank" rounded-full transition duration-300 border="~ transparent" hover="scale-105 border-primary">
<NuxtLink :href="`https://github.com/sponsors/${team.github}`" target="_blank" external rounded-full transition duration-300 border="~ transparent" hover="scale-105 border-primary">
<img :src="`/avatars/${team.github}-100x100.png`" :alt="team.display" rounded-full w-15 h-15 height="60" width="60">
</a>
</NuxtLink>
</template>
</p>
<p italic flex justify-center w-full>

View file

@ -55,11 +55,17 @@ function toggleDark() {
{{ $t('settings.about.label') }}
</NuxtLink>
&middot;
<a href="/m.webtoo.ls/@elk" target="_blank">Mastodon</a>
<NuxtLink href="/m.webtoo.ls/@elk" target="_blank">
Mastodon
</NuxtLink>
&middot;
<a href="https://chat.elk.zone" target="_blank">Discord</a>
<NuxtLink href="https://chat.elk.zone" target="_blank" external>
Discord
</NuxtLink>
&middot;
<a href="https://github.com/elk-zone" target="_blank">GitHub</a>
<NuxtLink href="https://github.com/elk-zone" target="_blank" external>
GitHub
</NuxtLink>
</div>
</footer>
</template>

View file

@ -168,11 +168,11 @@ const showReplyTo = $computed(() => !replyToMain && !directReply)
<AccountBotIndicator v-if="status.account.bot" me-2 />
<div flex>
<CommonTooltip :content="createdAt">
<a :title="status.createdAt" :href="statusRoute.href" @click.prevent="go($event)">
<NuxtLink :title="status.createdAt" :href="statusRoute.href" @click.prevent="go($event)">
<time text-sm ws-nowrap hover:underline :datetime="status.createdAt">
{{ timeago }}
</time>
</a>
</NuxtLink>
</CommonTooltip>
<StatusEditIndicator :status="status" inline />
</div>

View file

@ -46,6 +46,7 @@ const cardTypeIconMap: Record<mastodon.v1.PreviewCardType, string> = {
'rounded-lg border border-base': !root,
}"
target="_blank"
external
>
<div
v-if="card.image"

View file

@ -99,13 +99,13 @@ const meta = $computed(() => {
<div p4 sm:px-8 flex flex-col justify-between min-h-50 md:min-h-60 h-full>
<div flex justify-between items-center gap-2 sm:gap-6 h-full mb-2 min-h-35 md:min-h-45>
<div flex flex-col gap-2>
<a flex gap-1 text-xl sm:text-3xl flex-wrap leading-none :href="meta.titleUrl" target="_blank">
<NuxtLink flex gap-1 text-xl sm:text-3xl flex-wrap leading-none :href="meta.titleUrl" target="_blank" external>
<template v-if="meta.repo">
<span>{{ meta.user }}</span><span text-secondary-light>/</span><span text-primary font-bold>{{ meta.repo }}</span>
</template>
<span v-else>{{ meta.user }}</span>
</a>
<a sm:text-lg :href="card.url" target="_blank">
</NuxtLink>
<NuxtLink sm:text-lg :href="card.url" target="_blank" external>
<span v-if="meta.type === 'issue'" text-secondary-light me-2>
#{{ meta.number }}
</span>
@ -113,12 +113,12 @@ const meta = $computed(() => {
PR #{{ meta.number }}
</span>
<span text-secondary leading-tight>{{ meta.details }}</span>
</a>
</NuxtLink>
</div>
<div>
<a :href="meta.titleUrl" target="_blank">
<NuxtLink :href="meta.titleUrl" target="_blank" external>
<img w-30 aspect-square width="20" height="20" rounded-2 :src="meta.avatar">
</a>
</NuxtLink>
</div>
</div>
<div flex justify-between>

View file

@ -41,14 +41,14 @@ const showOriginSite = $computed(() =>
<template v-if="context === 'account' && showOriginSite" #done>
<div p5 text-secondary text-center flex flex-col items-center gap1>
<span italic>{{ $t('timeline.view_older_posts') }}</span>
<a
:href="account!.url" target="_blank"
<NuxtLink
:href="account!.url" target="_blank" external
flex="~ gap-1" items-center text-primary
hover="underline text-primary-active"
>
<div i-ri:external-link-fill />
{{ $t('menu.open_in_original_site') }}
</a>
</NuxtLink>
</div>
</template>
</CommonPaginator>

View file

@ -175,7 +175,7 @@ onClickOutside($$(input), () => {
<div i-ri:lightbulb-line me-1 />
<span>
<i18n-t keypath="user.tip_no_account">
<a href="https://joinmastodon.org/servers" target="_blank" hover="underline text-primary">{{ $t('user.tip_register_account') }}</a>
<NuxtLink href="https://joinmastodon.org/servers" target="_blank" external hover="underline text-primary">{{ $t('user.tip_register_account') }}</NuxtLink>
</i18n-t>
</span>
</div>