161sh/jointrashposs
1
0
Fork 0
mirror of https://iceshrimp.dev/Crimekillz/jointrashposs.git synced 2024-11-24 17:59:07 +01:00
Code Issues Packages Projects Releases Wiki Activity

(add) ブログにシェアボタンを追加

Browse Source
This commit is contained in:
kakkokari-gtyih 2023-12-12 00:36:58 +09:00
parent 24952ab4cc
commit 0a2cfb13ea
2 changed files with 29 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
locales/ja-JP.yml
View File

@ -3,6 +3,8 @@ learnMore: "詳しく知る"
loading: "読み込み中…"
clickToExpand: "（クリックして展開）"
copy: "コピー"
share: "共有する"
note: "ノート"
_seo:
siteName: "Misskey Hub"

28
pages/blog/[slug].vue
View File

@ -14,6 +14,12 @@
<ContentRenderer :value="data" />
</div>
<div class="text-center mt-6 lg:mt-12">
<h2 class="font-bold text-lg mb-4">{{ $t('share') }}</h2>
<div class="mb-6 flex items-center justify-center w-full space-x-4">
<GNuxtLink :to="miShareUrl" target="_blank" class="h-12 p-3 flex items-center rounded-full bg-accent-600 hover:opacity-80 text-white"><MiIco class="w-7 h-7" /><span class="sr-only">Misskey</span><div class="ml-1.5 font-bold">{{ $t('note') }}</div></GNuxtLink>
<GNuxtLink :to="mtdShareUrl" target="_blank" class="w-12 h-12 p-3 rounded-full bg-[#563ACC] hover:opacity-80 text-white"><MastoIco class="w-6 h-6" /><span class="sr-only">Mastodon</span></GNuxtLink>
<GNuxtLink :to="twShareUrl" target="_blank" class="w-12 h-12 p-3 rounded-full bg-black hover:opacity-80 text-white"><TwitterXIco class="w-6 h-6" /><span class="sr-only">X (Twitter)</span></GNuxtLink>
</div>
<GNuxtLink :to="localePath('/blog/', originalLocale)" class="text-xl font-bold hover:opacity-70">
<LeftIco class="mr-2" />{{ $t('_blog.back') }}
</GNuxtLink>
@ -24,9 +30,14 @@
<script setup lang="ts">
import LeftIco from 'bi/arrow-left.svg';
import { joinURL, parseURL } from 'ufo';
import { joinURL, parseURL, withQuery } from 'ufo';
import { isLocalPath } from '@/assets/js/misc';
import type { MiBlogParsedContent } from '~/types/content';
import MiIco from '@/assets/svg/misskey_mi_bi.svg';
import MastoIco from 'bi/mastodon.svg';
import TwitterXIco from 'bi/twitter-x.svg';
// 日本語でしか提供されない
defineI18nRoute({
locales: ['ja'],
@ -69,6 +80,21 @@ route.meta.description = data.value?.description;
const pd = data.value.date ? new Date(data.value.date).toISOString() : undefined;
const miShareUrl = computed(() => withQuery('https://misskey-hub.net/share', {
text: route.meta.title + ' - Misskey Hub',
url: `${runtimeConfig.public.baseUrl}/ja/blog/${route.params.slug}/`,
}));
const mtdShareUrl = computed(() => withQuery('https://donshare.net/share.html', {
text: route.meta.title + ' - Misskey Hub',
url: `${runtimeConfig.public.baseUrl}/ja/blog/${route.params.slug}/`,
}));
const twShareUrl = computed(() => withQuery('https://twitter.com/share', {
text: route.meta.title + ' - Misskey Hub',
url: `${runtimeConfig.public.baseUrl}/ja/blog/${route.params.slug}/`,
}));
route.meta.graph = [
{
"@type": "BlogPosting",