hexo-theme-particlex 2.5.7 → 2.5.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (5) hide show
  1. package/README.md +282 -276
  2. package/_config.yml +4 -6
  3. package/layout/index.ejs +5 -3
  4. package/package.json +2 -2
  5. package/source/css/main.css +1 -1
package/README.md CHANGED
@@ -8,15 +8,15 @@
8
8
 
9
9
  > 目前有 Full、Night 和 Maiden **两个**主题样式
10
10
 
11
- 虽然更改后只有一种了，如果你想改颜色就在 `particlex.css` 里 `Ctrl+F` 替换吧
11
+ 虽然更改后只有一种了，如果你想改颜色就在 `main.css` 里替换吧
12
12
 
13
- ## 演示
13
+ # 1. 演示
14
14
 
15
15
  - [GitHub Pages](https://argvchs.github.io)
16
16
  - [Netlify](https://argvchs.netlify.app)
17
17
  - [Vercel](https://argvchs.vercel.app)
18
18
 
19
- ## 安装
19
+ # 2. 安装
20
20
 
21
21
  ```bash
22
22
  cd themes
@@ -29,319 +29,325 @@ git clone https://github.com/argvchs/hexo-theme-particlex.git particlex --depth=
29
29
  theme: particlex
30
30
  ```
31
31
 
32
- - 关闭自带 Highlight
32
+ ## 2.1. 关闭自带代码高亮
33
33
 
34
- Hexo 有自带的 Highlight，但是和 ParticleX 的 Highlight 不兼容
34
+ Hexo 有自带的代码高亮，但是和 ParticleX 的不兼容
35
35
 
36
- ```yaml
37
- highlight:
38
- enable: false
39
- prismjs:
40
- enable: false
41
- ```
36
+ ```yaml
37
+ highlight:
38
+ enable: false
39
+ prismjs:
40
+ enable: false
41
+ ```
42
42
 
43
- 如果使用 Pandoc 还需要设置一下
43
+ 如果使用 Pandoc 还需要设置一下
44
44
 
45
- ```yaml
46
- pandoc:
47
- extra:
48
- - no-highlight:
49
- ```
45
+ ```yaml
46
+ pandoc:
47
+ extra:
48
+ - no-highlight:
49
+ ```
50
50
 
51
- - 禁用年度月度归档
51
+ ## 2.2. 禁用年度月度归档
52
52
 
53
- Hexo 会自动生成年度月度归档，可是 ParticleX 主题没有这个功能 ~~我太懒了~~
53
+ Hexo 会自动生成年度月度归档，可是 ParticleX 主题没有这个功能 ~~我太懒了~~
54
54
 
55
- ```yaml
56
- archive_generator:
57
- enabled: true
58
- per_page: 0
59
- yearly: false
60
- monthly: false
61
- daily: false
62
- ```
55
+ ```yaml
56
+ archive_generator:
57
+ enabled: true
58
+ per_page: 0
59
+ yearly: false
60
+ monthly: false
61
+ daily: false
62
+ ```
63
63
 
64
64
  修改完请 `hexo cl` 清除缓存
65
65
 
66
- ## 配置
66
+ # 3. 配置
67
+
68
+ ## 3.1. 基本配置
67
69
 
68
70
  ```yaml
69
71
  # Avatar image
70
72
  avatar: /images/avatar.jpg
71
73
 
72
- # Home page info block
73
- headBlockEnable: true
74
-
75
74
  # Home page background image
76
- background: /images/background.jpg
75
+ background:
76
+ - /images/background.jpg
77
77
  ```
78
78
 
79
- 其中 Background 可以是一个列表，打开时会随机加载一个背景
80
-
81
- - 导航栏
82
-
83
- 为了方便，主题使用的图标是 Font Awesome 6 图标
84
-
85
- ```yaml
86
- # ParticleX theme icon is adopts the Font Awesome 6
87
- # https://fontawesome.com
88
-
89
- # Main menu navigation
90
- menu:
91
- Home:
92
- name: house
93
- theme: solid
94
- link: /
95
- About:
96
- name: id-card
97
- theme: solid
98
- link: /about
99
- Archives:
100
- name: box-archive
101
- theme: solid
102
- link: /archives
103
- Categories:
104
- name: bookmark
105
- theme: solid
106
- link: /categories
107
- Tags:
108
- name: tags
109
- theme: solid
110
- link: /tags
111
- ```
112
-
113
- - 主页信息卡片
114
-
115
- `description` 支持 Markdown 格式
116
-
117
- 图标链接配置和导航栏配置相同
118
-
119
- **如果图标链接或友链为空，请在 `iconLinks:` 或 `friendLinks:` 后添加一个 `{}`**
120
-
121
- ```yaml
122
- # Side info card
123
- card:
124
- enable: true
125
- description: |
126
- Description
127
- ...
128
- iconLinks:
129
- {}
130
- friendLinks:
131
- Argvchs: https://argvchs.netlify.app
132
- ```
133
-
134
- - 页脚
135
-
136
- 考虑到博客部署在服务器并使用自己域名的情况，按规定需要在网站下边添加备案消息
137
-
138
- 如没有需要显示备案消息的可以关闭
139
-
140
- ```yaml
141
- # Footer info
142
- footer:
143
- since: 2022
144
- # Customize the server domain name ICP
145
- ICP:
146
- enable: false
147
- code:
148
- link:
149
- ```
150
-
151
- - Polyfill
152
-
153
- 使用 [Polyfill.io](https://polyfill.io) 自动根据 UA 处理新的 JS API 兼容
154
-
155
- 可以配合 [Hexo-Babel](https://github.com/argvchs/hexo-babel) 插件处理 JS 语法兼容
156
-
157
- ```yaml
158
- # Polyfill
159
- # https://polyfill.io
160
- polyfill:
161
- enable: true
162
- features:
163
- - default
164
- ```
165
-
166
- - 代码高亮
167
-
168
- 使用 Highlight.js 代码高亮
169
-
170
- 样式可以在[这里](https://highlightjs.org/static/demo)选择，默认为 GitHub
171
-
172
- ```yaml
173
- # Highlight.js
174
- # https://highlightjs.org
175
- highlight:
176
- enable: true
177
- style: github
178
- ```
179
-
180
- - 数学渲染
181
-
182
- 使用 KaTeX 渲染数学公式
183
-
184
- ```yaml
185
- # Rendering math with KaTeX
186
- math:
187
- enable: false
188
- ```
79
+ 其中 Background 是一个列表，打开时会随机加载一个背景
189
80
 
190
- - 图片预览
81
+ ## 3.2. 内容配置
191
82
 
192
- 简单的点击图片放大缩小的预览
83
+ ### 3.2.1. 导航栏
193
84
 
194
- ```yaml
195
- # Image Preview
196
- preview:
197
- enable: true
198
- ```
85
+ 为了方便，主题使用的图标是 Font Awesome 6 图标
199
86
 
200
- - 文章缩略
87
+ ```yaml
88
+ # ParticleX theme icon is adopts the Font Awesome 6
89
+ # https://fontawesome.com
90
+
91
+ # Main menu navigation
92
+ menu:
93
+ Home:
94
+ name: house
95
+ theme: solid
96
+ link: /
97
+ About:
98
+ name: id-card
99
+ theme: solid
100
+ link: /about
101
+ Archives:
102
+ name: box-archive
103
+ theme: solid
104
+ link: /archives
105
+ Categories:
106
+ name: bookmark
107
+ theme: solid
108
+ link: /categories
109
+ Tags:
110
+ name: tags
111
+ theme: solid
112
+ link: /tags
113
+ ```
201
114
 
202
- 一般来说，缩略展示文档只需要在文档中添加 `<!-- more -->` 即可，缩略内容在显示全文中也会出现
115
+ ### 3.2.2. 主页信息卡片
203
116
 
204
- 但考虑到不想把缩略内容放在正文里，就添加了此参数，在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置
117
+ `description` 支持 Markdown 格式
205
118
 
206
- 支持 Markdown 格式
119
+ 图标链接配置和导航栏配置相同
207
120
 
208
- ```yaml
209
- description: |
210
- Normal _Italic_ **Strong**
211
- ```
121
+ **如果图标链接或友链为空，请在 `iconLinks:` 或 `friendLinks:` 后添加一个 `{}`**
212
122
 
213
- - 文章置顶
123
+ ```yaml
124
+ # Side info card
125
+ card:
126
+ enable: true
127
+ description: |
128
+ Description
129
+ ...
130
+ iconLinks:
131
+ {}
132
+ friendLinks:
133
+ Argvchs: https://argvchs.netlify.app
134
+ ```
214
135
 
215
- 在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置 `pinned` 作为置顶参数，越大越靠前，默认为 0
136
+ ### 3.2.3. 页脚
216
137
 
217
- - 文章加密
138
+ 考虑到博客部署在服务器并使用自己域名的情况，按规定需要在网站下边添加备案消息
218
139
 
219
- 使用 AES 加密算法，在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置 `secret` 作为密码，**使用请安装插件 [Hexo-Helper-Crypto](https://github.com/argvchs/hexo-helper-crypto)**
140
+ 如没有需要显示备案消息的可以关闭
220
141
 
221
- ```yaml
222
- # Article encryption
223
- crypto:
142
+ ```yaml
143
+ # Footer info
144
+ footer:
145
+ since: 2022
146
+ # Customize the server domain name ICP
147
+ ICP:
224
148
  enable: false
225
- ```
149
+ code:
150
+ link:
151
+ ```
226
152
 
227
- - 搜索
153
+ ## 3.3. 功能配置
228
154
 
229
- 嵌入到 Archives 中的搜索
155
+ ### 3.3.1. Polyfill
230
156
 
231
- 目前只支持搜索文档标题（我太弱了）
157
+ 使用 [Polyfill.io](https://polyfill.io) 自动根据 UA 处理新的 JS API 兼容
232
158
 
233
- ```yaml
234
- # Search
235
- search:
236
- enable: false
237
- ```
159
+ 可以配合 [Hexo-Babel](https://github.com/argvchs/hexo-babel) 插件处理 JS 语法兼容
238
160
 
239
- - Giscus
161
+ ```yaml
162
+ # Polyfill
163
+ # https://polyfill.io
164
+ polyfill:
165
+ enable: true
166
+ features:
167
+ - default
168
+ ```
240
169
 
241
- Giscus 是一个由 GitHub Discussions 支持的评论系统
170
+ ### 3.3.2. 代码高亮
242
171
 
243
- 在 [Giscus.app](https://giscus.app) 设置好各项后，会在下面生成一个 `<script>` 标签，在主题内填入即可
172
+ 使用 Highlight.js 代码高亮
244
173
 
245
- ```yaml
246
- # Giscus
247
- # https://github.com/giscus/giscus
248
- giscus:
249
- enable: false
250
- src: https://giscus.app/client.js
251
- repo:
252
- repoID:
253
- category:
254
- categoryID:
255
- mapping: pathname
256
- strict: 0
257
- reactionsEnabled: 1
258
- emitMetadata: 0
259
- inputPosition: bottom
260
- theme: preferred_color_scheme
261
- lang: zh-CN
262
- ```
263
-
264
- - Gitalk
265
-
266
- Gitalk 是一个基于 GitHub Issue 和 Preact 的评论系统
267
-
268
- 考虑到博客可能部署到多个网站同步评论，但 OAuth APP 只能有一个回调 URL，所以添加了 `sites` 参数用于多个网站的评论
269
-
270
- **同样如果没有其他网站，请在 `sites:` 后添加一个 `{}`**
271
-
272
- 由于 Gitalk 官方 CORS 代理用的是 Cloudflare，速度过慢，添加了 `proxy` 参数，搭建 CORS 代理可以看[这篇文章](https://argvchs.github.io/2022/07/04/build-cors-anywhere)
273
-
274
- ```yaml
275
- # Gitalk
276
- # https://github.com/gitalk/gitalk
277
- gitalk:
278
- enable: false
279
- clientID: # Default ClientID
280
- clientSecret: # Default ClientSecret
281
- repo: # The name of repository of store comments
282
- owner: # GitHub repo owner
283
- admin: # GitHub repo owner and collaborators, only these guys can initialize github issues
284
- language: zh-CN # en, zh-CN, zh-TW, es-ES, fr, ru, de, pl and ko are currently available
285
- proxy: # CORS proxy
286
- sites: # Sites
287
- {}
288
- # www.example.com:
289
- # clientID:
290
- # clientSecret:
291
- ```
292
-
293
- - Waline
294
-
295
- Waline 是一个简单、安全的评论系统
296
-
297
- 详见：[在 ParticleX 上使用 Waline | Yuzi's Blog](https://blog.yuzi.dev/posts/bcb4ff00.html)
298
-
299
- **注意如果不需要 `locale` 参数，请在 `locale:` 后添加一个 `{}`**
300
-
301
- ```yaml
302
- # Waline
303
- # https://github.com/walinejs/waline
304
- waline:
305
- enable: false
306
- serverURL: # Waline server address url, you should set this to your own link
307
- locale: # Locale: https://waline.js.org/guide/client/i18n.html#locale-option
308
- {}
309
- commentCount: true # If false, comment count will only be displayed in post page, not in home page
310
- pageview: false # Pageviews count, Note: You should not enable both `waline.pageview` and `leancloud_visitors`
311
- emoji: # Custom emoji
312
- - https://unpkg.com/@waline/emojis@1.2.0/weibo
313
- - https://unpkg.com/@waline/emojis@1.2.0/alus
314
- - https://unpkg.com/@waline/emojis@1.2.0/bilibili
315
- - https://unpkg.com/@waline/emojis@1.2.0/qq
316
- - https://unpkg.com/@waline/emojis@1.2.0/tieba
317
- - https://unpkg.com/@waline/emojis@1.2.0/tw-emoji
318
- meta: # Comment information, valid meta are nick, mail and link
319
- - nick
320
- - mail
321
- - link
322
- requiredMeta: # Set required meta field, e.g.: [nick] | [nick, mail]
323
- - nick
324
- lang: zh-CN # Language, available values: en-US, zh-CN, zh-TW, pt-BR, ru-RU, jp-JP
325
- wordLimit: 0 # Word limit, no limit when setting to 0
326
- login: enable # Whether enable login, can choose from 'enable', 'disable' and 'force'
327
- pageSize: 10 # Comment per page
328
- ```
329
-
330
- - Twikoo
331
-
332
- Twikoo 是一个一个简洁、安全、免费的静态网站评论系统
333
-
334
- ```yaml
335
- # Twikoo
336
- # https://github.com/imaegoo/twikoo
337
- twikoo:
338
- enable: false
339
- envID:
340
- region:
341
- path: location.pathname
342
- lang: zh-CN
343
- ```
174
+ 样式可以在[这里](https://highlightjs.org/static/demo)选择，默认为 GitHub
175
+
176
+ ```yaml
177
+ # Highlight.js
178
+ # https://highlightjs.org
179
+ highlight:
180
+ enable: true
181
+ style: github
182
+ ```
183
+
184
+ ### 3.3.3. 数学渲染
185
+
186
+ 使用 KaTeX 渲染数学公式
187
+
188
+ ```yaml
189
+ # KaTeX math rendering
190
+ math:
191
+ enable: false
192
+ ```
193
+
194
+ ### 3.3.4. 图片预览
195
+
196
+ 简单的点击图片放大缩小的预览
197
+
198
+ ```yaml
199
+ # Image preview
200
+ preview:
201
+ enable: true
202
+ ```
203
+
204
+ ### 3.3.5. 文章缩略
205
+
206
+ 一般来说，缩略展示文档只需要在文档中添加 `<!-- more -->` 即可，缩略内容在显示全文中也会出现
207
+
208
+ 但考虑到不想把缩略内容放在正文里，就添加了此参数，在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置
209
+
210
+ 支持 Markdown 格式
211
+
212
+ ```yaml
213
+ description: |
214
+ Normal _Italic_ **Strong**
215
+ ```
216
+
217
+ ### 3.3.6. 文章置顶
218
+
219
+ 在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置 `pinned` 作为置顶参数，越大越靠前，默认为 0
220
+
221
+ ### 3.3.7. 文章加密
222
+
223
+ 使用 AES 加密算法，在 [Front-Matter](https://hexo.io/zh-cn/docs/front-matter) 里设置 `secret` 作为密码，**使用请安装插件 [Hexo-Helper-Crypto](https://github.com/argvchs/hexo-helper-crypto)**
224
+
225
+ ```yaml
226
+ # Article encryption
227
+ crypto:
228
+ enable: false
229
+ ```
230
+
231
+ ### 3.3.8. 搜索
232
+
233
+ 嵌入到 Archives 中的搜索
234
+
235
+ 目前只支持搜索文档标题
236
+
237
+ ```yaml
238
+ # Search
239
+ search:
240
+ enable: false
241
+ ```
242
+
243
+ ## 3.4. 评论配置
244
+
245
+ ### 3.4.1. Giscus
246
+
247
+ Giscus 是一个由 GitHub Discussions 支持的评论系统
248
+
249
+ 在 [Giscus.app](https://giscus.app) 设置好各项后，会在下面生成一个 `<script>` 标签，在主题内填入即可
250
+
251
+ ```yaml
252
+ # Giscus
253
+ # https://github.com/giscus/giscus
254
+ giscus:
255
+ enable: false
256
+ src: https://giscus.app/client.js
257
+ repo:
258
+ repoID:
259
+ category:
260
+ categoryID:
261
+ mapping: pathname
262
+ strict: 0
263
+ reactionsEnabled: 1
264
+ emitMetadata: 0
265
+ inputPosition: bottom
266
+ theme: preferred_color_scheme
267
+ lang: zh-CN
268
+ ```
269
+
270
+ ### 3.4.2. Gitalk
271
+
272
+ Gitalk 是一个基于 GitHub Issue 和 Preact 的评论系统
273
+
274
+ 考虑到博客可能部署到多个网站同步评论，但 OAuth APP 只能有一个回调 URL，所以添加了 `sites` 参数用于多个网站的评论
275
+
276
+ **同样如果没有其他网站，请在 `sites:` 后添加一个 `{}`**
277
+
278
+ 由于 Gitalk 官方 CORS 代理用的是 Cloudflare，速度过慢，添加了 `proxy` 参数，搭建 CORS 代理可以看[这篇文章](https://argvchs.netlify.app/2022/07/04/build-cors-anywhere)
279
+
280
+ ```yaml
281
+ # Gitalk
282
+ # https://github.com/gitalk/gitalk
283
+ gitalk:
284
+ enable: false
285
+ clientID: # Default ClientID
286
+ clientSecret: # Default ClientSecret
287
+ repo: # The name of repository of store comments
288
+ owner: # GitHub repo owner
289
+ admin: # GitHub repo owner and collaborators, only these guys can initialize github issues
290
+ language: zh-CN # en, zh-CN, zh-TW, es-ES, fr, ru, de, pl and ko are currently available
291
+ proxy: # CORS proxy
292
+ sites: # Sites
293
+ {}
294
+ # www.example.com:
295
+ # clientID:
296
+ # clientSecret:
297
+ ```
298
+
299
+ ### 3.4.3. Waline
300
+
301
+ Waline 是一个简单、安全的评论系统
302
+
303
+ 详见：[在 ParticleX 上使用 Waline | Yuzi's Blog](https://blog.yuzi.dev/posts/bcb4ff00.html)
304
+
305
+ **注意如果不需要 `locale` 参数，请在 `locale:` 后添加一个 `{}`**
306
+
307
+ ```yaml
308
+ # Waline
309
+ # https://github.com/walinejs/waline
310
+ waline:
311
+ enable: false
312
+ serverURL: # Waline server address url, you should set this to your own link
313
+ locale: # Locale: https://waline.js.org/guide/client/i18n.html#locale-option
314
+ {}
315
+ commentCount: true # If false, comment count will only be displayed in post page, not in home page
316
+ pageview: false # Pageviews count, Note: You should not enable both `waline.pageview` and `leancloud_visitors`
317
+ emoji: # Custom emoji
318
+ - https://unpkg.com/@waline/emojis@1.2.0/weibo
319
+ - https://unpkg.com/@waline/emojis@1.2.0/alus
320
+ - https://unpkg.com/@waline/emojis@1.2.0/bilibili
321
+ - https://unpkg.com/@waline/emojis@1.2.0/qq
322
+ - https://unpkg.com/@waline/emojis@1.2.0/tieba
323
+ - https://unpkg.com/@waline/emojis@1.2.0/tw-emoji
324
+ meta: # Comment information, valid meta are nick, mail and link
325
+ - nick
326
+ - mail
327
+ - link
328
+ requiredMeta: # Set required meta field, e.g.: [nick] | [nick, mail]
329
+ - nick
330
+ lang: zh-CN # Language, available values: en-US, zh-CN, zh-TW, pt-BR, ru-RU, jp-JP
331
+ wordLimit: 0 # Word limit, no limit when setting to 0
332
+ login: enable # Whether enable login, can choose from 'enable', 'disable' and 'force'
333
+ pageSize: 10 # Comment per page
334
+ ```
335
+
336
+ ### 3.4.4. Twikoo
337
+
338
+ Twikoo 是一个一个简洁、安全、免费的静态网站评论系统
339
+
340
+ ```yaml
341
+ # Twikoo
342
+ # https://github.com/imaegoo/twikoo
343
+ twikoo:
344
+ enable: false
345
+ envID:
346
+ region:
347
+ path: location.pathname
348
+ lang: zh-CN
349
+ ```
344
350
 
345
- ## 写在最后
351
+ # 4. 写在最后
346
352
 
347
353
  本项目采用 MIT 开源许可证，欢迎大家贡献，你可以随意打开一个 Issue 来进行提问，有任何改进想法都可以进行 Fork，期待您的 Pull Request！
package/_config.yml CHANGED
@@ -4,11 +4,9 @@
4
4
  # Avatar image
5
5
  avatar: /images/avatar.jpg
6
6
 
7
- # Home page info block
8
- headBlockEnable: true
9
-
10
7
  # Home page background image
11
- background: /images/background.jpg
8
+ background:
9
+ - /images/background.jpg
12
10
 
13
11
  # ParticleX theme icon is adopts the Font Awesome 6
14
12
  # https://fontawesome.com
@@ -69,11 +67,11 @@ highlight:
69
67
  enable: true
70
68
  style: github
71
69
 
72
- # Rendering math with KaTeX
70
+ # KaTeX math rendering
73
71
  math:
74
72
  enable: false
75
73
 
76
- # Image Preview
74
+ # Image preview
77
75
  preview:
78
76
  enable: true
79
77
 
package/layout/index.ejs CHANGED
@@ -1,6 +1,9 @@
1
1
  <div id="home-head">
2
- <div id="home-background" ref="homeBackground" data-image="<%- url_for(theme.background) %>"></div>
3
- <% if (theme.headBlockEnable) { %>
2
+ <div
3
+ id="home-background"
4
+ ref="homeBackground"
5
+ data-image="<%- theme.background.map(i => url_for(i)) %>"
6
+ ></div>
4
7
  <div id="home-info" @click="homeClick">
5
8
  <span class="loop"></span>
6
9
  <span class="loop"></span>
@@ -14,7 +17,6 @@
14
17
  </div>
15
18
  </span>
16
19
  </div>
17
- <% } %>
18
20
  </div>
19
21
  <div id="home-posts-wrap" <%- theme.card.enable ? "" : 'class="home-posts-wrap-no-card"' %> ref="homePostsWrap">
20
22
  <div id="home-posts">
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hexo-theme-particlex",
3
- "version": "2.5.7",
3
+ "version": "2.5.8",
4
4
  "description": "A concise Hexo theme, based on Particle.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -21,7 +21,7 @@
21
21
  },
22
22
  "homepage": "https://github.com/argvchs/hexo-theme-particlex#readme",
23
23
  "dependencies": {
24
- "hexo-helper-crypto": "^1.1.0",
24
+ "hexo-helper-crypto": "^1.1.2",
25
25
  "hexo-renderer-ejs": "^2.0.0"
26
26
  },
27
27
  "scripts": {
package/source/css/main.css CHANGED
@@ -363,8 +363,8 @@
363
363
  width: 50vmin;
364
364
  }
365
365
  #main {
366
+ display: grid;
366
367
  margin-right: calc(100% - 100vw);
367
- overflow: auto;
368
368
  }
369
369
  #menu {
370
370
  background: #92cafa;