diff --git a/docs/guide/deploying.md b/docs/guide/deploying.md index ff2fa921..d784d2cf 100644 --- a/docs/guide/deploying.md +++ b/docs/guide/deploying.md @@ -55,6 +55,7 @@ Set up a new project and change these settings using your dashboard: - **Build Command:** `yarn docs:build` - **Output Directory:** `docs/.vitepress/dist` +- **Node Version:** `14` (or above, by default it usually will be 14 or 16, but on Cloudflare Pages the default is still 12, so you may need to [change that](https://developers.cloudflare.com/pages/platform/build-configuration/)) ::: warning Don't enable options like _Auto Minify_ for HTML code. It will remove comments from output which have meaning to Vue. You may see hydration mismatch errors if they get removed. diff --git a/docs/guide/markdown.md b/docs/guide/markdown.md index 39716fef..342904e5 100644 --- a/docs/guide/markdown.md +++ b/docs/guide/markdown.md @@ -388,6 +388,48 @@ You can also use a [VS Code region](https://code.visualstudio.com/docs/editor/co +## Markdown File Inclusion + +You can include a markdown file in another markdown file like this: + +**Input** + +```md +# Docs + +## Basics + + +``` + +**Part file** (`parts/basics.md`) + +```md +Some getting started stuff. + +### Configuration + +Can be created using `.foorc.json`. +``` + +**Equivalent code** + +```md +# Docs + +## Basics + +Some getting started stuff. + +### Configuration + +Can be created using `.foorc.json`. +``` + +::: warning +Note that this does not throw errors if your file is not present. Hence, when using this feature make sure that the contents are being rendered as expected. +::: + ## Advanced Configuration VitePress uses [markdown-it](https://github.com/markdown-it/markdown-it) as the Markdown renderer. A lot of the extensions above are implemented via custom plugins. You can further customize the `markdown-it` instance using the `markdown` option in `.vitepress/config.js`: diff --git a/docs/guide/theme-introduction.md b/docs/guide/theme-introduction.md index b3ebd5f7..0f9b5cf3 100644 --- a/docs/guide/theme-introduction.md +++ b/docs/guide/theme-introduction.md @@ -207,3 +207,12 @@ Full list of slots available in the default theme layout: - `home-hero-after` - `home-features-before` - `home-features-after` +- Always: + - `layout-top` + - `layout-bottom` + - `nav-bar-title-before` + - `nav-bar-title-after` + - `nav-bar-content-before` + - `nav-bar-content-after` + - `nav-screen-content-before` + - `nav-screen-content-after` diff --git a/docs/guide/theme-nav.md b/docs/guide/theme-nav.md index d361d3a0..ccf2f973 100644 --- a/docs/guide/theme-nav.md +++ b/docs/guide/theme-nav.md @@ -114,7 +114,7 @@ export default { ### Customize link's "active" state -Nav menu items will be highlighted when the current page is under the matching path. if you would like to customize the path to be mathced, define `activeMatch` property and regex as a string value. +Nav menu items will be highlighted when the current page is under the matching path. if you would like to customize the path to be matched, define `activeMatch` property and regex as a string value. ```js export default { diff --git a/docs/guide/theme-team-page.md b/docs/guide/theme-team-page.md index f19b52d5..e2510473 100644 --- a/docs/guide/theme-team-page.md +++ b/docs/guide/theme-team-page.md @@ -60,9 +60,9 @@ The above will display a team member in card looking element. It should display -`` component comes in 2 different sizes, `small` and `medium`. While it boiles down to your preference, usually `small` size should fit better when used in doc page. Also, you may add more properties to each member such as adding "description" or "sponsor" button. Learn more about it in [``](#vpteammembers). +`` component comes in 2 different sizes, `small` and `medium`. While it boils down to your preference, usually `small` size should fit better when used in doc page. Also, you may add more properties to each member such as adding "description" or "sponsor" button. Learn more about it in [``](#vpteammembers). -Embbeding team members in doc page is good for small size team where having dedicated full team page might be too much, or introducing partial members as a refference to documenation context. +Embbeding team members in doc page is good for small size team where having dedicated full team page might be too much, or introducing partial members as a reference to documentation context. If you have large number of members, or simply would like to have more space to show team members, consider [creating a full team page](#create-a-full-team-page). @@ -217,7 +217,7 @@ interface TeamMember { ## `` -The root component when creating a full team page. It only accepts a single slot. It's will style all passed in team related components. +The root component when creating a full team page. It only accepts a single slot. It will style all passed in team related components. ## `` diff --git a/src/client/theme-default/Layout.vue b/src/client/theme-default/Layout.vue index 5087ee46..9008519a 100644 --- a/src/client/theme-default/Layout.vue +++ b/src/client/theme-default/Layout.vue @@ -29,7 +29,14 @@ provide('close-sidebar', closeSidebar) - + + + + + + + + diff --git a/src/client/theme-default/components/VPButton.vue b/src/client/theme-default/components/VPButton.vue index 0f818d9a..714f3e0c 100644 --- a/src/client/theme-default/components/VPButton.vue +++ b/src/client/theme-default/components/VPButton.vue @@ -1,6 +1,7 @@