@cryptotaxi247 / documentation
Code Commits Issues Pulls Sessions CI/CD
dependabot/npm_and_yarn/npm_and_yarn-ab9a7f4bc2
@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 68 lines 1.82 KB
Raw
1 import React from 'react'
2 import {BaseStyles} 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 {
9 SKIP_TO_CONTENT_ID,
10 SKIP_TO_SEARCH_ID,
11 HEADER_HEIGHT,
12 HEADER_BAR,
13 FULL_HEADER_HEIGHT,
14 SCROLL_MARGIN_TOP,
15 Z_INDEX,
16 } from './constants'
17
18 import {PageProvider} from './hooks/use-page'
19 import Layout from './layout'
20
21 import * as styles from './page.module.css'
22
23 const GlobalStyles = createGlobalStyle`
24 :root {
25 --header-height: ${HEADER_HEIGHT}px;
26 --header-bar: ${HEADER_BAR}px;
27 --full-header-height: ${FULL_HEADER_HEIGHT}px;
28 --scroll-margin-top: ${SCROLL_MARGIN_TOP}px;
29 --z-index-header: ${Z_INDEX.HEADER};
30 --z-index-search-overlay: ${Z_INDEX.SEARCH_OVERLAY};
31 }
32 body {
33 color: var(--fgColor-default);
34 background-color: var(--bgColor-default);
35 }
36 `
37
38 const PageElement = ({element, props}) => {
39 const page = {
40 pageContext: props.pageContext,
41 frontmatter: props.pageContext?.frontmatter || {},
42 location: props.location,
43 path: props.location.pathname,
44 slugger: new Slugger(),
45 }
46 return (
47 <BaseStyles>
48 <GlobalStyles />
49 <SkipBox>
50 <SkipLink href={`#${SKIP_TO_SEARCH_ID}`}>Skip to search</SkipLink>
51 <SkipLink href={`#${SKIP_TO_CONTENT_ID}`}>Skip to content</SkipLink>
52 </SkipBox>
53 <PageProvider value={page}>
54 <div className={styles.Box}>
55 <Header />
56 <div className={styles.Box_1}>
57 <div className={styles.sidebarContainer}>
58 <Sidebar />
59 </div>
60 <Layout>{element}</Layout>
61 </div>
62 </div>
63 </PageProvider>
64 </BaseStyles>
65 )
66 }
67
68 export default PageElement