Add better SEO

This commit is contained in:
Liam 2022-10-21 10:56:50 +01:00
parent 8e607cda18
commit 792c92c526
4 changed files with 81 additions and 71 deletions

@ -1,5 +1,5 @@
import { createTheme, NextUIProvider } from "@nextui-org/react"; import { createTheme, NextUIProvider } from "@nextui-org/react";
import { NextSeo } from "next-seo"; import { DefaultSeo } from "next-seo";
import { ThemeProvider as NextThemesProvider } from "next-themes"; import { ThemeProvider as NextThemesProvider } from "next-themes";
import "../styles/globals.css"; import "../styles/globals.css";
@ -19,17 +19,9 @@ const darkTheme = createTheme({
function MyApp({ Component, pageProps }) { function MyApp({ Component, pageProps }) {
return ( return (
<NextThemesProvider <>
storageKey="theme" <DefaultSeo
attribute="class" titleTemplate={`${process.env.NEXT_PUBLIC_SITE_NAME} | %s`}
value={{
dark: darkTheme,
light: lightTheme,
}}
>
<NextUIProvider>
<NextSeo
title={process.env.NEXT_PUBLIC_SITE_NAME}
description={process.env.NEXT_PUBLIC_SITE_DESCRIPTION} description={process.env.NEXT_PUBLIC_SITE_DESCRIPTION}
openGraph={{ openGraph={{
url: process.env.NEXT_PUBLIC_SITE_URL, url: process.env.NEXT_PUBLIC_SITE_URL,
@ -48,9 +40,19 @@ function MyApp({ Component, pageProps }) {
site: "@BeatSaber Overlay", site: "@BeatSaber Overlay",
}} }}
/> />
<NextThemesProvider
storageKey="theme"
attribute="class"
value={{
dark: darkTheme,
light: lightTheme,
}}
>
<NextUIProvider>
<Component {...pageProps} /> <Component {...pageProps} />
</NextUIProvider> </NextUIProvider>
</NextThemesProvider> </NextThemesProvider>
</>
); );
} }

@ -16,6 +16,7 @@ class MyDocument extends Document {
<Html lang="en"> <Html lang="en">
<Head> <Head>
{CssBaseline.flush()} {CssBaseline.flush()}
<link <link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap"
rel="stylesheet" rel="stylesheet"

@ -18,6 +18,7 @@ import NavBar from "../src/components/Navbar";
import { toast, ToastContainer } from "react-toastify"; import { toast, ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css"; import "react-toastify/dist/ReactToastify.css";
import { NextSeo } from "next-seo";
import Utils from "../src/utils/utils"; import Utils from "../src/utils/utils";
import styles from "../styles/main.module.css"; import styles from "../styles/main.module.css";
@ -152,6 +153,8 @@ export default class Home extends Component {
<div className={styles.main}> <div className={styles.main}>
<NavBar avatarUrl={this.state.avatarUrl}></NavBar> <NavBar avatarUrl={this.state.avatarUrl}></NavBar>
<NextSeo title="Builder"></NextSeo>
<Container <Container
css={{ css={{
marginTop: "$8", marginTop: "$8",

@ -1,4 +1,5 @@
import { Link, Spinner } from "@nextui-org/react"; import { Link, Spinner } from "@nextui-org/react";
import { NextSeo } from "next-seo";
import { Component } from "react"; import { Component } from "react";
import PlayerStats from "../src/components/PlayerStats"; import PlayerStats from "../src/components/PlayerStats";
import ScoreStats from "../src/components/ScoreStats"; import ScoreStats from "../src/components/ScoreStats";
@ -437,6 +438,8 @@ export default class Overlay extends Component {
} }
return ( return (
<>
<NextSeo title="Overlay"></NextSeo>
<div className={styles.main}> <div className={styles.main}>
{!isValidSteamId ? ( {!isValidSteamId ? (
<div className={styles.invalidPlayer}> <div className={styles.invalidPlayer}>
@ -475,6 +478,7 @@ export default class Overlay extends Component {
</div> </div>
)} )}
</div> </div>
</>
); );
} }
} }