@mgks/docmd 0.3.1 → 0.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -1
- package/package.json +28 -24
- package/src/templates/layout.ejs +16 -6
- package/src/templates/no-style.ejs +5 -1
- package/src/templates/partials/theme-init.js +20 -16
- package/src/templates/toc.ejs +1 -1
- package/.gitattributes +0 -2
- package/.github/CODE_OF_CONDUCT.md +0 -48
- package/.github/CONTRIBUTING.md +0 -129
- package/.github/FUNDING.yml +0 -15
- package/.github/ISSUE_TEMPLATE/bug_report.yml +0 -58
- package/.github/ISSUE_TEMPLATE/feature_request.yml +0 -27
- package/.github/PULL_REQUEST_TEMPLATE.md +0 -16
- package/.github/SECURITY.md +0 -18
- package/.github/workflows/deploy-docmd.yml +0 -45
- package/.github/workflows/npm-publish.yml +0 -49
- package/assets/css/welcome.css +0 -6
- package/assets/images/preview-dark-1.webp +0 -0
- package/assets/images/preview-dark-2.webp +0 -0
- package/assets/images/preview-dark-3.webp +0 -0
- package/assets/images/preview-dark-welcome.png +0 -0
- package/assets/images/preview-light-1.webp +0 -0
- package/assets/images/preview-light-2.webp +0 -0
- package/assets/images/preview-light-3.webp +0 -0
- package/docs/cli-commands.md +0 -108
- package/docs/comparison.md +0 -56
- package/docs/configuration.md +0 -289
- package/docs/content/containers/buttons.md +0 -88
- package/docs/content/containers/callouts.md +0 -154
- package/docs/content/containers/cards.md +0 -93
- package/docs/content/containers/changelogs.md +0 -128
- package/docs/content/containers/collapsible.md +0 -89
- package/docs/content/containers/index.md +0 -35
- package/docs/content/containers/nested-containers.md +0 -329
- package/docs/content/containers/steps.md +0 -175
- package/docs/content/containers/tabs.md +0 -228
- package/docs/content/custom-containers.md +0 -24
- package/docs/content/frontmatter.md +0 -84
- package/docs/content/images.md +0 -205
- package/docs/content/index.md +0 -19
- package/docs/content/markdown-syntax.md +0 -309
- package/docs/content/mermaid.md +0 -723
- package/docs/content/no-style-example.md +0 -112
- package/docs/content/no-style-pages.md +0 -226
- package/docs/content/search.md +0 -68
- package/docs/contributing.md +0 -101
- package/docs/deployment.md +0 -120
- package/docs/getting-started/basic-usage.md +0 -89
- package/docs/getting-started/index.md +0 -21
- package/docs/getting-started/installation.md +0 -75
- package/docs/index.md +0 -168
- package/docs/overview.md +0 -63
- package/docs/plugins/analytics.md +0 -75
- package/docs/plugins/index.md +0 -70
- package/docs/plugins/seo.md +0 -127
- package/docs/plugins/sitemap.md +0 -87
- package/docs/recipes/custom-fonts.md +0 -43
- package/docs/recipes/favicon.md +0 -38
- package/docs/recipes/index.md +0 -12
- package/docs/recipes/landing-page.md +0 -46
- package/docs/theming/assets-management.md +0 -126
- package/docs/theming/available-themes.md +0 -77
- package/docs/theming/custom-css-js.md +0 -79
- package/docs/theming/icons.md +0 -92
- package/docs/theming/index.md +0 -19
- package/docs/theming/light-dark-mode.md +0 -114
- package/src/assets/css/docmd-highlight-dark.css +0 -1
- package/src/assets/css/docmd-highlight-light.css +0 -1
- package/src/assets/css/docmd-main.css +0 -1608
- package/src/assets/css/docmd-theme-retro.css +0 -868
- package/src/assets/css/docmd-theme-ruby.css +0 -629
- package/src/assets/css/docmd-theme-sky.css +0 -618
- package/src/assets/favicon.ico +0 -0
- package/src/assets/images/docmd-logo-dark.png +0 -0
- package/src/assets/images/docmd-logo-light.png +0 -0
- package/src/assets/images/docmd-logo.png +0 -0
- package/src/assets/images/docmd-preview.png +0 -0
- package/src/assets/js/docmd-image-lightbox.js +0 -74
- package/src/assets/js/docmd-main.js +0 -249
- package/src/assets/js/docmd-mermaid.js +0 -205
- package/src/assets/js/docmd-search.js +0 -218
package/docs/cli-commands.md
DELETED
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "CLI Commands"
|
|
3
|
-
description: "A reference guide to all available docmd command-line interface (CLI) commands and their options."
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# CLI Commands
|
|
7
|
-
|
|
8
|
-
`docmd` provides a set of commands to help you initialize, build, and preview your documentation site.
|
|
9
|
-
|
|
10
|
-
## `docmd init`
|
|
11
|
-
|
|
12
|
-
Initializes a new `docmd` project in the current directory.
|
|
13
|
-
|
|
14
|
-
**Usage:**
|
|
15
|
-
```bash
|
|
16
|
-
docmd init
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
**Description:**
|
|
20
|
-
This command creates the basic file and directory structure required for a `docmd` project:
|
|
21
|
-
* `docs/`: A directory to store your Markdown source files.
|
|
22
|
-
* `docs/index.md`: A sample Markdown file.
|
|
23
|
-
* `docmd.config.js`: The main configuration file for your site, pre-filled with default settings.
|
|
24
|
-
|
|
25
|
-
If a `docs/` directory or `docmd.config.js` file already exists, `docmd init` will typically warn you and avoid overwriting them to prevent accidental data loss.
|
|
26
|
-
|
|
27
|
-
**Options:**
|
|
28
|
-
This command currently does not take any options.
|
|
29
|
-
|
|
30
|
-
## `docmd build`
|
|
31
|
-
|
|
32
|
-
Builds your static documentation site.
|
|
33
|
-
|
|
34
|
-
**Usage:**
|
|
35
|
-
```bash
|
|
36
|
-
docmd build [options]
|
|
37
|
-
```
|
|
38
|
-
|
|
39
|
-
**Description:**
|
|
40
|
-
The `build` command reads your Markdown files from the source directory (specified by `srcDir` in `docmd.config.js`, defaults to `docs/`), processes them along with your `docmd.config.js`, and generates a complete static website in the output directory (specified by `outputDir` in `docmd.config.js`, defaults to `site/`).
|
|
41
|
-
|
|
42
|
-
The output `site/` directory contains all the HTML, CSS, JavaScript, and other assets needed to deploy your documentation.
|
|
43
|
-
|
|
44
|
-
By default, the build process will update all assets to ensure you have the latest versions from the docmd package. This ensures your site benefits from the latest improvements and fixes.
|
|
45
|
-
|
|
46
|
-
**Options:**
|
|
47
|
-
|
|
48
|
-
* `-c, --config <path>`
|
|
49
|
-
* **Default:** `docmd.config.js` or `config.js`
|
|
50
|
-
* **Description:** Specifies the path to the configuration file.
|
|
51
|
-
|
|
52
|
-
* `-p, --preserve`
|
|
53
|
-
* **Default:** `false`
|
|
54
|
-
* **Description:** Preserves existing asset files instead of updating them.
|
|
55
|
-
|
|
56
|
-
* `--silent`
|
|
57
|
-
* **Default:** `false`
|
|
58
|
-
* **Description:** Suppresses most log output in the console. Useful for running in automated environments.
|
|
59
|
-
|
|
60
|
-
## `docmd dev`
|
|
61
|
-
|
|
62
|
-
Starts a local development server with live reloading.
|
|
63
|
-
|
|
64
|
-
**Usage:**
|
|
65
|
-
```bash
|
|
66
|
-
docmd dev [options]
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
**Description:**
|
|
70
|
-
The `dev` command is essential for writing and previewing your documentation. It:
|
|
71
|
-
1. Performs an initial build of your site.
|
|
72
|
-
2. Starts a local web server (usually on `http://localhost:3000`).
|
|
73
|
-
3. Watches your source files (`docs/` directory, `docmd.config.js`, and internal `docmd` theme assets) for changes.
|
|
74
|
-
4. When a change is detected, it automatically rebuilds the necessary parts of your site and triggers a live reload in your browser.
|
|
75
|
-
|
|
76
|
-
This provides a fast feedback loop, allowing you to see your changes almost instantly.
|
|
77
|
-
|
|
78
|
-
**Options:**
|
|
79
|
-
|
|
80
|
-
* `-c, --config <path>`
|
|
81
|
-
* **Default:** `docmd.config.js` or `config.js`
|
|
82
|
-
* **Description:** Specifies the path to the configuration file.
|
|
83
|
-
|
|
84
|
-
* `--port <number>`
|
|
85
|
-
* **Default:** `3000`
|
|
86
|
-
* **Description:** Specifies the port for the development server. If the port is in use, docmd will automatically try the next available one.
|
|
87
|
-
* **Example:** `docmd dev --port 8080`
|
|
88
|
-
|
|
89
|
-
* `-p, --preserve`
|
|
90
|
-
* **Default:** `false`
|
|
91
|
-
* **Description:** Preserves existing asset files instead of updating them.
|
|
92
|
-
|
|
93
|
-
* `--silent`
|
|
94
|
-
* **Default:** `false`
|
|
95
|
-
* **Description:** Suppresses most log output in the console. Useful for running in automated environments.
|
|
96
|
-
|
|
97
|
-
**Note:** The development server starts on port 3000 by default. If port 3000 is already in use, the server will automatically try the next available port (3001, 3002, etc.) until it finds an open port.
|
|
98
|
-
|
|
99
|
-
## Global Options (Apply to all commands)
|
|
100
|
-
|
|
101
|
-
* `--version`
|
|
102
|
-
* **Usage:** `docmd --version`
|
|
103
|
-
* **Description:** Displays the installed version of `docmd`.
|
|
104
|
-
* `--help`
|
|
105
|
-
* **Usage:** `docmd --help` or `docmd <command> --help` (e.g., `docmd build --help`)
|
|
106
|
-
* **Description:** Displays help information for `docmd` or a specific command, including available options.
|
|
107
|
-
|
|
108
|
-
This reference should help you effectively use `docmd` from your command line. For more detailed explanations of how these commands fit into the workflow, see the [Getting Started > Basic Usage](/getting-started/basic-usage/) guide.
|
package/docs/comparison.md
DELETED
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Comparison between docmd, Docusaurus, MkDocs, Mintlify and more"
|
|
3
|
-
description: "A detailed comparison of docmd against Docusaurus, MkDocs, Mintlify, and Docsify."
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# Comparing Documentation Tools
|
|
7
|
-
|
|
8
|
-
Choosing the right tool depends on your specific needs. `docmd` was built to fill the gap between "too simple" (basic parsers) and "too heavy" (full application frameworks).
|
|
9
|
-
|
|
10
|
-
## Feature Matrix
|
|
11
|
-
|
|
12
|
-
| Feature | docmd | Docusaurus | MkDocs (Material) | Mintlify | Docsify |
|
|
13
|
-
| :--- | :--- | :--- | :--- | :--- | :--- |
|
|
14
|
-
| **Core Tech** | Node.js (Native) | React.js | Python | Proprietary | JS (Runtime) |
|
|
15
|
-
| **Output** | Static HTML | React SPA (Hydrated) | Static HTML | Hosted / Next.js | None (Runtime SPA) |
|
|
16
|
-
| **Setup Time** | ~2 minutes | ~15 minutes | ~10 mins (Python env) | Instant (SaaS) | Instant |
|
|
17
|
-
| **Client JS Size** | **Tiny (< 15kb)** | Heavy (React Bundle) | Minimal | Medium | Medium |
|
|
18
|
-
| **Customization** | Standard CSS/JS | React Components | Python/Jinja2 | JSON Config | Vue/Plugins |
|
|
19
|
-
| **Search** | **Built-in (Offline)** | Algolia (Requires Setup) | Built-in (Lunr) | Built-in | Client-side Plugin |
|
|
20
|
-
| **SEO** | **Excellent** | Excellent | Excellent | Excellent | **Poor** |
|
|
21
|
-
| **Hosting** | **Anywhere** | Anywhere | Anywhere | **Vendor Locked** | Anywhere |
|
|
22
|
-
| **Cost** | **100% Free OSS** | 100% Free OSS | 100% Free OSS | Freemium | 100% Free OSS |
|
|
23
|
-
|
|
24
|
-
## Detailed Breakdown
|
|
25
|
-
|
|
26
|
-
### The Search Advantage
|
|
27
|
-
* **Docusaurus and others** rely on 3rd party services like Algolia and others. This is great for enterprise scale, but for most projects, it's a hassle. You have to apply for an account, manage API keys, and configure crawlers.
|
|
28
|
-
* **docmd** includes a production-grade search engine out of the box. It generates a local index during the build. This means your documentation is **searchable even offline** (perfect for Intranets or air-gapped networks) and respects user privacy completely.
|
|
29
|
-
|
|
30
|
-
### vs. Docusaurus
|
|
31
|
-
**Docusaurus** is the gold standard for large-scale React projects (like Meta's own docs).
|
|
32
|
-
* **Choose Docusaurus if:** You need to embed complex React components inside your markdown, need versioning *today*, or are building a massive site with thousands of pages.
|
|
33
|
-
* **Choose docmd if:** You want a fast, lightweight site that is just HTML/CSS. You don't want to maintain a React dependency tree just to display documentation.
|
|
34
|
-
|
|
35
|
-
### vs. MkDocs (Material)
|
|
36
|
-
**MkDocs** is widely loved but requires a Python environment.
|
|
37
|
-
* **Choose MkDocs if:** You are already in the Python ecosystem or need its mature plugin ecosystem immediately.
|
|
38
|
-
* **Choose docmd if:** You are a JavaScript/Node.js developer. You want to run `npm install` and go, without dealing with `pip`, `requirements.txt`, or Python version conflicts.
|
|
39
|
-
|
|
40
|
-
### vs. Mintlify
|
|
41
|
-
**Mintlify** is a modern, hosted documentation platform focused on design.
|
|
42
|
-
* **Choose Mintlify if:** You have a budget and don't want to touch *any* code or configuration. You just want to upload markdown and pay someone to host and style it.
|
|
43
|
-
* **Choose docmd if:** You want full control over your HTML/CSS and want to host your docs for **free** on GitHub Pages, Vercel, or Netlify without branding watermarks or custom domain fees.
|
|
44
|
-
|
|
45
|
-
### vs. Docsify
|
|
46
|
-
**Docsify** is a "magical" generator that parses Markdown on the fly in the browser.
|
|
47
|
-
* **Choose Docsify if:** You absolutely cannot run a build step (e.g., you are hosting on a legacy server that only serves static files and you can't run CI/CD).
|
|
48
|
-
* **Choose docmd if:** You care about **SEO** and **Performance**. Docsify requires the user's browser to download the Markdown parser and the content before rendering anything, which is bad for search engines and users on slow connections. `docmd` builds real HTML files that load instantly.
|
|
49
|
-
|
|
50
|
-
## The docmd Philosophy
|
|
51
|
-
|
|
52
|
-
We believe documentation tools shouldn't be heavy. `docmd` generates **zero-clutter** websites. We don't ship a heavy JavaScript framework to the client just to render text. This results in:
|
|
53
|
-
|
|
54
|
-
1. **Better SEO:** Search engines love clean, semantic HTML.
|
|
55
|
-
2. **Faster Load Times:** No "hydration" delay or runtime parsing.
|
|
56
|
-
3. **Easier Maintenance:** Standard web technologies (CSS/JS), no framework knowledge required.
|
package/docs/configuration.md
DELETED
|
@@ -1,289 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Configuration"
|
|
3
|
-
description: "Detailed explanation of all options available in the docmd config file, including logo, theming, plugins, and more."
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# Configuration (`docmd.config.js`)
|
|
7
|
-
|
|
8
|
-
`docmd` uses a `docmd.config.js` file in the root of your project... For backward compatibility, it will fall back to using `config.js` if `docmd.config.js` is not found.
|
|
9
|
-
|
|
10
|
-
## Example `docmd.config.js` Structure:
|
|
11
|
-
|
|
12
|
-
```javascript
|
|
13
|
-
module.exports = {
|
|
14
|
-
siteTitle: 'My Awesome Project Docs',
|
|
15
|
-
logo: {
|
|
16
|
-
light: '/assets/images/logo-light.svg', // Path to logo for light mode
|
|
17
|
-
dark: '/assets/images/logo-dark.svg', // Path to logo for dark mode
|
|
18
|
-
alt: 'My Project Logo', // Alt text for the logo
|
|
19
|
-
// href: '/', // Optional: link for the logo, defaults to site root
|
|
20
|
-
// height: '30px', // Optional: specify height via CSS is often better
|
|
21
|
-
},
|
|
22
|
-
srcDir: 'docs',
|
|
23
|
-
outputDir: 'site',
|
|
24
|
-
|
|
25
|
-
search: true,
|
|
26
|
-
|
|
27
|
-
sidebar: {
|
|
28
|
-
collapsible: true,
|
|
29
|
-
defaultCollapsed: false,
|
|
30
|
-
},
|
|
31
|
-
|
|
32
|
-
theme: {
|
|
33
|
-
name: 'sky',
|
|
34
|
-
defaultMode: 'light',
|
|
35
|
-
enableModeToggle: true,
|
|
36
|
-
positionMode: 'top', // 'top' or 'bottom'
|
|
37
|
-
customCss: [ // Array of paths to your custom CSS files
|
|
38
|
-
// '/css/override-styles.css', // Paths are relative to the outputDir root
|
|
39
|
-
],
|
|
40
|
-
// options: { /* Future: theme-specific options */ }
|
|
41
|
-
},
|
|
42
|
-
|
|
43
|
-
customJs: [ // Array of paths to your custom JS files
|
|
44
|
-
// '/js/extra-functionality.js', // Loaded at the end of the body
|
|
45
|
-
],
|
|
46
|
-
|
|
47
|
-
autoTitleFromH1: true,
|
|
48
|
-
copyCode: true,
|
|
49
|
-
|
|
50
|
-
sponsor: {
|
|
51
|
-
enabled: true,
|
|
52
|
-
title: 'Sponsor the Project',
|
|
53
|
-
link: 'https://github.com/sponsors/mgks',
|
|
54
|
-
},
|
|
55
|
-
|
|
56
|
-
plugins: {
|
|
57
|
-
// SEO Plugin Configuration
|
|
58
|
-
seo: {
|
|
59
|
-
defaultDescription: 'A fantastic site about interesting things.',
|
|
60
|
-
openGraph: {
|
|
61
|
-
defaultImage: '/assets/images/og-social-default.png'
|
|
62
|
-
},
|
|
63
|
-
twitter: {
|
|
64
|
-
cardType: 'summary_large_image',
|
|
65
|
-
siteUsername: '@MyProject'
|
|
66
|
-
}
|
|
67
|
-
},
|
|
68
|
-
|
|
69
|
-
// Google Analytics 4
|
|
70
|
-
analytics: {
|
|
71
|
-
googleV4: {
|
|
72
|
-
measurementId: 'G-XXXXXXXXXX'
|
|
73
|
-
}
|
|
74
|
-
},
|
|
75
|
-
|
|
76
|
-
// Sitemap generation
|
|
77
|
-
sitemap: {
|
|
78
|
-
defaultChangefreq: 'weekly',
|
|
79
|
-
defaultPriority: 0.8
|
|
80
|
-
}
|
|
81
|
-
},
|
|
82
|
-
|
|
83
|
-
navigation: [
|
|
84
|
-
{ title: 'Home', path: '/', icon: 'home' }, // Icon names correspond to SVGs
|
|
85
|
-
{
|
|
86
|
-
title: 'Guides',
|
|
87
|
-
icon: 'book-open',
|
|
88
|
-
collapsible: true, // This makes the 'Guides' section collapsible
|
|
89
|
-
children: [
|
|
90
|
-
{ title: 'Installation', path: '/guides/installation', icon: 'download' },
|
|
91
|
-
{ title: 'Project GitHub', path: 'https://github.com/mgks/docmd', icon: 'github', external: true }
|
|
92
|
-
],
|
|
93
|
-
},
|
|
94
|
-
],
|
|
95
|
-
footer: '© ' + new Date().getFullYear() + ' My Project. Made with [docmd](https://github.com/mgks/docmd).',
|
|
96
|
-
favicon: '/assets/favicon.ico', // Path relative to outputDir root
|
|
97
|
-
};
|
|
98
|
-
```
|
|
99
|
-
|
|
100
|
-
## Top-Level Options
|
|
101
|
-
|
|
102
|
-
### `siteTitle`
|
|
103
|
-
* **Type:** `String`
|
|
104
|
-
* **Required:** Yes
|
|
105
|
-
* **Description:** The main title for your documentation site. Used as a fallback if no logo is provided, in the HTML `<title>` tag, and potentially by plugins (e.g., SEO).
|
|
106
|
-
* **Example:** `siteTitle: 'My Product Documentation'`
|
|
107
|
-
|
|
108
|
-
### `logo`
|
|
109
|
-
* **Type:** `Object`
|
|
110
|
-
* **Optional**
|
|
111
|
-
* **Description:** Configures a logo to be displayed in the site header/sidebar, typically replacing or complementing the `siteTitle` text.
|
|
112
|
-
* **Properties:**
|
|
113
|
-
* `light` (String, Required if using logo): Path to the logo image file for light mode. Path should be relative to the `outputDir` root (e.g., `/assets/images/logo-light.svg`).
|
|
114
|
-
* `dark` (String, Required if using logo): Path to the logo image file for dark mode.
|
|
115
|
-
* `alt` (String, Required if using logo): Alternative text for the logo image (for accessibility).
|
|
116
|
-
* `href` (String, Optional): The URL the logo should link to. Defaults to the site root (`/`).
|
|
117
|
-
* `height` (String, Optional): Suggested height for the logo (e.g., `'30px'`, `'2rem'`). It's often better to control size via CSS for more flexibility.
|
|
118
|
-
* **Note:** Ensure your logo image files are copied to the specified paths within your `outputDir` during the build. Usually, this means placing them in an assets folder that `docmd` copies.
|
|
119
|
-
|
|
120
|
-
### `srcDir`
|
|
121
|
-
* **Type:** `String`
|
|
122
|
-
* **Default:** `'docs'`
|
|
123
|
-
* **Description:** Directory containing your Markdown source files.
|
|
124
|
-
|
|
125
|
-
### `outputDir`
|
|
126
|
-
* **Type:** `String`
|
|
127
|
-
* **Default:** `'site'`
|
|
128
|
-
* **Description:** Directory where the static site will be generated.
|
|
129
|
-
|
|
130
|
-
### `search`
|
|
131
|
-
* **Type:** `Boolean`
|
|
132
|
-
* **Default:** `true`
|
|
133
|
-
* **Description:** Controls the visibility of the full-text search bar in the header and the generation of the search index. Set to `false` to disable search capabilities entirely.
|
|
134
|
-
|
|
135
|
-
## `minify`
|
|
136
|
-
* **Type:** `Boolean`
|
|
137
|
-
* **Optional**
|
|
138
|
-
* **Default:** `true` when running `docmd build`, `false` when running `docmd dev`.
|
|
139
|
-
* **Description:** Controls whether CSS and JavaScript assets are minified (compressed) during the build.
|
|
140
|
-
* **Usage:** You can force this to `false` if you need to debug production builds.
|
|
141
|
-
|
|
142
|
-
### `autoTitleFromH1`
|
|
143
|
-
* **Type:** `Boolean`
|
|
144
|
-
* **Default:** `true`
|
|
145
|
-
* **Description:** If `true`, `docmd` will automatically use the content of the first H1 tag (`# Title`) as the page title if no `title` is specified in the frontmatter. If set to `false` and a page has no `title` in its frontmatter, the page header will be hidden.
|
|
146
|
-
* **Example:**
|
|
147
|
-
```javascript
|
|
148
|
-
// With autoTitleFromH1: true (default)
|
|
149
|
-
// Markdown file with: # My Page Title
|
|
150
|
-
// Will automatically set the page title to "My Page Title"
|
|
151
|
-
|
|
152
|
-
// With autoTitleFromH1: false
|
|
153
|
-
// You must explicitly set title in frontmatter:
|
|
154
|
-
// ---
|
|
155
|
-
// title: "My Page Title"
|
|
156
|
-
// ---
|
|
157
|
-
```
|
|
158
|
-
|
|
159
|
-
### `copyCode`
|
|
160
|
-
* **Type:** `Boolean`
|
|
161
|
-
* **Default:** `true`
|
|
162
|
-
* **Description:** If `true`, a "Copy" button will be added to the top-right corner of all code blocks, allowing users to easily copy the code to their clipboard with a single click.
|
|
163
|
-
|
|
164
|
-
**Note:** This setting only applies to regular pages. For noStyle pages, copy code functionality must be explicitly enabled via the `components.mainScripts: true` setting.
|
|
165
|
-
|
|
166
|
-
## `sidebar` (Object)
|
|
167
|
-
|
|
168
|
-
Configures the behavior of the sidebar.
|
|
169
|
-
|
|
170
|
-
### `sidebar.collapsible`
|
|
171
|
-
* **Type:** `Boolean`
|
|
172
|
-
* **Default:** `false`
|
|
173
|
-
* **Description:** If `true`, a toggle button is added to the header, allowing users to show or hide the sidebar. The user's preference is saved in `localStorage`.
|
|
174
|
-
|
|
175
|
-
### `sidebar.defaultCollapsed`
|
|
176
|
-
* **Type:** `Boolean`
|
|
177
|
-
* **Default:** `false`
|
|
178
|
-
* **Description:** If `sidebar.collapsible` is `true`, this option sets the default state of the sidebar to collapsed. A user's saved preference will override this.
|
|
179
|
-
|
|
180
|
-
## `theme` (Object)
|
|
181
|
-
|
|
182
|
-
Configures the visual theme of your site.
|
|
183
|
-
|
|
184
|
-
### `theme.name`
|
|
185
|
-
* **Type:** `String`
|
|
186
|
-
* **Default:** `'default'`
|
|
187
|
-
* **Description:** Specifies which built-in `docmd` theme to use. Future versions may offer multiple themes like `'classic'`, `'minimalist-pro'`. Each theme would correspond to a CSS file (e.g., `theme-default.css`).
|
|
188
|
-
* **See Also:** [Available Themes](/theming/available-themes/)
|
|
189
|
-
|
|
190
|
-
### `theme.defaultMode`
|
|
191
|
-
* **Type:** `String`
|
|
192
|
-
* **Default:** `'light'`
|
|
193
|
-
* **Values:** `'light'` or `'dark'`
|
|
194
|
-
* **Description:** Sets the default color mode (light or dark) for the site.
|
|
195
|
-
|
|
196
|
-
### `theme.enableModeToggle`
|
|
197
|
-
* **Type:** `Boolean`
|
|
198
|
-
* **Default:** `true` (assuming it's now a core feature)
|
|
199
|
-
* **Description:** If `true`, a UI toggle button will be displayed allowing users to switch between light and dark modes. Their preference is typically saved in `localStorage`.
|
|
200
|
-
|
|
201
|
-
### `theme.positionMode`
|
|
202
|
-
* **Type:** `String`
|
|
203
|
-
* **Default:** `'bottom'`
|
|
204
|
-
* **Values:** `'top'` or `'bottom'`
|
|
205
|
-
* **Description:** Sets the position of the light/dark mode toggle button. `'top'` places it in the page header (top right), while `'bottom'` places it at the bottom of the sidebar.
|
|
206
|
-
* **Example:** `positionMode: 'top'` - Useful for sites where you want the theme toggle to be more prominent and easily accessible.
|
|
207
|
-
|
|
208
|
-
### `theme.customCss`
|
|
209
|
-
* **Type:** `Array` of `String`
|
|
210
|
-
* **Default:** `[]` (empty array)
|
|
211
|
-
* **Description:** An array of paths to your custom CSS files. These files will be linked in the `<head>` of every regular page *after* the main theme CSS, allowing you to override or extend styles. **Note:** For noStyle pages, custom CSS must be explicitly enabled via `components.customCss: true`.
|
|
212
|
-
* **Paths:** Should be relative to the `outputDir` root (e.g., `'/css/my-styles.css'`). You are responsible for ensuring these files exist at the specified location in your final `site/` output (e.g., by placing them in an assets folder that `docmd` copies, or in your project's static assets if your `srcDir` is part of a larger project).
|
|
213
|
-
* **Example:** `customCss: ['/assets/css/custom-branding.css']`
|
|
214
|
-
|
|
215
|
-
### `theme.options` (Future Placeholder)
|
|
216
|
-
* **Type:** `Object`
|
|
217
|
-
* **Description:** A placeholder for theme-specific configuration options if a theme (`theme.name`) exposes its own settings (e.g., primary color, font choices for a more advanced theme).
|
|
218
|
-
|
|
219
|
-
## `customJs` (Array of String)
|
|
220
|
-
* **Type:** `Array` of `String`
|
|
221
|
-
* **Default:** `[]`
|
|
222
|
-
* **Description:** An array of paths to your custom JavaScript files. These files will be included as `<script>` tags just before the closing `</body>` tag on every regular page. **Note:** For noStyle pages, custom JavaScript must be explicitly enabled via `components.customJs: true`.
|
|
223
|
-
* **Paths:** Should be relative to the `outputDir` root (e.g., `'/js/my-analytics-alternative.js'`).
|
|
224
|
-
* **Example:** `customJs: ['/assets/js/interactive-component.js']`
|
|
225
|
-
|
|
226
|
-
## `plugins` (Object)
|
|
227
|
-
* **Type:** `Object`
|
|
228
|
-
* **Default:** `{}`
|
|
229
|
-
* **Description:** An object to configure and enable plugins. `docmd` ships with core plugins like SEO, Analytics, and Sitemap that you can configure here.
|
|
230
|
-
* **Format:** Each key in the object represents a plugin name, and its value is an object containing the plugin's configuration options.
|
|
231
|
-
* **Built-in Plugin Examples:**
|
|
232
|
-
* `seo: { defaultDescription: '...', openGraph: { ... }, ... }`
|
|
233
|
-
* `analytics: { googleV4: { measurementId: 'G-XXXXXXXXXX' } }`
|
|
234
|
-
* `sitemap: { defaultChangefreq: 'weekly', defaultPriority: 0.8 }`
|
|
235
|
-
* **See Also:** [Plugins](/plugins/)
|
|
236
|
-
|
|
237
|
-
## `editLink` (Object, Optional)
|
|
238
|
-
* **Type:** `Object`
|
|
239
|
-
* **Description:** Configures a link in the page footer that points to the source file on GitHub (or GitLab/Bitbucket), allowing users to propose changes.
|
|
240
|
-
* **Properties:**
|
|
241
|
-
* `enabled` (Boolean): Set to `true` to show the link.
|
|
242
|
-
* `baseUrl` (String): The base URL to your repository's documentation source folder.
|
|
243
|
-
* *GitHub Example:* `https://github.com/USERNAME/REPO/edit/main/docs`
|
|
244
|
-
* *Note:* Do not include a trailing slash. `docmd` appends the file path automatically.
|
|
245
|
-
* `text` (String, Optional): The text to display. Defaults to "Edit this page".
|
|
246
|
-
* **Example:**
|
|
247
|
-
```javascript
|
|
248
|
-
editLink: {
|
|
249
|
-
enabled: true,
|
|
250
|
-
baseUrl: 'https://github.com/mgks/docmd/edit/main/docs',
|
|
251
|
-
text: 'Edit on GitHub'
|
|
252
|
-
}
|
|
253
|
-
```
|
|
254
|
-
|
|
255
|
-
## `navigation` (Array of Objects)
|
|
256
|
-
* **Description:** Defines the sidebar navigation. (Content mostly same as before, but add the `icon` property explanation).
|
|
257
|
-
* **Navigation Item Properties:**
|
|
258
|
-
* `title` (String, Required)
|
|
259
|
-
* `path` (String, Required for direct links)
|
|
260
|
-
* `children` (Array, Optional)
|
|
261
|
-
* `icon` (String, Optional): The name of an SVG icon to display next to the navigation item. `docmd` will look for an SVG file named `icon-name.svg` in its bundled assets (e.g., `home` for `home.svg`). Ensure the chosen icon name corresponds to an available SVG. See [Theming > Icons](/theming/icons/) for more details.
|
|
262
|
-
* `collapsible` (Boolean, Optional): If set to `true` on a parent item (an item with `children`), the item will become a collapsible accordion. It will be collapsed by default unless one of its children is the currently active page. User interactions (opening/closing) are saved in `sessionStorage`. Defaults to `false`.
|
|
263
|
-
* `external` (Boolean, Optional): If set to `true`, the `path` is treated as an absolute external URL and the link will open in a new tab (`target="_blank"`). Defaults to `false`.
|
|
264
|
-
* `collapsible` (Boolean, Optional): If set to `true` on a parent item (an item with `children`), the item will become a collapsible accordion. It will be collapsed by default unless one of its children is the currently active page. User interactions (opening/closing) are saved in `sessionStorage`. Defaults to `false`.
|
|
265
|
-
|
|
266
|
-
## `footer` (String, Optional)
|
|
267
|
-
* **Description:** Custom footer text (Markdown supported). **Note:** For noStyle pages, the footer must be explicitly enabled via `components.footer: true`.
|
|
268
|
-
|
|
269
|
-
## `sponsor` (Object, Optional)
|
|
270
|
-
* **Type:** `Object`
|
|
271
|
-
* **Description:** Configures a sponsor ribbon that appears in the bottom-right corner of every regular page. **Note:** For noStyle pages, the sponsor ribbon must be explicitly enabled via `components.branding: true`.
|
|
272
|
-
* **Properties:**
|
|
273
|
-
* `enabled` (Boolean, Optional): Whether to show the sponsor ribbon. Defaults to `true` if the sponsor object is provided.
|
|
274
|
-
* `title` (String, Optional): Text to display on the ribbon. Defaults to `'Sponsor the Project'`.
|
|
275
|
-
* `link` (String, Required if enabled): URL for the sponsor link. Should open in a new tab.
|
|
276
|
-
* **Example:**
|
|
277
|
-
```javascript
|
|
278
|
-
sponsor: {
|
|
279
|
-
enabled: true,
|
|
280
|
-
title: 'Sponsor the Project',
|
|
281
|
-
link: 'https://github.com/sponsors/mgks'
|
|
282
|
-
}
|
|
283
|
-
```
|
|
284
|
-
* **Note:** The ribbon is positioned fixed in the bottom-right corner and includes a heart icon with a subtle animation.
|
|
285
|
-
|
|
286
|
-
## `favicon` (String, Optional)
|
|
287
|
-
* **Description:** Path to your favicon file, relative to `outputDir` root. **Note:** For noStyle pages, the favicon must be explicitly enabled via `components.favicon: true`.
|
|
288
|
-
|
|
289
|
-
This file needs significant detail for each new option, explaining its purpose, type, default value, and how to use it with examples.
|
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Container: Buttons"
|
|
3
|
-
description: "How to create stylish, clickable buttons within your documentation for calls to action."
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# Buttons
|
|
7
|
-
|
|
8
|
-
The `button` container allows you to easily create a stylish, clickable button. It's perfect for calls to action, such as linking to a download page, an external resource, or another section of your documentation.
|
|
9
|
-
|
|
10
|
-
## Usage
|
|
11
|
-
|
|
12
|
-
The button container is a self-contained component. You provide its text, URL, and an optional color as arguments.
|
|
13
|
-
|
|
14
|
-
::: callout info Important Notes
|
|
15
|
-
- Container blocks (like `::: button`) should be preceded by a blank line to ensure proper parsing by the markdown processor.
|
|
16
|
-
:::
|
|
17
|
-
|
|
18
|
-
**Syntax:**
|
|
19
|
-
```bash
|
|
20
|
-
::: button Button_Text /path/to/link color:#hexcode
|
|
21
|
-
::: button Button_Text external:/external-url color:#hexcode
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
- **`Button_Text`**: The text to display on the button. Use underscores (`_`) for spaces.
|
|
25
|
-
- **`/path/to/link`**: The URL the button should link to. For internal links, use relative paths.
|
|
26
|
-
- **`external:/external-url`**: For external links that should open in a new tab, prefix the URL with `external:`.
|
|
27
|
-
- **`[color:#hexcode]`**: (Optional) A custom background color for the button. If omitted, it will use the theme's default link color.
|
|
28
|
-
|
|
29
|
-
---
|
|
30
|
-
|
|
31
|
-
## Examples
|
|
32
|
-
|
|
33
|
-
### Standard Internal Button
|
|
34
|
-
|
|
35
|
-
This button will use the default theme color and link to a section on the current page.
|
|
36
|
-
|
|
37
|
-
**Code:**
|
|
38
|
-
```bash
|
|
39
|
-
::: button View_Examples #examples
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
**Rendered Preview:**
|
|
43
|
-
::: button View_Examples #examples
|
|
44
|
-
|
|
45
|
-
### External Link Button
|
|
46
|
-
|
|
47
|
-
External links open in a new tab for better user experience.
|
|
48
|
-
|
|
49
|
-
**Code:**
|
|
50
|
-
```bash
|
|
51
|
-
::: button GitHub_Repository external:https://github.com/mgks/docmd
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
**Rendered Preview:**
|
|
55
|
-
::: button GitHub_Repository external:https://github.com/mgks/docmd
|
|
56
|
-
|
|
57
|
-
### Button with Custom Color
|
|
58
|
-
|
|
59
|
-
You can easily override the color for emphasis.
|
|
60
|
-
|
|
61
|
-
**Code:**
|
|
62
|
-
```bash
|
|
63
|
-
::: button Getting_Started #getting-started color:#28a745
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
**Rendered Preview:**
|
|
67
|
-
::: button Getting_Started #getting-started color:#28a745
|
|
68
|
-
|
|
69
|
-
### Buttons Inside Other Containers
|
|
70
|
-
|
|
71
|
-
Buttons are flexible and can be placed inside other containers, like cards or callouts, to create powerful components. This nesting is now reliable.
|
|
72
|
-
|
|
73
|
-
**Code:**
|
|
74
|
-
|
|
75
|
-
```bash
|
|
76
|
-
::: card Feature Announcement
|
|
77
|
-
Our latest feature is now available! Read the full documentation to learn more about how it works.
|
|
78
|
-
::: button Read_More /path/to/feature/docs/
|
|
79
|
-
:::
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
**Rendered Preview:**
|
|
83
|
-
|
|
84
|
-
::: card Feature Announcement
|
|
85
|
-
Our latest feature is now available! Read the full documentation to learn more about how it works.
|
|
86
|
-
|
|
87
|
-
::: button Learn_More #customization
|
|
88
|
-
:::
|