You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/adding-pages.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -67,7 +67,7 @@ To create section headers:
67
67
68
68
You need to create a `.nojekyll` in `./docs` to prevent GitHub Pages from ignoring files that begin with an underscore.
69
69
70
-
!> Docsify only looks for `_sidebar.md` in the current folder, and uses that, otherwise it falls back to the one configured using `window.$docsify.loadSidebar` config.
70
+
> [!IMPORTANT] Docsify only looks for `_sidebar.md` in the current folder, and uses that, otherwise it falls back to the one configured using `window.$docsify.loadSidebar` config.
71
71
72
72
Example file structure:
73
73
@@ -98,7 +98,7 @@ You can specify `alias` to avoid unnecessary fallback.
98
98
</script>
99
99
```
100
100
101
-
!> You can create a `README.md` file in a subdirectory to use it as the landing page for the route.
101
+
> [!IMPORTANT] You can create a `README.md` file in a subdirectory to use it as the landing page for the route.
Copy file name to clipboardExpand all lines: docs/cdn.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -29,7 +29,7 @@ Uncompressed resources are available by omitting the `.min` from the filename.
29
29
30
30
Specifying the latest major version allows your site to receive all non-breaking enhancements ("minor" updates) and bug fixes ("patch" updates) as they are released. This is good option for those who prefer a zero-maintenance way of keeping their site up to date with minimal risk as new versions are published.
31
31
32
-
?> When a new major version is released, you will need to manually update the major version number after the `@` symbol in your CDN URLs.
32
+
> [!TIP] When a new major version is released, you will need to manually update the major version number after the `@` symbol in your CDN URLs.
33
33
34
34
<!-- prettier-ignore -->
35
35
```html
@@ -44,7 +44,7 @@ Specifying the latest major version allows your site to receive all non-breaking
44
44
45
45
Specifying an exact version prevents any future updates from affecting your site. This is good option for those who prefer to manually update their resources as new versions are published.
46
46
47
-
?> When a new version is released, you will need to manually update the version number after the `@` symbol in your CDN URLs.
47
+
> [!TIP] When a new version is released, you will need to manually update the version number after the `@` symbol in your CDN URLs.
Copy file name to clipboardExpand all lines: docs/configuration.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -303,7 +303,7 @@ Key `bindings` are defined as case insensitive string values separated by `+`. M
303
303
304
304
The `callback` function receive a [keydown event](https://developer.mozilla.org/en-US/docs/Web/API/Element/keydown_event) as an argument.
305
305
306
-
!> Let site visitors know your custom key bindings are available! If a binding is associated with a DOM element, consider inserting a `<kbd>` element as a visual cue (e.g., <kbd>alt</kbd> + <kbd>a</kbd>) or adding [title](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title) and [aria-keyshortcuts](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-keyshortcuts) attributes for hover/focus hints.
306
+
> [!IMPORTANT] Let site visitors know your custom key bindings are available! If a binding is associated with a DOM element, consider inserting a `<kbd>` element as a visual cue (e.g., <kbd>alt</kbd> + <kbd>a</kbd>) or adding [title](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title) and [aria-keyshortcuts](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-keyshortcuts) attributes for hover/focus hints.
307
307
308
308
```js
309
309
window.$docsify= {
@@ -378,7 +378,7 @@ window.$docsify = {
378
378
379
379
Website logo as it appears in the sidebar. You can resize it using CSS.
380
380
381
-
!> Logo will only be visible if `name` prop is also set. See [name](#name) configuration.
381
+
> [!IMPORTANT] Logo will only be visible if `name` prop is also set. See [name](#name) configuration.
382
382
383
383
```js
384
384
window.$docsify= {
@@ -921,7 +921,7 @@ For more details, see [#1131](https://github.com/docsifyjs/docsify/issues/1131).
921
921
922
922
## themeColor ⚠️ :id=themecolor
923
923
924
-
!> Deprecated as of v5. Use the `--theme-color`[theme property](themes#theme-properties) to [customize](themes#customization) your theme color.
924
+
> [!IMPORTANT] Deprecated as of v5. Use the `--theme-color`[theme property](themes#theme-properties) to [customize](themes#customization) your theme color.
925
925
926
926
- Type: `String`
927
927
@@ -935,7 +935,7 @@ window.$docsify = {
935
935
936
936
## topMargin ⚠️ :id=topmargin
937
937
938
-
!> Deprecated as of v5. Use the `--scroll-padding-top`[theme property](themes#theme-properties) to specify a scroll margin when using a sticky navbar.
938
+
> [!IMPORTANT] Deprecated as of v5. Use the `--scroll-padding-top`[theme property](themes#theme-properties) to specify a scroll margin when using a sticky navbar.
Copy file name to clipboardExpand all lines: docs/custom-navbar.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,7 +4,7 @@
4
4
5
5
If you need custom navigation, you can create a HTML-based navigation bar.
6
6
7
-
!> Note that documentation links begin with `#/`.
7
+
> [!IMPORTANT] Note that documentation links begin with `#/`.
8
8
9
9
```html
10
10
<!-- index.html -->
@@ -51,7 +51,7 @@ To create drop-down menus:
51
51
- [chinese](/zh-cn/)
52
52
```
53
53
54
-
!> You need to create a `.nojekyll` in `./docs` to prevent GitHub Pages from ignoring files that begin with an underscore.
54
+
> [!IMPORTANT] You need to create a `.nojekyll` in `./docs` to prevent GitHub Pages from ignoring files that begin with an underscore.
55
55
56
56
`_navbar.md` is loaded from each level directory. If the current directory doesn't have `_navbar.md`, it will fall back to the parent directory. If, for example, the current path is `/guide/quick-start`, the `_navbar.md` will be loaded from `/guide/_navbar.md`.
Copy file name to clipboardExpand all lines: docs/deploy.md
+5-5Lines changed: 5 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -14,14 +14,14 @@ It is recommended that you save your files to the `./docs` subfolder of the `mai
14
14
15
15
16
16
17
-
!> You can also save files in the root directory and select `main branch`.
18
-
You'll need to place a `.nojekyll` file in the deploy location (such as `/docs` or the gh-pages branch)
17
+
> [!IMPORTANT] You can also save files in the root directory and select `main branch`.
18
+
> You'll need to place a `.nojekyll` file in the deploy location (such as `/docs` or the gh-pages branch)
19
19
20
20
## GitLab Pages
21
21
22
22
If you are deploying your master branch, create a `.gitlab-ci.yml` with the following script:
23
23
24
-
?> The `.public` workaround is so `cp` doesn't also copy `public/` to itself in an infinite loop.
24
+
> [!TIP] The `.public` workaround is so `cp` doesn't also copy `public/` to itself in an infinite loop.
25
25
26
26
```YAML
27
27
pages:
@@ -37,11 +37,11 @@ pages:
37
37
- master
38
38
```
39
39
40
-
!> You can replace script with `- cp -r docs/. public`, if `./docs` is your Docsify subfolder.
40
+
> [!IMPORTANT] You can replace script with `- cp -r docs/. public`, if `./docs` is your Docsify subfolder.
41
41
42
42
## Firebase Hosting
43
43
44
-
!> You'll need to install the Firebase CLI using `npm i -g firebase-tools` after signing into the [Firebase Console](https://console.firebase.google.com) using a Google Account.
44
+
> [!IMPORTANT] You'll need to install the Firebase CLI using `npm i -g firebase-tools` after signing into the [Firebase Console](https://console.firebase.google.com) using a Google Account.
45
45
46
46
Using a terminal, determine and navigate to the directory for your Firebase Project. This could be `~/Projects/Docs`, etc. From there, run `firebase init` and choose `Hosting` from the menu (use **space** to select, **arrow keys** to change options and **enter** to confirm). Follow the setup instructions.
Copy file name to clipboardExpand all lines: docs/embed-files.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -75,7 +75,7 @@ Example:
75
75
76
76
If you embed the file as `iframe`, `audio` and `video`, then you may need to set the attributes of these tags.
77
77
78
-
?> Note, for the `audio` and `video` types, docsify adds the `controls` attribute by default. When you want add more attributes, the `controls` attribute need to be added manually if need be.
78
+
> [!TIP] Note, for the `audio` and `video` types, docsify adds the `controls` attribute by default. When you want add more attributes, the `controls` attribute need to be added manually if need be.
@@ -101,13 +101,13 @@ Embedding any type of source code file, you can specify the highlighted language
101
101
102
102
[](_media/example.html':include :type=code text')
103
103
104
-
?> How to set highlight? You can see [here](language-highlight.md).
104
+
> [!TIP] How to set highlight? You can see [here](language-highlight.md).
105
105
106
106
## Embed a gist
107
107
108
108
You can embed a gist as markdown content or as a code block - this is based on the approach at the start of [Embed Files](#embed-files) section, but uses a raw gist URL as the target.
109
109
110
-
?>**No** plugin or app config change is needed here to make this work. In fact, the "Embed" `script` tag that is copied from a gist will _not_ load even if you make plugin or config changes to allow an external script.
110
+
> [!TIP]**No** plugin or app config change is needed here to make this work. In fact, the "Embed" `script` tag that is copied from a gist will _not_ load even if you make plugin or config changes to allow an external script.
111
111
112
112
### Identify the gist's metadata
113
113
@@ -132,7 +132,7 @@ Here are two examples based on the sample gist:
?> Alternatively, you can get a raw URL directly clicking the _Raw_ button on a gist file. But, if you use that approach, just be sure to **remove** the revision number between `raw/` and the filename so that the URL matches the pattern above instead. Otherwise your embedded gist will **not** show the latest content when the gist is updated.
135
+
> [!TIP] Alternatively, you can get a raw URL directly clicking the _Raw_ button on a gist file. But, if you use that approach, just be sure to **remove** the revision number between `raw/` and the filename so that the URL matches the pattern above instead. Otherwise your embedded gist will **not** show the latest content when the gist is updated.
136
136
137
137
Continue with one of the sections below to embed the gist on a Docsify page.
Copy file name to clipboardExpand all lines: docs/helpers.md
+56-22Lines changed: 56 additions & 22 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,72 +6,106 @@ docsify extends Markdown syntax to make your documents more readable.
6
6
7
7
## Callouts
8
8
9
-
### Important content
9
+
Docsify supports [GitHub style](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts) callouts (also known as "admonitions" or "alerts").
10
10
11
-
Important content like:
11
+
<!-- prettier-ignore -->
12
+
> [!CAUTION]
13
+
> **Caution** callouts communicate negative potential consequences of an action.
12
14
13
-
```markdown
14
-
!> **Time** is money, my friend!
15
-
```
15
+
<!-- prettier-ignore -->
16
+
> [!IMPORTANT]
17
+
> **Important** callouts communicate information necessary for users to succeed.
16
18
17
-
is rendered as:
19
+
<!-- prettier-ignore -->
20
+
> [!NOTE]
21
+
> **Note** callouts communicate information that users should take into account.
18
22
19
-
!> **Time** is money, my friend!
23
+
<!-- prettier-ignore -->
24
+
> [!TIP]
25
+
> **Tip** callouts communicate optional information to help a user be more successful.
20
26
21
-
### Tips
27
+
<!-- prettier-ignore -->
28
+
> [!WARNING]
29
+
> **Warning** callouts communicate potential risks user should be aware of.
22
30
23
-
General tips like:
31
+
**Markdown**
24
32
33
+
<!-- prettier-ignore -->
25
34
```markdown
26
-
?> _TODO_ unit test
35
+
> [!CAUTION]
36
+
> **Caution** callouts communicate negative potential consequences of an action.
37
+
38
+
> [!IMPORTANT]
39
+
> **Important** callouts communicate information necessary for users to succeed.
40
+
41
+
> [!NOTE]
42
+
> **Note** callouts communicate information that users should take into account.
43
+
44
+
> [!TIP]
45
+
> **Tip** callouts communicate optional information to help a user be more successful.
46
+
47
+
> [!WARNING]
48
+
> **Warning** callouts communicate potential risks user should be aware of.
27
49
```
28
50
29
-
are rendered as:
51
+
### Legacy Style ⚠️
30
52
31
-
?> _TODO_ unit test
53
+
The following Docsify v4 callout syntax has been deprecated and will be removed in a future version.
54
+
55
+
!> Legacy **Important** callouts are deprecated.
56
+
57
+
?> Legacy **Tip** callouts are deprecated.
58
+
59
+
**Markdown**
60
+
61
+
```markdown
62
+
!> Legacy **Important** callouts are deprecated.
63
+
64
+
?> Legacy **Tip** callouts are deprecated.
65
+
```
32
66
33
67
## Link attributes
34
68
35
69
### disabled
36
70
37
-
```md
71
+
```markdown
38
72
[link](/demo ':disabled')
39
73
```
40
74
41
75
### href
42
76
43
77
Sometimes we will use some other relative path for the link, and we have to tell docsify that we don't need to compile this link. For example:
44
78
45
-
```md
79
+
```markdown
46
80
[link](/demo/)
47
81
```
48
82
49
83
It will be compiled to `<a href="/#/demo/">link</a>` and will load `/demo/README.md`. Maybe you want to jump to `/demo/index.html`.
50
84
51
85
Now you can do that
52
86
53
-
```md
87
+
```markdown
54
88
[link](/demo/ ':ignore')
55
89
```
56
90
57
91
You will get `<a href="/demo/">link</a>`html. Do not worry, you can still set the title for the link.
58
92
59
-
```md
93
+
```markdown
60
94
[link](/demo/ ':ignore title')
61
95
62
96
<a href="/demo/" title="title">link</a>
63
97
```
64
98
65
99
### target
66
100
67
-
```md
101
+
```markdown
68
102
[link](/demo ':target=_blank')
69
103
[link](/demo2 ':target=_self')
70
104
```
71
105
72
106
## Task lists
73
107
74
-
```md
108
+
```markdown
75
109
- [ ] foo
76
110
- bar
77
111
- [x] baz
@@ -91,7 +125,7 @@ You will get `<a href="/demo/">link</a>`html. Do not worry, you can still set th
Copy file name to clipboardExpand all lines: docs/language-highlight.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -57,7 +57,7 @@ function add(a, b) {
57
57
58
58
Support for additional [languages](https://prismjs.com/#supported-languages) is available by loading the Prism [grammar files](https://cdn.jsdelivr.net/npm/prismjs@1/components/):
59
59
60
-
!> Prism grammar files must be loaded after Docsify.
60
+
> [!IMPORTANT] Prism grammar files must be loaded after Docsify.
0 commit comments