friends-best/pages/index.tsx

45 lines
1.9 KiB
TypeScript
Raw Normal View History

2021-07-23 16:14:54 +00:00
import Head from 'next/head'
2021-07-23 18:35:41 +00:00
import { useTranslations } from 'next-intl'
import { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
2021-07-23 20:31:56 +00:00
import Image from 'next/image'
import {LinkCard, Title} from '../components'
2021-07-23 18:35:41 +00:00
export function getStaticProps({locale}: GetStaticPropsContext) {
return {
props: {
// You can get the messages from anywhere you like, but the recommended
// pattern is to put them in JSON files separated by language and read
// the desired one based on the `locale` received from Next.js.
messages: require(`../locales/${locale}.json`),
}
};
}
2021-07-23 16:14:54 +00:00
export default function Home() {
2021-07-23 18:35:41 +00:00
const t = useTranslations('common')
2021-07-23 16:14:54 +00:00
return (
<div className="min-h-screen min-w-full bg-gray-400 dark:bg-gray-800">
2021-07-23 16:14:54 +00:00
<Head>
<meta name="description" content="A Young Royals fan website with links to different discussion spaces." />
2021-07-24 08:27:00 +00:00
<meta property="og:description" content="A Young Royals fan website with links to different discussion spaces."/>
2021-07-23 16:14:54 +00:00
</Head>
<main className="container mx-auto flex flex-col py-2 font-body">
<Title>
{t('welcome')}
</Title>
<p className="dark:text-gray-300 text-center md:text-2xl text-lg">
{t('desc')}
</p>
<div className="grid grid-flow-col grid-cols-2 grid-rows-3 gap-6 pt-4 px-8">
<LinkCard link="https://www.netflix.com/title/81210762" title={`${t('watch.title')}`} sub={t('watch.desc')}/>
<LinkCard link="https://discord.gg/hyKVDeRJ8Y" title={`Discord`} sub={t('discord')}/>
<LinkCard link="https://www.reddit.com/r/YoungRoyals/" title={`Reddit`} sub={t('reddit')}/>
<LinkCard link="https://www.talkable.com/x/IchxFl" title={t('learn.title')} sub={t('learn.desc')} />
<LinkCard link="https://matrix.to/#/#young-royals:matrix.org" title={`Matrix`} sub={t('matrix')} />
</div>
2021-07-23 16:14:54 +00:00
</main>
</div>
)
}