Add house

i18n.json

@@ -4,6 +4,7 @@
     "pages": {
       "/": ["index", "common"],
       "/profile": ["profile", "common"],
-      "/status": ["status", "common"]
+      "/status": ["status", "common"],
+      "/house": ["house", "common"]
     }
   }

locales/en/house.json

@@ -0,0 +1,3 @@
+{
+    "house": "yude's house"
+}

locales/ja/house.json

@@ -0,0 +1,3 @@
+{
+    "house": "ゆでハウス"
+}

pages/house.js

@@ -0,0 +1,28 @@
+import Layout from "./components/Layout"
+import Navbar from "./components/Navbar"
+import useTranslation from 'next-translate/useTranslation'
+import { faDiscord, faTwitter, faGithub, faKeybase, faInstagram, faMastodon, faSteam } from '@fortawesome/free-brands-svg-icons'
+import { faEnvelope, faBirthdayCake, faMapPin, faSchool, faPhone, faInfo, faKey, faDownload, faEye } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import Link from 'next/link'
+import Image from 'next/image'
+
+import { useRouter } from 'next/router'
+
+export default function About(props) {
+  const router = useRouter()
+  const { locale, locales, defaultLocale, pathname } = router
+  const { t, lang } = useTranslation("house")
+  const house = t('house')
+
+  return (
+
+    <Layout title={house}>
+      <Navbar />
+      <p className="my-2 text-3xl">{house}</p>
+      <div className="mx-9">
+      <iframe className="w-full h-96" src="https://mackerel.io/embed/public/embed/4mVIU29WCRVZgHUxQPzWsfXo953uxiAegbjDb83hTQ7szesCunwdpVkBIzhnLc9i?period=1d" frameborder="0" scrolling="no"></iframe>
+      </div>
+    </Layout>
+  )
+}

pages/index.js

@@ -3,7 +3,7 @@ import Navbar from "./components/Navbar"
 import Link from 'next/link'
 import { ReactElement } from 'react'
 import { faDiscord, faGit, faMastodon, faGithub } from '@fortawesome/free-brands-svg-icons'
-import { faBlog, faBook, faUser, faServer } from '@fortawesome/free-solid-svg-icons'
+import { faBlog, faBook, faUser, faServer, faHouseUser } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import Image from 'next/image'
 import useTranslation from 'next-translate/useTranslation'
@@ -39,6 +39,7 @@ export default function Index(props) {
         <span className="ml-4"><Link href="https://git.yude.jp"><a><FontAwesomeIcon icon={faGit} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
         <span className="ml-4"><Link href="https://mstdn.yude.jp"><a><FontAwesomeIcon icon={faMastodon} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
         <span className="ml-4"><Link href="/status"><a><FontAwesomeIcon icon={faServer} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
+        <span className="ml-4"><Link href="/house"><a><FontAwesomeIcon icon={faHouseUser} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
         <p></p>
       </div>