|
|
@ -1,5 +1,5 @@ |
|
|
|
import { FC } from 'react'; |
|
|
|
import { FC } from 'react'; |
|
|
|
import { Box, Divider, Link, Text } from '@chakra-ui/react'; |
|
|
|
import { Box, Divider, Link, Stack, Text } from '@chakra-ui/react'; |
|
|
|
import NextLink from 'next/link'; |
|
|
|
import NextLink from 'next/link'; |
|
|
|
|
|
|
|
|
|
|
|
import { parseHeadingId } from '../../../utils/parseHeadingId'; |
|
|
|
import { parseHeadingId } from '../../../utils/parseHeadingId'; |
|
|
@ -23,6 +23,7 @@ export const DocumentNav: FC<Props> = ({ content }) => { |
|
|
|
<Box as='aside' position='sticky' top='4'> |
|
|
|
<Box as='aside' position='sticky' top='4'> |
|
|
|
<Text textStyle='document-nav-title'>on this page</Text> |
|
|
|
<Text textStyle='document-nav-title'>on this page</Text> |
|
|
|
<Divider borderColor='primary' my={`4 !important`} /> |
|
|
|
<Divider borderColor='primary' my={`4 !important`} /> |
|
|
|
|
|
|
|
<Stack height='500px' overflow='scroll'> |
|
|
|
{parsedHeadings.map((heading, idx) => { |
|
|
|
{parsedHeadings.map((heading, idx) => { |
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<NextLink key={`${idx} ${heading?.title}`} href={`#${heading?.headingId}`} legacyBehavior> |
|
|
|
<NextLink key={`${idx} ${heading?.title}`} href={`#${heading?.headingId}`} legacyBehavior> |
|
|
@ -55,6 +56,7 @@ export const DocumentNav: FC<Props> = ({ content }) => { |
|
|
|
</NextLink> |
|
|
|
</NextLink> |
|
|
|
); |
|
|
|
); |
|
|
|
})} |
|
|
|
})} |
|
|
|
|
|
|
|
</Stack> |
|
|
|
</Box> |
|
|
|
</Box> |
|
|
|
) : null; |
|
|
|
) : null; |
|
|
|
}; |
|
|
|
}; |
|
|
|