From 41bf52b3f426ec13e80444283745b70c38e1b584 Mon Sep 17 00:00:00 2001 From: Chen Xianmin Date: Fri, 20 Sep 2024 18:05:33 +0800 Subject: [PATCH] docs: add "Jane Theme V3 Major Update" --- .../post/Jane-Theme-V3-Major-Update.md | 46 ++++++++++++++++++ .../post/Jane-Theme-V3-Major-Update.zh-cn.md | 48 +++++++++++++++++++ .../content/post/jane-theme-preview.md | 2 +- .../content/post/jane-theme-preview.zh-cn.md | 2 +- 4 files changed, 96 insertions(+), 2 deletions(-) create mode 100644 exampleSite/content/post/Jane-Theme-V3-Major-Update.md create mode 100644 exampleSite/content/post/Jane-Theme-V3-Major-Update.zh-cn.md diff --git a/exampleSite/content/post/Jane-Theme-V3-Major-Update.md b/exampleSite/content/post/Jane-Theme-V3-Major-Update.md new file mode 100644 index 00000000..c5d74fb4 --- /dev/null +++ b/exampleSite/content/post/Jane-Theme-V3-Major-Update.md @@ -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. diff --git a/exampleSite/content/post/Jane-Theme-V3-Major-Update.zh-cn.md b/exampleSite/content/post/Jane-Theme-V3-Major-Update.zh-cn.md new file mode 100644 index 00000000..0c2ea580 --- /dev/null +++ b/exampleSite/content/post/Jane-Theme-V3-Major-Update.zh-cn.md @@ -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. 阅读体验始终是最重要的； diff --git a/exampleSite/content/post/jane-theme-preview.md b/exampleSite/content/post/jane-theme-preview.md index 9d79bf25..c522d4ab 100644 --- a/exampleSite/content/post/jane-theme-preview.md +++ b/exampleSite/content/post/jane-theme-preview.md @@ -7,7 +7,7 @@ tags: ["preview", "shortcodes", "tag-6"] categories: ["docs", "shortcodes", "index"] author: "Typora" -weight: 1 +weight: 2 # You can also close(false) or open(true) something for this content. # P.S. comment can only be closed diff --git a/exampleSite/content/post/jane-theme-preview.zh-cn.md b/exampleSite/content/post/jane-theme-preview.zh-cn.md index 09226c85..1e973753 100644 --- a/exampleSite/content/post/jane-theme-preview.zh-cn.md +++ b/exampleSite/content/post/jane-theme-preview.zh-cn.md @@ -7,7 +7,7 @@ tags: ["preview", "shortcodes", "tag-6"] categories: ["shortcodes", "index"] author: "Typora" -weight: 1 +weight: 2 # You can also close(false) or open(true) something for this content. # P.S. comment can only be closed