-
Notifications
You must be signed in to change notification settings - Fork 290
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
docs: add "Jane Theme V3 Major Update"
- Loading branch information
Showing
4 changed files
with
96 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
--- | ||
title: "Jane Theme V3 Major Update" | ||
date: 2024-09-20T16:01:23+08:00 | ||
draft: false | ||
tags: ["preview", "shortcodes", "tag-6", "update"] | ||
categories: ["docs", "shortcodes", "index"] | ||
author: "xianmin" | ||
|
||
weight: 1 | ||
--- | ||
|
||
## Update Content | ||
- Use [Pico CSS](https://picocss.com/) as the color scheme, allowing theme color switching and dark/light mode toggle. | ||
- Added STYLE SETTINGS, located at `/assets/sass/_settings.scss` . | ||
- Use [hugo-mods/icons](https://github.com/hugo-mods/icons). | ||
- Deprecated the Category page, merging it into the Archive page. | ||
|
||
Please note that due to the extensive modifications, some areas may still need refinement. I appreciate your understanding! | ||
|
||
## Personalize Your Website | ||
Copy `/assets/sass/_settings.scss` and `/assets/sass/_custom.scss` to your website's root directory (Note: maintain the same path and file names). | ||
|
||
Modify variables in `_settings.scss` and add custom styles in `/assets/sass/_custom.scss`. | ||
|
||
## Upgrading to v3 | ||
1. The new version utilizes the latest Sass language features, requiring Dart Sass installation. | ||
|
||
For installation guidance, refer to the official documentation: https://gohugo.io/hugo-pipes/transpile-sass-to-css/#dart-sass. | ||
|
||
2. As the new version uses hugo modules, please add the following to your `config.toml`: | ||
|
||
```toml | ||
# icons used by Jane, import module | ||
[module] | ||
[[module.imports]] | ||
path = 'github.com/hugomods/icons/vendors/mdi' | ||
[[module.imports]] | ||
path = 'github.com/hugomods/icons/vendors/lucide' | ||
``` | ||
|
||
Note: You may encounter compatibility issues after upgrading. If you face difficulties, please feel free to open an issue. | ||
|
||
## Development Philosophy of This Theme | ||
1. No `node_modules` - fewer dependencies make maintenance easier. | ||
2. Encourages users to modify the theme according to personal preferences for a more personalized website. | ||
3. Reading Experience is the top priority. |
48 changes: 48 additions & 0 deletions
48
exampleSite/content/post/Jane-Theme-V3-Major-Update.zh-cn.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
--- | ||
title: "Jane 主题 V3 大版本更新" | ||
date: 2024-09-20T16:01:23+08:00 | ||
draft: false | ||
tags: ["preview", "shortcodes", "tag-6", "update"] | ||
categories: ["docs", "shortcodes", "index"] | ||
author: "xianmin" | ||
|
||
weight: 1 | ||
--- | ||
|
||
## 更新内容 | ||
- 使用 [Pico CSS](https://picocss.com/) 作为配色方案,可切换主题颜色,可切换 dark / light 模式。 | ||
- 添加 STYLE SETTINGS ,位于 /assets/sass/_settings.scss ; | ||
- 使用 [hugo-mods/icons](https://github.com/hugo-mods/icons) 添加图标 ; | ||
- 弃用 Category 页面,合并到 Archive 页面。 | ||
|
||
由于修改的地方比较多,还有很多地方不完善,请您谅解! | ||
|
||
|
||
## 通过 STYLE SETTINGS 个性化你的网站 | ||
将 `/assets/sass/_settings.scss` 和 `/assets/sass/_custom.scss` 复制到你的网站根目录下(注意:路径名、文件名要一致)。 | ||
|
||
在 `_settings.scss` 中修改变量,在 `/assets/sass/_custom.scss` 中添加自定义样式。 | ||
|
||
|
||
## 从旧版本升级到 v3 | ||
1. 由于新版本使用到了 Sass 语言的最新功能,需要安装 Dart Sass 。 | ||
|
||
安装指南见官方文档: https://gohugo.io/hugo-pipes/transpile-sass-to-css/#dart-sass 。 | ||
|
||
2. 由于新版本使用到了 hugo module ,请在你的配置文件 `config.toml` 中加入以下内容: | ||
|
||
```toml | ||
# icons used by Jane, import module | ||
[module] | ||
[[module.imports]] | ||
path = 'github.com/hugomods/icons/vendors/mdi' | ||
[[module.imports]] | ||
path = 'github.com/hugomods/icons/vendors/lucide' | ||
``` | ||
|
||
注意: 升级之后可能会遇到一些兼容性问题。如果遇到困难,欢迎提 issue。 | ||
|
||
## 这个主题的开发理念 | ||
1. 没有 `node_modules` ,越少的依赖越容易维护; | ||
2. 鼓励使用者按照个人喜好修改主题,让网站更个性化; | ||
3. 阅读体验始终是最重要的; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters