@cryptotaxi247 / documentation-1
Code Commits Issues Pulls Sessions CI/CD
@reggi/path-to-regexp
@reggi/path-to-regexp dependabot/npm_and_yarn/main/copy-to-clipboard-4.0.2 dependabot/npm_and_yarn/main/eslint-10.4.0 dependabot/npm_and_yarn/main/npmcli/eslint-config-7.0.0 dependabot/npm_and_yarn/main/proc-log-7.0.0 dependabot/npm_and_yarn/npm_and_yarn-826852524d dependabot/npm_and_yarn/npm_and_yarn-ab9a7f4bc2 deprecate-totp-2fa dhei/classic-tokens gat-bypass-2fa-docs jpg619/fix-accessibility-content-flow jpg619/version-bump-tar-2 kartykp/gat-bypass-2fa-docs kartykp/upgrade-path-to-regex main maitxn/version-bump-tar patch-1 reggi/cache-based-on-version reggi/dev-engines reggi/fix-transform-prettier reggi/overrides update-search-sensitivity
js 50 lines 1.54 KB
Raw
1 import React from 'react'
2 import {BaseStyles, themeGet, Box} from '@primer/react'
3 import {createGlobalStyle} from 'styled-components'
4 import Slugger from 'github-slugger'
5 import Header from './components/header'
6 import Sidebar from './components/sidebar'
7 import {SkipBox, SkipLink} from './components/skip-nav'
8 import {SKIP_TO_CONTENT_ID, SKIP_TO_SEARCH_ID} from './constants'
9
10 import {PageProvider} from './hooks/use-page'
11 import Layout from './layout'
12
13 const GlobalStyles = createGlobalStyle`
14 body {
15 color: ${themeGet('colors.fg.default')};
16 background-color: ${themeGet('colors.canvas.default')};
17 }
18 `
19
20 const PageElement = ({element, props}) => {
21 const page = {
22 pageContext: props.pageContext,
23 frontmatter: props.pageContext?.frontmatter || {},
24 location: props.location,
25 path: props.location.pathname,
26 slugger: new Slugger(),
27 }
28 return (
29 <BaseStyles>
30 <GlobalStyles />
31 <SkipBox>
32 <SkipLink href={`#${SKIP_TO_SEARCH_ID}`}>Skip to search</SkipLink>
33 <SkipLink href={`#${SKIP_TO_CONTENT_ID}`}>Skip to content</SkipLink>
34 </SkipBox>
35 <PageProvider value={page}>
36 <Box sx={{display: 'flex', flexDirection: 'column', minHeight: '100vh'}}>
37 <Header />
38 <Box sx={{zIndex: 0, display: 'flex', flex: '1 1 auto', flexDirection: 'row'}}>
39 <Box sx={{display: ['none', null, null, 'block']}}>
40 <Sidebar />
41 </Box>
42 <Layout>{element}</Layout>
43 </Box>
44 </Box>
45 </PageProvider>
46 </BaseStyles>
47 )
48 }
49
50 export default PageElement