interesting
/
go-ethereum
mirror of https://github.com/ethereum/go-ethereum.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

update MDX header styles

This commit is contained in:
Paul Wackerow 2022-11-21 15:25:15 -08:00
parent dfec5f8265
commit ebdb7a852e
No known key found for this signature in database
GPG Key ID: BB63E296FE9CAB8D
2 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/MDXComponents.tsx
View File

@ -14,6 +14,7 @@ import sh from 'react-syntax-highlighter/dist/cjs/languages/prism/shell-session'
import solidity from 'react-syntax-highlighter/dist/cjs/languages/prism/solidity'; import solidity from 'react-syntax-highlighter/dist/cjs/languages/prism/solidity';
import swift from 'react-syntax-highlighter/dist/cjs/languages/prism/swift'; import swift from 'react-syntax-highlighter/dist/cjs/languages/prism/swift';
import { textStyles } from '../theme/foundations';
// syntax highlighting languages supported // syntax highlighting languages supported
SyntaxHighlighter.registerLanguage('bash', bash); SyntaxHighlighter.registerLanguage('bash', bash);
SyntaxHighlighter.registerLanguage('go', go); SyntaxHighlighter.registerLanguage('go', go);
@ -27,6 +28,7 @@ SyntaxHighlighter.registerLanguage('solidity', solidity);
SyntaxHighlighter.registerLanguage('swift', swift); SyntaxHighlighter.registerLanguage('swift', swift);
import { getProgrammingLanguageName } from '../utils'; import { getProgrammingLanguageName } from '../utils';
const { header1, header2, header3, header4 } = textStyles
const MDXComponents = { const MDXComponents = {
// paragraphs // paragraphs
@ -53,28 +55,28 @@ const MDXComponents = {
// headings // headings
h1: ({ children }: any) => { h1: ({ children }: any) => {
return ( return (
<Heading as='h1' textAlign='start' fontSize='4xl' mb={5}> <Heading as='h1' textAlign='start' mb={5} {...header1}>
{children} {children}
</Heading> </Heading>
); );
}, },
h2: ({ children }: any) => { h2: ({ children }: any) => {
return ( return (
<Heading as='h2' textAlign='start' fontSize='3xl' mb={4}> <Heading as='h2' textAlign='start' mb={4} {...header2}>
{children} {children}
</Heading> </Heading>
); );
}, },
h3: ({ children }: any) => { h3: ({ children }: any) => {
return ( return (
<Heading as='h3' fontSize='2xl' mt={5} mb={2.5}> <Heading as='h3' mt={5} mb={2.5} {...header3}>
{children} {children}
</Heading> </Heading>
); );
}, },
h4: ({ children }: any) => { h4: ({ children }: any) => {
return ( return (
<Heading as='h4' fontSize='lg' mb={2.5}> <Heading as='h4' mb={2.5} {...header4}>
{children} {children}
</Heading> </Heading>
); );

4
src/pages/[...slug].tsx
View File

@ -6,6 +6,7 @@ import { Heading } from '@chakra-ui/react';
import MDXComponents from '../components/'; import MDXComponents from '../components/';
import { ParsedUrlQuery } from 'querystring'; import { ParsedUrlQuery } from 'querystring';
import type { GetStaticPaths, GetStaticProps, NextPage } from 'next'; import type { GetStaticPaths, GetStaticProps, NextPage } from 'next';
import { textStyles } from '../theme/foundations';
const MATTER_OPTIONS = { const MATTER_OPTIONS = {
engines: { engines: {
@ -71,8 +72,7 @@ const DocPage: NextPage<Props> = ({ frontmatter, content }) => {
return ( return (
<> <>
<main> <main>
<Heading as='h1'>{frontmatter.title}</Heading> <Heading as='h1' mb={5} {...textStyles.header1}>{frontmatter.title}</Heading>
<ReactMarkdown components={MDXComponents}>{content}</ReactMarkdown> <ReactMarkdown components={MDXComponents}>{content}</ReactMarkdown>
</main> </main>
</> </>