Add mutual links page

docs/mutual/en.md

@@ -0,0 +1,14 @@
+# Mutual links
+Publishing the website whose links to yude.jp.
+
+## Link listing
+### カービィ★KIRBYの家 `https://exout.net/~kirby3ds/`
+[![kirby3ds](/static/images/mutual/kirby3ds.png)](https://exout.net/~kirby3ds/)
+
+### こーげんやさい `https://nona-takahara.github.io/`
+[![こーげんやさい](/static/images/mutual/nona-takahara.png)](https://nona-takahara.github.io/)
+
+
+## To those who want to link yude.jp
+Thank you! You can use the banner below to link this website.
+[![yude.jp](/static/images/banner_new.png)](https://yude.jp)

docs/mutual/ja.md

@@ -0,0 +1,14 @@
+# 相互リンク
+この Web サイトをリンクしてくださっている方のページを掲載します。
+
+## リンク一覧
+### カービィ★KIRBYの家 `https://exout.net/~kirby3ds/`
+[![kirby3ds](/static/images/mutual/kirby3ds.png)](https://exout.net/~kirby3ds/)
+
+### こーげんやさい `https://nona-takahara.github.io/`
+[![こーげんやさい](/static/images/mutual/nona-takahara.png)](https://nona-takahara.github.io/)
+
+
+## このサイトをリンクしてくださる方へ
+ありがとうございます！以下のバナーを使用して、この Web サイトをリンクすることができます。
+[![yude.jp](/static/images/banner_new.png)](https://yude.jp)

locales/en/common.json

@@ -4,5 +4,6 @@
     "tos": "yude.jp Terms of Service",
     "yes_playing": "Playing {{playing}}",
     "listening": "Listening to {{listening}}",
-    "close": "Close"
+    "close": "Close",
+    "mutual": "Mutual links"
 }

locales/ja/common.json

@@ -4,5 +4,6 @@
     "tos": "yude.jp サービス利用規約",
     "yes_playing": "{{playing}} をプレイ中",
     "listening": "{{listening}} を再生中",
-    "close": "閉じる"
+    "close": "閉じる",
+    "mutual": "相互リンク"
 }

pages/index.js

@@ -1,7 +1,7 @@
 import Layout from "./components/Layout"
 import Link from 'next/link'
 import { faDiscord, faGit, faMastodon, faGithub } from '@fortawesome/free-brands-svg-icons'
-import { faBlog, faBook, faUser, faServer, faHouseUser } from '@fortawesome/free-solid-svg-icons'
+import { faBlog, faBook, faUser, faServer, faHouseUser, faHeart } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import Image from 'next/image'
 import useTranslation from 'next-translate/useTranslation'
@@ -48,6 +48,7 @@ export default function Index(props) {
           <path d="M 39.10262 126.138 L 39.16748 12.39574 L 152.7982 12.33506 L 266.4289 12.27438 L 266.4289 126.0773 L 266.4289 239.8803 L 152.7333 239.8803 L 39.03775 239.8803 L 39.10262 126.138 Z M 260.4857 126.0776 L 260.4857 18.55703 L 152.8628 18.55703 L 45.23985 18.55703 L 45.23985 126.0776 L 45.23985 233.5982 L 152.8628 233.5982 L 260.4857 233.5982 L 260.4857 126.0776 Z M 103.8963 162.9245 L 103.8963 126.0776 L 116.1702 126.0776 L 128.4441 126.0776 L 128.4441 113.8758 L 128.4441 101.674 L 152.8628 101.674 L 177.2814 101.674 L 177.2814 113.8758 L 177.2814 126.0776 L 189.3835 126.0776 L 201.4856 126.0776 L 201.6573 150.5415 C 201.7517 163.9967 201.829 180.5779 201.8291 187.3885 L 201.8293 199.7715 L 189.6869 199.7715 L 177.5446 199.7715 L 177.4776 187.5093 L 177.4106 175.2471 L 152.7982 175.1855 L 128.1857 175.1239 L 128.1857 187.4477 L 128.1857 199.7715 L 116.041 199.7715 L 103.8963 199.7715 L 103.8963 162.9245 Z M 79.34843 77.02888 L 79.34843 52.62534 L 103.7671 52.62534 L 128.1857 52.62534 L 128.1857 77.02888 L 128.1857 101.4324 L 103.7671 101.4324 L 79.34843 101.4324 L 79.34843 77.02888 Z M 177.5398 77.02888 L 177.5398 52.62534 L 201.9585 52.62534 L 226.3771 52.62534 L 226.3771 77.02888 L 226.3771 101.4324 L 201.9585 101.4324 L 177.5398 101.4324 L 177.5398 77.02888 Z"/>
         </svg>
         </a></Link></div>
+        <div className="has-tooltip"><span className="tooltip rounded shadow-lg p-1 bg-yellow-600 transform translate-y-10">{t('mutual')}</span><Link href="/mutual"><a><FontAwesomeIcon icon={faHeart} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></div>
         </div>
       </div>
     </Layout>

pages/mutual.js

@@ -0,0 +1,25 @@
+import Layout from "./components/Layout"
+import useTranslation from 'next-translate/useTranslation'
+import { useRouter } from 'next/router'
+import React from "react"
+import ReactMarkdown from "react-markdown"
+import gfm from 'remark-gfm';
+import ja from '../docs/mutual/ja.md'
+import en from '../docs/mutual/en.md'
+
+export default function Tos(props) {
+    const router = useRouter()
+    const { locale, locales, defaultLocale, pathname } = router
+    const { t, lang } = useTranslation("common")
+    return(
+        <Layout title={t('common:mutual')}>
+        <div>
+        {lang === 'ja' ? (
+          <ReactMarkdown plugins={[gfm]} children={ja} />
+        ) : (
+          <ReactMarkdown plugins={[gfm]} children={en} />
+        )}
+        </div>
+        </Layout>
+        )
+    }