first commit

pages/_app.tsx

@@ -0,0 +1,21 @@
+import { manrope } from '@/styles/fonts';
+import '@/styles/globals.css';
+import clsx from 'clsx';
+import type { AppProps } from 'next/app';
+import styles from '@/styles/app.module.css';
+import Head from 'next/head';
+import { Cursor } from '@/components/cursor';
+
+export default function App({ Component, pageProps }: AppProps) {
+  return (
+    <div className={clsx(styles.main, manrope.className)}>
+      <Head>
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <meta name="theme-color" content="#FFFFFF" />
+      </Head>
+      <Cursor>
+        <Component {...pageProps} />
+      </Cursor>
+    </div>
+  );
+}

pages/_document.tsx

@@ -0,0 +1,60 @@
+import useLocale, { Locales } from '@/utils/useLocale';
+import { Html, Head, Main, NextScript, DocumentProps } from 'next/document';
+import { useRouter } from 'next/router';
+import { LocalesMap } from '@/utils/useLocale';
+
+export const locales: LocalesMap = {
+  ru: {
+    title: 'ridebus - расписание транспорта',
+    description: 'Приложение, которое поможет вам удобно смотреть расписание общественного транспорта',
+  },
+  en: {
+    title: 'ridebus - public transport schedule',
+    description: 'An app that helps you conveniently view public transportation schedules',
+  },
+};
+
+export default function Document(props: DocumentProps) {
+  const locale = props.locale || 'en';
+
+  const t = (key: string) => locales[locale as Locales][key] || key;
+
+  return (
+    <Html>
+      <Head>
+        <link rel="shortcut icon" type="image/ico" href="/favicon.ico" />
+
+        {/* Primary Meta Tags */}
+        <meta name="title" content="ridebus - budget manager" />
+        <meta
+          name="description"
+          content="An app that helps you conveniently view public transportation schedules"
+        />
+
+        {/* Open Graph */}
+        <meta property="og:type" content="website" />
+        <meta property="og:url" content="https://ridebus.by/" />
+        <meta property="og:title" content={t('title')} />
+        <meta property="og:description" content={t('description')} />
+        <meta
+          property="og:image"
+          content={`https://ridebus.by/images/share-banner-${locale}.png`}
+        />
+
+        {/* Twitter */}
+        <meta property="twitter:card" content="summary_large_image" />
+        <meta property="twitter:url" content="https://ridebus.by/" />
+        <meta property="twitter:title" content={t('title')} />
+        <meta property="twitter:description" content={t('description')} />
+        <meta
+          property="twitter:image"
+          content={`https://ridebus.by/images/share-banner-${locale}.png`}
+        />
+      </Head>
+      <body>
+        <Main />
+        <NextScript />
+      </body>
+    </Html>
+  );
+}

pages/contribute.tsx

@@ -0,0 +1,50 @@
+import Head from 'next/head';
+import styles from '@/modules/contribute/contribute.module.scss';
+import { GooglePlayButton } from '@/components/googlePlayButton';
+import { GithubCardButton } from '@/components/githubCardButton';
+import { Card } from '@/components/card';
+import { Footer } from '@/components/footer';
+import clsx from 'clsx';
+import useLocale from '@/utils/useLocale';
+import { useRouter } from 'next/router';
+import { locales } from '@/modules/contribute/locales';
+import { ShareCard } from '@/modules/contribute/shareCard';
+import { Fragment } from 'react';
+import { Header } from '@/modules/contribute/header';
+
+export default function ContributePage() {
+  const router = useRouter();
+  const t = useLocale(locales);
+
+  return (
+    <Fragment>
+      <Head>
+        <title>{t('pageTitle')}</title>
+        <meta name="description" content={t('pageDescription')} />
+      </Head>
+      <Header />
+      <main className={styles.main}>
+        <ShareCard />
+        <div className={styles.stores}>
+          <Card
+            className={clsx(styles.card, styles.reviewCard)}
+            title={t('reviewTitle')}
+            subtitle={t('reviewDescription')}
+            classes={{ content: styles.reviewCardContent }}
+          >
+            <div className={styles.googlePlayButtonWrapper}>
+              <GooglePlayButton
+                className={styles.googlePlayButton}
+                disableGlass
+              />
+            </div>
+          </Card>
+          <div className={styles.additionalStores}>
+            <GithubCardButton />
+          </div>
+        </div>
+      </main>
+      <Footer />
+    </Fragment>
+  );
+}

pages/index.tsx

@@ -0,0 +1,42 @@
+import { Footer } from '@/components/footer';
+import { GithubCardButton } from '@/components/githubCardButton';
+import { GooglePlayButton } from '@/components/googlePlayButton';
+import { ContributeCard } from '@/modules/home/contributeCard';
+import Header from '@/modules/home/header';
+import styles from '@/modules/home/home.module.scss';
+import { HowItsWorkCard } from '@/modules/home/howItsWorkCard';
+import { FreeCard } from '@/modules/home/freeCard';
+import { CitiesCard } from '@/modules/home/citiesCard';
+import { locales } from '@/modules/home/locales';
+import useLocale from '@/utils/useLocale';
+import Head from 'next/head';
+import { Fragment } from 'react';
+
+export default function HomePage() {
+  const t = useLocale(locales);
+
+  return (
+    <Fragment>
+      <Head>
+        <title>{t('pageTitle')}</title>
+        <meta name="description" content={t('pageDescription')} />
+      </Head>
+      <Header />
+      <main className={styles.main}>
+        <div className={styles.cardsRow}>
+          <CitiesCard />
+        </div>
+        <div className={styles.cardsRow}>
+          <div className={styles.storesBlock}>
+            <GooglePlayButton className={styles.googlePlayButton} />
+            <div>
+              <GithubCardButton />
+            </div>
+          </div>
+          <ContributeCard />
+        </div>
+      </main>
+      <Footer />
+    </Fragment>
+  );
+}