Added dark theme

This commit is contained in:
Liam 2022-10-19 15:53:00 +01:00
parent 6d26698b78
commit bb63827e2a
3 changed files with 68 additions and 38 deletions

@ -13,6 +13,7 @@
"@nextui-org/react": "^1.0.0-beta.10", "@nextui-org/react": "^1.0.0-beta.10",
"next": "12", "next": "12",
"next-seo": "^5.5.0", "next-seo": "^5.5.0",
"next-themes": "^0.2.1",
"node-fetch": "^3.2.10", "node-fetch": "^3.2.10",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^18.2.0", "react": "^18.2.0",

@ -1,52 +1,76 @@
import { NextUIProvider } from "@nextui-org/react"; import { createTheme, NextUIProvider } from "@nextui-org/react";
import { NextSeo } from "next-seo"; import { NextSeo } from "next-seo";
import { ThemeProvider as NextThemesProvider } from "next-themes";
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";
const lightTheme = createTheme({
type: "light",
theme: {
colors: {},
},
});
const darkTheme = createTheme({
type: "dark",
theme: {
colors: {},
},
});
function MyApp({ Component, pageProps }) { function MyApp({ Component, pageProps }) {
return ( return (
<NextUIProvider> <NextThemesProvider
<NextSeo storageKey="theme"
title={Config.name} attribute="class"
description={Config.description} value={{
openGraph={{ dark: darkTheme,
url: Config.url, light: lightTheme,
title: Config.name, }}
description: Config.description, >
site_name: Config.name, <NextUIProvider>
images: [ <NextSeo
{ title={Config.name}
url: "https://cdn.fascinated.cc/YrATaLjUOP.png?raw=true", description={Config.description}
alt: "Site Example", openGraph={{
}, url: Config.url,
], title: Config.name,
}} description: Config.description,
twitter={{ site_name: Config.name,
cardType: "summary_large_image", images: [
site: "@BeatSaber Overlay", {
}} url: "https://cdn.fascinated.cc/YrATaLjUOP.png?raw=true",
/> alt: "Site Example",
},
<Head> ],
<meta name="theme-color" content={Config.color} /> }}
<meta twitter={{
property="og:keywords" cardType: "summary_large_image",
content="BeatSaber,Overlay,OBS,Twitch,YouTube,BeatSaber Overlay,Github," site: "@BeatSaber Overlay",
}}
/> />
<noscript> <Head>
<img src="https://analytics.fascinated.cc/ingress/4bc413fa-a126-4860-9a6a-22d10d5cf2fb/pixel.gif" /> <meta name="theme-color" content={Config.color} />
</noscript> <meta
<script property="og:keywords"
defer content="BeatSaber,Overlay,OBS,Twitch,YouTube,BeatSaber Overlay,Github,"
src="https://analytics.fascinated.cc/ingress/4bc413fa-a126-4860-9a6a-22d10d5cf2fb/script.js" />
></script>
</Head> <noscript>
<Component {...pageProps} /> <img src="https://analytics.fascinated.cc/ingress/4bc413fa-a126-4860-9a6a-22d10d5cf2fb/pixel.gif" />
</NextUIProvider> </noscript>
<script
defer
src="https://analytics.fascinated.cc/ingress/4bc413fa-a126-4860-9a6a-22d10d5cf2fb/script.js"
></script>
</Head>
<Component {...pageProps} />
</NextUIProvider>
</NextThemesProvider>
); );
} }

@ -2155,6 +2155,11 @@ next-seo@^5.5.0:
resolved "https://registry.yarnpkg.com/next-seo/-/next-seo-5.5.0.tgz#12bdfce60a6ae098f49617357a166c2d44dbc29e" resolved "https://registry.yarnpkg.com/next-seo/-/next-seo-5.5.0.tgz#12bdfce60a6ae098f49617357a166c2d44dbc29e"
integrity sha512-5ouBHFtx8YrSDW44lj0qIEQ+oMcz6stgoITB+SqHUZbhgizoJsyLmq73gJ0lxtEKpcN8vG2QgRIJfdb8OAPChw== integrity sha512-5ouBHFtx8YrSDW44lj0qIEQ+oMcz6stgoITB+SqHUZbhgizoJsyLmq73gJ0lxtEKpcN8vG2QgRIJfdb8OAPChw==
next-themes@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/next-themes/-/next-themes-0.2.1.tgz#0c9f128e847979daf6c67f70b38e6b6567856e45"
integrity sha512-B+AKNfYNIzh0vqQQKqQItTS8evEouKD7H5Hj3kmuPERwddR2TxvDSFZuTj6T7Jfn1oyeUyJMydPl1Bkxkh0W7A==
next@12: next@12:
version "12.3.1" version "12.3.1"
resolved "https://registry.yarnpkg.com/next/-/next-12.3.1.tgz#127b825ad2207faf869b33393ec8c75fe61e50f1" resolved "https://registry.yarnpkg.com/next/-/next-12.3.1.tgz#127b825ad2207faf869b33393ec8c75fe61e50f1"