From 36f00bd1fc3b0bb0b3d8c72943002a65559e8ae9 Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Mon, 1 Jun 2020 08:28:47 -0300 Subject: [PATCH 1/8] fix(v2): doc sidebar --- packages/docusaurus-theme-bootstrap/README.md | 31 +++++++++++++++++++ .../src/theme/DocPage/index.js | 16 +++++++--- 2 files changed, 42 insertions(+), 5 deletions(-) create mode 100644 packages/docusaurus-theme-bootstrap/README.md diff --git a/packages/docusaurus-theme-bootstrap/README.md b/packages/docusaurus-theme-bootstrap/README.md new file mode 100644 index 000000000000..3687e9e0dcfc --- /dev/null +++ b/packages/docusaurus-theme-bootstrap/README.md @@ -0,0 +1,31 @@ +# Docusaurus Theme Bootstrap + +The bootstrap theme for Docusaurus. + +## Installation + +Add `docusaurus/theme-bootstrap` to your package: + +```bash +npm i @docusaurus/theme-bootstrao +# or +yarn add @docusaurus/theme-bootstrap +``` + +Modify your `docusaurus.config.js`: + +```diff +module.exports = { + ... ++ themes: ['@docusaurus/theme-bootstrap'], + ... +} +``` + +## Swizzling components + +```shell +$ npm swizzle @docusaurus/theme-bootstrap [component name] +``` + +All components used by this theme can be found [here](https://github.com/facebook/docusaurus/tree/master/packages/docusaurus-theme-bootstrap/src/theme) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js index 20fe578739d1..43681e39c2c4 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js @@ -14,14 +14,20 @@ import {MDXProvider} from '@mdx-js/react'; import {matchPath} from '@docusaurus/router'; function DocPage(props) { - const {route: baseRoute, docsMetadata, location} = props; + const {route: baseRoute, docsMetadata, location, content} = props; + const { + isHomePage, + } = docsMetadata; // case-sensitive route such as it is defined in the sidebar - const currentRoute = - baseRoute.routes.find((route) => { + const currentRoute = !isHomePage + ? baseRoute.routes.find((route) => { return matchPath(location.pathname, route); - }) || {}; + }) || {} + : {}; const {permalinkToSidebar, docsSidebars} = docsMetadata; - const sidebar = permalinkToSidebar[currentRoute.path]; + const sidebar = isHomePage + ? content.metadata.sidebar + : permalinkToSidebar[currentRoute.path]; return ( <Layout title="Doc page" description="My Doc page"> From f9a28ad7a7dbb8879b61d213662ae6f8e26ba439 Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Mon, 1 Jun 2020 08:33:10 -0300 Subject: [PATCH 2/8] chore(v2): prettier --- .../docusaurus-theme-bootstrap/src/theme/DocPage/index.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js index 43681e39c2c4..87d8634251b4 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js @@ -15,14 +15,12 @@ import {matchPath} from '@docusaurus/router'; function DocPage(props) { const {route: baseRoute, docsMetadata, location, content} = props; - const { - isHomePage, - } = docsMetadata; + const {isHomePage} = docsMetadata; // case-sensitive route such as it is defined in the sidebar const currentRoute = !isHomePage ? baseRoute.routes.find((route) => { - return matchPath(location.pathname, route); - }) || {} + return matchPath(location.pathname, route); + }) || {} : {}; const {permalinkToSidebar, docsSidebars} = docsMetadata; const sidebar = isHomePage From ea43ab9c333bde2d66c8ee92b4375e31eaefe5ad Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Mon, 1 Jun 2020 08:37:36 -0300 Subject: [PATCH 3/8] fix(v2): docs navbar path --- .../docusaurus-init/templates/bootstrap/docusaurus.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js b/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js index 27deb4d95d42..a4623765c061 100644 --- a/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js +++ b/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js @@ -15,7 +15,7 @@ module.exports = { }, links: [ { - to: 'docs/', + to: 'docs/doc1', activeBasePath: 'docs', label: 'Docs', position: 'left', From bbfe75a375d4215b26a2df5685bfdeba9676863f Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Mon, 1 Jun 2020 08:58:24 -0300 Subject: [PATCH 4/8] fix(v2): fix error about activepath --- .../src/theme/Navbar/index.js | 29 ++++++++++++++++--- 1 file changed, 25 insertions(+), 4 deletions(-) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js index 5b04c9c183b6..3655f59e6a2c 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js @@ -18,8 +18,19 @@ import { NavItem as NavItemBase, } from 'reactstrap'; -function NavItem({href, label, to, ...props}) { +function NavItem({ + activeBasePath, + activeBaseRegex, + href, + label, + to, + activeClassName = 'nav-link active', + prependBaseUrlToHref, + ...props +}) { const toUrl = useBaseUrl(to); + const activeBaseUrl = useBaseUrl(activeBasePath); + const normalizedHref = useBaseUrl(href, true); return ( <NavItemBase> @@ -29,11 +40,21 @@ function NavItem({href, label, to, ...props}) { ? { target: '_blank', rel: 'noopener noreferrer', - href, + href: prependBaseUrlToHref ? normalizedHref : href, } : { - to: toUrl, - })} + isNavLink: true, + activeClassName, + to: toUrl, + ...(activeBasePath || activeBaseRegex + ? { + isActive: (_match, location) => + activeBaseRegex + ? new RegExp(activeBaseRegex).test(location.pathname) + : location.pathname.startsWith(activeBaseUrl), + } + : null), + })} {...props}> {label} </Link> From b9d602ece2c0a69345d023f25c2fa0d0436cc6af Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Mon, 1 Jun 2020 08:59:16 -0300 Subject: [PATCH 5/8] chore(v2): prettier --- .../src/theme/Navbar/index.js | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js index 3655f59e6a2c..488e52d4e431 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js @@ -43,18 +43,18 @@ function NavItem({ href: prependBaseUrlToHref ? normalizedHref : href, } : { - isNavLink: true, - activeClassName, - to: toUrl, - ...(activeBasePath || activeBaseRegex - ? { - isActive: (_match, location) => - activeBaseRegex - ? new RegExp(activeBaseRegex).test(location.pathname) - : location.pathname.startsWith(activeBaseUrl), - } - : null), - })} + isNavLink: true, + activeClassName, + to: toUrl, + ...(activeBasePath || activeBaseRegex + ? { + isActive: (_match, location) => + activeBaseRegex + ? new RegExp(activeBaseRegex).test(location.pathname) + : location.pathname.startsWith(activeBaseUrl), + } + : null), + })} {...props}> {label} </Link> From d63a9bd390140beff9daaab50c318dce511da771 Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Tue, 2 Jun 2020 09:39:47 -0300 Subject: [PATCH 6/8] feat(v2): change active color --- packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js index 488e52d4e431..6ebff920fab3 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/Navbar/index.js @@ -24,7 +24,7 @@ function NavItem({ href, label, to, - activeClassName = 'nav-link active', + activeClassName = 'nav-link text-info', prependBaseUrlToHref, ...props }) { From 32aba025f1c4ee58e9ae0711925486044baafc24 Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Tue, 2 Jun 2020 20:07:13 -0300 Subject: [PATCH 7/8] feat(v2): update to new docs cpmfog --- .../src/theme/DocPage/index.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js index 87d8634251b4..511c4eb00822 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js @@ -7,6 +7,7 @@ import React from 'react'; import renderRoutes from '@docusaurus/renderRoutes'; +import DocItem from '@theme/DocItem'; import DocSidebar from '@theme/DocSidebar'; import MDXComponents from '@theme/MDXComponents'; import Layout from '@theme/Layout'; @@ -27,16 +28,24 @@ function DocPage(props) { ? content.metadata.sidebar : permalinkToSidebar[currentRoute.path]; + if (!isHomePage && Object.keys(currentRoute).length === 0) { + return <NotFound {...props} />; + } + return ( <Layout title="Doc page" description="My Doc page"> <DocSidebar docsSidebars={docsSidebars} - path={currentRoute.path} + path={isHomePage ? homePagePath : currentRoute.path} sidebar={sidebar} /> <section className="offset-1 mr-4 mt-4 col-xl-6 offset-xl-4 p-0 justify-content-center align-self-center overflow-hidden"> <MDXProvider components={MDXComponents}> - {renderRoutes(baseRoute.routes)} + {isHomePage ? ( + <DocItem content={content} /> + ) : ( + renderRoutes(baseRoute.routes) + )} </MDXProvider> </section> </Layout> From b2449a676e4b098e77e878fb8ecd7f4a788a8776 Mon Sep 17 00:00:00 2001 From: fanny <fanny.vieira@ccc.ufcg.edu.br> Date: Tue, 2 Jun 2020 20:20:14 -0300 Subject: [PATCH 8/8] feat(v2): Add homepagepath --- .../templates/bootstrap/docusaurus.config.js | 2 +- .../src/theme/DocPage/index.js | 9 +++++++-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js b/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js index a4623765c061..27deb4d95d42 100644 --- a/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js +++ b/packages/docusaurus-init/templates/bootstrap/docusaurus.config.js @@ -15,7 +15,7 @@ module.exports = { }, links: [ { - to: 'docs/doc1', + to: 'docs/', activeBasePath: 'docs', label: 'Docs', position: 'left', diff --git a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js index 511c4eb00822..93f92e5fc4a3 100644 --- a/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js +++ b/packages/docusaurus-theme-bootstrap/src/theme/DocPage/index.js @@ -7,6 +7,7 @@ import React from 'react'; import renderRoutes from '@docusaurus/renderRoutes'; +import NotFound from '@theme/NotFound'; import DocItem from '@theme/DocItem'; import DocSidebar from '@theme/DocSidebar'; import MDXComponents from '@theme/MDXComponents'; @@ -16,14 +17,18 @@ import {matchPath} from '@docusaurus/router'; function DocPage(props) { const {route: baseRoute, docsMetadata, location, content} = props; - const {isHomePage} = docsMetadata; + const { + permalinkToSidebar, + docsSidebars, + isHomePage, + homePagePath, + } = docsMetadata; // case-sensitive route such as it is defined in the sidebar const currentRoute = !isHomePage ? baseRoute.routes.find((route) => { return matchPath(location.pathname, route); }) || {} : {}; - const {permalinkToSidebar, docsSidebars} = docsMetadata; const sidebar = isHomePage ? content.metadata.sidebar : permalinkToSidebar[currentRoute.path];