refactor: icons and head

This commit is contained in:
iCrawl
2022-08-22 15:34:21 +02:00
parent abb968de81
commit 4fb4492b17
11 changed files with 105 additions and 70 deletions

View File

@@ -1,6 +1,7 @@
import { ColorScheme, ColorSchemeProvider, MantineProvider } from '@mantine/core';
import { useColorScheme } from '@mantine/hooks';
import type { AppProps } from 'next/app';
import Head from 'next/head';
import { useEffect, useState } from 'react';
import { RouterTransition } from '~/components/RouterTransition';
import '../styles/unocss.css';
@@ -17,34 +18,40 @@ export default function MyApp({ Component, pageProps }: AppProps) {
}, [preferredColorScheme]);
return (
<ColorSchemeProvider colorScheme={colorScheme} toggleColorScheme={toggleColorScheme}>
<MantineProvider
theme={{
fontFamily: 'Inter',
colorScheme,
colors: {
blurple: [
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
],
},
primaryColor: 'blurple',
}}
withCSSVariables
withNormalizeCSS
withGlobalStyles
>
<RouterTransition />
<Component {...pageProps} />
</MantineProvider>
</ColorSchemeProvider>
<>
<Head>
<title key="title">discord.js</title>
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
</Head>
<ColorSchemeProvider colorScheme={colorScheme} toggleColorScheme={toggleColorScheme}>
<MantineProvider
theme={{
fontFamily: 'Inter',
colorScheme,
colors: {
blurple: [
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
'#5865F2',
],
},
primaryColor: 'blurple',
}}
withCSSVariables
withNormalizeCSS
withGlobalStyles
>
<RouterTransition />
<Component {...pageProps} />
</MantineProvider>
</ColorSchemeProvider>
</>
);
}

View File

@@ -15,9 +15,8 @@ export default class _Document extends Document {
public override render() {
return (
<Html>
<Html lang="en">
<Head>
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />

View File

@@ -1,8 +1,8 @@
/* eslint-disable @typescript-eslint/no-throw-literal */
import { readFile } from 'node:fs/promises';
import { join } from 'node:path';
import { Box } from '@mantine/core';
import { ApiFunction } from '@microsoft/api-extractor-model';
import Head from 'next/head';
import type { GetStaticPaths, GetStaticProps } from 'next/types';
import type {
ApiClassJSON,
@@ -150,7 +150,16 @@ export default function Slug(props: Partial<SidebarLayoutProps & { error?: strin
<Box sx={{ display: 'flex', maxWidth: '100%', height: '100%' }}>{props.error}</Box>
) : (
<MemberProvider member={props.data?.member}>
<SidebarLayout {...props}>{props.data?.member ? member(props.data.member) : null}</SidebarLayout>
<SidebarLayout {...props}>
{props.data?.member ? (
<>
<Head>
<title key="title">discord.js | {props.data.member.name}</title>
</Head>
{member(props.data.member)}
</>
) : null}
</SidebarLayout>
</MemberProvider>
);
}