Initial commit

2022-04-24 22:36:47 +02:00
commit c2c4f3a9d1
23 changed files with 12140 additions and 0 deletions
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -0,0 +1,40 @@
+import { GetServerSidePropsContext } from 'next';
+import { useState } from 'react';
+import { AppProps } from 'next/app';
+import { getCookie, setCookies } from 'cookies-next';
+import Head from 'next/head';
+import { MantineProvider, ColorScheme, ColorSchemeProvider } from '@mantine/core';
+import { NotificationsProvider } from '@mantine/notifications';
+
+export default function App(props: AppProps & { colorScheme: ColorScheme }) {
+  const { Component, pageProps } = props;
+  const [colorScheme, setColorScheme] = useState<ColorScheme>(props.colorScheme);
+
+  const toggleColorScheme = (value?: ColorScheme) => {
+    const nextColorScheme = value || (colorScheme === 'dark' ? 'light' : 'dark');
+    setColorScheme(nextColorScheme);
+    setCookies('mantine-color-scheme', nextColorScheme, { maxAge: 60 * 60 * 24 * 30 });
+  };
+
+  return (
+    <>
+      <Head>
+        <title>Mantine next example</title>
+        <meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
+        <link rel="shortcut icon" href="/favicon.svg" />
+      </Head>
+
+      <ColorSchemeProvider colorScheme={colorScheme} toggleColorScheme={toggleColorScheme}>
+        <MantineProvider theme={{ colorScheme }} withGlobalStyles withNormalizeCSS>
+          <NotificationsProvider>
+            <Component {...pageProps} />
+          </NotificationsProvider>
+        </MantineProvider>
+      </ColorSchemeProvider>
+    </>
+  );
+}
+
+App.getInitialProps = ({ ctx }: { ctx: GetServerSidePropsContext }) => ({
+  colorScheme: getCookie('mantine-color-scheme', ctx) || 'light',
+});
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -0,0 +1,8 @@
+import Document from 'next/document';
+import { createGetInitialProps } from '@mantine/next';
+
+const getInitialProps = createGetInitialProps();
+
+export default class _Document extends Document {
+  static getInitialProps = getInitialProps;
+}
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -0,0 +1,11 @@
+import { Welcome } from '../components/Welcome/Welcome';
+import { ColorSchemeToggle } from '../components/ColorSchemeToggle/ColorSchemeToggle';
+
+export default function HomePage() {
+  return (
+    <>
+      <Welcome />
+      <ColorSchemeToggle />
+    </>
+  );
+}