Setup inital NextUI base

This commit is contained in:
Fascinated 2022-09-02 00:38:01 +01:00
parent 738d476962
commit 7018f1757f
5 changed files with 2373 additions and 12 deletions

2335
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -10,6 +10,7 @@
"dependencies": { "dependencies": {
"@emotion/cache": "^11.7.1", "@emotion/cache": "^11.7.1",
"@emotion/server": "^11.4.0", "@emotion/server": "^11.4.0",
"@nextui-org/react": "^1.0.0-beta.10",
"next": "12.0.10", "next": "12.0.10",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "17.0.2", "react": "17.0.2",

@ -1,11 +1,16 @@
// 1. import `NextUIProvider` component
import { NextUIProvider } from '@nextui-org/react';
import Head from 'next/head' import Head from 'next/head'
import Config from '../config.json'; import Config from '../config.json';
import '../styles/globals.css' import '../styles/globals.css'
function MyApp({ Component, pageProps }) { function MyApp({ Component, pageProps }) {
return <> return (
// 2. Use at the root of your app
<NextUIProvider>
<Head> <Head>
<title>{Config.name}</title> <title>{Config.name}</title>
<meta name="twitter:title" content= {Config.name} /> <meta name="twitter:title" content= {Config.name} />
@ -14,8 +19,9 @@ function MyApp({ Component, pageProps }) {
<meta property="og:description" content= {Config.description} key="description" /> <meta property="og:description" content= {Config.description} key="description" />
<meta name="theme-color" content= {Config.color} /> <meta name="theme-color" content= {Config.color} />
</Head> </Head>
<Component {...pageProps} /> <Component {...pageProps} />
</> </NextUIProvider>
);
} }
export default MyApp export default MyApp;

33
pages/_document.js Normal file

@ -0,0 +1,33 @@
import React from 'react';
import Document, { Html, Head, Main, NextScript } from 'next/document';
import { CssBaseline } from '@nextui-org/react';
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx);
return {
...initialProps,
styles: React.Children.toArray([initialProps.styles])
};
}
render() {
return (
<Html lang="en">
<Head>
{CssBaseline.flush()}
<link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap"
rel="stylesheet"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;

@ -1,5 +1,3 @@
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
* { * {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
color: white; color: white;