e8b7d3b9fc
* start SidebarNav, enable dark mode * wip: sidebarnav, fix primer components theme rendering * feat: ProductSiteTree, useFeatureFlag * feat: add new product site tree (untested) * wire up HomepageVersionPicker, run lint * fix: remove re-render logic, fix homepage version picker to be natural width * fix: support css + primer/components color modes * fix: rename categoryId -> productId * feat: ProductSiteTree and AllArticlesProduct * fix: cleanup warnings * fix: use next links on ProductSiteTreeNew * fix: use next Link on AllArticlesProduct * fix: add tooltip to ScrollButton, remove stylesheet dependency * feat: ProductArticlesList component * fix: convert color_mode value from cookie when necessary * remove comments * replace liquid with jsx Co-authored-by: Rachael Sewell <rachmari@github.com>
52 lines
1.5 KiB
TypeScript
52 lines
1.5 KiB
TypeScript
import React, { useEffect } from 'react'
|
|
import { AppProps } from 'next/app'
|
|
import Head from 'next/head'
|
|
import { useTheme, ThemeProvider } from '@primer/components'
|
|
|
|
import '@primer/css/index.scss'
|
|
|
|
import { defaultThemeProps } from 'components/lib/getThemeProps'
|
|
|
|
const App: React.FC<AppProps> = ({ Component, pageProps }) => {
|
|
return (
|
|
<>
|
|
<Head>
|
|
<meta charSet="utf-8" />
|
|
<title>GitHub Documentation</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
<link rel="alternate icon" type="image/png" href="/assets/images/site/favicon.png" />
|
|
<link rel="icon" type="image/svg+xml" href="/assets/images/site/favicon.svg" />
|
|
|
|
<meta
|
|
name="google-site-verification"
|
|
content="OgdQc0GZfjDI52wDv1bkMT-SLpBUo_h5nn9mI9L22xQ"
|
|
/>
|
|
<meta
|
|
name="google-site-verification"
|
|
content="c1kuD-K2HIVF635lypcsWPoD4kilo5-jA_wBFyT4uMY"
|
|
/>
|
|
|
|
<meta name="csrf-token" content="$CSRFTOKEN$" />
|
|
</Head>
|
|
<ThemeProvider>
|
|
<SetTheme themeProps={pageProps.themeProps} />
|
|
<Component {...pageProps} />
|
|
</ThemeProvider>
|
|
</>
|
|
)
|
|
}
|
|
|
|
const SetTheme = ({ themeProps }: { themeProps: typeof defaultThemeProps }) => {
|
|
// Cause primer/components to re-evaluate the 'auto' color mode on client side render
|
|
const { setColorMode } = useTheme()
|
|
useEffect(() => {
|
|
setTimeout(() => {
|
|
setColorMode(themeProps.colorMode as any)
|
|
})
|
|
}, [])
|
|
return null
|
|
}
|
|
|
|
export default App
|