-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
- Loading branch information
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
/** @type {import('postcss').PostcssConfig} */ | ||
module.exports = { | ||
plugins: { | ||
'postcss-import': {}, | ||
tailwindcss: {}, | ||
autoprefixer: {}, | ||
}, | ||
}; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import React from 'react'; | ||
Check failure on line 1 in src/theme/DocItem/Content/index.js GitHub Actions / Run linters
|
||
import clsx from 'clsx'; | ||
import {ThemeClassNames} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import Heading from '@theme/Heading'; | ||
import MDXContent from '@theme/MDXContent'; | ||
/** | ||
Title can be declared inside md content or declared through | ||
front matter and added manually. To make both cases consistent, | ||
the added title is added under the same div.markdown block | ||
See https://github.com/facebook/docusaurus/pull/4882#issuecomment-853021120 | ||
We render a "synthetic title" if: | ||
- user doesn't ask to hide it with front matter | ||
- the markdown content does not already contain a top-level h1 heading | ||
*/ | ||
function useSyntheticTitle() { | ||
const {metadata, frontMatter, contentTitle} = useDoc(); | ||
const shouldRender = | ||
!frontMatter.hide_title && typeof contentTitle === 'undefined'; | ||
if (!shouldRender) { | ||
return null; | ||
} | ||
return metadata.title; | ||
} | ||
export default function DocItemContent({children}) { | ||
Check failure on line 26 in src/theme/DocItem/Content/index.js GitHub Actions / Run linters
|
||
const syntheticTitle = useSyntheticTitle(); | ||
return ( | ||
<div className={clsx(ThemeClassNames.docs.docMarkdown, 'markdown')}> | ||
{syntheticTitle && ( | ||
<header> | ||
<Heading as="h1">{syntheticTitle}</Heading> | ||
</header> | ||
)} | ||
<MDXContent>{children}</MDXContent> | ||
</div> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,68 @@ | ||
import React from 'react'; | ||
Check failure on line 1 in src/theme/DocItem/Footer/index.js GitHub Actions / Run linters
|
||
import clsx from 'clsx'; | ||
import {ThemeClassNames} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import LastUpdated from '@theme/LastUpdated'; | ||
import EditThisPage from '@theme/EditThisPage'; | ||
import TagsListInline from '@theme/TagsListInline'; | ||
import styles from './styles.module.css'; | ||
function TagsRow(props) { | ||
return ( | ||
<div | ||
className={clsx( | ||
ThemeClassNames.docs.docFooterTagsRow, | ||
'row margin-bottom--sm', | ||
)}> | ||
<div className="col"> | ||
<TagsListInline {...props} /> | ||
</div> | ||
</div> | ||
); | ||
} | ||
function EditMetaRow({ | ||
editUrl, | ||
Check failure on line 23 in src/theme/DocItem/Footer/index.js GitHub Actions / Run linters
|
||
lastUpdatedAt, | ||
Check failure on line 24 in src/theme/DocItem/Footer/index.js GitHub Actions / Run linters
|
||
lastUpdatedBy, | ||
Check failure on line 25 in src/theme/DocItem/Footer/index.js GitHub Actions / Run linters
|
||
formattedLastUpdatedAt, | ||
Check failure on line 26 in src/theme/DocItem/Footer/index.js GitHub Actions / Run linters
|
||
}) { | ||
return ( | ||
<div className={clsx(ThemeClassNames.docs.docFooterEditMetaRow, 'row')}> | ||
<div className="col">{editUrl && <EditThisPage editUrl={editUrl} />}</div> | ||
|
||
<div className={clsx('col', styles.lastUpdated)}> | ||
{(lastUpdatedAt || lastUpdatedBy) && ( | ||
<LastUpdated | ||
lastUpdatedAt={lastUpdatedAt} | ||
formattedLastUpdatedAt={formattedLastUpdatedAt} | ||
lastUpdatedBy={lastUpdatedBy} | ||
/> | ||
)} | ||
</div> | ||
</div> | ||
); | ||
} | ||
export default function DocItemFooter() { | ||
const {metadata} = useDoc(); | ||
const {editUrl, lastUpdatedAt, formattedLastUpdatedAt, lastUpdatedBy, tags} = | ||
metadata; | ||
const canDisplayTagsRow = tags.length > 0; | ||
const canDisplayEditMetaRow = !!(editUrl || lastUpdatedAt || lastUpdatedBy); | ||
const canDisplayFooter = canDisplayTagsRow || canDisplayEditMetaRow; | ||
if (!canDisplayFooter) { | ||
return null; | ||
} | ||
return ( | ||
<footer | ||
className={clsx(ThemeClassNames.docs.docFooter, 'docusaurus-mt-lg')}> | ||
{canDisplayTagsRow && <TagsRow tags={tags} />} | ||
{canDisplayEditMetaRow && ( | ||
<EditMetaRow | ||
editUrl={editUrl} | ||
lastUpdatedAt={lastUpdatedAt} | ||
lastUpdatedBy={lastUpdatedBy} | ||
formattedLastUpdatedAt={formattedLastUpdatedAt} | ||
/> | ||
)} | ||
</footer> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
.lastUpdated { | ||
margin-top: 0.2rem; | ||
font-style: italic; | ||
font-size: smaller; | ||
} | ||
|
||
@media (min-width: 997px) { | ||
.lastUpdated { | ||
text-align: right; | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
import React from 'react'; | ||
Check failure on line 1 in src/theme/DocItem/Layout/index.js GitHub Actions / Run linters
|
||
import clsx from 'clsx'; | ||
import {useWindowSize} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import DocItemPaginator from '@theme/DocItem/Paginator'; | ||
import DocVersionBanner from '@theme/DocVersionBanner'; | ||
import DocVersionBadge from '@theme/DocVersionBadge'; | ||
import DocItemFooter from '@theme/DocItem/Footer'; | ||
import DocItemTOCMobile from '@theme/DocItem/TOC/Mobile'; | ||
import DocItemTOCDesktop from '@theme/DocItem/TOC/Desktop'; | ||
import DocItemContent from '@theme/DocItem/Content'; | ||
import DocBreadcrumbs from '@theme/DocBreadcrumbs'; | ||
import styles from './styles.module.css'; | ||
/** | ||
* Decide if the toc should be rendered, on mobile or desktop viewports | ||
*/ | ||
function useDocTOC() { | ||
const {frontMatter, toc} = useDoc(); | ||
const windowSize = useWindowSize(); | ||
const hidden = frontMatter.hide_table_of_contents; | ||
const canRender = !hidden && toc.length > 0; | ||
const mobile = canRender ? <DocItemTOCMobile /> : undefined; | ||
const desktop = | ||
canRender && (windowSize === 'desktop' || windowSize === 'ssr') ? ( | ||
<DocItemTOCDesktop /> | ||
) : undefined; | ||
return { | ||
hidden, | ||
mobile, | ||
desktop, | ||
}; | ||
} | ||
export default function DocItemLayout({children}) { | ||
Check failure on line 33 in src/theme/DocItem/Layout/index.js GitHub Actions / Run linters
|
||
const docTOC = useDocTOC(); | ||
return ( | ||
<div className="row"> | ||
<div className={clsx('col', !docTOC.hidden && styles.docItemCol)}> | ||
<DocVersionBanner /> | ||
<div className={styles.docItemContainer}> | ||
<article> | ||
<DocBreadcrumbs /> | ||
<DocVersionBadge /> | ||
{docTOC.mobile} | ||
<DocItemContent>{children}</DocItemContent> | ||
<DocItemFooter /> | ||
</article> | ||
<DocItemPaginator /> | ||
</div> | ||
</div> | ||
{docTOC.desktop && <div className="col col--3">On this page {docTOC.desktop}</div>} | ||
</div> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
.docItemContainer header + *, | ||
.docItemContainer article > *:first-child { | ||
margin-top: 0; | ||
} | ||
|
||
@media (min-width: 997px) { | ||
.docItemCol { | ||
max-width: 75% !important; | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import React from 'react'; | ||
Check failure on line 1 in src/theme/DocItem/Metadata/index.js GitHub Actions / Run linters
|
||
import {PageMetadata} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
export default function DocItemMetadata() { | ||
const {metadata, frontMatter, assets} = useDoc(); | ||
return ( | ||
<PageMetadata | ||
title={metadata.title} | ||
description={metadata.description} | ||
keywords={frontMatter.keywords} | ||
image={assets.image ?? frontMatter.image} | ||
/> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import React from 'react'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import DocPaginator from '@theme/DocPaginator'; | ||
/** | ||
* This extra component is needed, because <DocPaginator> should remain generic. | ||
* DocPaginator is used in non-docs contexts too: generated-index pages... | ||
*/ | ||
export default function DocItemPaginator() { | ||
const {metadata} = useDoc(); | ||
return <DocPaginator previous={metadata.previous} next={metadata.next} />; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import React from 'react'; | ||
import {ThemeClassNames} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import TOC from '@theme/TOC'; | ||
export default function DocItemTOCDesktop() { | ||
const {toc, frontMatter} = useDoc(); | ||
return ( | ||
<TOC | ||
toc={toc} | ||
minHeadingLevel={frontMatter.toc_min_heading_level} | ||
maxHeadingLevel={frontMatter.toc_max_heading_level} | ||
className={ThemeClassNames.docs.docTocDesktop} | ||
/> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import React from 'react'; | ||
import clsx from 'clsx'; | ||
import {ThemeClassNames} from '@docusaurus/theme-common'; | ||
import {useDoc} from '@docusaurus/theme-common/internal'; | ||
import TOCCollapsible from '@theme/TOCCollapsible'; | ||
import styles from './styles.module.css'; | ||
export default function DocItemTOCMobile() { | ||
const {toc, frontMatter} = useDoc(); | ||
return ( | ||
<TOCCollapsible | ||
toc={toc} | ||
minHeadingLevel={frontMatter.toc_min_heading_level} | ||
maxHeadingLevel={frontMatter.toc_max_heading_level} | ||
className={clsx(ThemeClassNames.docs.docTocMobile, styles.tocMobile)} | ||
/> | ||
); | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
@media (min-width: 997px) { | ||
/* Prevent hydration FOUC, as the mobile TOC needs to be server-rendered */ | ||
.tocMobile { | ||
display: none; | ||
} | ||
} | ||
|
||
@media print { | ||
.tocMobile { | ||
display: none; | ||
} | ||
} |