Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 86594a3

Browse filesBrowse files
committed
feat(themes): add loading info
1 parent a6d823b commit 86594a3
Copy full SHA for 86594a3

5 files changed

+64-2Lines changed: 64 additions & 2 deletions

File tree

Expand file treeCollapse file tree
Open diff view settings
Filter options
Expand file treeCollapse file tree
Open diff view settings
Collapse file

‎docs/plugins.md‎

Copy file name to clipboardExpand all lines: docs/plugins.md
+1-1Lines changed: 1 addition & 1 deletion
  • Display the source diff
  • Display the rich diff
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ The hook supports handling asynchronous tasks.
6565
```js
6666
window.$docsify = {
6767
plugins: [
68-
function (hook) {
68+
function (hook, vm) {
6969
hook.init(function() {
7070
// Called when the script starts running, only trigger once, no arguments,
7171
})
Collapse file

‎docs/quickstart.md‎

Copy file name to clipboardExpand all lines: docs/quickstart.md
+22Lines changed: 22 additions & 0 deletions
  • Display the source diff
  • Display the rich diff
Original file line numberDiff line numberDiff line change
@@ -61,3 +61,25 @@ If your system has Python, you can easily to run a static server to preview your
6161
```bash
6262
cd docs && python -m SimpleHTTPServer 3000
6363
```
64+
65+
## Loading tip
66+
67+
Show `Loading...` Before starting rendering. You can customize the content.
68+
69+
*index.html*
70+
```html
71+
<div id="app">Please wait...</div>
72+
```
73+
74+
You should set the `data-app` attribute if you changed `el`.
75+
76+
*index.html*
77+
```html
78+
<div data-app id="main">Please wait...</div>
79+
80+
<script>
81+
window.$docsify = {
82+
el: '#main'
83+
}
84+
</script>
85+
```
Collapse file

‎docs/zh-cn/plugins.md‎

Copy file name to clipboardExpand all lines: docs/zh-cn/plugins.md
+1-1Lines changed: 1 addition & 1 deletion
  • Display the source diff
  • Display the rich diff
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ docsify 提供了一套插件机制,其中提供的钩子(hook)支持处
6161
```js
6262
window.$docsify = {
6363
plugins: [
64-
function (hook) {
64+
function (hook, vm) {
6565
hook.init(function() {
6666
// 初始化时调用,只调用一次,没有参数。
6767
})
Collapse file

‎docs/zh-cn/quickstart.md‎

Copy file name to clipboardExpand all lines: docs/zh-cn/quickstart.md
+23Lines changed: 23 additions & 0 deletions
  • Display the source diff
  • Display the rich diff
Original file line numberDiff line numberDiff line change
@@ -59,3 +59,26 @@ docsify serve docs
5959
```bash
6060
cd docs && python -m SimpleHTTPServer 3000
6161
```
62+
63+
## Loading 提示
64+
65+
初始化时会显示 `Loading...` 内容,你可以自定义提示信息。
66+
67+
*index.html*
68+
```html
69+
<div id="app">加载中</div>
70+
```
71+
72+
如果更改了 `el` 的配置,需要将该元素加上 `data-app` 属性。
73+
74+
*index.html*
75+
```html
76+
<div data-app id="main">加载中</div>
77+
78+
<script>
79+
window.$docsify = {
80+
el: '#main'
81+
}
82+
</script>
83+
```
84+
Collapse file

‎src/themes/basic/_layout.css‎

Copy file name to clipboardExpand all lines: src/themes/basic/_layout.css
+17Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,23 @@
77
-webkit-font-smoothing: antialiased;
88
}
99

10+
body:not(.ready) {
11+
[data-cloak] {
12+
display: none;
13+
}
14+
}
15+
16+
div#app {
17+
text-align: center;
18+
font-size: 30px;
19+
font-weight: lighter;
20+
margin: 40vw auto;
21+
22+
&:empty::before {
23+
content: "Loading...";
24+
}
25+
}
26+
1027
.emoji {
1128
height: 1.2em;
1229
vertical-align: middle;

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.