From f605e6dc8999d6691424d697b80faf67906d8b58 Mon Sep 17 00:00:00 2001 From: Jerry Date: Sun, 16 Feb 2025 20:38:17 +0800 Subject: [PATCH] update --- .DS_Store | Bin 0 -> 6148 bytes .github/ISSUE_TEMPLATE/bug_report.yml | 164 +- .github/ISSUE_TEMPLATE/config.yml | 36 +- .github/ISSUE_TEMPLATE/feature_request.yml | 26 +- .github/workflows/publish.yml | 36 +- .github/workflows/stale.yml | 36 +- LICENSE | 402 +-- README.md | 234 +- README_CN.md | 234 +- _config.yml | 2212 ++++++++--------- languages/default.yml | 242 +- languages/en.yml | 242 +- languages/ja.yml | 242 +- languages/ko.yml | 242 +- languages/zh-CN.yml | 244 +- languages/zh-HK.yml | 242 +- languages/zh-TW.yml | 242 +- layout/archive.pug | 14 +- layout/category.pug | 22 +- layout/includes/additional-js.pug | 112 +- layout/includes/footer.pug | 35 +- layout/includes/head.pug | 154 +- layout/includes/head/Open_Graph.pug | 32 +- layout/includes/head/analytics.pug | 66 +- layout/includes/head/config.pug | 252 +- layout/includes/head/config_site.pug | 50 +- layout/includes/head/google_adsense.pug | 16 +- layout/includes/head/preconnect.pug | 68 +- layout/includes/head/pwa.pug | 26 +- layout/includes/head/site_verification.pug | 4 +- layout/includes/header/index.pug | 102 +- layout/includes/header/menu_item.pug | 52 +- layout/includes/header/nav.pug | 42 +- layout/includes/header/post-info.pug | 296 +-- layout/includes/header/social.pug | 14 +- layout/includes/layout.pug | 72 +- layout/includes/loading/fullpage-loading.pug | 64 +- layout/includes/loading/index.pug | 8 +- layout/includes/loading/pace.pug | 22 +- layout/includes/mixins/article-sort.pug | 44 +- layout/includes/mixins/indexPostUI.pug | 230 +- layout/includes/page/404.pug | 16 +- layout/includes/page/default-page.pug | 2 +- layout/includes/page/flink.pug | 164 +- layout/includes/page/shuoshuo.pug | 374 +-- layout/includes/page/tags.pug | 2 +- layout/includes/pagination.pug | 72 +- layout/includes/post/outdate-notice.pug | 14 +- layout/includes/post/post-copyright.pug | 44 +- layout/includes/post/reward.pug | 22 +- layout/includes/rightside.pug | 120 +- layout/includes/sidebar.pug | 34 +- layout/includes/third-party/abcjs/abcjs.pug | 32 +- layout/includes/third-party/abcjs/index.pug | 6 +- layout/includes/third-party/aplayer.pug | 46 +- .../third-party/card-post-count/artalk.pug | 60 +- .../third-party/card-post-count/disqus.pug | 50 +- .../third-party/card-post-count/fb.pug | 36 +- .../third-party/card-post-count/index.pug | 30 +- .../third-party/card-post-count/remark42.pug | 34 +- .../third-party/card-post-count/twikoo.pug | 72 +- .../third-party/card-post-count/valine.pug | 40 +- .../third-party/card-post-count/waline.pug | 42 +- layout/includes/third-party/chat/chatra.pug | 76 +- layout/includes/third-party/chat/crisp.pug | 62 +- layout/includes/third-party/chat/index.pug | 12 +- layout/includes/third-party/chat/tidio.pug | 90 +- .../includes/third-party/comments/artalk.pug | 144 +- .../includes/third-party/comments/disqus.pug | 160 +- .../third-party/comments/disqusjs.pug | 172 +- .../comments/facebook_comments.pug | 128 +- .../includes/third-party/comments/giscus.pug | 164 +- .../includes/third-party/comments/gitalk.pug | 128 +- .../includes/third-party/comments/index.pug | 92 +- layout/includes/third-party/comments/js.pug | 50 +- .../includes/third-party/comments/livere.pug | 92 +- .../third-party/comments/remark42.pug | 154 +- .../includes/third-party/comments/twikoo.pug | 126 +- .../third-party/comments/utterances.pug | 124 +- .../includes/third-party/comments/valine.pug | 118 +- .../includes/third-party/comments/waline.pug | 122 +- layout/includes/third-party/effect.pug | 68 +- layout/includes/third-party/math/chartjs.pug | 182 +- layout/includes/third-party/math/index.pug | 26 +- layout/includes/third-party/math/katex.pug | 30 +- layout/includes/third-party/math/mathjax.pug | 92 +- layout/includes/third-party/math/mermaid.pug | 100 +- .../third-party/newest-comments/artalk.pug | 132 +- .../third-party/newest-comments/common.pug | 120 +- .../newest-comments/disqus-comment.pug | 68 +- .../newest-comments/github-issues.pug | 124 +- .../third-party/newest-comments/index.pug | 66 +- .../third-party/newest-comments/remark42.pug | 62 +- .../newest-comments/twikoo-comment.pug | 90 +- .../third-party/newest-comments/valine.pug | 102 +- .../third-party/newest-comments/waline.pug | 64 +- layout/includes/third-party/pjax.pug | 126 +- layout/includes/third-party/prismjs.pug | 44 +- .../includes/third-party/search/algolia.pug | 42 +- .../includes/third-party/search/docsearch.pug | 58 +- layout/includes/third-party/search/index.pug | 12 +- .../third-party/search/local-search.pug | 42 +- .../includes/third-party/share/addtoany.pug | 20 +- layout/includes/third-party/share/index.pug | 16 +- .../includes/third-party/share/share-js.pug | 6 +- layout/includes/third-party/subtitle.pug | 184 +- .../includes/third-party/umami_analytics.pug | 128 +- layout/includes/widget/card_ad.pug | 6 +- layout/includes/widget/card_announcement.pug | 10 +- layout/includes/widget/card_archives.pug | 14 +- layout/includes/widget/card_author.pug | 52 +- layout/includes/widget/card_bottom_self.pug | 18 +- layout/includes/widget/card_categories.pug | 8 +- .../includes/widget/card_newest_comment.pug | 14 +- layout/includes/widget/card_post_series.pug | 42 +- layout/includes/widget/card_post_toc.pug | 28 +- layout/includes/widget/card_recent_post.pug | 52 +- layout/includes/widget/card_tags.pug | 28 +- layout/includes/widget/card_top_self.pug | 14 +- layout/includes/widget/card_webinfo.pug | 86 +- layout/includes/widget/index.pug | 70 +- layout/index.pug | 8 +- layout/page.pug | 62 +- layout/post.pug | 70 +- layout/tag.pug | 22 +- package.json | 64 +- plugins.yml | 422 ++-- scripts/common/postDesc.js | 72 +- scripts/events/404.js | 40 +- scripts/events/cdn.js | 194 +- scripts/events/comment.js | 48 +- scripts/events/init.js | 40 +- scripts/events/merge_config.js | 1166 ++++----- scripts/events/stylus.js | 48 +- scripts/events/welcome.js | 26 +- scripts/filters/post_lazyload.js | 62 +- scripts/filters/random_cover.js | 164 +- scripts/helpers/aside_archives.js | 236 +- scripts/helpers/aside_categories.js | 162 +- scripts/helpers/getArchiveLength.js | 90 +- scripts/helpers/inject_head_js.js | 310 +-- scripts/helpers/page.js | 299 +-- scripts/helpers/related_post.js | 194 +- scripts/helpers/series.js | 44 +- scripts/tag/button.js | 42 +- scripts/tag/chartjs.js | 98 +- scripts/tag/flink.js | 68 +- scripts/tag/gallery.js | 152 +- scripts/tag/hide.js | 102 +- scripts/tag/inlineImg.js | 38 +- scripts/tag/label.js | 28 +- scripts/tag/mermaid.js | 34 +- scripts/tag/note.js | 54 +- scripts/tag/score.js | 44 +- scripts/tag/series.js | 126 +- scripts/tag/tabs.js | 102 +- scripts/tag/timeline.js | 100 +- source/css/_global/function.styl | 560 ++--- source/css/_global/index.styl | 448 ++-- source/css/_highlight/highlight.styl | 560 ++--- source/css/_highlight/highlight/diff.styl | 162 +- source/css/_highlight/highlight/index.styl | 78 +- source/css/_highlight/prismjs/diff.styl | 602 ++--- source/css/_highlight/prismjs/index.styl | 48 +- .../css/_highlight/prismjs/line-number.styl | 84 +- source/css/_highlight/theme.styl | 242 +- source/css/_layout/aside.styl | 848 +++---- source/css/_layout/chat.styl | 16 +- source/css/_layout/comments.styl | 160 +- source/css/_layout/footer.styl | 70 +- source/css/_layout/head.styl | 874 +++---- source/css/_layout/loading.styl | 190 +- source/css/_layout/pagination.styl | 210 +- source/css/_layout/post.styl | 528 ++-- source/css/_layout/relatedposts.styl | 60 +- source/css/_layout/reward.styl | 156 +- source/css/_layout/rightside.styl | 144 +- source/css/_layout/sidebar.styl | 154 +- source/css/_layout/third-party.styl | 372 +-- source/css/_mode/darkmode.styl | 318 +-- source/css/_mode/readmode.styl | 370 +-- source/css/_page/404.styl | 130 +- source/css/_page/archives.styl | 230 +- source/css/_page/categories.styl | 74 +- source/css/_page/common.styl | 120 +- source/css/_page/flink.styl | 172 +- source/css/_page/homepage.styl | 346 +-- source/css/_page/shuoshuo.styl | 156 +- source/css/_page/tags.styl | 54 +- source/css/_search/algolia.styl | 184 +- source/css/_search/index.styl | 110 +- source/css/_search/local-search.styl | 112 +- source/css/_tags/button.styl | 112 +- source/css/_tags/gallery.styl | 436 ++-- source/css/_tags/hexo.styl | 60 +- source/css/_tags/hide.styl | 96 +- source/css/_tags/inlineImg.styl | 10 +- source/css/_tags/label.styl | 22 +- source/css/_tags/note.styl | 248 +- source/css/_tags/series.styl | 8 +- source/css/_tags/tabs.styl | 154 +- source/css/_tags/timeline.styl | 134 +- source/css/_third-party/normalize.min.css | 358 +-- source/css/index.styl | 28 +- source/css/var.styl | 372 +-- source/js/main.js | 1860 +++++++------- source/js/search/algolia.js | 348 +-- source/js/search/local-search.js | 720 +++--- source/js/tw_cn.js | 234 +- source/js/utils.js | 626 ++--- 210 files changed, 16126 insertions(+), 16118 deletions(-) create mode 100644 .DS_Store diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6 GIT binary patch literal 6148 zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3 zem<@ulZcFPQ@L2!n>{z**++&mCkOWA81W14cNZlEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ zLs35+`xjp>T0 -中文 - - -
- - - -# hexo-theme-butterfly - -![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/master?color=%231ab1ad&label=master) -![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/dev?label=dev) -![https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff](https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff) -![hexo version](https://img.shields.io/badge/hexo-5.3.0+-0e83c) -![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531) - -📢 Demo: [Butterfly](https://butterfly.js.org/) / [CrazyWong](https://blog.crazywong.com/) - -📖 Docs: [English](https://butterfly.js.org/en/posts/butterfly-docs-en-get-started/) / [Chinese](https://butterfly.js.org/posts/21cfbf15/) - -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png) - -
- ---- - -## 💻 Installation - -### GIT - -> If you are in Mainland China, you can download in [Gitee](https://gitee.com/immyw/hexo-theme-butterfly.git) - -Stable branch [recommend]: - -``` -git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly -``` - -Dev branch: - -``` -git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly -``` - -### NPM - -> It supports Hexo 5.0.0 or later - -In Hexo site root directory - -```powershell -npm i hexo-theme-butterfly -``` - -## ⚙ Configuration - - Set theme in the hexo work folder's root config file `_config.yml`: - -> theme: butterfly - - If you don't have pug & stylus renderer, try this: - -> npm install hexo-renderer-pug hexo-renderer-stylus - -## 🎉 Features - -- [x] Card UI Design -- [x] Rounded Design/Squared Design -- [X] Support sub-menu -- [x] Two-column layout -- [x] Responsive Web Design -- [x] Dark Mode -- [x] Pjax -- [x] Read Mode -- [x] Conversion between Traditional and Simplified Chinese -- [X] TOC catalog is available for both computers and mobile phones -- [X] Built-in Syntax Highlighting Themes (darker/pale night/light/ocean), also support customization -- [X] Code Blocks (Display code language/close or expand Code Blocks/Copy Button/word wrap) -- [X] Disable copy/Add a Copyright Notice to the Copied Text -- [X] Search (Algolia Search/Local Search) -- [x] Mathjax and Katex -- [x] Built-in 404 page -- [x] WordCount -- [x] Related articles -- [x] Displays outdated notice for a post -- [x] Share (Sharejs/Addtoany) -- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk) -- [x] Multiple Comment System Support -- [x] Online Chats (Chatra/Tidio/Crisp) -- [x] Web analytics -- [x] Google AdSense -- [x] Webmaster Verification -- [x] Change website colour scheme -- [x] Typewriter Effect: activate_power_mode -- [x] Background effects (Canvas ribbon/canvas_ribbon_piao/canvas_nest) -- [x] Mouse click effects (Fireworks/Heart/Text) -- [x] Preloader/Loading Animation/pace.js -- [x] Busuanzi visitor counter -- [x] Medium Zoom/Fancybox -- [x] Mermaid -- [x] Chart.js -- [x] Justified Gallery -- [x] Lazyload images -- [x] Instantpage/Snackbar notification toast/PWA...... - -## ✨ Contributors - - - - - -## 📷 Screenshots - -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg) +
+中文 +
+ +
+ + + +# hexo-theme-butterfly + +![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/master?color=%231ab1ad&label=master) +![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/dev?label=dev) +![https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff](https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff) +![hexo version](https://img.shields.io/badge/hexo-5.3.0+-0e83c) +![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531) + +📢 Demo: [Butterfly](https://butterfly.js.org/) / [CrazyWong](https://blog.crazywong.com/) + +📖 Docs: [English](https://butterfly.js.org/en/posts/butterfly-docs-en-get-started/) / [Chinese](https://butterfly.js.org/posts/21cfbf15/) + +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png) + +
+ +--- + +## 💻 Installation + +### GIT + +> If you are in Mainland China, you can download in [Gitee](https://gitee.com/immyw/hexo-theme-butterfly.git) + +Stable branch [recommend]: + +``` +git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly +``` + +Dev branch: + +``` +git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly +``` + +### NPM + +> It supports Hexo 5.0.0 or later + +In Hexo site root directory + +```powershell +npm i hexo-theme-butterfly +``` + +## ⚙ Configuration + + Set theme in the hexo work folder's root config file `_config.yml`: + +> theme: butterfly + + If you don't have pug & stylus renderer, try this: + +> npm install hexo-renderer-pug hexo-renderer-stylus + +## 🎉 Features + +- [x] Card UI Design +- [x] Rounded Design/Squared Design +- [X] Support sub-menu +- [x] Two-column layout +- [x] Responsive Web Design +- [x] Dark Mode +- [x] Pjax +- [x] Read Mode +- [x] Conversion between Traditional and Simplified Chinese +- [X] TOC catalog is available for both computers and mobile phones +- [X] Built-in Syntax Highlighting Themes (darker/pale night/light/ocean), also support customization +- [X] Code Blocks (Display code language/close or expand Code Blocks/Copy Button/word wrap) +- [X] Disable copy/Add a Copyright Notice to the Copied Text +- [X] Search (Algolia Search/Local Search) +- [x] Mathjax and Katex +- [x] Built-in 404 page +- [x] WordCount +- [x] Related articles +- [x] Displays outdated notice for a post +- [x] Share (Sharejs/Addtoany) +- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk) +- [x] Multiple Comment System Support +- [x] Online Chats (Chatra/Tidio/Crisp) +- [x] Web analytics +- [x] Google AdSense +- [x] Webmaster Verification +- [x] Change website colour scheme +- [x] Typewriter Effect: activate_power_mode +- [x] Background effects (Canvas ribbon/canvas_ribbon_piao/canvas_nest) +- [x] Mouse click effects (Fireworks/Heart/Text) +- [x] Preloader/Loading Animation/pace.js +- [x] Busuanzi visitor counter +- [x] Medium Zoom/Fancybox +- [x] Mermaid +- [x] Chart.js +- [x] Justified Gallery +- [x] Lazyload images +- [x] Instantpage/Snackbar notification toast/PWA...... + +## ✨ Contributors + + + + + +## 📷 Screenshots + +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg) diff --git a/README_CN.md b/README_CN.md index 2b0e07d..5a42e0e 100644 --- a/README_CN.md +++ b/README_CN.md @@ -1,117 +1,117 @@ -
- English -
- -
- - - -# hexo-theme-butterfly - -![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/master?color=%231ab1ad&label=master) -![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/dev?label=dev) -![https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff](https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff) -![hexo version](https://img.shields.io/badge/hexo-5.3.0+-0e83c) -![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531) - -📢 預覽: [Butterfly](https://butterfly.js.org/) / [CrazyWong](https://blog.crazywong.com/) - -📖 文檔: [中文](https://butterfly.js.org/posts/21cfbf15/) / [English](https://butterfly.js.org/en/posts/butterfly-docs-en-get-started/) - -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png) - -
- ---- - -## 💻 安裝 - -### Git 安裝 - -> 本倉庫同時上傳到 [Gitee](https://gitee.com/immyw/hexo-theme-butterfly.git)，如果你訪問 Github 緩慢，可從 Gitee 中下載。 - -在博客根目錄裡安裝穩定版【推薦】 - -```powershell -git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly -``` - -如果想要安裝比較新的dev分支，可以 - -```powershell -git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly -``` - -### npm 安裝 - -> 此方法只支持Hexo 5.0.0以上版本 - -在博客根目錄裡 - -```powershell -npm i hexo-theme-butterfly -``` - -## ⚙ 應用主題 - -修改hexo配置文件`_config.yml`，把主題改為`Butterfly` - -``` -theme: butterfly -``` - ->如果你沒有pug以及stylus的渲染器，請下載安裝： npm install hexo-renderer-pug hexo-renderer-stylus --save - -## 🎉 特色 - -- [x] 卡片化設計 -- [x] 圓角化設計/直角化設計 -- [X] 支持二級目錄 -- [x] 雙欄設計 -- [x] 響應式主題 -- [x] 夜間模式 -- [x] Pjax -- [x] 文章閲讀模式 -- [x] 簡體和繁體轉換 -- [X] 電腦和手機都可查看TOC目錄 -- [X] 內置多種代碼配色（darker/pale night/light/ocean），可自定義代碼配色 -- [X] 代碼塊顯示代碼語言/關閉或展開代碼塊/代碼複製/代碼自動換行 -- [X] 可關閉文字複製/可開啟內容複製增加版權信息） -- [X] 兩種搜索（ Algolia 搜索和本地搜索） -- [x] Mathjax 和 Katex -- [x] 內置404頁面 -- [x] 顯示字數統計 -- [x] 顯示相關文章 -- [x] 過期文章提醒 -- [x] 多種分享系統（Sharejs/Addtoany） -- [X] 多種評論系統（Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk） -- [x] 支持雙評論部署 -- [x] 多種在線聊天（Chatra/Tidio/Crisp） -- [x] 多種分析系統 -- [x] 谷歌廣告/手動廣告位置 -- [x] 各種站長驗證 -- [x] 修改網站配色 -- [x] 打字特效 activate_power_mode -- [x] 多種背景特效（靜止彩帶/動態彩帶/Canvas Nest） -- [x] 多種鼠標點擊特效（煙花/文字/愛心） -- [x] 內置一種 Preloader 加載動畫和 pace.js 加載動畫條 -- [x] 不蒜子訪問統計 -- [x] 兩種大圖模式（Medium Zoom/Fancybox） -- [x] Mermaid 圖表顯示 -- [x] Chart.js 圖表顯示 -- [x] 照片牆 -- [x] 圖片懶加載 -- [x] Instantpage/Snackbar彈窗/PWA...... - -## ✨ 貢獻者 - - - - - -## 📷 截圖 - -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg) -![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg) +
+ English +
+ +
+ + + +# hexo-theme-butterfly + +![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/master?color=%231ab1ad&label=master) +![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/dev?label=dev) +![https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff](https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff) +![hexo version](https://img.shields.io/badge/hexo-5.3.0+-0e83c) +![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531) + +📢 預覽: [Butterfly](https://butterfly.js.org/) / [CrazyWong](https://blog.crazywong.com/) + +📖 文檔: [中文](https://butterfly.js.org/posts/21cfbf15/) / [English](https://butterfly.js.org/en/posts/butterfly-docs-en-get-started/) + +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png) + +
+ +--- + +## 💻 安裝 + +### Git 安裝 + +> 本倉庫同時上傳到 [Gitee](https://gitee.com/immyw/hexo-theme-butterfly.git)，如果你訪問 Github 緩慢，可從 Gitee 中下載。 + +在博客根目錄裡安裝穩定版【推薦】 + +```powershell +git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly +``` + +如果想要安裝比較新的dev分支，可以 + +```powershell +git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly +``` + +### npm 安裝 + +> 此方法只支持Hexo 5.0.0以上版本 + +在博客根目錄裡 + +```powershell +npm i hexo-theme-butterfly +``` + +## ⚙ 應用主題 + +修改hexo配置文件`_config.yml`，把主題改為`Butterfly` + +``` +theme: butterfly +``` + +>如果你沒有pug以及stylus的渲染器，請下載安裝： npm install hexo-renderer-pug hexo-renderer-stylus --save + +## 🎉 特色 + +- [x] 卡片化設計 +- [x] 圓角化設計/直角化設計 +- [X] 支持二級目錄 +- [x] 雙欄設計 +- [x] 響應式主題 +- [x] 夜間模式 +- [x] Pjax +- [x] 文章閲讀模式 +- [x] 簡體和繁體轉換 +- [X] 電腦和手機都可查看TOC目錄 +- [X] 內置多種代碼配色（darker/pale night/light/ocean），可自定義代碼配色 +- [X] 代碼塊顯示代碼語言/關閉或展開代碼塊/代碼複製/代碼自動換行 +- [X] 可關閉文字複製/可開啟內容複製增加版權信息） +- [X] 兩種搜索（ Algolia 搜索和本地搜索） +- [x] Mathjax 和 Katex +- [x] 內置404頁面 +- [x] 顯示字數統計 +- [x] 顯示相關文章 +- [x] 過期文章提醒 +- [x] 多種分享系統（Sharejs/Addtoany） +- [X] 多種評論系統（Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk） +- [x] 支持雙評論部署 +- [x] 多種在線聊天（Chatra/Tidio/Crisp） +- [x] 多種分析系統 +- [x] 谷歌廣告/手動廣告位置 +- [x] 各種站長驗證 +- [x] 修改網站配色 +- [x] 打字特效 activate_power_mode +- [x] 多種背景特效（靜止彩帶/動態彩帶/Canvas Nest） +- [x] 多種鼠標點擊特效（煙花/文字/愛心） +- [x] 內置一種 Preloader 加載動畫和 pace.js 加載動畫條 +- [x] 不蒜子訪問統計 +- [x] 兩種大圖模式（Medium Zoom/Fancybox） +- [x] Mermaid 圖表顯示 +- [x] Chart.js 圖表顯示 +- [x] 照片牆 +- [x] 圖片懶加載 +- [x] Instantpage/Snackbar彈窗/PWA...... + +## ✨ 貢獻者 + + + + + +## 📷 截圖 + +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg) +![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg) diff --git a/_config.yml b/_config.yml index 0ec8370..8316d81 100644 --- a/_config.yml +++ b/_config.yml @@ -1,1106 +1,1106 @@ -# -------------------------------------- -# Hexo Butterfly Theme Configuration -# If you have any questions, please refer to the documentation -# Chinese: https://butterfly.js.org/ -# English: https://butterfly.js.org/en/ -# -------------------------------------- - -# -------------------------------------- -# Navigation Settings -# -------------------------------------- - -nav: - # Navigation bar logo image - logo: - display_title: true - # Whether to fix navigation bar - fixed: false - -menu: - # Home: / || fas fa-home - # List||fas fa-list: - # Music: /music/ || fas fa-music - # Movie: /movies/ || fas fa-video - -# -------------------------------------- -# Code Blocks Settings -# -------------------------------------- - -code_blocks: - # Code block theme: darker / pale night / light / ocean / false - theme: light - macStyle: false - # Code block height limit (unit: px) - height_limit: false - word_wrap: false - - # Toolbar - copy: true - language: true - # true: shrink the code blocks | false: expand the code blocks | none: expand code blocks and hide the button - shrink: false - fullpage: false - -# Social media links -# Formal: -# icon: link || the description || color -social: - # fab fa-github: https://github.com/xxxxx || Github || '#24292e' - # fas fa-envelope: mailto:xxxxxx@gmail.com || Email || '#4a7dbe' - -# -------------------------------------- -# Image Settings -# -------------------------------------- - -favicon: /img/favicon.png - -avatar: - img: /img/butterfly-icon.png - effect: false - -# Disable all banner images -disable_top_img: false - -# If the banner of page not setting, it will show the default_top_img -default_top_img: - -# The banner image of index page -index_img: - -# The banner image of archive page -archive_img: - -# Note: tag page, not tags page -tag_img: - -# The banner image of tag page, you can set the banner image for each tag -# Format: -# - tag name: xxxxx -tag_per_img: - -# Note: category page, not categories page -category_img: - -# The banner image of category page, you can set the banner image for each category -# Format: -# - category name: xxxxx -category_per_img: - -# The background image of footer -footer_img: false - -# Website Background -# Can set it to color or image url -background: - -cover: - # Disable the cover or not - index_enable: true - aside_enable: true - archives_enable: true - # When cover is not set, the default cover is displayed - default_cover: - # - xxx.jpg - -# Replace Broken Images -error_img: - flink: /img/friend_404.gif - post_page: /img/404.jpg - -# A simple 404 page -error_404: - enable: false - subtitle: 'Page Not Found' - background: /img/error-page.png - -post_meta: - # Home Page - page: - # Choose: created / updated / both - date_type: created - # Choose: date / relative - date_format: date - categories: true - tags: false - label: true - post: - # Choose: left / center - position: left - # Choose: created / updated / both - date_type: both - # Choose: date / relative - date_format: date - categories: true - tags: true - label: true - -# -------------------------------------- -# Index page settings -# -------------------------------------- - -# The top_img settings of home page -# default: top img - full screen, site info - middle -# The position of site info, eg: 300px/300em/300rem/10% -index_site_info_top: -# The height of top_img, eg: 300px/300em/300rem -index_top_img_height: - -# The subtitle on homepage -subtitle: - enable: false - # Typewriter Effect - effect: true - # Customize typed.js - # https://github.com/mattboldt/typed.js/#customization - typed_option: - # Source - Call the third-party service API (Chinese only) - # It will show the source first, then show the content of sub - # Choose: false/1/2/3 - # false - disable the function - # 1 - hitokoto.cn - # 2 - yijuzhan.com - # 3 - jinrishici.com - source: false - # If you close the typewriter effect, the subtitle will only show the first line of sub - sub: - -# Article layout on the homepage -# 1: Cover on the left, info on the right -# 2: Cover on the right, info on the left -# 3: Cover and info alternate between left and right -# 4: Cover on top, info on the bottom -# 5: Info displayed on the cover -# 6: Masonry layout - Cover on top, info on the bottom -# 7: Masonry layout - Info displayed on the cover -index_layout: 3 - -# Display the article introduction on homepage -# 1: description -# 2: both (if the description exists, it will show description, or show the auto_excerpt) -# 3: auto_excerpt (default) -# false: do not show the article introduction -index_post_content: - method: 3 - # If you set method to 2 or 3, the length need to config - length: 500 - -# -------------------------------------- -# Post Settings -# -------------------------------------- - -toc: - post: true - page: false - number: true - expand: false - # Only for post - style_simple: false - scroll_percent: true - -post_copyright: - enable: true - decode: false - author_href: - license: CC BY-NC-SA 4.0 - license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/ - -# Sponsor/reward -reward: - enable: false - text: - QR_code: - # - img: /img/wechat.jpg - # link: - # text: wechat - # - img: /img/alipay.jpg - # link: - # text: alipay - -# Post edit -# Easily browse and edit blog source code online. -post_edit: - enable: false - # url: https://github.com/user-name/repo-name/edit/branch-name/subdirectory-name/ - # For example: https://github.com/jerryc127/butterfly.js.org/edit/main/source/ - url: - -# Related Articles -related_post: - enable: true - # Number of posts displayed - limit: 6 - # Choose: created / updated - date_type: created - -# Choose: 1 / 2 / false -# 1: The 'next post' will link to old post -# 2: The 'next post' will link to new post -# false: disable pagination -post_pagination: 1 - -# Displays outdated notice for a post -noticeOutdate: - enable: false - # Style: simple / flat - style: flat - # When will it be shown - limit_day: 365 - # Position: top / bottom - position: top - message_prev: It has been - message_next: days since the last update, the content of the article may be outdated. - -# -------------------------------------- -# Footer Settings -# -------------------------------------- -footer: - owner: - enable: true - since: 2019 - custom_text: - # Copyright of theme and framework - copyright: true - -# -------------------------------------- -# Aside Settings -# -------------------------------------- - -aside: - enable: true - hide: false - # Show the button to hide the aside in bottom right button - button: true - mobile: true - # Position: left / right - position: right - display: - archive: true - tag: true - category: true - card_author: - enable: true - description: - button: - enable: true - icon: fab fa-github - text: Follow Me - link: https://github.com/xxxxxx - card_announcement: - enable: true - content: This is my Blog - card_recent_post: - enable: true - # If set 0 will show all - limit: 5 - # Sort: date / updated - sort: date - sort_order: - card_newest_comments: - enable: false - sort_order: - limit: 6 - # Unit: mins, save data to localStorage - storage: 10 - avatar: true - card_categories: - enable: true - # If set 0 will show all - limit: 8 - # Choose: none / true / false - expand: none - sort_order: - card_tags: - enable: true - # If set 0 will show all - limit: 40 - color: false - # Order of tags, random/name/length - orderby: random - # Sort of order. 1, asc for ascending; -1, desc for descending - order: 1 - sort_order: - card_archives: - enable: true - # Type: monthly / yearly - type: monthly - # Eg: YYYY年MM月 - format: MMMM YYYY - # Sort of order. 1, asc for ascending; -1, desc for descending - order: -1 - # If set 0 will show all - limit: 8 - sort_order: - card_post_series: - enable: true - # The title shows the series name - series_title: false - # Order by title or date - orderBy: 'date' - # Sort of order. 1, asc for ascending; -1, desc for descending - order: -1 - card_webinfo: - enable: true - post_count: true - last_push_date: true - sort_order: - # Time difference between publish date and now - # Formal: Month/Day/Year Time or Year/Month/Day Time - # Leave it empty if you don't enable this feature - runtime_date: - -# -------------------------------------- -# Bottom right button -# -------------------------------------- - -# The distance between the bottom right button and the bottom (default unit: px) -rightside_bottom: - -# Conversion between Traditional and Simplified Chinese -translate: - enable: false - # The text of a button - default: 繁 - # the language of website (1 - Traditional Chinese/ 2 - Simplified Chinese） - defaultEncoding: 2 - # Time delay - translateDelay: 0 - # The text of the button when the language is Simplified Chinese - msgToTraditionalChinese: '繁' - # The text of the button when the language is Traditional Chinese - msgToSimplifiedChinese: '簡' - -# Read Mode -readmode: true - -# Dark Mode -darkmode: - enable: true - # Toggle Button to switch dark/light mode - button: true - # Switch dark/light mode automatically - # autoChangeMode: 1 Following System Settings, if the system doesn't support dark mode, it will switch dark mode between 6 pm to 6 am - # autoChangeMode: 2 Switch dark mode between 6 pm to 6 am - # autoChangeMode: false - autoChangeMode: false - # Set the light mode time. The value is between 0 and 24. If not set, the default value is 6 and 18 - start: - end: - -# Show scroll percent in scroll-to-top button -rightside_scroll_percent: false - -# Don't modify the following settings unless you know how they work -# Choose: readmode,translate,darkmode,hideAside,toc,chat,comment -# Don't repeat the same value -rightside_item_order: - enable: false - # Default: readmode,translate,darkmode,hideAside - hide: - # Default: toc,chat,comment - show: - -# -------------------------------------- -# Global Settings -# -------------------------------------- - -anchor: - # When you scroll, the URL will update according to header id. - auto_update: false - # Click the headline to scroll and update the anchor - click_to_scroll: false - -photofigcaption: false - -copy: - enable: true - # Add the copyright information after copied content - copyright: - enable: false - limit_count: 150 - -# Need to install the hexo-wordcount plugin -wordcount: - enable: false - # Display the word count of the article in post meta - post_wordcount: true - # Display the time to read the article in post meta - min2read: true - # Display the total word count of the website in aside's webinfo - total_wordcount: true - -# Busuanzi count for PV / UV in site -busuanzi: - site_uv: true - site_pv: true - page_pv: true - -# -------------------------------------- -# Math -# -------------------------------------- - -# About the per_page -# if you set it to true, it will load mathjax/katex script in each page -# if you set it to false, it will load mathjax/katex script according to your setting (add the 'mathjax: true' or 'katex: true' in page's front-matter) -math: - # Choose: mathjax, katex - # Leave it empty if you don't need math - use: - per_page: true - hide_scrollbar: false - - mathjax: - # Enable the contextual menu - enableMenu: true - # Choose: all / ams / none, This controls whether equations are numbered and how - tags: none - - katex: - # Enable the copy KaTeX formula - copy_tex: false - -# -------------------------------------- -# Search -# -------------------------------------- - -search: - # Choose: algolia_search / local_search / docsearch - # leave it empty if you don't need search - use: - placeholder: - - # Algolia Search - algolia_search: - # Number of search results per page - hitsPerPage: 6 - - # Local Search - local_search: - # Preload the search data when the page loads. - preload: false - # Show top n results per article, show all results by setting to -1 - top_n_per_article: 1 - # Unescape html strings to the readable one. - unescape: false - CDN: - - # Docsearch - # https://docsearch.algolia.com/ - docsearch: - appId: - apiKey: - indexName: - option: - -# -------------------------------------- -# Share System -# -------------------------------------- - -share: - # Choose: sharejs / addtoany - # Leave it empty if you don't need share - use: sharejs - - # Share.js - # https://github.com/overtrue/share.js - sharejs: - sites: facebook,twitter,wechat,weibo,qq - - # AddToAny - # https://www.addtoany.com/ - addtoany: - item: facebook,twitter,wechat,sina_weibo,facebook_messenger,email,copy_link - -# -------------------------------------- -# Comments System -# -------------------------------------- - -comments: - # Up to two comments system, the first will be shown as default - # Leave it empty if you don't need comments - # Choose: Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/Artalk - # Format of two comments system : Disqus,Waline - use: - # Display the comment name next to the button - text: true - # Lazyload: The comment system will be load when comment element enters the browser's viewport. - # If you set it to true, the comment count will be invalid - lazyload: false - # Display comment count in post's top_img - count: false - # Display comment count in Home Page - card_post_count: false - -# Disqus -# https://disqus.com/ -disqus: - shortname: - # For newest comments widget - apikey: - -# Alternative Disqus - Render comments with Disqus API -# https://github.com/SukkaW/DisqusJS -disqusjs: - shortname: - apikey: - option: - -# Livere -# https://www.livere.com/ -livere: - uid: - -# Gitalk -# https://github.com/gitalk/gitalk -gitalk: - client_id: - client_secret: - repo: - owner: - admin: - option: - -# Valine -# https://valine.js.org -valine: - appId: - appKey: - avatar: monsterid - # This configuration is suitable for domestic custom domain name users, overseas version will be automatically detected (no need to manually fill in) - serverURLs: - bg: - # Use Valine visitor count as the page view count - visitor: false - option: - -# Waline - A simple comment system with backend support fork from Valine -# https://waline.js.org/ -waline: - serverURL: - bg: - # Use Waline pageview count as the page view count - pageview: false - option: - -# Utterances -# https://utteranc.es/ -utterances: - repo: - # Issue Mapping: pathname/url/title/og:title - issue_term: pathname - # Theme: github-light/github-dark/github-dark-orange/icy-dark/dark-blue/photon-dark - light_theme: github-light - dark_theme: photon-dark - js: - option: - -# Facebook Comments Plugin -# https://developers.facebook.com/docs/plugins/comments/ -facebook_comments: - app_id: - # optional - user_id: - pageSize: 10 - # Choose: social / time / reverse_time - order_by: social - lang: en_US - -# Twikoo -# https://github.com/imaegoo/twikoo -twikoo: - envId: - region: - # Use Twikoo visitor count as the page view count - visitor: false - option: - -# Giscus -# https://giscus.app/ -giscus: - repo: - repo_id: - category_id: - light_theme: light - dark_theme: dark - js: - option: - -# Remark42 -# https://remark42.com/docs/configuration/frontend/ -remark42: - host: - siteId: - option: - -# Artalk -# https://artalk.js.org/guide/frontend/config.html -artalk: - server: - site: - # Use Artalk visitor count as the page view count - visitor: false - option: - -# -------------------------------------- -# Chat Services -# -------------------------------------- - -chat: - # Choose: chatra/tidio/crisp - # Leave it empty if you don't need chat - use: - # Chat Button [recommend] - # It will create a button in the bottom right corner of website, and hide the origin button - rightside_button: false - # The origin chat button is displayed when scrolling up, and the button is hidden when scrolling down - button_hide_show: false - -# https://chatra.io/ -chatra: - id: - -# https://www.tidio.com/ -tidio: - public_key: - -# https://crisp.chat/en/ -crisp: - website_id: - -# -------------------------------------- -# Analysis -# -------------------------------------- - -# https://tongji.baidu.com/web/welcome/login -baidu_analytics: - -# https://analytics.google.com/analytics/web/ -google_analytics: - -# https://www.cloudflare.com/zh-tw/web-analytics/ -cloudflare_analytics: - -# https://clarity.microsoft.com/ -microsoft_clarity: - -# https://umami.is/ -umami_analytics: - enable: false - # For self-hosted setups, configure the hostname of the Umami instance - serverURL: - website_id: - option: - UV_PV: - site_uv: false - site_pv: false - page_pv: false - # Umami Cloud (API key) / self-hosted Umami (token) - token: - -# -------------------------------------- -# Advertisement -# -------------------------------------- - -# Google Adsense -google_adsense: - enable: false - auto_ads: true - js: https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js - client: - enable_page_level_ads: true - -# Insert ads manually -# Leave it empty if you don't need ads -ad: - # Insert ads in the index (every three posts) - index: - # Insert ads in aside - aside: - # Insert ads in the post (before pagination) - post: - -# -------------------------------------- -# Verification -# -------------------------------------- - -site_verification: - # - name: google-site-verification - # content: xxxxxx - # - name: baidu-site-verification - # content: xxxxxxx - -# -------------------------------------- -# Beautify / Effect -# -------------------------------------- - -# Theme color for customize -# Notice: color value must in double quotes like "#000" or may cause error! - -# theme_color: -# enable: true -# main: "#49B1F5" -# paginator: "#00c4b6" -# button_hover: "#FF7242" -# text_selection: "#00c4b6" -# link_color: "#99a9bf" -# meta_color: "#858585" -# hr_color: "#A4D8FA" -# code_foreground: "#F47466" -# code_background: "rgba(27, 31, 35, .05)" -# toc_color: "#00c4b6" -# blockquote_padding_color: "#49b1f5" -# blockquote_background_color: "#49b1f5" -# scrollbar_color: "#49b1f5" -# meta_theme_color_light: "ffffff" -# meta_theme_color_dark: "#0d0d0d" - -# The user interface setting of category and tag page -# Choose: index - same as Homepage UI / default - same as archives UI -# leave it empty or index -category_ui: -tag_ui: - -# Rounded corners for UI elements -rounded_corners_ui: true - -# Stretches the lines so that each line has equal width -text_align_justify: false - -# Add a mask to the header and footer -mask: - header: true - footer: true - -# Loading Animation -preloader: - enable: false - # source - # 1. fullpage-loading - # 2. pace (progress bar) - source: 1 - # pace theme (see https://codebyzach.github.io/pace/) - pace_css_url: - -# Page Transition -enter_transitions: true - -# Default display mode - light (default) / dark -display_mode: light - -# Configuration for beautifying the content of the article -beautify: - enable: false - # Specify the field to beautify (site or post) - field: post - # Specify the icon to be used as a prefix for the title, such as '\f0c1' - title_prefix_icon: - # Specify the color of the title prefix icon, such as '#F47466' - title_prefix_icon_color: - -# Global font settings -# Don't modify the following settings unless you know how they work -font: - global_font_size: - code_font_size: - font_family: - code_font_family: - -# Font settings for the site title and site subtitle -blog_title_font: - font_link: - font_family: - -# The setting of divider icon -hr_icon: - enable: true - # The unicode value of Font Awesome icon, such as '\3423' - icon: - icon_top: - -# Typewriter Effect -# https://github.com/disjukr/activate-power-mode -activate_power_mode: - enable: false - colorful: true - shake: true - mobile: false - -# Background effects -# -------------------------------------- - -# canvas_ribbon -# See: https://github.com/hustcc/ribbon.js -canvas_ribbon: - enable: false - # The size of ribbon - size: 150 - # The opacity of ribbon (0 ~ 1) - alpha: 0.6 - zIndex: -1 - click_to_change: false - mobile: false - -# Fluttering Ribbon -canvas_fluttering_ribbon: - enable: false - mobile: false - -# canvas_nest -# https://github.com/hustcc/canvas-nest.js -canvas_nest: - enable: false - # Color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.) - color: '0,0,255' - # The opacity of line (0~1) - opacity: 0.7 - # The z-index property of the background - zIndex: -1 - # The number of lines - count: 99 - mobile: false - -# Mouse click effects: fireworks -fireworks: - enable: false - zIndex: 9999 - mobile: false - -# Mouse click effects: Heart symbol -click_heart: - enable: false - mobile: false - -# Mouse click effects: words -clickShowText: - enable: false - text: - # - I - # - LOVE - # - YOU - fontSize: 15px - random: false - mobile: false - -# -------------------------------------- -# Lightbox Settings -# -------------------------------------- - -# Choose: fancybox / medium_zoom -# https://github.com/francoischalifour/medium-zoom -# https://fancyapps.com/fancybox/ -# Leave it empty if you don't need lightbox -lightbox: - -# -------------------------------------- -# Tag Plugins settings -# -------------------------------------- - -# Series -series: - enable: false - # Order by title or date - orderBy: 'title' - # Sort of order. 1, asc for ascending; -1, desc for descending - order: 1 - number: true - -# ABCJS - The ABC Music Notation Plugin -# https://github.com/paulrosen/abcjs -abcjs: - enable: false - per_page: true - -# Mermaid -# https://github.com/mermaid-js/mermaid -mermaid: - enable: false - # Write Mermaid diagrams using code blocks - code_write: false - # built-in themes: default / forest / dark / neutral - theme: - light: default - dark: dark - -# chartjs -# see https://www.chartjs.org/docs/latest/ -chartjs: - enable: false - # Do not modify unless you understand how they work. - # The default settings are only used when the MD syntax is not specified. - # General font color for the chart - fontColor: - light: 'rgba(0, 0, 0, 0.8)' - dark: 'rgba(255, 255, 255, 0.8)' - # General border color for the chart - borderColor: - light: 'rgba(0, 0, 0, 0.1)' - dark: 'rgba(255, 255, 255, 0.2)' - # Background color for scale labels on radar and polar area charts - scale_ticks_backdropColor: - light: 'transparent' - dark: 'transparent' - -# Note - Bootstrap Callout -note: - # Note tag style values: - # - simple bs-callout old alert style. Default. - # - modern bs-callout new (v2-v3) alert style. - # - flat flat callout style with background, like on Mozilla or StackOverflow. - # - disabled disable all CSS styles import of note tag. - style: flat - icons: true - border_radius: 3 - # Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6). - # Offset also applied to label tag variables. This option can work with disabled note tag. - light_bg_offset: 0 - -# -------------------------------------- -# Other Settings -# -------------------------------------- - -# https://github.com/MoOx/pjax -pjax: - enable: false - # Exclude the specified pages from pjax, such as '/music/' - exclude: - # - /xxxxxx/ - -# Inject the css and script (aplayer/meting) -aplayerInject: - enable: false - per_page: true - -# Snackbar - Toast Notification -# https://github.com/polonel/SnackBar -# position: top-left / top-center / top-right / bottom-left / bottom-center / bottom-right -snackbar: - enable: false - position: bottom-left - # The background color of Toast Notification in light mode and dark mode - bg_light: '#49b1f5' - bg_dark: '#1f1f1f' - -# Instant.page -# https://instant.page/ -instantpage: false - -# Lazyload -# https://github.com/verlok/vanilla-lazyload -lazyload: - enable: false - # Specify the field to use lazyload (site or post) - field: site - placeholder: - blur: false - -# PWA -# See https://github.com/JLHwung/hexo-offline -# --------------- -pwa: - enable: false - manifest: - apple_touch_icon: - favicon_32_32: - favicon_16_16: - mask_icon: - -# Open graph meta tags -# https://hexo.io/docs/helpers#open-graph -Open_Graph_meta: - enable: true - option: - # twitter_card: - # twitter_image: - # twitter_id: - # twitter_site: - # google_plus: - # fb_admins: - # fb_app_id: - -# Structured Data -# https://developers.google.com/search/docs/guides/intro-structured-data -structured_data: true - -# Add the vendor prefixes to ensure compatibility -css_prefix: true - -# Inject -# Insert the code to head (before '' tag) and the bottom (before '' tag) -inject: - head: - # - - bottom: - # - - -# CDN Settings -# Don't modify the following settings unless you know how they work -CDN: - # The CDN provider for internal and third-party scripts - # Options for both: local/jsdelivr/unpkg/cdnjs/custom - # Note: Dev version can only use 'local' for internal scripts - # Note: When setting third-party scripts to 'local', you need to install hexo-butterfly-extjs - internal_provider: local - third_party_provider: jsdelivr - - # Add version number to url, true or false - version: false - - # Custom format - # For example: https://cdn.staticfile.org/${cdnjs_name}/${version}/${min_cdnjs_file} - custom_format: - - option: - # abcjs_basic_js: - # activate_power_mode: - # algolia_js: - # algolia_search: - # aplayer_css: - # aplayer_js: - # artalk_css: - # artalk_js: - # blueimp_md5: - # busuanzi: - # canvas_fluttering_ribbon: - # canvas_nest: - # canvas_ribbon: - # chartjs: - # click_heart: - # clickShowText: - # disqusjs: - # disqusjs_css: - # docsearch_css: - # docsearch_js: - # egjs_infinitegrid: - # fancybox: - # fancybox_css: - # fireworks: - # fontawesome: - # gitalk: - # gitalk_css: - # giscus: - # instantpage: - # instantsearch: - # katex: - # katex_copytex: - # lazyload: - # local_search: - # main: - # main_css: - # mathjax: - # medium_zoom: - # mermaid: - # meting_js: - # prismjs_autoloader: - # prismjs_js: - # prismjs_lineNumber_js: - # pjax: - # sharejs: - # sharejs_css: - # snackbar: - # snackbar_css: - # translate: - # twikoo: - # typed: - # utils: - # valine: - # waline_css: - # waline_js: +# -------------------------------------- +# Hexo Butterfly Theme Configuration +# If you have any questions, please refer to the documentation +# Chinese: https://butterfly.js.org/ +# English: https://butterfly.js.org/en/ +# -------------------------------------- + +# -------------------------------------- +# Navigation Settings +# -------------------------------------- + +nav: + # Navigation bar logo image + logo: + display_title: true + # Whether to fix navigation bar + fixed: false + +menu: + # Home: / || fas fa-home + # List||fas fa-list: + # Music: /music/ || fas fa-music + # Movie: /movies/ || fas fa-video + +# -------------------------------------- +# Code Blocks Settings +# -------------------------------------- + +code_blocks: + # Code block theme: darker / pale night / light / ocean / false + theme: light + macStyle: false + # Code block height limit (unit: px) + height_limit: false + word_wrap: false + + # Toolbar + copy: true + language: true + # true: shrink the code blocks | false: expand the code blocks | none: expand code blocks and hide the button + shrink: false + fullpage: false + +# Social media links +# Formal: +# icon: link || the description || color +social: + # fab fa-github: https://github.com/xxxxx || Github || '#24292e' + # fas fa-envelope: mailto:xxxxxx@gmail.com || Email || '#4a7dbe' + +# -------------------------------------- +# Image Settings +# -------------------------------------- + +favicon: /img/favicon.png + +avatar: + img: /img/butterfly-icon.png + effect: false + +# Disable all banner images +disable_top_img: false + +# If the banner of page not setting, it will show the default_top_img +default_top_img: + +# The banner image of index page +index_img: + +# The banner image of archive page +archive_img: + +# Note: tag page, not tags page +tag_img: + +# The banner image of tag page, you can set the banner image for each tag +# Format: +# - tag name: xxxxx +tag_per_img: + +# Note: category page, not categories page +category_img: + +# The banner image of category page, you can set the banner image for each category +# Format: +# - category name: xxxxx +category_per_img: + +# The background image of footer +footer_img: false + +# Website Background +# Can set it to color or image url +background: + +cover: + # Disable the cover or not + index_enable: true + aside_enable: true + archives_enable: true + # When cover is not set, the default cover is displayed + default_cover: + # - xxx.jpg + +# Replace Broken Images +error_img: + flink: /img/friend_404.gif + post_page: /img/404.jpg + +# A simple 404 page +error_404: + enable: false + subtitle: 'Page Not Found' + background: /img/error-page.png + +post_meta: + # Home Page + page: + # Choose: created / updated / both + date_type: created + # Choose: date / relative + date_format: date + categories: true + tags: false + label: true + post: + # Choose: left / center + position: left + # Choose: created / updated / both + date_type: both + # Choose: date / relative + date_format: date + categories: true + tags: true + label: true + +# -------------------------------------- +# Index page settings +# -------------------------------------- + +# The top_img settings of home page +# default: top img - full screen, site info - middle +# The position of site info, eg: 300px/300em/300rem/10% +index_site_info_top: +# The height of top_img, eg: 300px/300em/300rem +index_top_img_height: + +# The subtitle on homepage +subtitle: + enable: false + # Typewriter Effect + effect: true + # Customize typed.js + # https://github.com/mattboldt/typed.js/#customization + typed_option: + # Source - Call the third-party service API (Chinese only) + # It will show the source first, then show the content of sub + # Choose: false/1/2/3 + # false - disable the function + # 1 - hitokoto.cn + # 2 - yijuzhan.com + # 3 - jinrishici.com + source: false + # If you close the typewriter effect, the subtitle will only show the first line of sub + sub: + +# Article layout on the homepage +# 1: Cover on the left, info on the right +# 2: Cover on the right, info on the left +# 3: Cover and info alternate between left and right +# 4: Cover on top, info on the bottom +# 5: Info displayed on the cover +# 6: Masonry layout - Cover on top, info on the bottom +# 7: Masonry layout - Info displayed on the cover +index_layout: 3 + +# Display the article introduction on homepage +# 1: description +# 2: both (if the description exists, it will show description, or show the auto_excerpt) +# 3: auto_excerpt (default) +# false: do not show the article introduction +index_post_content: + method: 3 + # If you set method to 2 or 3, the length need to config + length: 500 + +# -------------------------------------- +# Post Settings +# -------------------------------------- + +toc: + post: true + page: false + number: true + expand: false + # Only for post + style_simple: false + scroll_percent: true + +post_copyright: + enable: true + decode: false + author_href: + license: CC BY-NC-SA 4.0 + license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/ + +# Sponsor/reward +reward: + enable: false + text: + QR_code: + # - img: /img/wechat.jpg + # link: + # text: wechat + # - img: /img/alipay.jpg + # link: + # text: alipay + +# Post edit +# Easily browse and edit blog source code online. +post_edit: + enable: false + # url: https://github.com/user-name/repo-name/edit/branch-name/subdirectory-name/ + # For example: https://github.com/jerryc127/butterfly.js.org/edit/main/source/ + url: + +# Related Articles +related_post: + enable: true + # Number of posts displayed + limit: 6 + # Choose: created / updated + date_type: created + +# Choose: 1 / 2 / false +# 1: The 'next post' will link to old post +# 2: The 'next post' will link to new post +# false: disable pagination +post_pagination: 1 + +# Displays outdated notice for a post +noticeOutdate: + enable: false + # Style: simple / flat + style: flat + # When will it be shown + limit_day: 365 + # Position: top / bottom + position: top + message_prev: It has been + message_next: days since the last update, the content of the article may be outdated. + +# -------------------------------------- +# Footer Settings +# -------------------------------------- +footer: + owner: + enable: true + since: 2019 + custom_text: + # Copyright of theme and framework + copyright: true + +# -------------------------------------- +# Aside Settings +# -------------------------------------- + +aside: + enable: true + hide: false + # Show the button to hide the aside in bottom right button + button: true + mobile: true + # Position: left / right + position: right + display: + archive: true + tag: true + category: true + card_author: + enable: true + description: + button: + enable: true + icon: fab fa-github + text: Follow Me + link: https://github.com/xxxxxx + card_announcement: + enable: true + content: This is my Blog + card_recent_post: + enable: true + # If set 0 will show all + limit: 5 + # Sort: date / updated + sort: date + sort_order: + card_newest_comments: + enable: false + sort_order: + limit: 6 + # Unit: mins, save data to localStorage + storage: 10 + avatar: true + card_categories: + enable: true + # If set 0 will show all + limit: 8 + # Choose: none / true / false + expand: none + sort_order: + card_tags: + enable: true + # If set 0 will show all + limit: 40 + color: false + # Order of tags, random/name/length + orderby: random + # Sort of order. 1, asc for ascending; -1, desc for descending + order: 1 + sort_order: + card_archives: + enable: true + # Type: monthly / yearly + type: monthly + # Eg: YYYY年MM月 + format: MMMM YYYY + # Sort of order. 1, asc for ascending; -1, desc for descending + order: -1 + # If set 0 will show all + limit: 8 + sort_order: + card_post_series: + enable: true + # The title shows the series name + series_title: false + # Order by title or date + orderBy: 'date' + # Sort of order. 1, asc for ascending; -1, desc for descending + order: -1 + card_webinfo: + enable: true + post_count: true + last_push_date: true + sort_order: + # Time difference between publish date and now + # Formal: Month/Day/Year Time or Year/Month/Day Time + # Leave it empty if you don't enable this feature + runtime_date: + +# -------------------------------------- +# Bottom right button +# -------------------------------------- + +# The distance between the bottom right button and the bottom (default unit: px) +rightside_bottom: + +# Conversion between Traditional and Simplified Chinese +translate: + enable: false + # The text of a button + default: 繁 + # the language of website (1 - Traditional Chinese/ 2 - Simplified Chinese） + defaultEncoding: 2 + # Time delay + translateDelay: 0 + # The text of the button when the language is Simplified Chinese + msgToTraditionalChinese: '繁' + # The text of the button when the language is Traditional Chinese + msgToSimplifiedChinese: '簡' + +# Read Mode +readmode: true + +# Dark Mode +darkmode: + enable: true + # Toggle Button to switch dark/light mode + button: true + # Switch dark/light mode automatically + # autoChangeMode: 1 Following System Settings, if the system doesn't support dark mode, it will switch dark mode between 6 pm to 6 am + # autoChangeMode: 2 Switch dark mode between 6 pm to 6 am + # autoChangeMode: false + autoChangeMode: false + # Set the light mode time. The value is between 0 and 24. If not set, the default value is 6 and 18 + start: + end: + +# Show scroll percent in scroll-to-top button +rightside_scroll_percent: false + +# Don't modify the following settings unless you know how they work +# Choose: readmode,translate,darkmode,hideAside,toc,chat,comment +# Don't repeat the same value +rightside_item_order: + enable: false + # Default: readmode,translate,darkmode,hideAside + hide: + # Default: toc,chat,comment + show: + +# -------------------------------------- +# Global Settings +# -------------------------------------- + +anchor: + # When you scroll, the URL will update according to header id. + auto_update: false + # Click the headline to scroll and update the anchor + click_to_scroll: false + +photofigcaption: false + +copy: + enable: true + # Add the copyright information after copied content + copyright: + enable: false + limit_count: 150 + +# Need to install the hexo-wordcount plugin +wordcount: + enable: false + # Display the word count of the article in post meta + post_wordcount: true + # Display the time to read the article in post meta + min2read: true + # Display the total word count of the website in aside's webinfo + total_wordcount: true + +# Busuanzi count for PV / UV in site +busuanzi: + site_uv: true + site_pv: true + page_pv: true + +# -------------------------------------- +# Math +# -------------------------------------- + +# About the per_page +# if you set it to true, it will load mathjax/katex script in each page +# if you set it to false, it will load mathjax/katex script according to your setting (add the 'mathjax: true' or 'katex: true' in page's front-matter) +math: + # Choose: mathjax, katex + # Leave it empty if you don't need math + use: + per_page: true + hide_scrollbar: false + + mathjax: + # Enable the contextual menu + enableMenu: true + # Choose: all / ams / none, This controls whether equations are numbered and how + tags: none + + katex: + # Enable the copy KaTeX formula + copy_tex: false + +# -------------------------------------- +# Search +# -------------------------------------- + +search: + # Choose: algolia_search / local_search / docsearch + # leave it empty if you don't need search + use: + placeholder: + + # Algolia Search + algolia_search: + # Number of search results per page + hitsPerPage: 6 + + # Local Search + local_search: + # Preload the search data when the page loads. + preload: false + # Show top n results per article, show all results by setting to -1 + top_n_per_article: 1 + # Unescape html strings to the readable one. + unescape: false + CDN: + + # Docsearch + # https://docsearch.algolia.com/ + docsearch: + appId: + apiKey: + indexName: + option: + +# -------------------------------------- +# Share System +# -------------------------------------- + +share: + # Choose: sharejs / addtoany + # Leave it empty if you don't need share + use: sharejs + + # Share.js + # https://github.com/overtrue/share.js + sharejs: + sites: facebook,twitter,wechat,weibo,qq + + # AddToAny + # https://www.addtoany.com/ + addtoany: + item: facebook,twitter,wechat,sina_weibo,facebook_messenger,email,copy_link + +# -------------------------------------- +# Comments System +# -------------------------------------- + +comments: + # Up to two comments system, the first will be shown as default + # Leave it empty if you don't need comments + # Choose: Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/Artalk + # Format of two comments system : Disqus,Waline + use: + # Display the comment name next to the button + text: true + # Lazyload: The comment system will be load when comment element enters the browser's viewport. + # If you set it to true, the comment count will be invalid + lazyload: false + # Display comment count in post's top_img + count: false + # Display comment count in Home Page + card_post_count: false + +# Disqus +# https://disqus.com/ +disqus: + shortname: + # For newest comments widget + apikey: + +# Alternative Disqus - Render comments with Disqus API +# https://github.com/SukkaW/DisqusJS +disqusjs: + shortname: + apikey: + option: + +# Livere +# https://www.livere.com/ +livere: + uid: + +# Gitalk +# https://github.com/gitalk/gitalk +gitalk: + client_id: + client_secret: + repo: + owner: + admin: + option: + +# Valine +# https://valine.js.org +valine: + appId: + appKey: + avatar: monsterid + # This configuration is suitable for domestic custom domain name users, overseas version will be automatically detected (no need to manually fill in) + serverURLs: + bg: + # Use Valine visitor count as the page view count + visitor: false + option: + +# Waline - A simple comment system with backend support fork from Valine +# https://waline.js.org/ +waline: + serverURL: + bg: + # Use Waline pageview count as the page view count + pageview: false + option: + +# Utterances +# https://utteranc.es/ +utterances: + repo: + # Issue Mapping: pathname/url/title/og:title + issue_term: pathname + # Theme: github-light/github-dark/github-dark-orange/icy-dark/dark-blue/photon-dark + light_theme: github-light + dark_theme: photon-dark + js: + option: + +# Facebook Comments Plugin +# https://developers.facebook.com/docs/plugins/comments/ +facebook_comments: + app_id: + # optional + user_id: + pageSize: 10 + # Choose: social / time / reverse_time + order_by: social + lang: en_US + +# Twikoo +# https://github.com/imaegoo/twikoo +twikoo: + envId: + region: + # Use Twikoo visitor count as the page view count + visitor: false + option: + +# Giscus +# https://giscus.app/ +giscus: + repo: + repo_id: + category_id: + light_theme: light + dark_theme: dark + js: + option: + +# Remark42 +# https://remark42.com/docs/configuration/frontend/ +remark42: + host: + siteId: + option: + +# Artalk +# https://artalk.js.org/guide/frontend/config.html +artalk: + server: + site: + # Use Artalk visitor count as the page view count + visitor: false + option: + +# -------------------------------------- +# Chat Services +# -------------------------------------- + +chat: + # Choose: chatra/tidio/crisp + # Leave it empty if you don't need chat + use: + # Chat Button [recommend] + # It will create a button in the bottom right corner of website, and hide the origin button + rightside_button: false + # The origin chat button is displayed when scrolling up, and the button is hidden when scrolling down + button_hide_show: false + +# https://chatra.io/ +chatra: + id: + +# https://www.tidio.com/ +tidio: + public_key: + +# https://crisp.chat/en/ +crisp: + website_id: + +# -------------------------------------- +# Analysis +# -------------------------------------- + +# https://tongji.baidu.com/web/welcome/login +baidu_analytics: + +# https://analytics.google.com/analytics/web/ +google_analytics: + +# https://www.cloudflare.com/zh-tw/web-analytics/ +cloudflare_analytics: + +# https://clarity.microsoft.com/ +microsoft_clarity: + +# https://umami.is/ +umami_analytics: + enable: false + # For self-hosted setups, configure the hostname of the Umami instance + serverURL: + website_id: + option: + UV_PV: + site_uv: false + site_pv: false + page_pv: false + # Umami Cloud (API key) / self-hosted Umami (token) + token: + +# -------------------------------------- +# Advertisement +# -------------------------------------- + +# Google Adsense +google_adsense: + enable: false + auto_ads: true + js: https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js + client: + enable_page_level_ads: true + +# Insert ads manually +# Leave it empty if you don't need ads +ad: + # Insert ads in the index (every three posts) + index: + # Insert ads in aside + aside: + # Insert ads in the post (before pagination) + post: + +# -------------------------------------- +# Verification +# -------------------------------------- + +site_verification: + # - name: google-site-verification + # content: xxxxxx + # - name: baidu-site-verification + # content: xxxxxxx + +# -------------------------------------- +# Beautify / Effect +# -------------------------------------- + +# Theme color for customize +# Notice: color value must in double quotes like "#000" or may cause error! + +# theme_color: +# enable: true +# main: "#49B1F5" +# paginator: "#00c4b6" +# button_hover: "#FF7242" +# text_selection: "#00c4b6" +# link_color: "#99a9bf" +# meta_color: "#858585" +# hr_color: "#A4D8FA" +# code_foreground: "#F47466" +# code_background: "rgba(27, 31, 35, .05)" +# toc_color: "#00c4b6" +# blockquote_padding_color: "#49b1f5" +# blockquote_background_color: "#49b1f5" +# scrollbar_color: "#49b1f5" +# meta_theme_color_light: "ffffff" +# meta_theme_color_dark: "#0d0d0d" + +# The user interface setting of category and tag page +# Choose: index - same as Homepage UI / default - same as archives UI +# leave it empty or index +category_ui: +tag_ui: + +# Rounded corners for UI elements +rounded_corners_ui: true + +# Stretches the lines so that each line has equal width +text_align_justify: false + +# Add a mask to the header and footer +mask: + header: true + footer: true + +# Loading Animation +preloader: + enable: false + # source + # 1. fullpage-loading + # 2. pace (progress bar) + source: 1 + # pace theme (see https://codebyzach.github.io/pace/) + pace_css_url: + +# Page Transition +enter_transitions: true + +# Default display mode - light (default) / dark +display_mode: light + +# Configuration for beautifying the content of the article +beautify: + enable: false + # Specify the field to beautify (site or post) + field: post + # Specify the icon to be used as a prefix for the title, such as '\f0c1' + title_prefix_icon: + # Specify the color of the title prefix icon, such as '#F47466' + title_prefix_icon_color: + +# Global font settings +# Don't modify the following settings unless you know how they work +font: + global_font_size: + code_font_size: + font_family: + code_font_family: + +# Font settings for the site title and site subtitle +blog_title_font: + font_link: + font_family: + +# The setting of divider icon +hr_icon: + enable: true + # The unicode value of Font Awesome icon, such as '\3423' + icon: + icon_top: + +# Typewriter Effect +# https://github.com/disjukr/activate-power-mode +activate_power_mode: + enable: false + colorful: true + shake: true + mobile: false + +# Background effects +# -------------------------------------- + +# canvas_ribbon +# See: https://github.com/hustcc/ribbon.js +canvas_ribbon: + enable: false + # The size of ribbon + size: 150 + # The opacity of ribbon (0 ~ 1) + alpha: 0.6 + zIndex: -1 + click_to_change: false + mobile: false + +# Fluttering Ribbon +canvas_fluttering_ribbon: + enable: false + mobile: false + +# canvas_nest +# https://github.com/hustcc/canvas-nest.js +canvas_nest: + enable: false + # Color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.) + color: '0,0,255' + # The opacity of line (0~1) + opacity: 0.7 + # The z-index property of the background + zIndex: -1 + # The number of lines + count: 99 + mobile: false + +# Mouse click effects: fireworks +fireworks: + enable: false + zIndex: 9999 + mobile: false + +# Mouse click effects: Heart symbol +click_heart: + enable: false + mobile: false + +# Mouse click effects: words +clickShowText: + enable: false + text: + # - I + # - LOVE + # - YOU + fontSize: 15px + random: false + mobile: false + +# -------------------------------------- +# Lightbox Settings +# -------------------------------------- + +# Choose: fancybox / medium_zoom +# https://github.com/francoischalifour/medium-zoom +# https://fancyapps.com/fancybox/ +# Leave it empty if you don't need lightbox +lightbox: + +# -------------------------------------- +# Tag Plugins settings +# -------------------------------------- + +# Series +series: + enable: false + # Order by title or date + orderBy: 'title' + # Sort of order. 1, asc for ascending; -1, desc for descending + order: 1 + number: true + +# ABCJS - The ABC Music Notation Plugin +# https://github.com/paulrosen/abcjs +abcjs: + enable: false + per_page: true + +# Mermaid +# https://github.com/mermaid-js/mermaid +mermaid: + enable: false + # Write Mermaid diagrams using code blocks + code_write: false + # built-in themes: default / forest / dark / neutral + theme: + light: default + dark: dark + +# chartjs +# see https://www.chartjs.org/docs/latest/ +chartjs: + enable: false + # Do not modify unless you understand how they work. + # The default settings are only used when the MD syntax is not specified. + # General font color for the chart + fontColor: + light: 'rgba(0, 0, 0, 0.8)' + dark: 'rgba(255, 255, 255, 0.8)' + # General border color for the chart + borderColor: + light: 'rgba(0, 0, 0, 0.1)' + dark: 'rgba(255, 255, 255, 0.2)' + # Background color for scale labels on radar and polar area charts + scale_ticks_backdropColor: + light: 'transparent' + dark: 'transparent' + +# Note - Bootstrap Callout +note: + # Note tag style values: + # - simple bs-callout old alert style. Default. + # - modern bs-callout new (v2-v3) alert style. + # - flat flat callout style with background, like on Mozilla or StackOverflow. + # - disabled disable all CSS styles import of note tag. + style: flat + icons: true + border_radius: 3 + # Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6). + # Offset also applied to label tag variables. This option can work with disabled note tag. + light_bg_offset: 0 + +# -------------------------------------- +# Other Settings +# -------------------------------------- + +# https://github.com/MoOx/pjax +pjax: + enable: false + # Exclude the specified pages from pjax, such as '/music/' + exclude: + # - /xxxxxx/ + +# Inject the css and script (aplayer/meting) +aplayerInject: + enable: false + per_page: true + +# Snackbar - Toast Notification +# https://github.com/polonel/SnackBar +# position: top-left / top-center / top-right / bottom-left / bottom-center / bottom-right +snackbar: + enable: false + position: bottom-left + # The background color of Toast Notification in light mode and dark mode + bg_light: '#49b1f5' + bg_dark: '#1f1f1f' + +# Instant.page +# https://instant.page/ +instantpage: false + +# Lazyload +# https://github.com/verlok/vanilla-lazyload +lazyload: + enable: false + # Specify the field to use lazyload (site or post) + field: site + placeholder: + blur: false + +# PWA +# See https://github.com/JLHwung/hexo-offline +# --------------- +pwa: + enable: false + manifest: + apple_touch_icon: + favicon_32_32: + favicon_16_16: + mask_icon: + +# Open graph meta tags +# https://hexo.io/docs/helpers#open-graph +Open_Graph_meta: + enable: true + option: + # twitter_card: + # twitter_image: + # twitter_id: + # twitter_site: + # google_plus: + # fb_admins: + # fb_app_id: + +# Structured Data +# https://developers.google.com/search/docs/guides/intro-structured-data +structured_data: true + +# Add the vendor prefixes to ensure compatibility +css_prefix: true + +# Inject +# Insert the code to head (before '' tag) and the bottom (before '' tag) +inject: + head: + # - + bottom: + # - + +# CDN Settings +# Don't modify the following settings unless you know how they work +CDN: + # The CDN provider for internal and third-party scripts + # Options for both: local/jsdelivr/unpkg/cdnjs/custom + # Note: Dev version can only use 'local' for internal scripts + # Note: When setting third-party scripts to 'local', you need to install hexo-butterfly-extjs + internal_provider: local + third_party_provider: jsdelivr + + # Add version number to url, true or false + version: false + + # Custom format + # For example: https://cdn.staticfile.org/${cdnjs_name}/${version}/${min_cdnjs_file} + custom_format: + + option: + # abcjs_basic_js: + # activate_power_mode: + # algolia_js: + # algolia_search: + # aplayer_css: + # aplayer_js: + # artalk_css: + # artalk_js: + # blueimp_md5: + # busuanzi: + # canvas_fluttering_ribbon: + # canvas_nest: + # canvas_ribbon: + # chartjs: + # click_heart: + # clickShowText: + # disqusjs: + # disqusjs_css: + # docsearch_css: + # docsearch_js: + # egjs_infinitegrid: + # fancybox: + # fancybox_css: + # fireworks: + # fontawesome: + # gitalk: + # gitalk_css: + # giscus: + # instantpage: + # instantsearch: + # katex: + # katex_copytex: + # lazyload: + # local_search: + # main: + # main_css: + # mathjax: + # medium_zoom: + # mermaid: + # meting_js: + # prismjs_autoloader: + # prismjs_js: + # prismjs_lineNumber_js: + # pjax: + # sharejs: + # sharejs_css: + # snackbar: + # snackbar_css: + # translate: + # twikoo: + # typed: + # utils: + # valine: + # waline_css: + # waline_js: diff --git a/languages/default.yml b/languages/default.yml index f35cb35..2fe206f 100644 --- a/languages/default.yml +++ b/languages/default.yml @@ -1,121 +1,121 @@ -footer: - framework: Framework - theme: Theme - -copy: - success: Copy Successful - error: Copy Failed - noSupport: Browser Not Supported - -page: - articles: All Articles - tag: Tag - category: Category - archives: Archives - -card_post_count: comments - -no_title: Untitled - -post: - created: Created - updated: Updated - wordcount: Word Count - min2read: Reading Time - min2read_unit: mins - page_pv: Post Views - comments: Comments - copyright: - author: Author - link: Link - copyright_notice: Copyright Notice - copyright_content: 'All articles on this blog are licensed under %s unless otherwise stated.' - recommend: Related Articles - edit: Edit - -search: - title: Search - load_data: Loading Database - input_placeholder: Search for Posts - algolia_search: - hits_empty: 'No results found for: ${query}' - hits_stats: '${hits} results found in ${time} ms' - local_search: - hits_empty: 'No results found for: ${query}' - hits_stats: '${hits} articles found' - -pagination: - prev: Previous - next: Next - -comment: Comments - -aside: - articles: Articles - tags: Tags - categories: Categories - card_announcement: Announcement - card_categories: Categories - card_tags: Tags - card_archives: Archives - card_recent_post: Recent Posts - card_webinfo: - headline: Website Info - article_name: Article Count - runtime: - name: Runtime - unit: days - last_push_date: - name: Last Update - site_wordcount: Total Word Count - site_uv_name: Unique Visitors - site_pv_name: Page Views - more_button: View More - card_newest_comments: - headline: Latest Comments - loading_text: Loading... - error: Unable to retrieve comments, please check the configuration - zero: No comments - image: Image - link: Link - code: Code - card_toc: Contents - card_post_series: Post Series - -date_suffix: - just: Just now - min: minutes ago - hour: hours ago - day: days ago - month: months ago - -donate: Sponsor -share: Share - -rightside: - readmode_title: Reading Mode - translate_title: Toggle Between Traditional and Simplified Chinese - night_mode_title: Toggle Between Light and Dark Mode - back_to_top: Back to Top - toc: Table of Contents - scroll_to_comment: Scroll to Comments - setting: Settings - aside: Toggle Between Single-column and Double-column - chat: Chat - -copy_copyright: - author: Author - link: Link - source: Source - info: Copyright belongs to the author. For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source. - -Snackbar: - chs_to_cht: You have switched to Traditional Chinese - cht_to_chs: You have switched to Simplified Chinese - day_to_night: You have switched to Dark Mode - night_to_day: You have switched to Light Mode - -loading: Loading... -load_more: Load More - -error404: Page Not Found +footer: + framework: Framework + theme: Theme + +copy: + success: Copy Successful + error: Copy Failed + noSupport: Browser Not Supported + +page: + articles: All Articles + tag: Tag + category: Category + archives: Archives + +card_post_count: comments + +no_title: Untitled + +post: + created: Created + updated: Updated + wordcount: Word Count + min2read: Reading Time + min2read_unit: mins + page_pv: Post Views + comments: Comments + copyright: + author: Author + link: Link + copyright_notice: Copyright Notice + copyright_content: 'All articles on this blog are licensed under %s unless otherwise stated.' + recommend: Related Articles + edit: Edit + +search: + title: Search + load_data: Loading Database + input_placeholder: Search for Posts + algolia_search: + hits_empty: 'No results found for: ${query}' + hits_stats: '${hits} results found in ${time} ms' + local_search: + hits_empty: 'No results found for: ${query}' + hits_stats: '${hits} articles found' + +pagination: + prev: Previous + next: Next + +comment: Comments + +aside: + articles: Articles + tags: Tags + categories: Categories + card_announcement: Announcement + card_categories: Categories + card_tags: Tags + card_archives: Archives + card_recent_post: Recent Posts + card_webinfo: + headline: Website Info + article_name: Article Count + runtime: + name: Runtime + unit: days + last_push_date: + name: Last Update + site_wordcount: Total Word Count + site_uv_name: Unique Visitors + site_pv_name: Page Views + more_button: View More + card_newest_comments: + headline: Latest Comments + loading_text: Loading... + error: Unable to retrieve comments, please check the configuration + zero: No comments + image: Image + link: Link + code: Code + card_toc: Contents + card_post_series: Post Series + +date_suffix: + just: Just now + min: minutes ago + hour: hours ago + day: days ago + month: months ago + +donate: Sponsor +share: Share + +rightside: + readmode_title: Reading Mode + translate_title: Toggle Between Traditional and Simplified Chinese + night_mode_title: Toggle Between Light and Dark Mode + back_to_top: Back to Top + toc: Table of Contents + scroll_to_comment: Scroll to Comments + setting: Settings + aside: Toggle Between Single-column and Double-column + chat: Chat + +copy_copyright: + author: Author + link: Link + source: Source + info: Copyright belongs to the author. For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source. + +Snackbar: + chs_to_cht: You have switched to Traditional Chinese + cht_to_chs: You have switched to Simplified Chinese + day_to_night: You have switched to Dark Mode + night_to_day: You have switched to Light Mode + +loading: Loading... +load_more: Load More + +error404: Page Not Found diff --git a/languages/en.yml b/languages/en.yml index f35cb35..2fe206f 100644 --- a/languages/en.yml +++ b/languages/en.yml @@ -1,121 +1,121 @@ -footer: - framework: Framework - theme: Theme - -copy: - success: Copy Successful - error: Copy Failed - noSupport: Browser Not Supported - -page: - articles: All Articles - tag: Tag - category: Category - archives: Archives - -card_post_count: comments - -no_title: Untitled - -post: - created: Created - updated: Updated - wordcount: Word Count - min2read: Reading Time - min2read_unit: mins - page_pv: Post Views - comments: Comments - copyright: - author: Author - link: Link - copyright_notice: Copyright Notice - copyright_content: 'All articles on this blog are licensed under %s unless otherwise stated.' - recommend: Related Articles - edit: Edit - -search: - title: Search - load_data: Loading Database - input_placeholder: Search for Posts - algolia_search: - hits_empty: 'No results found for: ${query}' - hits_stats: '${hits} results found in ${time} ms' - local_search: - hits_empty: 'No results found for: ${query}' - hits_stats: '${hits} articles found' - -pagination: - prev: Previous - next: Next - -comment: Comments - -aside: - articles: Articles - tags: Tags - categories: Categories - card_announcement: Announcement - card_categories: Categories - card_tags: Tags - card_archives: Archives - card_recent_post: Recent Posts - card_webinfo: - headline: Website Info - article_name: Article Count - runtime: - name: Runtime - unit: days - last_push_date: - name: Last Update - site_wordcount: Total Word Count - site_uv_name: Unique Visitors - site_pv_name: Page Views - more_button: View More - card_newest_comments: - headline: Latest Comments - loading_text: Loading... - error: Unable to retrieve comments, please check the configuration - zero: No comments - image: Image - link: Link - code: Code - card_toc: Contents - card_post_series: Post Series - -date_suffix: - just: Just now - min: minutes ago - hour: hours ago - day: days ago - month: months ago - -donate: Sponsor -share: Share - -rightside: - readmode_title: Reading Mode - translate_title: Toggle Between Traditional and Simplified Chinese - night_mode_title: Toggle Between Light and Dark Mode - back_to_top: Back to Top - toc: Table of Contents - scroll_to_comment: Scroll to Comments - setting: Settings - aside: Toggle Between Single-column and Double-column - chat: Chat - -copy_copyright: - author: Author - link: Link - source: Source - info: Copyright belongs to the author. For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source. - -Snackbar: - chs_to_cht: You have switched to Traditional Chinese - cht_to_chs: You have switched to Simplified Chinese - day_to_night: You have switched to Dark Mode - night_to_day: You have switched to Light Mode - -loading: Loading... -load_more: Load More - -error404: Page Not Found +footer: + framework: Framework + theme: Theme + +copy: + success: Copy Successful + error: Copy Failed + noSupport: Browser Not Supported + +page: + articles: All Articles + tag: Tag + category: Category + archives: Archives + +card_post_count: comments + +no_title: Untitled + +post: + created: Created + updated: Updated + wordcount: Word Count + min2read: Reading Time + min2read_unit: mins + page_pv: Post Views + comments: Comments + copyright: + author: Author + link: Link + copyright_notice: Copyright Notice + copyright_content: 'All articles on this blog are licensed under %s unless otherwise stated.' + recommend: Related Articles + edit: Edit + +search: + title: Search + load_data: Loading Database + input_placeholder: Search for Posts + algolia_search: + hits_empty: 'No results found for: ${query}' + hits_stats: '${hits} results found in ${time} ms' + local_search: + hits_empty: 'No results found for: ${query}' + hits_stats: '${hits} articles found' + +pagination: + prev: Previous + next: Next + +comment: Comments + +aside: + articles: Articles + tags: Tags + categories: Categories + card_announcement: Announcement + card_categories: Categories + card_tags: Tags + card_archives: Archives + card_recent_post: Recent Posts + card_webinfo: + headline: Website Info + article_name: Article Count + runtime: + name: Runtime + unit: days + last_push_date: + name: Last Update + site_wordcount: Total Word Count + site_uv_name: Unique Visitors + site_pv_name: Page Views + more_button: View More + card_newest_comments: + headline: Latest Comments + loading_text: Loading... + error: Unable to retrieve comments, please check the configuration + zero: No comments + image: Image + link: Link + code: Code + card_toc: Contents + card_post_series: Post Series + +date_suffix: + just: Just now + min: minutes ago + hour: hours ago + day: days ago + month: months ago + +donate: Sponsor +share: Share + +rightside: + readmode_title: Reading Mode + translate_title: Toggle Between Traditional and Simplified Chinese + night_mode_title: Toggle Between Light and Dark Mode + back_to_top: Back to Top + toc: Table of Contents + scroll_to_comment: Scroll to Comments + setting: Settings + aside: Toggle Between Single-column and Double-column + chat: Chat + +copy_copyright: + author: Author + link: Link + source: Source + info: Copyright belongs to the author. For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source. + +Snackbar: + chs_to_cht: You have switched to Traditional Chinese + cht_to_chs: You have switched to Simplified Chinese + day_to_night: You have switched to Dark Mode + night_to_day: You have switched to Light Mode + +loading: Loading... +load_more: Load More + +error404: Page Not Found diff --git a/languages/ja.yml b/languages/ja.yml index 1a291f8..f1ccbb7 100644 --- a/languages/ja.yml +++ b/languages/ja.yml @@ -1,121 +1,121 @@ -footer: - framework: フレームワーク - theme: テーマ - -copy: - success: コピー成功 - error: コピー失敗 - noSupport: ブラウザが対応していません - -page: - articles: 記事一覧 - tag: タグ - category: カテゴリ - archives: アーカイブ - -card_post_count: コメント数 - -no_title: タイトルなし - -post: - created: 作成日 - updated: 更新日 - wordcount: 総文字数 - min2read: 読む時間 - min2read_unit: 分 - page_pv: 閲覧数 - comments: コメント数 - copyright: - author: 著者 - link: リンク - copyright_notice: 著作権表示 - copyright_content: 'このブログのすべての記事は、%s ライセンスの下で提供されており、特に明記されていない限り、すべての権利を留保します。転載時には出典を明記してください: %s。' - recommend: 関連記事 - edit: 編集 - -search: - title: 検索 - load_data: データベースを読み込んでいます - input_placeholder: 記事を検索 - algolia_search: - hits_empty: '${query} の検索結果が見つかりませんでした。' - hits_stats: '${hits} 件の結果が ${time}ms で見つかりました' - local_search: - hits_empty: '${query} の検索結果が見つかりませんでした。' - hits_stats: '${hits} 件の記事が見つかりました' - -pagination: - prev: 前へ - next: 次へ - -comment: コメント - -aside: - articles: 記事 - tags: タグ - categories: カテゴリ - card_announcement: お知らせ - card_categories: カテゴリ - card_tags: タグ - card_archives: アーカイブ - card_recent_post: 最近の記事 - card_webinfo: - headline: サイト情報 - article_name: 記事数 - runtime: - name: 稼働時間 - unit: 日 - last_push_date: - name: 最終更新日 - site_wordcount: 総文字数 - site_uv_name: ユーザー数 - site_pv_name: ページビュー数 - more_button: もっと見る - card_newest_comments: - headline: 最新コメント - loading_text: ローディング中... - error: コメントを取得できませんでした。設定を確認してください。 - zero: コメントがありません - image: 画像 - link: リンク - code: コード - card_toc: 目次 - card_post_series: シリーズ記事 - -date_suffix: - just: たった今 - min: 分前 - hour: 時間前 - day: 日前 - month: ヶ月前 - -donate: 寄付 -share: 共有 - -rightside: - readmode_title: 読書モード - translate_title: 簡体字と繁体字の切り替え - night_mode_title: ライトモード/ダークモード切り替え - back_to_top: トップに戻る - toc: 目次 - scroll_to_comment: コメントへ移動 - setting: 設定 - aside: シングルカラムとダブルカラムの切り替え - chat: チャット - -copy_copyright: - author: 著者 - link: リンク - source: ソース - info: 著作権は著者に帰属します。商業的利用の場合は著者に連絡して許可を得てください。非商業的利用の場合は出典を明記してください。 - -Snackbar: - chs_to_cht: 繁体字に切り替えました - cht_to_chs: 簡体字に切り替えました - day_to_night: ダークモードに切り替えました - night_to_day: ライトモードに切り替えました - -loading: ローディング中... -load_more: もっと見る - -error404: ページが見つかりません +footer: + framework: フレームワーク + theme: テーマ + +copy: + success: コピー成功 + error: コピー失敗 + noSupport: ブラウザが対応していません + +page: + articles: 記事一覧 + tag: タグ + category: カテゴリ + archives: アーカイブ + +card_post_count: コメント数 + +no_title: タイトルなし + +post: + created: 作成日 + updated: 更新日 + wordcount: 総文字数 + min2read: 読む時間 + min2read_unit: 分 + page_pv: 閲覧数 + comments: コメント数 + copyright: + author: 著者 + link: リンク + copyright_notice: 著作権表示 + copyright_content: 'このブログのすべての記事は、%s ライセンスの下で提供されており、特に明記されていない限り、すべての権利を留保します。転載時には出典を明記してください: %s。' + recommend: 関連記事 + edit: 編集 + +search: + title: 検索 + load_data: データベースを読み込んでいます + input_placeholder: 記事を検索 + algolia_search: + hits_empty: '${query} の検索結果が見つかりませんでした。' + hits_stats: '${hits} 件の結果が ${time}ms で見つかりました' + local_search: + hits_empty: '${query} の検索結果が見つかりませんでした。' + hits_stats: '${hits} 件の記事が見つかりました' + +pagination: + prev: 前へ + next: 次へ + +comment: コメント + +aside: + articles: 記事 + tags: タグ + categories: カテゴリ + card_announcement: お知らせ + card_categories: カテゴリ + card_tags: タグ + card_archives: アーカイブ + card_recent_post: 最近の記事 + card_webinfo: + headline: サイト情報 + article_name: 記事数 + runtime: + name: 稼働時間 + unit: 日 + last_push_date: + name: 最終更新日 + site_wordcount: 総文字数 + site_uv_name: ユーザー数 + site_pv_name: ページビュー数 + more_button: もっと見る + card_newest_comments: + headline: 最新コメント + loading_text: ローディング中... + error: コメントを取得できませんでした。設定を確認してください。 + zero: コメントがありません + image: 画像 + link: リンク + code: コード + card_toc: 目次 + card_post_series: シリーズ記事 + +date_suffix: + just: たった今 + min: 分前 + hour: 時間前 + day: 日前 + month: ヶ月前 + +donate: 寄付 +share: 共有 + +rightside: + readmode_title: 読書モード + translate_title: 簡体字と繁体字の切り替え + night_mode_title: ライトモード/ダークモード切り替え + back_to_top: トップに戻る + toc: 目次 + scroll_to_comment: コメントへ移動 + setting: 設定 + aside: シングルカラムとダブルカラムの切り替え + chat: チャット + +copy_copyright: + author: 著者 + link: リンク + source: ソース + info: 著作権は著者に帰属します。商業的利用の場合は著者に連絡して許可を得てください。非商業的利用の場合は出典を明記してください。 + +Snackbar: + chs_to_cht: 繁体字に切り替えました + cht_to_chs: 簡体字に切り替えました + day_to_night: ダークモードに切り替えました + night_to_day: ライトモードに切り替えました + +loading: ローディング中... +load_more: もっと見る + +error404: ページが見つかりません diff --git a/languages/ko.yml b/languages/ko.yml index 7dca8da..b94c365 100644 --- a/languages/ko.yml +++ b/languages/ko.yml @@ -1,121 +1,121 @@ -footer: - framework: 프레임워크 - theme: 테마 - -copy: - success: 복사 성공 - error: 복사 실패 - noSupport: 브라우저가 지원되지 않음 - -page: - articles: 모든 글 - tag: 태그 - category: 카테고리 - archives: 아카이브 - -card_post_count: 댓글 수 - -no_title: 제목 없음 - -post: - created: 작성일 - updated: 수정일 - wordcount: 총 글자 수 - min2read: 읽기 시간 - min2read_unit: 분 - page_pv: 조회수 - comments: 댓글 - copyright: - author: 작성자 - link: 링크 - copyright_notice: 저작권 고지 - copyright_content: '이 블로그의 모든 글은 %s 라이선스를 따르며, 별도로 명시되지 않는 한 모든 권리를 보유합니다. 재배포 시 출처를 명시해 주세요: %s.' - recommend: 관련 글 - edit: 편집 - -search: - title: 검색 - load_data: 데이터베이스 로드 중 - input_placeholder: 글 검색 - algolia_search: - hits_empty: '${query}에 대한 결과를 찾을 수 없습니다.' - hits_stats: '${hits}개의 결과를 ${time}ms 만에 찾음' - local_search: - hits_empty: '${query}에 대한 결과를 찾을 수 없습니다.' - hits_stats: '${hits}개의 글을 찾음' - -pagination: - prev: 이전 - next: 다음 - -comment: 댓글 - -aside: - articles: 글 - tags: 태그 - categories: 카테고리 - card_announcement: 공지 - card_categories: 카테고리 - card_tags: 태그 - card_archives: 아카이브 - card_recent_post: 최근 글 - card_webinfo: - headline: 사이트 정보 - article_name: 글 수 - runtime: - name: 운영 시간 - unit: 일 - last_push_date: - name: 마지막 업데이트 - site_wordcount: 총 글자 수 - site_uv_name: 방문자 수 - site_pv_name: 총 조회수 - more_button: 더 보기 - card_newest_comments: - headline: 최신 댓글 - loading_text: 로딩 중... - error: 댓글을 가져올 수 없습니다. 설정을 확인해 주세요. - zero: 댓글 없음 - image: 이미지 - link: 링크 - code: 코드 - card_toc: 목차 - card_post_series: 시리즈 글 - -date_suffix: - just: 방금 - min: 분 전 - hour: 시간 전 - day: 일 전 - month: 달 전 - -donate: 후원 -share: 공유 - -rightside: - readmode_title: 읽기 모드 - translate_title: 번체와 간체 전환 - night_mode_title: 라이트/다크 모드 전환 - back_to_top: 맨 위로 - toc: 목차 - scroll_to_comment: 댓글로 이동 - setting: 설정 - aside: 단일/이중 열 전환 - chat: 채팅 - -copy_copyright: - author: 작성자 - link: 링크 - source: 출처 - info: 저작권은 작성자에게 있습니다. 상업적 사용을 위해서는 작성자의 허가를 받아야 하며, 비상업적 사용 시에는 출처를 명시해 주세요. - -Snackbar: - chs_to_cht: 번체로 전환되었습니다. - cht_to_chs: 간체로 전환되었습니다. - day_to_night: 다크 모드로 전환되었습니다. - night_to_day: 라이트 모드로 전환되었습니다. - -loading: 로딩 중... -load_more: 더 보기 - -error404: 페이지를 찾을 수 없습니다. +footer: + framework: 프레임워크 + theme: 테마 + +copy: + success: 복사 성공 + error: 복사 실패 + noSupport: 브라우저가 지원되지 않음 + +page: + articles: 모든 글 + tag: 태그 + category: 카테고리 + archives: 아카이브 + +card_post_count: 댓글 수 + +no_title: 제목 없음 + +post: + created: 작성일 + updated: 수정일 + wordcount: 총 글자 수 + min2read: 읽기 시간 + min2read_unit: 분 + page_pv: 조회수 + comments: 댓글 + copyright: + author: 작성자 + link: 링크 + copyright_notice: 저작권 고지 + copyright_content: '이 블로그의 모든 글은 %s 라이선스를 따르며, 별도로 명시되지 않는 한 모든 권리를 보유합니다. 재배포 시 출처를 명시해 주세요: %s.' + recommend: 관련 글 + edit: 편집 + +search: + title: 검색 + load_data: 데이터베이스 로드 중 + input_placeholder: 글 검색 + algolia_search: + hits_empty: '${query}에 대한 결과를 찾을 수 없습니다.' + hits_stats: '${hits}개의 결과를 ${time}ms 만에 찾음' + local_search: + hits_empty: '${query}에 대한 결과를 찾을 수 없습니다.' + hits_stats: '${hits}개의 글을 찾음' + +pagination: + prev: 이전 + next: 다음 + +comment: 댓글 + +aside: + articles: 글 + tags: 태그 + categories: 카테고리 + card_announcement: 공지 + card_categories: 카테고리 + card_tags: 태그 + card_archives: 아카이브 + card_recent_post: 최근 글 + card_webinfo: + headline: 사이트 정보 + article_name: 글 수 + runtime: + name: 운영 시간 + unit: 일 + last_push_date: + name: 마지막 업데이트 + site_wordcount: 총 글자 수 + site_uv_name: 방문자 수 + site_pv_name: 총 조회수 + more_button: 더 보기 + card_newest_comments: + headline: 최신 댓글 + loading_text: 로딩 중... + error: 댓글을 가져올 수 없습니다. 설정을 확인해 주세요. + zero: 댓글 없음 + image: 이미지 + link: 링크 + code: 코드 + card_toc: 목차 + card_post_series: 시리즈 글 + +date_suffix: + just: 방금 + min: 분 전 + hour: 시간 전 + day: 일 전 + month: 달 전 + +donate: 후원 +share: 공유 + +rightside: + readmode_title: 읽기 모드 + translate_title: 번체와 간체 전환 + night_mode_title: 라이트/다크 모드 전환 + back_to_top: 맨 위로 + toc: 목차 + scroll_to_comment: 댓글로 이동 + setting: 설정 + aside: 단일/이중 열 전환 + chat: 채팅 + +copy_copyright: + author: 작성자 + link: 링크 + source: 출처 + info: 저작권은 작성자에게 있습니다. 상업적 사용을 위해서는 작성자의 허가를 받아야 하며, 비상업적 사용 시에는 출처를 명시해 주세요. + +Snackbar: + chs_to_cht: 번체로 전환되었습니다. + cht_to_chs: 간체로 전환되었습니다. + day_to_night: 다크 모드로 전환되었습니다. + night_to_day: 라이트 모드로 전환되었습니다. + +loading: 로딩 중... +load_more: 더 보기 + +error404: 페이지를 찾을 수 없습니다. diff --git a/languages/zh-CN.yml b/languages/zh-CN.yml index 1afa96b..32ff836 100644 --- a/languages/zh-CN.yml +++ b/languages/zh-CN.yml @@ -1,122 +1,122 @@ -footer: - framework: 框架 - theme: 主题 - -copy: - success: 复制成功 - error: 复制失败 - noSupport: 浏览器不支持 - -page: - articles: 全部文章 - tag: 标签 - category: 分类 - archives: 归档 - -card_post_count: 条评论 - -no_title: 无标题 - -post: - created: 发表于 - updated: 更新于 - wordcount: 总字数 - min2read: 阅读时长 - min2read_unit: 分钟 - page_pv: 浏览量 - comments: 评论数 - copyright: - author: 文章作者 - link: 文章链接 - copyright_notice: 版权声明 - copyright_content: '本博客所有文章除特别声明外，均采用 - %s 许可协议。转载请注明来源 %s！' - recommend: 相关推荐 - edit: 编辑 - -search: - title: 搜索 - load_data: 数据加载中 - input_placeholder: 搜索文章 - algolia_search: - hits_empty: '未找到符合您查询的内容：${query}' - hits_stats: '找到 ${hits} 条结果，耗时 ${time} 毫秒' - local_search: - hits_empty: '未找到符合您查询的内容：${query}' - hits_stats: '共找到 ${hits} 篇文章' - -pagination: - prev: 上一篇 - next: 下一篇 - -comment: 评论 - -aside: - articles: 文章 - tags: 标签 - categories: 分类 - card_announcement: 公告 - card_categories: 分类 - card_tags: 标签 - card_archives: 归档 - card_recent_post: 最新文章 - card_webinfo: - headline: 网站信息 - article_name: 文章数目 - runtime: - name: 运行时间 - unit: 天 - last_push_date: - name: 最后更新时间 - site_wordcount: 本站总字数 - site_uv_name: 本站访客数 - site_pv_name: 本站总浏览量 - more_button: 查看更多 - card_newest_comments: - headline: 最新评论 - loading_text: 加载中... - error: 无法获取评论，请确认相关配置是否正确 - zero: 暂无评论 - image: 图片 - link: 链接 - code: 代码 - card_toc: 目录 - card_post_series: 系列文章 - -date_suffix: - just: 刚刚 - min: 分钟前 - hour: 小时前 - day: 天前 - month: 个月前 - -donate: 赞助 -share: 分享 - -rightside: - readmode_title: 阅读模式 - translate_title: 简繁转换 - night_mode_title: 日间和夜间模式切换 - back_to_top: 回到顶部 - toc: 目录 - scroll_to_comment: 前往评论 - setting: 设置 - aside: 单栏和双栏切换 - chat: 聊天 - -copy_copyright: - author: 作者 - link: 链接 - source: 来源 - info: 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 - -Snackbar: - chs_to_cht: 已切换为繁体中文 - cht_to_chs: 已切换为简体中文 - day_to_night: 已切换为深色模式 - night_to_day: 已切换为浅色模式 - -loading: 加载中... -load_more: 加载更多 - -error404: 页面未找到 +footer: + framework: 框架 + theme: 主题 + +copy: + success: 复制成功 + error: 复制失败 + noSupport: 浏览器不支持 + +page: + articles: 全部文章 + tag: 标签 + category: 分类 + archives: 归档 + +card_post_count: 条评论 + +no_title: 无标题 + +post: + created: 发表于 + updated: 更新于 + wordcount: 总字数 + min2read: 阅读时长 + min2read_unit: 分钟 + page_pv: 浏览量 + comments: 评论数 + copyright: + author: 文章作者 + link: 文章链接 + copyright_notice: 版权声明 + copyright_content: '本博客所有文章除特别声明外，均采用 + %s 许可协议。转载请注明来源 %s！' + recommend: 相关推荐 + edit: 编辑 + +search: + title: 搜索 + load_data: 数据加载中 + input_placeholder: 搜索文章 + algolia_search: + hits_empty: '未找到符合您查询的内容：${query}' + hits_stats: '找到 ${hits} 条结果，耗时 ${time} 毫秒' + local_search: + hits_empty: '未找到符合您查询的内容：${query}' + hits_stats: '共找到 ${hits} 篇文章' + +pagination: + prev: 上一篇 + next: 下一篇 + +comment: 评论 + +aside: + articles: 文章 + tags: 标签 + categories: 分类 + card_announcement: 公告 + card_categories: 分类 + card_tags: 标签 + card_archives: 归档 + card_recent_post: 最新文章 + card_webinfo: + headline: 网站信息 + article_name: 文章数目 + runtime: + name: 运行时间 + unit: 天 + last_push_date: + name: 最后更新时间 + site_wordcount: 本站总字数 + site_uv_name: 本站访客数 + site_pv_name: 本站总浏览量 + more_button: 查看更多 + card_newest_comments: + headline: 最新评论 + loading_text: 加载中... + error: 无法获取评论，请确认相关配置是否正确 + zero: 暂无评论 + image: 图片 + link: 链接 + code: 代码 + card_toc: 目录 + card_post_series: 系列文章 + +date_suffix: + just: 刚刚 + min: 分钟前 + hour: 小时前 + day: 天前 + month: 个月前 + +donate: 赞助 +share: 分享 + +rightside: + readmode_title: 阅读模式 + translate_title: 简繁转换 + night_mode_title: 日间和夜间模式切换 + back_to_top: 回到顶部 + toc: 目录 + scroll_to_comment: 前往评论 + setting: 设置 + aside: 单栏和双栏切换 + chat: 聊天 + +copy_copyright: + author: 作者 + link: 链接 + source: 来源 + info: 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 + +Snackbar: + chs_to_cht: 已切换为繁体中文 + cht_to_chs: 已切换为简体中文 + day_to_night: 已切换为深色模式 + night_to_day: 已切换为浅色模式 + +loading: 加载中... +load_more: 加载更多 + +error404: 页面未找到 diff --git a/languages/zh-HK.yml b/languages/zh-HK.yml index b1f99d7..0ef4487 100644 --- a/languages/zh-HK.yml +++ b/languages/zh-HK.yml @@ -1,121 +1,121 @@ -footer: - framework: 框架 - theme: 主題 - -copy: - success: 複製成功 - error: 複製失敗 - noSupport: 瀏覽器不支援 - -page: - articles: 全部文章 - tag: 標籤 - category: 分類 - archives: 歸檔 - -card_post_count: 條評論 - -no_title: 無標題 - -post: - created: 發表於 - updated: 更新於 - wordcount: 字數統計 - min2read: 閱讀時間 - min2read_unit: 分鐘 - page_pv: 瀏覽量 - comments: 評論數 - copyright: - author: 文章作者 - link: 文章連結 - copyright_notice: 版權聲明 - copyright_content: '除特別聲明外，本博客所有文章均採用%s 授權協議。轉載請註明出處：%s。' - recommend: 相關文章 - edit: 編輯 - -search: - title: 搜尋 - load_data: 正在加載數據庫 - input_placeholder: 搜尋文章 - algolia_search: - hits_empty: '未找到相關內容：${query}' - hits_stats: '找到 ${hits} 條結果，耗時 ${time} 毫秒' - local_search: - hits_empty: '未找到相關內容：${query}' - hits_stats: '找到 ${hits} 篇文章' - -pagination: - prev: 上一頁 - next: 下一頁 - -comment: 評論 - -aside: - articles: 文章 - tags: 標籤 - categories: 分類 - card_announcement: 公告 - card_categories: 分類 - card_tags: 標籤 - card_archives: 歸檔 - card_recent_post: 最新文章 - card_webinfo: - headline: 網站資訊 - article_name: 文章數目 - runtime: - name: 運行時間 - unit: 天 - last_push_date: - name: 最後更新時間 - site_wordcount: 總字數 - site_uv_name: 訪客數 - site_pv_name: 總瀏覽量 - more_button: 查看更多 - card_newest_comments: - headline: 最新評論 - loading_text: 正在加載... - error: 無法取得評論，請確認配置是否正確 - zero: 暫無評論 - image: 圖片 - link: 連結 - code: 代碼 - card_toc: 目錄 - card_post_series: 系列文章 - -date_suffix: - just: 剛剛 - min: 分鐘前 - hour: 小時前 - day: 天前 - month: 個月前 - -donate: 贊助 -share: 分享 - -rightside: - readmode_title: 閱讀模式 - translate_title: 簡繁轉換 - night_mode_title: 切換日夜模式 - back_to_top: 回到頂部 - toc: 目錄 - scroll_to_comment: 前往評論 - setting: 設定 - aside: 單欄與雙欄切換 - chat: 聊天 - -copy_copyright: - author: 作者 - link: 連結 - source: 來源 - info: 版權屬於作者所有。商業用途請聯絡作者獲得授權，非商業用途請註明出處。 - -Snackbar: - chs_to_cht: 已切換為繁體中文 - cht_to_chs: 已切換為簡體中文 - day_to_night: 已切換為深色模式 - night_to_day: 已切換為淺色模式 - -loading: 正在加載... -load_more: 加載更多 - -error404: 未找到頁面 +footer: + framework: 框架 + theme: 主題 + +copy: + success: 複製成功 + error: 複製失敗 + noSupport: 瀏覽器不支援 + +page: + articles: 全部文章 + tag: 標籤 + category: 分類 + archives: 歸檔 + +card_post_count: 條評論 + +no_title: 無標題 + +post: + created: 發表於 + updated: 更新於 + wordcount: 字數統計 + min2read: 閱讀時間 + min2read_unit: 分鐘 + page_pv: 瀏覽量 + comments: 評論數 + copyright: + author: 文章作者 + link: 文章連結 + copyright_notice: 版權聲明 + copyright_content: '除特別聲明外，本博客所有文章均採用%s 授權協議。轉載請註明出處：%s。' + recommend: 相關文章 + edit: 編輯 + +search: + title: 搜尋 + load_data: 正在加載數據庫 + input_placeholder: 搜尋文章 + algolia_search: + hits_empty: '未找到相關內容：${query}' + hits_stats: '找到 ${hits} 條結果，耗時 ${time} 毫秒' + local_search: + hits_empty: '未找到相關內容：${query}' + hits_stats: '找到 ${hits} 篇文章' + +pagination: + prev: 上一頁 + next: 下一頁 + +comment: 評論 + +aside: + articles: 文章 + tags: 標籤 + categories: 分類 + card_announcement: 公告 + card_categories: 分類 + card_tags: 標籤 + card_archives: 歸檔 + card_recent_post: 最新文章 + card_webinfo: + headline: 網站資訊 + article_name: 文章數目 + runtime: + name: 運行時間 + unit: 天 + last_push_date: + name: 最後更新時間 + site_wordcount: 總字數 + site_uv_name: 訪客數 + site_pv_name: 總瀏覽量 + more_button: 查看更多 + card_newest_comments: + headline: 最新評論 + loading_text: 正在加載... + error: 無法取得評論，請確認配置是否正確 + zero: 暫無評論 + image: 圖片 + link: 連結 + code: 代碼 + card_toc: 目錄 + card_post_series: 系列文章 + +date_suffix: + just: 剛剛 + min: 分鐘前 + hour: 小時前 + day: 天前 + month: 個月前 + +donate: 贊助 +share: 分享 + +rightside: + readmode_title: 閱讀模式 + translate_title: 簡繁轉換 + night_mode_title: 切換日夜模式 + back_to_top: 回到頂部 + toc: 目錄 + scroll_to_comment: 前往評論 + setting: 設定 + aside: 單欄與雙欄切換 + chat: 聊天 + +copy_copyright: + author: 作者 + link: 連結 + source: 來源 + info: 版權屬於作者所有。商業用途請聯絡作者獲得授權，非商業用途請註明出處。 + +Snackbar: + chs_to_cht: 已切換為繁體中文 + cht_to_chs: 已切換為簡體中文 + day_to_night: 已切換為深色模式 + night_to_day: 已切換為淺色模式 + +loading: 正在加載... +load_more: 加載更多 + +error404: 未找到頁面 diff --git a/languages/zh-TW.yml b/languages/zh-TW.yml index c91cb73..c9558ef 100644 --- a/languages/zh-TW.yml +++ b/languages/zh-TW.yml @@ -1,121 +1,121 @@ -footer: - framework: 框架 - theme: 主題 - -copy: - success: 複製成功 - error: 複製失敗 - noSupport: 瀏覽器不支援 - -page: - articles: 所有文章 - tag: 標籤 - category: 分類 - archives: 歸檔 - -card_post_count: 則評論 - -no_title: 無標題 - -post: - created: 發表於 - updated: 更新於 - wordcount: 總字數 - min2read: 閱讀時間 - min2read_unit: 分鐘 - page_pv: 瀏覽量 - comments: 評論數 - copyright: - author: 文章作者 - link: 文章連結 - copyright_notice: 版權聲明 - copyright_content: '本部落格所有文章除特別聲明外，均採用%s 授權協議。轉載請註明來源 %s！' - recommend: 相關推薦 - edit: 編輯 - -search: - title: 搜尋 - load_data: 資料載入中 - input_placeholder: 搜尋文章 - algolia_search: - hits_empty: '找不到符合您查詢的內容：${query}' - hits_stats: '找到 ${hits} 筆結果，耗時 ${time} 毫秒' - local_search: - hits_empty: '找不到符合您查詢的內容：${query}' - hits_stats: '共找到 ${hits} 篇文章' - -pagination: - prev: 上一篇 - next: 下一篇 - -comment: 評論 - -aside: - articles: 文章 - tags: 標籤 - categories: 分類 - card_announcement: 公告 - card_categories: 分類 - card_tags: 標籤 - card_archives: 歸檔 - card_recent_post: 最新文章 - card_webinfo: - headline: 網站資訊 - article_name: 文章數量 - runtime: - name: 運行時間 - unit: 天 - last_push_date: - name: 最後更新時間 - site_wordcount: 總字數 - site_uv_name: 訪客數 - site_pv_name: 總瀏覽量 - more_button: 檢視更多 - card_newest_comments: - headline: 最新評論 - loading_text: 載入中... - error: 無法獲取評論，請確認相關配置是否正確 - zero: 尚無評論 - image: 圖片 - link: 連結 - code: 程式碼 - card_toc: 目錄 - card_post_series: 系列文章 - -date_suffix: - just: 剛剛 - min: 分鐘前 - hour: 小時前 - day: 天前 - month: 個月前 - -donate: 贊助 -share: 分享 - -rightside: - readmode_title: 閱讀模式 - translate_title: 繁簡轉換 - night_mode_title: 日夜模式切換 - back_to_top: 回到頂端 - toc: 目錄 - scroll_to_comment: 前往評論 - setting: 設定 - aside: 單欄和雙欄切換 - chat: 聊天 - -copy_copyright: - author: 作者 - link: 連結 - source: 來源 - info: 著作權歸作者所有。如需商業轉載，請聯絡作者獲得授權，非商業轉載請註明出處。 - -Snackbar: - chs_to_cht: 已切換為繁體中文 - cht_to_chs: 已切換為簡體中文 - day_to_night: 已切換為深色模式 - night_to_day: 已切換為淺色模式 - -loading: 載入中... -load_more: 載入更多 - -error404: 找不到頁面 +footer: + framework: 框架 + theme: 主題 + +copy: + success: 複製成功 + error: 複製失敗 + noSupport: 瀏覽器不支援 + +page: + articles: 所有文章 + tag: 標籤 + category: 分類 + archives: 歸檔 + +card_post_count: 則評論 + +no_title: 無標題 + +post: + created: 發表於 + updated: 更新於 + wordcount: 總字數 + min2read: 閱讀時間 + min2read_unit: 分鐘 + page_pv: 瀏覽量 + comments: 評論數 + copyright: + author: 文章作者 + link: 文章連結 + copyright_notice: 版權聲明 + copyright_content: '本部落格所有文章除特別聲明外，均採用%s 授權協議。轉載請註明來源 %s！' + recommend: 相關推薦 + edit: 編輯 + +search: + title: 搜尋 + load_data: 資料載入中 + input_placeholder: 搜尋文章 + algolia_search: + hits_empty: '找不到符合您查詢的內容：${query}' + hits_stats: '找到 ${hits} 筆結果，耗時 ${time} 毫秒' + local_search: + hits_empty: '找不到符合您查詢的內容：${query}' + hits_stats: '共找到 ${hits} 篇文章' + +pagination: + prev: 上一篇 + next: 下一篇 + +comment: 評論 + +aside: + articles: 文章 + tags: 標籤 + categories: 分類 + card_announcement: 公告 + card_categories: 分類 + card_tags: 標籤 + card_archives: 歸檔 + card_recent_post: 最新文章 + card_webinfo: + headline: 網站資訊 + article_name: 文章數量 + runtime: + name: 運行時間 + unit: 天 + last_push_date: + name: 最後更新時間 + site_wordcount: 總字數 + site_uv_name: 訪客數 + site_pv_name: 總瀏覽量 + more_button: 檢視更多 + card_newest_comments: + headline: 最新評論 + loading_text: 載入中... + error: 無法獲取評論，請確認相關配置是否正確 + zero: 尚無評論 + image: 圖片 + link: 連結 + code: 程式碼 + card_toc: 目錄 + card_post_series: 系列文章 + +date_suffix: + just: 剛剛 + min: 分鐘前 + hour: 小時前 + day: 天前 + month: 個月前 + +donate: 贊助 +share: 分享 + +rightside: + readmode_title: 閱讀模式 + translate_title: 繁簡轉換 + night_mode_title: 日夜模式切換 + back_to_top: 回到頂端 + toc: 目錄 + scroll_to_comment: 前往評論 + setting: 設定 + aside: 單欄和雙欄切換 + chat: 聊天 + +copy_copyright: + author: 作者 + link: 連結 + source: 來源 + info: 著作權歸作者所有。如需商業轉載，請聯絡作者獲得授權，非商業轉載請註明出處。 + +Snackbar: + chs_to_cht: 已切換為繁體中文 + cht_to_chs: 已切換為簡體中文 + day_to_night: 已切換為深色模式 + night_to_day: 已切換為淺色模式 + +loading: 載入中... +load_more: 載入更多 + +error404: 找不到頁面 diff --git a/layout/archive.pug b/layout/archive.pug index 913dedc..31a1b50 100644 --- a/layout/archive.pug +++ b/layout/archive.pug @@ -1,8 +1,8 @@ -extends includes/layout.pug - -block content - include ./includes/mixins/article-sort.pug - #archive - .article-sort-title= `${_p('page.articles')} - ${getArchiveLength()}` - +articleSort(page.posts) +extends includes/layout.pug + +block content + include ./includes/mixins/article-sort.pug + #archive + .article-sort-title= `${_p('page.articles')} - ${getArchiveLength()}` + +articleSort(page.posts) include includes/pagination.pug \ No newline at end of file diff --git a/layout/category.pug b/layout/category.pug index 092be9a..cdc0295 100644 --- a/layout/category.pug +++ b/layout/category.pug @@ -1,12 +1,12 @@ -extends includes/layout.pug - -block content - if theme.category_ui == 'index' - include ./includes/mixins/indexPostUI.pug - +indexPostUI - else - include ./includes/mixins/article-sort.pug - #category - .article-sort-title= _p('page.category') + ' - ' + page.category - +articleSort(page.posts) +extends includes/layout.pug + +block content + if theme.category_ui == 'index' + include ./includes/mixins/indexPostUI.pug + +indexPostUI + else + include ./includes/mixins/article-sort.pug + #category + .article-sort-title= _p('page.category') + ' - ' + page.category + +articleSort(page.posts) include includes/pagination.pug \ No newline at end of file diff --git a/layout/includes/additional-js.pug b/layout/includes/additional-js.pug index b884ced..5312260 100644 --- a/layout/includes/additional-js.pug +++ b/layout/includes/additional-js.pug @@ -1,57 +1,57 @@ -div - script(src=url_for(theme.asset.utils)) - script(src=url_for(theme.asset.main)) - - if theme.translate.enable - script(src=url_for(theme.asset.translate)) - - if theme.lightbox - script(src=url_for(theme.asset[theme.lightbox])) - - if theme.instantpage - script(src=url_for(theme.asset.instantpage), type='module') - - if theme.lazyload.enable && !theme.lazyload.native - script(src=url_for(theme.asset.lazyload)) - - if theme.snackbar.enable - script(src=url_for(theme.asset.snackbar)) - - .js-pjax - if needLoadCountJs - != partial("includes/third-party/card-post-count/index", {}, { cache: true }) - - if loadSubJs - include ./third-party/subtitle.pug - - include ./third-party/math/index.pug - include ./third-party/abcjs/index.pug - - if commentsJsLoad - include ./third-party/comments/js.pug - - != partial("includes/third-party/prismjs", {}, { cache: true }) - - if theme.aside.enable && theme.aside.card_newest_comments.enable - if theme.pjax.enable || (globalPageType !== 'post' && page.aside !== false) - != partial("includes/third-party/newest-comments/index", {}, { cache: true }) - - != fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)}) - - != partial("includes/third-party/effect", {}, { cache: true }) - != partial("includes/third-party/chat/index", {}, { cache: true }) - - if theme.aplayerInject && theme.aplayerInject.enable - if theme.pjax.enable || theme.aplayerInject.per_page || page.aplayer - include ./third-party/aplayer.pug - - if theme.pjax.enable - != partial("includes/third-party/pjax", {}, { cache: true }) - - if theme.umami_analytics.enable - != partial("includes/third-party/umami_analytics", {}, { cache: true }) - - if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv - script(async data-pjax src= theme.asset.busuanzi || '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js') - +div + script(src=url_for(theme.asset.utils)) + script(src=url_for(theme.asset.main)) + + if theme.translate.enable + script(src=url_for(theme.asset.translate)) + + if theme.lightbox + script(src=url_for(theme.asset[theme.lightbox])) + + if theme.instantpage + script(src=url_for(theme.asset.instantpage), type='module') + + if theme.lazyload.enable && !theme.lazyload.native + script(src=url_for(theme.asset.lazyload)) + + if theme.snackbar.enable + script(src=url_for(theme.asset.snackbar)) + + .js-pjax + if needLoadCountJs + != partial("includes/third-party/card-post-count/index", {}, { cache: true }) + + if loadSubJs + include ./third-party/subtitle.pug + + include ./third-party/math/index.pug + include ./third-party/abcjs/index.pug + + if commentsJsLoad + include ./third-party/comments/js.pug + + != partial("includes/third-party/prismjs", {}, { cache: true }) + + if theme.aside.enable && theme.aside.card_newest_comments.enable + if theme.pjax.enable || (globalPageType !== 'post' && page.aside !== false) + != partial("includes/third-party/newest-comments/index", {}, { cache: true }) + + != fragment_cache('injectBottom', function(){return injectHtml(theme.inject.bottom)}) + + != partial("includes/third-party/effect", {}, { cache: true }) + != partial("includes/third-party/chat/index", {}, { cache: true }) + + if theme.aplayerInject && theme.aplayerInject.enable + if theme.pjax.enable || theme.aplayerInject.per_page || page.aplayer + include ./third-party/aplayer.pug + + if theme.pjax.enable + != partial("includes/third-party/pjax", {}, { cache: true }) + + if theme.umami_analytics.enable + != partial("includes/third-party/umami_analytics", {}, { cache: true }) + + if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv + script(async data-pjax src= theme.asset.busuanzi || '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js') + != partial('includes/third-party/search/index', {}, { cache: true }) \ No newline at end of file diff --git a/layout/includes/footer.pug b/layout/includes/footer.pug index f6c3e87..0f3dbe3 100644 --- a/layout/includes/footer.pug +++ b/layout/includes/footer.pug @@ -1,18 +1,19 @@ -#footer-wrap - if theme.footer.owner.enable - - const currentYear = new Date().getFullYear() - - const sinceYear = theme.footer.owner.since - .copyright - if sinceYear && sinceYear != currentYear - != `©${sinceYear} - ${currentYear} By ${config.author}` - else - != `©${currentYear} By ${config.author}` - if theme.footer.copyright - .framework-info - span= _p('footer.framework') + ' ' - a(href='https://hexo.io')= 'Hexo' - span.footer-separator | - span= _p('footer.theme') + ' ' - a(href='https://github.com/jerryc127/hexo-theme-butterfly')= 'Butterfly' - if theme.footer.custom_text +#footer-wrap + if theme.footer.owner.enable + - const currentYear = new Date().getFullYear() + - const sinceYear = theme.footer.owner.since + .copyright + if sinceYear && sinceYear != currentYear + != `©${sinceYear} - ${currentYear} By ${config.author}` + else + != `©${currentYear} By ${config.author}` + if theme.footer.copyright + - const v = getVersion() + .framework-info + span= _p('footer.framework') + ' ' + a(href='https://hexo.io')= `Hexo ${v.hexo}` + span.footer-separator | + span= _p('footer.theme') + ' ' + a(href='https://github.com/jerryc127/hexo-theme-butterfly')= `Butterfly ${v.theme}` + if theme.footer.custom_text .footer_custom_text!= theme.footer.custom_text \ No newline at end of file diff --git a/layout/includes/head.pug b/layout/includes/head.pug index 3e77573..447199b 100644 --- a/layout/includes/head.pug +++ b/layout/includes/head.pug @@ -1,77 +1,77 @@ -- var pageTitle -- globalPageType === 'archive' ? page.title = findArchivesTitle(page, theme.menu, date) : '' -case globalPageType - when 'tag' - - pageTitle = _p('page.tag') + ': ' + page.tag - when 'category' - - pageTitle = _p('page.category') + ': ' + page.category - when '404' - - pageTitle = _p('error404') - default - - pageTitle = page.title || config.title || '' - - -- var isSubtitle = config.subtitle ? ' - ' + config.subtitle : '' -- var tabTitle = globalPageType === 'home' || !pageTitle ? config.title + isSubtitle : pageTitle + ' | ' + config.title -- var pageAuthor = config.email ? config.author + ',' + config.email : config.author -- var pageCopyright = config.copyright || config.author -- var themeColorLight = theme.theme_color && theme.theme_color.enable && theme.theme_color.meta_theme_color_light || '#ffffff' -- var themeColorDark = theme.theme_color && theme.theme_color.enable && theme.theme_color.meta_theme_color_dark || '#0d0d0d' -- var themeColor = theme.display_mode === 'dark' ? themeColorDark : themeColorLight - -meta(charset='UTF-8') -meta(http-equiv="X-UA-Compatible" content="IE=edge") -meta(name="viewport" content="width=device-width, initial-scale=1.0,viewport-fit=cover") -title= tabTitle -meta(name="author" content=pageAuthor) -meta(name="copyright" content=pageCopyright) -meta(name ="format-detection" content="telephone=no") -meta(name="theme-color" content=themeColor) - -//- Open_Graph -include ./head/Open_Graph.pug - -//- Structured Data -include ./head/structured_data.pug - -!=favicon_tag(theme.favicon || config.favicon) -link(rel="canonical" href=urlNoIndex(null,config.pretty_urls.trailing_index,config.pretty_urls.trailing_html)) - -//- 預解析 -!=partial('includes/head/preconnect', {}, {cache: true}) - -//- 網站驗證 -!=partial('includes/head/site_verification', {}, {cache: true}) - -//- PWA -if (theme.pwa && theme.pwa.enable) - !=partial('includes/head/pwa', {}, {cache: true}) - -//- main css -link(rel='stylesheet', href=url_for(theme.asset.main_css)) -link(rel='stylesheet', href=url_for(theme.asset.fontawesome)) - -if (theme.snackbar && theme.snackbar.enable) - link(rel='stylesheet', href=url_for(theme.asset.snackbar_css) media="print" onload="this.media='all'") - -if theme.lightbox === 'fancybox' - link(rel='stylesheet' href=url_for(theme.asset.fancybox_css) media="print" onload="this.media='all'") - -!=fragment_cache('injectHeadJs', function(){return inject_head_js()}) - -//- google_adsense -!=partial('includes/head/google_adsense', {}, {cache: true}) - -//- analytics -!=partial('includes/head/analytics', {}, {cache: true}) - -//- font -if theme.blog_title_font && theme.blog_title_font.font_link - link(rel='stylesheet' href=url_for(theme.blog_title_font.font_link) media="print" onload="this.media='all'") - -//- global config -!=partial('includes/head/config', {}, {cache: true}) - -include ./head/config_site.pug - -!=fragment_cache('injectHead', function(){return injectHtml(theme.inject.head)}) +- var pageTitle +- globalPageType === 'archive' ? page.title = findArchivesTitle(page, theme.menu, date) : '' +case globalPageType + when 'tag' + - pageTitle = _p('page.tag') + ': ' + page.tag + when 'category' + - pageTitle = _p('page.category') + ': ' + page.category + when '404' + - pageTitle = _p('error404') + default + - pageTitle = page.title || config.title || '' + + +- var isSubtitle = config.subtitle ? ' - ' + config.subtitle : '' +- var tabTitle = globalPageType === 'home' || !pageTitle ? config.title + isSubtitle : pageTitle + ' | ' + config.title +- var pageAuthor = config.email ? config.author + ',' + config.email : config.author +- var pageCopyright = config.copyright || config.author +- var themeColorLight = theme.theme_color && theme.theme_color.enable && theme.theme_color.meta_theme_color_light || '#ffffff' +- var themeColorDark = theme.theme_color && theme.theme_color.enable && theme.theme_color.meta_theme_color_dark || '#0d0d0d' +- var themeColor = theme.display_mode === 'dark' ? themeColorDark : themeColorLight + +meta(charset='UTF-8') +meta(http-equiv="X-UA-Compatible" content="IE=edge") +meta(name="viewport" content="width=device-width, initial-scale=1.0,viewport-fit=cover") +title= tabTitle +meta(name="author" content=pageAuthor) +meta(name="copyright" content=pageCopyright) +meta(name ="format-detection" content="telephone=no") +meta(name="theme-color" content=themeColor) + +//- Open_Graph +include ./head/Open_Graph.pug + +//- Structured Data +include ./head/structured_data.pug + +!=favicon_tag(theme.favicon || config.favicon) +link(rel="canonical" href=urlNoIndex(null,config.pretty_urls.trailing_index,config.pretty_urls.trailing_html)) + +//- 預解析 +!=partial('includes/head/preconnect', {}, {cache: true}) + +//- 網站驗證 +!=partial('includes/head/site_verification', {}, {cache: true}) + +//- PWA +if (theme.pwa && theme.pwa.enable) + !=partial('includes/head/pwa', {}, {cache: true}) + +//- main css +link(rel='stylesheet', href=url_for(theme.asset.main_css)) +link(rel='stylesheet', href=url_for(theme.asset.fontawesome)) + +if (theme.snackbar && theme.snackbar.enable) + link(rel='stylesheet', href=url_for(theme.asset.snackbar_css) media="print" onload="this.media='all'") + +if theme.lightbox === 'fancybox' + link(rel='stylesheet' href=url_for(theme.asset.fancybox_css) media="print" onload="this.media='all'") + +!=fragment_cache('injectHeadJs', function(){return inject_head_js()}) + +//- google_adsense +!=partial('includes/head/google_adsense', {}, {cache: true}) + +//- analytics +!=partial('includes/head/analytics', {}, {cache: true}) + +//- font +if theme.blog_title_font && theme.blog_title_font.font_link + link(rel='stylesheet' href=url_for(theme.blog_title_font.font_link) media="print" onload="this.media='all'") + +//- global config +!=partial('includes/head/config', {}, {cache: true}) + +include ./head/config_site.pug + +!=fragment_cache('injectHead', function(){return injectHtml(theme.inject.head)}) diff --git a/layout/includes/head/Open_Graph.pug b/layout/includes/head/Open_Graph.pug index b3628d0..d353f3e 100644 --- a/layout/includes/head/Open_Graph.pug +++ b/layout/includes/head/Open_Graph.pug @@ -1,16 +1,16 @@ -if theme.Open_Graph_meta.enable - - - const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img - let ogOption = Object.assign({ - type: globalPageType === 'post' ? 'article' : 'website', - image: coverVal ? full_url_for(coverVal) : '', - fb_admins: theme.facebook_comments.user_id || '', - fb_app_id: theme.facebook_comments.app_id || '', - }, theme.Open_Graph_meta.option) - - - != open_graph(ogOption) -else - - const description = page.description || page.content || page.title || config.description - if description - meta(name="description" content=truncate(description, 150)) - +if theme.Open_Graph_meta.enable + - + const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img + let ogOption = Object.assign({ + type: globalPageType === 'post' ? 'article' : 'website', + image: coverVal ? full_url_for(coverVal) : '', + fb_admins: theme.facebook_comments.user_id || '', + fb_app_id: theme.facebook_comments.app_id || '', + }, theme.Open_Graph_meta.option) + - + != open_graph(ogOption) +else + - const description = page.description || page.content || page.title || config.description + if description + meta(name="description" content=truncate(description, 150)) + diff --git a/layout/includes/head/analytics.pug b/layout/includes/head/analytics.pug index d75145d..e6aa621 100644 --- a/layout/includes/head/analytics.pug +++ b/layout/includes/head/analytics.pug @@ -1,34 +1,34 @@ -if theme.baidu_analytics - script. - var _hmt = _hmt || []; - (function() { - var hm = document.createElement("script"); - hm.src = "https://hm.baidu.com/hm.js?!{theme.baidu_analytics}"; - var s = document.getElementsByTagName("script")[0]; - s.parentNode.insertBefore(hm, s); - })(); - btf.addGlobalFn('pjaxComplete', () => { - _hmt.push(['_trackPageview',window.location.pathname]) - }, 'baidu_analytics') - -if theme.google_analytics - script(async src=`https://www.googletagmanager.com/gtag/js?id=${theme.google_analytics}`) - script. - window.dataLayer = window.dataLayer || [] - function gtag(){dataLayer.push(arguments)} - gtag('js', new Date()) - gtag('config', '!{theme.google_analytics}') - btf.addGlobalFn('pjaxComplete', () => { - gtag('config', '!{theme.google_analytics}', {'page_path': window.location.pathname}) - }, 'google_analytics') - -if theme.cloudflare_analytics - script(defer data-pjax src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon=`{"token": "${theme.cloudflare_analytics}"}`) - -if theme.microsoft_clarity - script. - (function(c,l,a,r,i,t,y){ - c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; - t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i; - y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); +if theme.baidu_analytics + script. + var _hmt = _hmt || []; + (function() { + var hm = document.createElement("script"); + hm.src = "https://hm.baidu.com/hm.js?!{theme.baidu_analytics}"; + var s = document.getElementsByTagName("script")[0]; + s.parentNode.insertBefore(hm, s); + })(); + btf.addGlobalFn('pjaxComplete', () => { + _hmt.push(['_trackPageview',window.location.pathname]) + }, 'baidu_analytics') + +if theme.google_analytics + script(async src=`https://www.googletagmanager.com/gtag/js?id=${theme.google_analytics}`) + script. + window.dataLayer = window.dataLayer || [] + function gtag(){dataLayer.push(arguments)} + gtag('js', new Date()) + gtag('config', '!{theme.google_analytics}') + btf.addGlobalFn('pjaxComplete', () => { + gtag('config', '!{theme.google_analytics}', {'page_path': window.location.pathname}) + }, 'google_analytics') + +if theme.cloudflare_analytics + script(defer data-pjax src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon=`{"token": "${theme.cloudflare_analytics}"}`) + +if theme.microsoft_clarity + script. + (function(c,l,a,r,i,t,y){ + c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; + t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i; + y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); })(window, document, "clarity", "script", "!{theme.microsoft_clarity}"); \ No newline at end of file diff --git a/layout/includes/head/config.pug b/layout/includes/head/config.pug index efa3654..b50ecfe 100644 --- a/layout/includes/head/config.pug +++ b/layout/includes/head/config.pug @@ -1,126 +1,126 @@ -- - let algolia = 'undefined' - if (theme.search.use === 'algolia_search') { - const { ALGOLIA_APP_ID, ALGOLIA_API_KEY, ALGOLIA_INDEX_NAME } = process.env - const { appId, applicationID, apiKey, indexName } = config.algolia - algolia = JSON.stringify({ - appId: ALGOLIA_APP_ID || appId || applicationID, - apiKey: ALGOLIA_API_KEY || apiKey, - indexName: ALGOLIA_INDEX_NAME || indexName, - hitsPerPage: theme.search.algolia_search.hitsPerPage, - // search languages - languages: { - input_placeholder: theme.search.placeholder || _p("search.input_placeholder"), - hits_empty: _p("search.algolia_search.hits_empty"), - hits_stats: _p("search.algolia_search.hits_stats"), - } - }) - } - - let localSearch = 'undefined' - if (theme.search.use === 'local_search') { - const { CDN, preload, top_n_per_article, unescape } = theme.search.local_search - localSearch = JSON.stringify({ - path: CDN || config.root + config.search.path, - preload, - top_n_per_article, - unescape, - languages: { - // search languages - hits_empty: _p("search.local_search.hits_empty"), - hits_stats: _p("search.local_search.hits_stats"), - } - }) - } - - let translate = 'undefined' - if (theme.translate && theme.translate.enable){ - translate = JSON.stringify({ - defaultEncoding: theme.translate.defaultEncoding, - translateDelay: theme.translate.translateDelay, - msgToTraditionalChinese: theme.translate.msgToTraditionalChinese, - msgToSimplifiedChinese: theme.translate.msgToSimplifiedChinese - }) - } - - let copyright = 'undefined' - if (theme.copy.enable && theme.copy.copyright.enable){ - copyright = JSON.stringify({ - limitCount: theme.copy.copyright.limit_count, - languages: { - author: _p("copy_copyright.author") + ': ' + config.author, - link: _p("copy_copyright.link") + ': ', - source: _p("copy_copyright.source") + ': ' + config.title, - info: _p("copy_copyright.info") - } - }) - } - - let Snackbar = 'undefined' - if (theme.snackbar && theme.snackbar.enable) { - Snackbar = JSON.stringify({ - chs_to_cht: _p("Snackbar.chs_to_cht"), - cht_to_chs: _p("Snackbar.cht_to_chs"), - day_to_night: _p("Snackbar.day_to_night"), - night_to_day: _p("Snackbar.night_to_day"), - bgLight: theme.snackbar.bg_light, - bgDark: theme.snackbar.bg_dark, - position: theme.snackbar.position, - }) - } - - let highlight = 'undefined' - let syntaxHighlighter = config.syntax_highlighter - let highlightEnable = syntaxHighlighter ? ['highlight.js', 'prismjs'].includes(syntaxHighlighter) : (config.highlight.enable || config.prismjs.enable) - if (highlightEnable) { - const { copy, language, height_limit, fullpage, macStyle } = theme.code_blocks - highlight = JSON.stringify({ - plugin: syntaxHighlighter ? syntaxHighlighter : config.highlight.enable ? 'highlight.js' : 'prismjs', - highlightCopy: copy, - highlightLang: language, - highlightHeightLimit: height_limit, - highlightFullpage: fullpage, - highlightMacStyle: macStyle - }) - } - -script. - const GLOBAL_CONFIG = { - root: '!{config.root}', - algolia: !{algolia}, - localSearch: !{localSearch}, - translate: !{translate}, - highlight: !{highlight}, - copy: { - success: '!{_p("copy.success")}', - error: '!{_p("copy.error")}', - noSupport: '!{_p("copy.noSupport")}' - }, - relativeDate: { - homepage: !{theme.post_meta.page.date_format === 'relative'}, - post: !{theme.post_meta.post.date_format === 'relative'} - }, - runtime: '!{theme.aside.card_webinfo.runtime_date ? _p("aside.card_webinfo.runtime.unit") : ""}', - dateSuffix: { - just: '!{_p("date_suffix.just")}', - min: '!{_p("date_suffix.min")}', - hour: '!{_p("date_suffix.hour")}', - day: '!{_p("date_suffix.day")}', - month: '!{_p("date_suffix.month")}' - }, - copyright: !{copyright}, - lightbox: '!{ theme.lightbox || 'null' }', - Snackbar: !{Snackbar}, - infinitegrid: { - js: '!{url_for(theme.asset.egjs_infinitegrid)}', - buttonText: '!{_p("load_more")}' - }, - isPhotoFigcaption: !{theme.photofigcaption}, - islazyloadPlugin: !{theme.lazyload.enable && !theme.lazyload.native}, - isAnchor: !{theme.anchor.auto_update || false}, - percent: { - toc: !{theme.toc.scroll_percent}, - rightside: !{theme.rightside_scroll_percent}, - }, - autoDarkmode: !{theme.darkmode.enable && theme.darkmode.autoChangeMode === 1} - } +- + let algolia = 'undefined' + if (theme.search.use === 'algolia_search') { + const { ALGOLIA_APP_ID, ALGOLIA_API_KEY, ALGOLIA_INDEX_NAME } = process.env + const { appId, applicationID, apiKey, indexName } = config.algolia + algolia = JSON.stringify({ + appId: ALGOLIA_APP_ID || appId || applicationID, + apiKey: ALGOLIA_API_KEY || apiKey, + indexName: ALGOLIA_INDEX_NAME || indexName, + hitsPerPage: theme.search.algolia_search.hitsPerPage, + // search languages + languages: { + input_placeholder: theme.search.placeholder || _p("search.input_placeholder"), + hits_empty: _p("search.algolia_search.hits_empty"), + hits_stats: _p("search.algolia_search.hits_stats"), + } + }) + } + + let localSearch = 'undefined' + if (theme.search.use === 'local_search') { + const { CDN, preload, top_n_per_article, unescape } = theme.search.local_search + localSearch = JSON.stringify({ + path: CDN || config.root + config.search.path, + preload, + top_n_per_article, + unescape, + languages: { + // search languages + hits_empty: _p("search.local_search.hits_empty"), + hits_stats: _p("search.local_search.hits_stats"), + } + }) + } + + let translate = 'undefined' + if (theme.translate && theme.translate.enable){ + translate = JSON.stringify({ + defaultEncoding: theme.translate.defaultEncoding, + translateDelay: theme.translate.translateDelay, + msgToTraditionalChinese: theme.translate.msgToTraditionalChinese, + msgToSimplifiedChinese: theme.translate.msgToSimplifiedChinese + }) + } + + let copyright = 'undefined' + if (theme.copy.enable && theme.copy.copyright.enable){ + copyright = JSON.stringify({ + limitCount: theme.copy.copyright.limit_count, + languages: { + author: _p("copy_copyright.author") + ': ' + config.author, + link: _p("copy_copyright.link") + ': ', + source: _p("copy_copyright.source") + ': ' + config.title, + info: _p("copy_copyright.info") + } + }) + } + + let Snackbar = 'undefined' + if (theme.snackbar && theme.snackbar.enable) { + Snackbar = JSON.stringify({ + chs_to_cht: _p("Snackbar.chs_to_cht"), + cht_to_chs: _p("Snackbar.cht_to_chs"), + day_to_night: _p("Snackbar.day_to_night"), + night_to_day: _p("Snackbar.night_to_day"), + bgLight: theme.snackbar.bg_light, + bgDark: theme.snackbar.bg_dark, + position: theme.snackbar.position, + }) + } + + let highlight = 'undefined' + let syntaxHighlighter = config.syntax_highlighter + let highlightEnable = syntaxHighlighter ? ['highlight.js', 'prismjs'].includes(syntaxHighlighter) : (config.highlight.enable || config.prismjs.enable) + if (highlightEnable) { + const { copy, language, height_limit, fullpage, macStyle } = theme.code_blocks + highlight = JSON.stringify({ + plugin: syntaxHighlighter ? syntaxHighlighter : config.highlight.enable ? 'highlight.js' : 'prismjs', + highlightCopy: copy, + highlightLang: language, + highlightHeightLimit: height_limit, + highlightFullpage: fullpage, + highlightMacStyle: macStyle + }) + } + +script. + const GLOBAL_CONFIG = { + root: '!{config.root}', + algolia: !{algolia}, + localSearch: !{localSearch}, + translate: !{translate}, + highlight: !{highlight}, + copy: { + success: '!{_p("copy.success")}', + error: '!{_p("copy.error")}', + noSupport: '!{_p("copy.noSupport")}' + }, + relativeDate: { + homepage: !{theme.post_meta.page.date_format === 'relative'}, + post: !{theme.post_meta.post.date_format === 'relative'} + }, + runtime: '!{theme.aside.card_webinfo.runtime_date ? _p("aside.card_webinfo.runtime.unit") : ""}', + dateSuffix: { + just: '!{_p("date_suffix.just")}', + min: '!{_p("date_suffix.min")}', + hour: '!{_p("date_suffix.hour")}', + day: '!{_p("date_suffix.day")}', + month: '!{_p("date_suffix.month")}' + }, + copyright: !{copyright}, + lightbox: '!{ theme.lightbox || 'null' }', + Snackbar: !{Snackbar}, + infinitegrid: { + js: '!{url_for(theme.asset.egjs_infinitegrid)}', + buttonText: '!{_p("load_more")}' + }, + isPhotoFigcaption: !{theme.photofigcaption}, + islazyloadPlugin: !{theme.lazyload.enable && !theme.lazyload.native}, + isAnchor: !{theme.anchor.auto_update || false}, + percent: { + toc: !{theme.toc.scroll_percent}, + rightside: !{theme.rightside_scroll_percent}, + }, + autoDarkmode: !{theme.darkmode.enable && theme.darkmode.autoChangeMode === 1} + } diff --git a/layout/includes/head/config_site.pug b/layout/includes/head/config_site.pug index 5c1c67d..8f8d3b6 100644 --- a/layout/includes/head/config_site.pug +++ b/layout/includes/head/config_site.pug @@ -1,25 +1,25 @@ -- - const titleVal = pageTitle.replace(/'/ig,"\\'") - - let isHighlightShrink - if (theme.code_blocks.shrink == 'none') isHighlightShrink = 'undefined' - else if (typeof page.highlight_shrink == 'boolean') isHighlightShrink = page.highlight_shrink - else isHighlightShrink = theme.code_blocks.shrink - - var showToc = false - if (theme.aside.enable && page.aside !== false) { - let tocEnable = false - if (globalPageType === 'post' && theme.toc.post) tocEnable = true - else if (globalPageType === 'page' && theme.toc.page) tocEnable = true - const pageToc = typeof page.toc === 'boolean' ? page.toc : tocEnable - showToc = pageToc && (toc(page.content) !== '' || page.encrypt === true) - } -- - -script#config-diff. - var GLOBAL_CONFIG_SITE = { - title: '!{titleVal}', - isHighlightShrink: !{isHighlightShrink}, - isToc: !{showToc}, - pageType: '!{page.type == 'shuoshuo' ? 'shuoshuo' : globalPageType}' - } +- + const titleVal = pageTitle.replace(/'/ig,"\\'") + + let isHighlightShrink + if (theme.code_blocks.shrink == 'none') isHighlightShrink = 'undefined' + else if (typeof page.highlight_shrink == 'boolean') isHighlightShrink = page.highlight_shrink + else isHighlightShrink = theme.code_blocks.shrink + + var showToc = false + if (theme.aside.enable && page.aside !== false) { + let tocEnable = false + if (globalPageType === 'post' && theme.toc.post) tocEnable = true + else if (globalPageType === 'page' && theme.toc.page) tocEnable = true + const pageToc = typeof page.toc === 'boolean' ? page.toc : tocEnable + showToc = pageToc && (toc(page.content) !== '' || page.encrypt === true) + } +- + +script#config-diff. + var GLOBAL_CONFIG_SITE = { + title: '!{titleVal}', + isHighlightShrink: !{isHighlightShrink}, + isToc: !{showToc}, + pageType: '!{page.type == 'shuoshuo' ? 'shuoshuo' : globalPageType}' + } diff --git a/layout/includes/head/google_adsense.pug b/layout/includes/head/google_adsense.pug index 3ef1af9..f4dac01 100644 --- a/layout/includes/head/google_adsense.pug +++ b/layout/includes/head/google_adsense.pug @@ -1,9 +1,9 @@ -if (theme.google_adsense && theme.google_adsense.enable) - script(async src=theme.google_adsense.js) - - if theme.google_adsense.auto_ads - script. - (adsbygoogle = window.adsbygoogle || []).push({ - google_ad_client: '!{theme.google_adsense.client}', - enable_page_level_ads: '!{theme.google_adsense.enable_page_level_ads}' +if (theme.google_adsense && theme.google_adsense.enable) + script(async src=theme.google_adsense.js) + + if theme.google_adsense.auto_ads + script. + (adsbygoogle = window.adsbygoogle || []).push({ + google_ad_client: '!{theme.google_adsense.client}', + enable_page_level_ads: '!{theme.google_adsense.enable_page_level_ads}' }); \ No newline at end of file diff --git a/layout/includes/head/preconnect.pug b/layout/includes/head/preconnect.pug index cefe9fc..25bda87 100644 --- a/layout/includes/head/preconnect.pug +++ b/layout/includes/head/preconnect.pug @@ -1,35 +1,35 @@ -- - const { internal_provider, third_party_provider, custom_format } = theme.CDN - const providers = { - 'jsdelivr': '//cdn.jsdelivr.net', - 'cdnjs': '//cdnjs.cloudflare.com', - 'unpkg': '//unpkg.com', - 'custom': custom_format && custom_format.match(/^((https?:)?(\/\/[^/]+)|([^/]+))(\/|$)/)[1] - } -- - -if internal_provider === third_party_provider && internal_provider !== 'local' - link(rel="preconnect" href=providers[internal_provider]) -else - if internal_provider !== 'local' - link(rel="preconnect" href=providers[internal_provider]) - if third_party_provider !== 'local' - link(rel="preconnect" href=providers[third_party_provider]) - -if theme.google_analytics - link(rel="preconnect" href="//www.google-analytics.com" crossorigin='') - -if theme.baidu_analytics - link(rel="preconnect" href="//hm.baidu.com") - -if theme.cloudflare_analytics - link(rel="preconnect" href="//static.cloudflareinsights.com") - -if theme.microsoft_clarity - link(rel="preconnect" href="//www.clarity.ms") - -if theme.blog_title_font && theme.blog_title_font.font_link && theme.blog_title_font.font_link.indexOf('//fonts.googleapis.com') != -1 - link(rel="preconnect" href="//fonts.googleapis.com" crossorigin='') - -if !theme.asset.busuanzi && (theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv) +- + const { internal_provider, third_party_provider, custom_format } = theme.CDN + const providers = { + 'jsdelivr': '//cdn.jsdelivr.net', + 'cdnjs': '//cdnjs.cloudflare.com', + 'unpkg': '//unpkg.com', + 'custom': custom_format && custom_format.match(/^((https?:)?(\/\/[^/]+)|([^/]+))(\/|$)/)[1] + } +- + +if internal_provider === third_party_provider && internal_provider !== 'local' + link(rel="preconnect" href=providers[internal_provider]) +else + if internal_provider !== 'local' + link(rel="preconnect" href=providers[internal_provider]) + if third_party_provider !== 'local' + link(rel="preconnect" href=providers[third_party_provider]) + +if theme.google_analytics + link(rel="preconnect" href="//www.google-analytics.com" crossorigin='') + +if theme.baidu_analytics + link(rel="preconnect" href="//hm.baidu.com") + +if theme.cloudflare_analytics + link(rel="preconnect" href="//static.cloudflareinsights.com") + +if theme.microsoft_clarity + link(rel="preconnect" href="//www.clarity.ms") + +if theme.blog_title_font && theme.blog_title_font.font_link && theme.blog_title_font.font_link.indexOf('//fonts.googleapis.com') != -1 + link(rel="preconnect" href="//fonts.googleapis.com" crossorigin='') + +if !theme.asset.busuanzi && (theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv) link(rel="preconnect" href="//busuanzi.ibruce.info") \ No newline at end of file diff --git a/layout/includes/head/pwa.pug b/layout/includes/head/pwa.pug index 816026a..13703fb 100644 --- a/layout/includes/head/pwa.pug +++ b/layout/includes/head/pwa.pug @@ -1,13 +1,13 @@ -- const { manifest, theme_color, apple_touch_icon, favicon_32_32, favicon_16_16, mask_icon } = theme.pwa - -link(rel="manifest" href=url_for(manifest)) -if theme_color - meta(name="msapplication-TileColor" content=theme_color) -if apple_touch_icon - link(rel="apple-touch-icon" sizes="180x180" href=url_for(apple_touch_icon)) -if favicon_32_32 - link(rel="icon" type="image/png" sizes="32x32" href=url_for(favicon_32_32)) -if favicon_16_16 - link(rel="icon" type="image/png" sizes="16x16" href=url_for(favicon_16_16)) -if mask_icon - link(rel="mask-icon" href=url_for(mask_icon) color="#5bbad5") +- const { manifest, theme_color, apple_touch_icon, favicon_32_32, favicon_16_16, mask_icon } = theme.pwa + +link(rel="manifest" href=url_for(manifest)) +if theme_color + meta(name="msapplication-TileColor" content=theme_color) +if apple_touch_icon + link(rel="apple-touch-icon" sizes="180x180" href=url_for(apple_touch_icon)) +if favicon_32_32 + link(rel="icon" type="image/png" sizes="32x32" href=url_for(favicon_32_32)) +if favicon_16_16 + link(rel="icon" type="image/png" sizes="16x16" href=url_for(favicon_16_16)) +if mask_icon + link(rel="mask-icon" href=url_for(mask_icon) color="#5bbad5") diff --git a/layout/includes/head/site_verification.pug b/layout/includes/head/site_verification.pug index 8947644..9130030 100644 --- a/layout/includes/head/site_verification.pug +++ b/layout/includes/head/site_verification.pug @@ -1,3 +1,3 @@ -if theme.site_verification - each item in theme.site_verification +if theme.site_verification + each item in theme.site_verification meta(name=item.name content=item.content) \ No newline at end of file diff --git a/layout/includes/header/index.pug b/layout/includes/header/index.pug index 481db70..fa39f5c 100644 --- a/layout/includes/header/index.pug +++ b/layout/includes/header/index.pug @@ -1,52 +1,52 @@ -- - const returnTopImg = img => img !== false ? img || theme.default_top_img : false - const isFixedClass = theme.nav.fixed ? ' fixed' : '' - var top_img = false - let headerClassName = 'not-top-img' - var bg_img = '' - -if !theme.disable_top_img && page.top_img !== false - case globalPageType - when 'post' - - top_img = page.top_img || page.cover || theme.default_top_img - when 'page' - - top_img = page.top_img || theme.default_top_img - when 'tag' - - top_img = theme.tag_per_img && theme.tag_per_img[page.tag] || returnTopImg(theme.tag_img) - when 'category' - - top_img = theme.category_per_img && theme.category_per_img[page.category] || returnTopImg(theme.category_img) - when 'home' - - top_img = returnTopImg(theme.index_img) - when 'archive' - - top_img = returnTopImg(theme.archive_img) - default - - top_img = page.top_img || theme.default_top_img - - if top_img !== false - - bg_img = getBgPath(top_img) - - headerClassName = globalPageType === 'home' ? 'full_page' : globalPageType === 'post' ? 'post-bg' : 'not-home-page' - -header#page-header(class=`${headerClassName + isFixedClass}` style=bg_img) - include ./nav.pug - if top_img !== false - if globalPageType === 'post' - include ./post-info.pug - else if globalPageType === 'home' - #site-info - h1#site-title=config.title - if theme.subtitle.enable - - var loadSubJs = true - #site-subtitle - span#subtitle - if theme.social - #site_social_icons - !=partial('includes/header/social', {}, {cache: true}) - #scroll-down - i.fas.fa-angle-down.scroll-down-effects - else - #page-site-info - h1#site-title=page.title || page.tag || page.category - else - //- improve seo - if globalPageType !== 'post' +- + const returnTopImg = img => img !== false ? img || theme.default_top_img : false + const isFixedClass = theme.nav.fixed ? ' fixed' : '' + var top_img = false + let headerClassName = 'not-top-img' + var bg_img = '' + +if !theme.disable_top_img && page.top_img !== false + case globalPageType + when 'post' + - top_img = page.top_img || page.cover || theme.default_top_img + when 'page' + - top_img = page.top_img || theme.default_top_img + when 'tag' + - top_img = theme.tag_per_img && theme.tag_per_img[page.tag] || returnTopImg(theme.tag_img) + when 'category' + - top_img = theme.category_per_img && theme.category_per_img[page.category] || returnTopImg(theme.category_img) + when 'home' + - top_img = returnTopImg(theme.index_img) + when 'archive' + - top_img = returnTopImg(theme.archive_img) + default + - top_img = page.top_img || theme.default_top_img + + if top_img !== false + - bg_img = getBgPath(top_img) + - headerClassName = globalPageType === 'home' ? 'full_page' : globalPageType === 'post' ? 'post-bg' : 'not-home-page' + +header#page-header(class=`${headerClassName + isFixedClass}` style=bg_img) + include ./nav.pug + if top_img !== false + if globalPageType === 'post' + include ./post-info.pug + else if globalPageType === 'home' + #site-info + h1#site-title=config.title + if theme.subtitle.enable + - var loadSubJs = true + #site-subtitle + span#subtitle + if theme.social + #site_social_icons + !=partial('includes/header/social', {}, {cache: true}) + #scroll-down + i.fas.fa-angle-down.scroll-down-effects + else + #page-site-info + h1#site-title=page.title || page.tag || page.category + else + //- improve seo + if globalPageType !== 'post' h1.title-seo=page.title || page.tag || page.category || config.title \ No newline at end of file diff --git a/layout/includes/header/menu_item.pug b/layout/includes/header/menu_item.pug index 6302ee4..4b0590c 100644 --- a/layout/includes/header/menu_item.pug +++ b/layout/includes/header/menu_item.pug @@ -1,27 +1,27 @@ -if theme.menu - .menus_items - each value, label in theme.menu - if typeof value !== 'object' - .menus_item - - const [link, icon] = value.split('||').map(part => trim(part)) - a.site-page(href=url_for(link)) - if icon - i.fa-fw(class=icon) - span= ' ' + label - else - .menus_item - - const [groupLabel, groupIcon, groupClass] = label.split('||').map(part => trim(part)) - - const hideClass = groupClass === 'hide' ? 'hide' : '' - span.site-page.group(class=hideClass) - if groupIcon - i.fa-fw(class=groupIcon) - span= ' ' + groupLabel - i.fas.fa-chevron-down - ul.menus_item_child - each val, lab in value - - const [childLink, childIcon] = val.split('||').map(part => trim(part)) - li - a.site-page.child(href=url_for(childLink)) - if childIcon - i.fa-fw(class=childIcon) +if theme.menu + .menus_items + each value, label in theme.menu + if typeof value !== 'object' + .menus_item + - const [link, icon] = value.split('||').map(part => trim(part)) + a.site-page(href=url_for(link)) + if icon + i.fa-fw(class=icon) + span= ' ' + label + else + .menus_item + - const [groupLabel, groupIcon, groupClass] = label.split('||').map(part => trim(part)) + - const hideClass = groupClass === 'hide' ? 'hide' : '' + span.site-page.group(class=hideClass) + if groupIcon + i.fa-fw(class=groupIcon) + span= ' ' + groupLabel + i.fas.fa-chevron-down + ul.menus_item_child + each val, lab in value + - const [childLink, childIcon] = val.split('||').map(part => trim(part)) + li + a.site-page.child(href=url_for(childLink)) + if childIcon + i.fa-fw(class=childIcon) span= ' ' + lab \ No newline at end of file diff --git a/layout/includes/header/nav.pug b/layout/includes/header/nav.pug index 814a476..32fdf68 100644 --- a/layout/includes/header/nav.pug +++ b/layout/includes/header/nav.pug @@ -1,22 +1,22 @@ -nav#nav - span#blog-info - a.nav-site-title(href=url_for('/')) - if theme.nav.logo - img.site-icon(src=url_for(theme.nav.logo) alt='Logo') - if theme.nav.display_title - span.site-name=config.title - if globalPageType === 'post' - a.nav-page-title(href=url_for('/')) - span.site-name=(page.title || config.title) - #menus - if theme.search.use - #search-button - span.site-page.social-icon.search - i.fas.fa-search.fa-fw - span= ' ' + _p('search.title') - if theme.menu - != partial('includes/header/menu_item', {}, {cache: true}) - - #toggle-menu - span.site-page +nav#nav + span#blog-info + a.nav-site-title(href=url_for('/')) + if theme.nav.logo + img.site-icon(src=url_for(theme.nav.logo) alt='Logo') + if theme.nav.display_title + span.site-name=config.title + if globalPageType === 'post' + a.nav-page-title(href=url_for('/')) + span.site-name=(page.title || config.title) + #menus + if theme.search.use + #search-button + span.site-page.social-icon.search + i.fas.fa-search.fa-fw + span= ' ' + _p('search.title') + if theme.menu + != partial('includes/header/menu_item', {}, {cache: true}) + + #toggle-menu + span.site-page i.fas.fa-bars.fa-fw \ No newline at end of file diff --git a/layout/includes/header/post-info.pug b/layout/includes/header/post-info.pug index f346f83..2e5100c 100644 --- a/layout/includes/header/post-info.pug +++ b/layout/includes/header/post-info.pug @@ -1,149 +1,149 @@ -- let comments = theme.comments -#post-info - h1.post-title= page.title || _p('no_title') - if theme.post_edit.enable - a.post-edit-link(href=theme.post_edit.url + page.source title=_p('post.edit') target="_blank") - i.fas.fa-pencil-alt - - #post-meta - .meta-firstline - if theme.post_meta.post.date_type - span.post-meta-date - if theme.post_meta.post.date_type === 'both' - i.far.fa-calendar-alt.fa-fw.post-meta-icon - span.post-meta-label= _p('post.created') - time.post-meta-date-created(datetime=date_xml(page.date) title=_p('post.created') + ' ' + full_date(page.date))= date(page.date, config.date_format) - span.post-meta-separator | - i.fas.fa-history.fa-fw.post-meta-icon - span.post-meta-label= _p('post.updated') - time.post-meta-date-updated(datetime=date_xml(page.updated) title=_p('post.updated') + ' ' + full_date(page.updated))= date(page.updated, config.date_format) - else - - let data_type_update = theme.post_meta.post.date_type === 'updated' - - let date_type = data_type_update ? 'updated' : 'date' - - let date_icon = data_type_update ? 'fas fa-history' : 'far fa-calendar-alt' - - let date_title = data_type_update ? _p('post.updated') : _p('post.created') - i.fa-fw.post-meta-icon(class=date_icon) - span.post-meta-label= date_title - time(datetime=date_xml(page[date_type]) title=date_title + ' ' + full_date(page[date_type]))= date(page[date_type], config.date_format) - if theme.post_meta.post.categories && page.categories.data.length > 0 - span.post-meta-categories - if theme.post_meta.post.date_type - span.post-meta-separator | - each item, index in page.categories.data - i.fas.fa-inbox.fa-fw.post-meta-icon - a(href=url_for(item.path)).post-meta-categories #[=item.name] - if index < page.categories.data.length - 1 - i.fas.fa-angle-right.post-meta-separator - - .meta-secondline - - let postWordcount = theme.wordcount.enable && (theme.wordcount.post_wordcount || theme.wordcount.min2read) - if postWordcount - span.post-meta-separator | - span.post-meta-wordcount - if theme.wordcount.post_wordcount - i.far.fa-file-word.fa-fw.post-meta-icon - span.post-meta-label= _p('post.wordcount') + ':' - span.word-count= wordcount(page.content) - if theme.wordcount.min2read - span.post-meta-separator | - if theme.wordcount.min2read - i.far.fa-clock.fa-fw.post-meta-icon - span.post-meta-label= _p('post.min2read') + ':' - span= min2read(page.content, {cn: 350, en: 160}) + _p('post.min2read_unit') - - //- for pv and count - mixin pvBlock(parent_id, parent_class, parent_title) - span.post-meta-separator | - span(class=parent_class id=parent_id data-flag-title=parent_title) - i.far.fa-eye.fa-fw.post-meta-icon - span.post-meta-label= _p('post.page_pv') + ':' - if block - block - - mixin otherPV() - if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.page_pv - +pvBlock('', '', '') - span#umamiPV(data-path=url_for(page.path)) - i.fa-solid.fa-spinner.fa-spin - else if theme.busuanzi.page_pv - +pvBlock('', 'post-meta-pv-cv', '') - span#busuanzi_value_page_pv - i.fa-solid.fa-spinner.fa-spin - - - const commentUse = comments.use && comments.use[0] - if page.comments !== false && commentUse && !comments.lazyload - if commentUse === 'Valine' && theme.valine.visitor - +pvBlock(url_for(page.path), 'leancloud_visitors', page.title) - span.leancloud-visitors-count - i.fa-solid.fa-spinner.fa-spin - else if commentUse === 'Waline' && theme.waline.pageview - +pvBlock('', '', '') - span.waline-pageview-count(data-path=url_for(page.path)) - i.fa-solid.fa-spinner.fa-spin - else if commentUse === 'Twikoo' && theme.twikoo.visitor - +pvBlock('', '', '') - span#twikoo_visitors - i.fa-solid.fa-spinner.fa-spin - else if commentUse === 'Artalk' && theme.artalk.visitor - +pvBlock('', '', '') - span#ArtalkPV - i.fa-solid.fa-spinner.fa-spin - else - +otherPV() - else - +otherPV() - - if comments.count && !comments.lazyload && page.comments !== false && comments.use - - var whichCount = comments.use[0] - - mixin countBlock - span.post-meta-separator | - span.post-meta-commentcount - i.far.fa-comments.fa-fw.post-meta-icon - span.post-meta-label= _p('post.comments') + ':' - if block - block - - case whichCount - when 'Disqus' - +countBlock - a.disqus-comment-count(href=full_url_for(page.path) + '#post-comment') - i.fa-solid.fa-spinner.fa-spin - when 'Disqusjs' - +countBlock - a.disqusjs-comment-count(href=full_url_for(page.path) + '#post-comment') - i.fa-solid.fa-spinner.fa-spin - when 'Valine' - +countBlock - a(href=url_for(page.path) + '#post-comment' itemprop="discussionUrl") - span.valine-comment-count(data-xid=url_for(page.path) itemprop="commentCount") - i.fa-solid.fa-spinner.fa-spin - when 'Waline' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span.waline-comment-count(data-path=url_for(page.path)) - i.fa-solid.fa-spinner.fa-spin - when 'Gitalk' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span.gitalk-comment-count - i.fa-solid.fa-spinner.fa-spin - when 'Twikoo' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span#twikoo-count - i.fa-solid.fa-spinner.fa-spin - when 'Facebook Comments' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span.fb-comments-count(data-href=urlNoIndex()) - when 'Remark42' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span.remark42__counter(data-url=urlNoIndex()) - i.fa-solid.fa-spinner.fa-spin - when 'Artalk' - +countBlock - a(href=url_for(page.path) + '#post-comment') - span#ArtalkCount +- let comments = theme.comments +#post-info + h1.post-title= page.title || _p('no_title') + if theme.post_edit.enable + a.post-edit-link(href=theme.post_edit.url + page.source title=_p('post.edit') target="_blank") + i.fas.fa-pencil-alt + + #post-meta + .meta-firstline + if theme.post_meta.post.date_type + span.post-meta-date + if theme.post_meta.post.date_type === 'both' + i.far.fa-calendar-alt.fa-fw.post-meta-icon + span.post-meta-label= _p('post.created') + time.post-meta-date-created(datetime=date_xml(page.date) title=_p('post.created') + ' ' + full_date(page.date))= date(page.date, config.date_format) + span.post-meta-separator | + i.fas.fa-history.fa-fw.post-meta-icon + span.post-meta-label= _p('post.updated') + time.post-meta-date-updated(datetime=date_xml(page.updated) title=_p('post.updated') + ' ' + full_date(page.updated))= date(page.updated, config.date_format) + else + - let data_type_update = theme.post_meta.post.date_type === 'updated' + - let date_type = data_type_update ? 'updated' : 'date' + - let date_icon = data_type_update ? 'fas fa-history' : 'far fa-calendar-alt' + - let date_title = data_type_update ? _p('post.updated') : _p('post.created') + i.fa-fw.post-meta-icon(class=date_icon) + span.post-meta-label= date_title + time(datetime=date_xml(page[date_type]) title=date_title + ' ' + full_date(page[date_type]))= date(page[date_type], config.date_format) + if theme.post_meta.post.categories && page.categories.data.length > 0 + span.post-meta-categories + if theme.post_meta.post.date_type + span.post-meta-separator | + each item, index in page.categories.data + i.fas.fa-inbox.fa-fw.post-meta-icon + a(href=url_for(item.path)).post-meta-categories #[=item.name] + if index < page.categories.data.length - 1 + i.fas.fa-angle-right.post-meta-separator + + .meta-secondline + - let postWordcount = theme.wordcount.enable && (theme.wordcount.post_wordcount || theme.wordcount.min2read) + if postWordcount + span.post-meta-separator | + span.post-meta-wordcount + if theme.wordcount.post_wordcount + i.far.fa-file-word.fa-fw.post-meta-icon + span.post-meta-label= _p('post.wordcount') + ':' + span.word-count= wordcount(page.content) + if theme.wordcount.min2read + span.post-meta-separator | + if theme.wordcount.min2read + i.far.fa-clock.fa-fw.post-meta-icon + span.post-meta-label= _p('post.min2read') + ':' + span= min2read(page.content, {cn: 350, en: 160}) + _p('post.min2read_unit') + + //- for pv and count + mixin pvBlock(parent_id, parent_class, parent_title) + span.post-meta-separator | + span(class=parent_class id=parent_id data-flag-title=parent_title) + i.far.fa-eye.fa-fw.post-meta-icon + span.post-meta-label= _p('post.page_pv') + ':' + if block + block + + mixin otherPV() + if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.page_pv + +pvBlock('', '', '') + span#umamiPV(data-path=url_for(page.path)) + i.fa-solid.fa-spinner.fa-spin + else if theme.busuanzi.page_pv + +pvBlock('', 'post-meta-pv-cv', '') + span#busuanzi_value_page_pv + i.fa-solid.fa-spinner.fa-spin + + - const commentUse = comments.use && comments.use[0] + if page.comments !== false && commentUse && !comments.lazyload + if commentUse === 'Valine' && theme.valine.visitor + +pvBlock(url_for(page.path), 'leancloud_visitors', page.title) + span.leancloud-visitors-count + i.fa-solid.fa-spinner.fa-spin + else if commentUse === 'Waline' && theme.waline.pageview + +pvBlock('', '', '') + span.waline-pageview-count(data-path=url_for(page.path)) + i.fa-solid.fa-spinner.fa-spin + else if commentUse === 'Twikoo' && theme.twikoo.visitor + +pvBlock('', '', '') + span#twikoo_visitors + i.fa-solid.fa-spinner.fa-spin + else if commentUse === 'Artalk' && theme.artalk.visitor + +pvBlock('', '', '') + span#ArtalkPV + i.fa-solid.fa-spinner.fa-spin + else + +otherPV() + else + +otherPV() + + if comments.count && !comments.lazyload && page.comments !== false && comments.use + - var whichCount = comments.use[0] + + mixin countBlock + span.post-meta-separator | + span.post-meta-commentcount + i.far.fa-comments.fa-fw.post-meta-icon + span.post-meta-label= _p('post.comments') + ':' + if block + block + + case whichCount + when 'Disqus' + +countBlock + a.disqus-comment-count(href=full_url_for(page.path) + '#post-comment') + i.fa-solid.fa-spinner.fa-spin + when 'Disqusjs' + +countBlock + a.disqusjs-comment-count(href=full_url_for(page.path) + '#post-comment') + i.fa-solid.fa-spinner.fa-spin + when 'Valine' + +countBlock + a(href=url_for(page.path) + '#post-comment' itemprop="discussionUrl") + span.valine-comment-count(data-xid=url_for(page.path) itemprop="commentCount") + i.fa-solid.fa-spinner.fa-spin + when 'Waline' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span.waline-comment-count(data-path=url_for(page.path)) + i.fa-solid.fa-spinner.fa-spin + when 'Gitalk' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span.gitalk-comment-count + i.fa-solid.fa-spinner.fa-spin + when 'Twikoo' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span#twikoo-count + i.fa-solid.fa-spinner.fa-spin + when 'Facebook Comments' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span.fb-comments-count(data-href=urlNoIndex()) + when 'Remark42' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span.remark42__counter(data-url=urlNoIndex()) + i.fa-solid.fa-spinner.fa-spin + when 'Artalk' + +countBlock + a(href=url_for(page.path) + '#post-comment') + span#ArtalkCount i.fa-solid.fa-spinner.fa-spin \ No newline at end of file diff --git a/layout/includes/header/social.pug b/layout/includes/header/social.pug index 81b47cc..cc816fa 100644 --- a/layout/includes/header/social.pug +++ b/layout/includes/header/social.pug @@ -1,8 +1,8 @@ -each url, icon in theme.social - - - const [link, title, color] = url.split('||').map(i => trim(i)) - const href = url_for(link) - const iconStyle = color ? `color: ${color.replace(/[\'\"]/g, '')};` : '' - const iconTitle = title || '' - a.social-icon(href=href target="_blank" title=iconTitle) +each url, icon in theme.social + - + const [link, title, color] = url.split('||').map(i => trim(i)) + const href = url_for(link) + const iconStyle = color ? `color: ${color.replace(/[\'\"]/g, '')};` : '' + const iconTitle = title || '' + a.social-icon(href=href target="_blank" title=iconTitle) i(class=icon style=iconStyle) \ No newline at end of file diff --git a/layout/includes/layout.pug b/layout/includes/layout.pug index cf3e973..ef6a46b 100644 --- a/layout/includes/layout.pug +++ b/layout/includes/layout.pug @@ -1,37 +1,37 @@ -- var globalPageType = getPageType(page, is_home) -- var htmlClassHideAside = theme.aside.enable && theme.aside.hide ? 'hide-aside' : '' -- page.aside = globalPageType === 'archive' ? theme.aside.display.archive: globalPageType === 'category' ? theme.aside.display.category : globalPageType === 'tag' ? theme.aside.display.tag : page.aside -- var hideAside = !theme.aside.enable || page.aside === false ? 'hide-aside' : '' -- var pageType = globalPageType === 'post' ? 'post' : 'page' -- pageType = page.type ? pageType + ' type-' + page.type : pageType - -doctype html -html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside) - head - include ./head.pug - body - !=partial('includes/loading/index', {}, {cache: true}) - - if theme.background - #web_bg(style=getBgPath(theme.background)) - - !=partial('includes/sidebar', {}, {cache: true}) - - #body-wrap(class=pageType) - include ./header/index.pug - - main#content-inner.layout(class=hideAside) - if body - div!= body - else - block content - if theme.aside.enable && page.aside !== false - include widget/index.pug - - - const footerBg = theme.footer_img - - const footer_bg = footerBg ? footerBg === true ? bg_img : getBgPath(footerBg) : '' - footer#footer(style=footer_bg) - !=partial('includes/footer', {}, {cache: true}) - - include ./rightside.pug +- var globalPageType = getPageType(page, is_home) +- var htmlClassHideAside = theme.aside.enable && theme.aside.hide ? 'hide-aside' : '' +- page.aside = globalPageType === 'archive' ? theme.aside.display.archive: globalPageType === 'category' ? theme.aside.display.category : globalPageType === 'tag' ? theme.aside.display.tag : page.aside +- var hideAside = !theme.aside.enable || page.aside === false ? 'hide-aside' : '' +- var pageType = globalPageType === 'post' ? 'post' : 'page' +- pageType = page.type ? pageType + ' type-' + page.type : pageType + +doctype html +html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside) + head + include ./head.pug + body + !=partial('includes/loading/index', {}, {cache: true}) + + if theme.background + #web_bg(style=getBgPath(theme.background)) + + !=partial('includes/sidebar', {}, {cache: true}) + + #body-wrap(class=pageType) + include ./header/index.pug + + main#content-inner.layout(class=hideAside) + if body + div!= body + else + block content + if theme.aside.enable && page.aside !== false + include widget/index.pug + + - const footerBg = theme.footer_img + - const footer_bg = footerBg ? footerBg === true ? bg_img : getBgPath(footerBg) : '' + footer#footer(style=footer_bg) + !=partial('includes/footer', {}, {cache: true}) + + include ./rightside.pug include ./additional-js.pug \ No newline at end of file diff --git a/layout/includes/loading/fullpage-loading.pug b/layout/includes/loading/fullpage-loading.pug index 774a6b9..a3d0098 100644 --- a/layout/includes/loading/fullpage-loading.pug +++ b/layout/includes/loading/fullpage-loading.pug @@ -1,33 +1,33 @@ -#loading-box - .loading-left-bg - .loading-right-bg - .spinner-box - .configure-border-1 - .configure-core - .configure-border-2 - .configure-core - .loading-word= _p('loading') - -script. - (()=>{ - const $loadingBox = document.getElementById('loading-box') - const $body = document.body - const preloader = { - endLoading: () => { - $body.style.overflow = '' - $loadingBox.classList.add('loaded') - }, - initLoading: () => { - $body.style.overflow = 'hidden' - $loadingBox.classList.remove('loaded') - } - } - - preloader.initLoading() - window.addEventListener('load', preloader.endLoading) - - if (!{theme.pjax && theme.pjax.enable}) { - btf.addGlobalFn('pjaxSend', preloader.initLoading, 'preloader_init') - btf.addGlobalFn('pjaxComplete', preloader.endLoading, 'preloader_end') - } +#loading-box + .loading-left-bg + .loading-right-bg + .spinner-box + .configure-border-1 + .configure-core + .configure-border-2 + .configure-core + .loading-word= _p('loading') + +script. + (()=>{ + const $loadingBox = document.getElementById('loading-box') + const $body = document.body + const preloader = { + endLoading: () => { + $body.style.overflow = '' + $loadingBox.classList.add('loaded') + }, + initLoading: () => { + $body.style.overflow = 'hidden' + $loadingBox.classList.remove('loaded') + } + } + + preloader.initLoading() + window.addEventListener('load', preloader.endLoading) + + if (!{theme.pjax && theme.pjax.enable}) { + btf.addGlobalFn('pjaxSend', preloader.initLoading, 'preloader_init') + btf.addGlobalFn('pjaxComplete', preloader.endLoading, 'preloader_end') + } })() \ No newline at end of file diff --git a/layout/includes/loading/index.pug b/layout/includes/loading/index.pug index 6a6facc..b058b58 100644 --- a/layout/includes/loading/index.pug +++ b/layout/includes/loading/index.pug @@ -1,5 +1,5 @@ -if theme.preloader.enable - if theme.preloader.source === 1 - include ./fullpage-loading.pug - else +if theme.preloader.enable + if theme.preloader.source === 1 + include ./fullpage-loading.pug + else include ./pace.pug \ No newline at end of file diff --git a/layout/includes/loading/pace.pug b/layout/includes/loading/pace.pug index 4cf2a4e..ac04c9b 100644 --- a/layout/includes/loading/pace.pug +++ b/layout/includes/loading/pace.pug @@ -1,12 +1,12 @@ -script. - window.paceOptions = { - restartOnPushState: false - } - - btf.addGlobalFn('pjaxSend', () => { - Pace.restart() - }, 'pace_restart') - - -link(rel="stylesheet", href=url_for(theme.preloader.pace_css_url || theme.asset.pace_default_css)) +script. + window.paceOptions = { + restartOnPushState: false + } + + btf.addGlobalFn('pjaxSend', () => { + Pace.restart() + }, 'pace_restart') + + +link(rel="stylesheet", href=url_for(theme.preloader.pace_css_url || theme.asset.pace_default_css)) script(src=url_for(theme.asset.pace_js)) \ No newline at end of file diff --git a/layout/includes/mixins/article-sort.pug b/layout/includes/mixins/article-sort.pug index acc5d9f..79f87da 100644 --- a/layout/includes/mixins/article-sort.pug +++ b/layout/includes/mixins/article-sort.pug @@ -1,23 +1,23 @@ -mixin articleSort(posts) - .article-sort - - let year - - posts.forEach(article => { - - const tempYear = date(article.date, 'YYYY') - - const noCoverClass = article.cover === false || !theme.cover.archives_enable ? 'no-article-cover' : '' - - const title = article.title || _p('no_title') - if tempYear !== year - - year = tempYear - .article-sort-item.year= year - .article-sort-item(class=noCoverClass) - if article.cover && theme.cover.archives_enable - a.article-sort-item-img(href=url_for(article.path) title=title) - if article.cover_type === 'img' - img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`) - else - div(style=`background: ${article.cover}`) - .article-sort-item-info - .article-sort-item-time - i.far.fa-calendar-alt - time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))= date(article.date, config.date_format) - a.article-sort-item-title(href=url_for(article.path) title=title)= title +mixin articleSort(posts) + .article-sort + - let year + - posts.forEach(article => { + - const tempYear = date(article.date, 'YYYY') + - const noCoverClass = article.cover === false || !theme.cover.archives_enable ? 'no-article-cover' : '' + - const title = article.title || _p('no_title') + if tempYear !== year + - year = tempYear + .article-sort-item.year= year + .article-sort-item(class=noCoverClass) + if article.cover && theme.cover.archives_enable + a.article-sort-item-img(href=url_for(article.path) title=title) + if article.cover_type === 'img' + img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`) + else + div(style=`background: ${article.cover}`) + .article-sort-item-info + .article-sort-item-time + i.far.fa-calendar-alt + time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))= date(article.date, config.date_format) + a.article-sort-item-title(href=url_for(article.path) title=title)= title - }) \ No newline at end of file diff --git a/layout/includes/mixins/indexPostUI.pug b/layout/includes/mixins/indexPostUI.pug index 4f2c3ee..874ad5e 100644 --- a/layout/includes/mixins/indexPostUI.pug +++ b/layout/includes/mixins/indexPostUI.pug @@ -1,116 +1,116 @@ -mixin indexPostUI() - - const indexLayout = theme.index_layout - - const masonryLayoutClass = (indexLayout === 6 || indexLayout === 7) ? 'masonry' : '' - #recent-posts.recent-posts.nc(class=masonryLayoutClass) - .recent-post-items - each article, index in page.posts.data - .recent-post-item - - const link = article.link || article.path - - const title = article.title || _p('no_title') - - const leftOrRight = indexLayout === 3 ? (index % 2 === 0 ? 'left' : 'right') : (indexLayout === 2 ? 'right' : '') - - const post_cover = article.cover - - const no_cover = article.cover === false || !theme.cover.index_enable ? 'no-cover' : '' - - if post_cover && theme.cover.index_enable - .post_cover(class=leftOrRight) - a(href=url_for(link) title=title) - if article.cover_type === 'img' - img.post-bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title) - else - div.post-bg(style=`background: ${post_cover}`) - .recent-post-info(class=no_cover) - a.article-title(href=url_for(link) title=title) - if globalPageType === 'home' && (article.top || article.sticky > 0) - i.fas.fa-thumbtack.sticky - = title - .article-meta-wrap - if theme.post_meta.page.date_type - span.post-meta-date - if theme.post_meta.page.date_type === 'both' - i.far.fa-calendar-alt - span.article-meta-label=_p('post.created') - time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))= date(article.date, config.date_format) - span.article-meta-separator | - i.fas.fa-history - span.article-meta-label=_p('post.updated') - time.post-meta-date-updated(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated))= date(article.updated, config.date_format) - else - - const data_type_updated = theme.post_meta.page.date_type === 'updated' - - const date_type = data_type_updated ? 'updated' : 'date' - - const date_icon = data_type_updated ? 'fas fa-history' : 'far fa-calendar-alt' - - const date_title = data_type_updated ? _p('post.updated') : _p('post.created') - i(class=date_icon) - span.article-meta-label= date_title - time(datetime=date_xml(article[date_type]) title=date_title + ' ' + full_date(article[date_type]))= date(article[date_type], config.date_format) - if theme.post_meta.page.categories && article.categories.data.length > 0 - span.article-meta - span.article-meta-separator | - each item, index in article.categories.data - i.fas.fa-inbox - a(href=url_for(item.path)).article-meta__categories #[=item.name] - if index < article.categories.data.length - 1 - i.fas.fa-angle-right.article-meta-link - if theme.post_meta.page.tags && article.tags.length > 0 - span.article-meta.tags - span.article-meta-separator | - each item, index in article.tags.data - i.fas.fa-tag - a(href=url_for(item.path)).article-meta__tags #[=item.name] - if index < article.tags.data.length - 1 - span.article-meta-link #[='•'] - - mixin countBlockInIndex - - needLoadCountJs = true - span.article-meta - span.article-meta-separator | - i.fas.fa-comments - if block - block - span.article-meta-label= ' ' + _p('card_post_count') - - if theme.comments.card_post_count && theme.comments.use - case theme.comments.use[0] - when 'Disqus' - when 'Disqusjs' - +countBlockInIndex - a.disqus-count(href=full_url_for(link) + '#post-comment') - i.fa-solid.fa-spinner.fa-spin - when 'Valine' - +countBlockInIndex - a(href=url_for(link) + '#post-comment') - span.valine-comment-count(data-xid=url_for(link)) - i.fa-solid.fa-spinner.fa-spin - when 'Waline' - +countBlockInIndex - a(href=url_for(link) + '#post-comment') - span.waline-comment-count(data-path=url_for(link)) - i.fa-solid.fa-spinner.fa-spin - when 'Twikoo' - +countBlockInIndex - a.twikoo-count(href=url_for(link) + '#post-comment') - i.fa-solid.fa-spinner.fa-spin - when 'Facebook Comments' - +countBlockInIndex - a(href=url_for(link) + '#post-comment') - span.fb-comments-count(data-href=urlNoIndex(article.permalink)) - when 'Remark42' - +countBlockInIndex - a(href=url_for(link) + '#post-comment') - span.remark42__counter(data-url=urlNoIndex(article.permalink)) - i.fa-solid.fa-spinner.fa-spin - when 'Artalk' - +countBlockInIndex - a(href=url_for(link) + '#post-comment') - span.artalk-count(data-page-key=url_for(link)) - i.fa-solid.fa-spinner.fa-spin - - //- Display the article introduction on homepage - - const content = postDesc(article) - if content - .content!=content - - if theme.ad && theme.ad.index - if (index + 1) % 3 === 0 - .recent-post-item.ads-wrap!= theme.ad.index - +mixin indexPostUI() + - const indexLayout = theme.index_layout + - const masonryLayoutClass = (indexLayout === 6 || indexLayout === 7) ? 'masonry' : '' + #recent-posts.recent-posts.nc(class=masonryLayoutClass) + .recent-post-items + each article, index in page.posts.data + .recent-post-item + - const link = article.link || article.path + - const title = article.title || _p('no_title') + - const leftOrRight = indexLayout === 3 ? (index % 2 === 0 ? 'left' : 'right') : (indexLayout === 2 ? 'right' : '') + - const post_cover = article.cover + - const no_cover = article.cover === false || !theme.cover.index_enable ? 'no-cover' : '' + + if post_cover && theme.cover.index_enable + .post_cover(class=leftOrRight) + a(href=url_for(link) title=title) + if article.cover_type === 'img' + img.post-bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title) + else + div.post-bg(style=`background: ${post_cover}`) + .recent-post-info(class=no_cover) + a.article-title(href=url_for(link) title=title) + if globalPageType === 'home' && (article.top || article.sticky > 0) + i.fas.fa-thumbtack.sticky + = title + .article-meta-wrap + if theme.post_meta.page.date_type + span.post-meta-date + if theme.post_meta.page.date_type === 'both' + i.far.fa-calendar-alt + span.article-meta-label=_p('post.created') + time.post-meta-date-created(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date))= date(article.date, config.date_format) + span.article-meta-separator | + i.fas.fa-history + span.article-meta-label=_p('post.updated') + time.post-meta-date-updated(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated))= date(article.updated, config.date_format) + else + - const data_type_updated = theme.post_meta.page.date_type === 'updated' + - const date_type = data_type_updated ? 'updated' : 'date' + - const date_icon = data_type_updated ? 'fas fa-history' : 'far fa-calendar-alt' + - const date_title = data_type_updated ? _p('post.updated') : _p('post.created') + i(class=date_icon) + span.article-meta-label= date_title + time(datetime=date_xml(article[date_type]) title=date_title + ' ' + full_date(article[date_type]))= date(article[date_type], config.date_format) + if theme.post_meta.page.categories && article.categories.data.length > 0 + span.article-meta + span.article-meta-separator | + each item, index in article.categories.data + i.fas.fa-inbox + a(href=url_for(item.path)).article-meta__categories #[=item.name] + if index < article.categories.data.length - 1 + i.fas.fa-angle-right.article-meta-link + if theme.post_meta.page.tags && article.tags.length > 0 + span.article-meta.tags + span.article-meta-separator | + each item, index in article.tags.data + i.fas.fa-tag + a(href=url_for(item.path)).article-meta__tags #[=item.name] + if index < article.tags.data.length - 1 + span.article-meta-link #[='•'] + + mixin countBlockInIndex + - needLoadCountJs = true + span.article-meta + span.article-meta-separator | + i.fas.fa-comments + if block + block + span.article-meta-label= ' ' + _p('card_post_count') + + if theme.comments.card_post_count && theme.comments.use + case theme.comments.use[0] + when 'Disqus' + when 'Disqusjs' + +countBlockInIndex + a.disqus-count(href=full_url_for(link) + '#post-comment') + i.fa-solid.fa-spinner.fa-spin + when 'Valine' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span.valine-comment-count(data-xid=url_for(link)) + i.fa-solid.fa-spinner.fa-spin + when 'Waline' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span.waline-comment-count(data-path=url_for(link)) + i.fa-solid.fa-spinner.fa-spin + when 'Twikoo' + +countBlockInIndex + a.twikoo-count(href=url_for(link) + '#post-comment') + i.fa-solid.fa-spinner.fa-spin + when 'Facebook Comments' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span.fb-comments-count(data-href=urlNoIndex(article.permalink)) + when 'Remark42' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span.remark42__counter(data-url=urlNoIndex(article.permalink)) + i.fa-solid.fa-spinner.fa-spin + when 'Artalk' + +countBlockInIndex + a(href=url_for(link) + '#post-comment') + span.artalk-count(data-page-key=url_for(link)) + i.fa-solid.fa-spinner.fa-spin + + //- Display the article introduction on homepage + - const content = postDesc(article) + if content + .content!=content + + if theme.ad && theme.ad.index + if (index + 1) % 3 === 0 + .recent-post-item.ads-wrap!= theme.ad.index + include ../pagination.pug \ No newline at end of file diff --git a/layout/includes/page/404.pug b/layout/includes/page/404.pug index 9444204..b08b5ad 100644 --- a/layout/includes/page/404.pug +++ b/layout/includes/page/404.pug @@ -1,8 +1,8 @@ -- var top_img_404 = theme.error_404.background || theme.default_top_img - -.error-content - .error-img - img(src=url_for(top_img_404) alt='Page not found') - .error-info - h1.error_title= '404' - .error_subtitle= theme.error_404.subtitle || _p('error404') +- var top_img_404 = theme.error_404.background || theme.default_top_img + +.error-content + .error-img + img(src=url_for(top_img_404) alt='Page not found') + .error-info + h1.error_title= '404' + .error_subtitle= theme.error_404.subtitle || _p('error404') diff --git a/layout/includes/page/default-page.pug b/layout/includes/page/default-page.pug index 4a7d515..38f651a 100644 --- a/layout/includes/page/default-page.pug +++ b/layout/includes/page/default-page.pug @@ -1,2 +1,2 @@ -#article-container.container +#article-container.container != page.content \ No newline at end of file diff --git a/layout/includes/page/flink.pug b/layout/includes/page/flink.pug index f94fffc..a4b6e27 100644 --- a/layout/includes/page/flink.pug +++ b/layout/includes/page/flink.pug @@ -1,82 +1,82 @@ -#article-container.container - .flink - - let { content, random, flink_url } = page - - let pageContent = content - - if flink_url || random - - const linkData = flink_url ? false : site.data.link || false - script. - (()=>{ - const replaceSymbol = (str) => { - return str.replace(/[\p{P}\p{S}]/gu, "-") - } - - let result = "" - const add = (str) => { - for(let i = 0; i < str.length; i++){ - const replaceClassName = replaceSymbol(str[i].class_name) - const className = str[i].class_name ? `

${str[i].class_name}

` : "" - const classDesc = str[i].class_desc ? `
${str[i].class_desc}
` : "" - - let listResult = "" - const lists = str[i].link_list - if (!{random === true}) { - lists.sort(() => Math.random() - 0.5) - } - for(let j = 0; j < lists.length; j++){ - listResult += ` -
- -
- ${lists[j].name} -
-
${lists[j].name}
-
${lists[j].descr}
- -
` - } - - result += `${className}${classDesc}
${listResult}
` - } - - document.querySelector(".flink").insertAdjacentHTML("afterbegin", result) - window.lazyLoadInstance && window.lazyLoadInstance.update() - } - - const linkData = !{JSON.stringify(linkData)} - if (!{Boolean(flink_url)}) { - fetch("!{url_for(flink_url)}") - .then(response => response.json()) - .then(add) - } else if (linkData) { - add(linkData) - } - })() - - else - if site.data.link - - let result = "" - each i in site.data.link - - let className = i.class_name ? markdown(`## ${i.class_name}`) : "" - - let classDesc = i.class_desc ? `
${i.class_desc}
` : "" - - - let listResult = "" - - each j in i.link_list - - - listResult += ` -
- -
- ${j.name} -
-
${j.name}
-
${j.descr}
- -
` - - - - - result += `${className}${classDesc}
${listResult}
` - - - pageContent = result + pageContent - != pageContent +#article-container.container + .flink + - let { content, random, flink_url } = page + - let pageContent = content + + if flink_url || random + - const linkData = flink_url ? false : site.data.link || false + script. + (()=>{ + const replaceSymbol = (str) => { + return str.replace(/[\p{P}\p{S}]/gu, "-") + } + + let result = "" + const add = (str) => { + for(let i = 0; i < str.length; i++){ + const replaceClassName = replaceSymbol(str[i].class_name) + const className = str[i].class_name ? `

${str[i].class_name}

` : "" + const classDesc = str[i].class_desc ? `
${str[i].class_desc}
` : "" + + let listResult = "" + const lists = str[i].link_list + if (!{random === true}) { + lists.sort(() => Math.random() - 0.5) + } + for(let j = 0; j < lists.length; j++){ + listResult += ` +
+ +
+ ${lists[j].name} +
+
${lists[j].name}
+
${lists[j].descr}
+ +
` + } + + result += `${className}${classDesc}
${listResult}
` + } + + document.querySelector(".flink").insertAdjacentHTML("afterbegin", result) + window.lazyLoadInstance && window.lazyLoadInstance.update() + } + + const linkData = !{JSON.stringify(linkData)} + if (!{Boolean(flink_url)}) { + fetch("!{url_for(flink_url)}") + .then(response => response.json()) + .then(add) + } else if (linkData) { + add(linkData) + } + })() + + else + if site.data.link + - let result = "" + each i in site.data.link + - let className = i.class_name ? markdown(`## ${i.class_name}`) : "" + - let classDesc = i.class_desc ? `
${i.class_desc}
` : "" + + - let listResult = "" + + each j in i.link_list + - + listResult += ` +
+ +
+ ${j.name} +
+
${j.name}
+
${j.descr}
+ +
` + - + + - result += `${className}${classDesc}
${listResult}
` + + - pageContent = result + pageContent + != pageContent diff --git a/layout/includes/page/shuoshuo.pug b/layout/includes/page/shuoshuo.pug index 3bcb01d..c107d5c 100644 --- a/layout/includes/page/shuoshuo.pug +++ b/layout/includes/page/shuoshuo.pug @@ -1,188 +1,188 @@ -//- - author: -//- avatar: -//- date: -//- content: -//- tags: -//- - tag1 -//- - tag2 - -- page.toc = false - -#article-container - if page.comments !== false && theme.comments.use - - commentsJsLoad = true - - script. - (() => { - const commentDiv = `!{partial('includes/third-party/comments/index', {}, {cache: true})}` - - const runDestroy = (shuoshuoComment) => { - if (!shuoshuoComment) return - - for (const [key, fn] of Object.entries(shuoshuoComment)) { - if (key.startsWith('destroy')) fn() - } - } - - window.addCommentToShuoshuo = e => { - const btn = e.target.closest('.shuoshuo-comment-btn') - if (!btn) return - - const ele = btn.closest('.container').nextElementSibling - const { shuoshuoComment } = window - const isInclude = ele.classList.contains('no-comment') - runDestroy(shuoshuoComment) - if (isInclude) { - ele.classList.remove('no-comment') - ele.innerHTML = commentDiv - const key = `${location.pathname.replace(/\/$/, '')}?key=${ele.getAttribute('data-key')}` - btf.switchComments(ele, key) - shuoshuoComment.loadComment && shuoshuoComment.loadComment(ele, key) - } - } - })() - - if page.shuoshuo_url - script. - (() => { - const limitConfig = !{ JSON.stringify(page.limit || {}) } - - const sortDataByDate = data => data.sort((a, b) => new Date(b.date) - new Date(a.date)) - - const filterDataByLimit = (data, limit) => { - if (!limit || !limit.type) return data - if (limit.type === 'num') return data.slice(0, limit.value) - if (limit.type === 'date') { - const limitDate = new Date(limit.value) - return data.filter(item => new Date(item.date) >= limitDate) - } - return data - }; - - const formatToTimeZone = (date) => { - const fullDate = date.length === 10 ? `${date} 00:00:00` : date - const visitorTimeZone = '#{config.timezone}' || Intl.DateTimeFormat().resolvedOptions().timeZone - const options = { - timeZone: visitorTimeZone, - year: 'numeric', - month: '2-digit', - day: '2-digit', - hour: '2-digit', - minute: '2-digit', - second: '2-digit', - hour12: false - } - const [day, month, year, hour, minute, second] = new Intl.DateTimeFormat('en-GB', options) - .format(new Date(fullDate)) - .match(/\d+/g) - return `${year}-${month}-${day} ${hour}:${minute}:${second}` - } - - const loadShuoshuo = async () => { - try { - const response = await fetch('!{url_for(page.shuoshuo_url)}') - let data = await response.json() - - data = filterDataByLimit(sortDataByDate(data), limitConfig) - - const container = document.getElementById('article-container') - let start = 0 - - const renderData = (dataSlice) => { - const content = dataSlice.map(item => { - const formattedDate = formatToTimeZone(item.date) - const tags = item.tags && item.tags.map(tag => `${tag}`).join('') || '' - const commentButton = item.key && !{commentsJsLoad} - ? `
- -
` - : '' - const commentContainer = item.key - ? `
` - : '' - - return ` -
-
-
-
- -
-
-
${item.author || '!{config.author}'}
- -
-
-
${item.content}
-
- ${tags ? `
${tags}
` : ''} - ${commentButton} -
-
- ${commentContainer} -
` - }).join('') - - container.insertAdjacentHTML('beforeend', content) - - window.lazyLoadInstance.update() - btf.loadLightbox(document.querySelectorAll('#article-container img:not(.no-lightbox)')) - } - - const handleIntersection = (entries) => { - if (!entries[0].isIntersecting) return - observer.unobserve(entries[0].target) - - const slice = data.slice(start, start + 10) - renderData(slice) - start += 10 - - if (start < data.length) { - setTimeout(() => observer.observe(container.lastElementChild), 100) - } else { - observer.disconnect() - } - }; - - const observer = new IntersectionObserver(handleIntersection, { - root: null, - rootMargin: '0px', - threshold: 1.0 - }) - - renderData(data.slice(start, 10)) - start += 10 - - if (container.lastElementChild) observer.observe(container.lastElementChild) - } catch (error) { - console.error(error) - } - }; - - window.pjax ? loadShuoshuo() : window.addEventListener('load', loadShuoshuo) - })() - else - if site.data.shuoshuo - each i in shuoshuoFN(site.data.shuoshuo, page) - .shuoshuo-item - .container - .shuoshuo-item-header - .shuoshuo-avatar - img.no-lightbox(src=i.avatar || url_for(theme.avatar.img)) - .shuoshuo-info - .shuoshuo-author=i.author || config.author - time.shuoshuo-date(title=i.date)=i.date - .shuoshuo-content - !=markdown(i.content) - .shuoshuo-footer(class=i.tags && i.tags.length ? 'flex-between' : 'flex-end') - if i.tags - .shuoshuo-tags - each tag in i.tags - span.shuoshuo-tag=tag - if i.key && commentsJsLoad - .shuoshuo-comment-btn(onclick='addCommentToShuoshuo(event)') - i.fa-solid.fa-comments - if i.key && commentsJsLoad +//- - author: +//- avatar: +//- date: +//- content: +//- tags: +//- - tag1 +//- - tag2 + +- page.toc = false + +#article-container + if page.comments !== false && theme.comments.use + - commentsJsLoad = true + + script. + (() => { + const commentDiv = `!{partial('includes/third-party/comments/index', {}, {cache: true})}` + + const runDestroy = (shuoshuoComment) => { + if (!shuoshuoComment) return + + for (const [key, fn] of Object.entries(shuoshuoComment)) { + if (key.startsWith('destroy')) fn() + } + } + + window.addCommentToShuoshuo = e => { + const btn = e.target.closest('.shuoshuo-comment-btn') + if (!btn) return + + const ele = btn.closest('.container').nextElementSibling + const { shuoshuoComment } = window + const isInclude = ele.classList.contains('no-comment') + runDestroy(shuoshuoComment) + if (isInclude) { + ele.classList.remove('no-comment') + ele.innerHTML = commentDiv + const key = `${location.pathname.replace(/\/$/, '')}?key=${ele.getAttribute('data-key')}` + btf.switchComments(ele, key) + shuoshuoComment.loadComment && shuoshuoComment.loadComment(ele, key) + } + } + })() + + if page.shuoshuo_url + script. + (() => { + const limitConfig = !{ JSON.stringify(page.limit || {}) } + + const sortDataByDate = data => data.sort((a, b) => new Date(b.date) - new Date(a.date)) + + const filterDataByLimit = (data, limit) => { + if (!limit || !limit.type) return data + if (limit.type === 'num') return data.slice(0, limit.value) + if (limit.type === 'date') { + const limitDate = new Date(limit.value) + return data.filter(item => new Date(item.date) >= limitDate) + } + return data + }; + + const formatToTimeZone = (date) => { + const fullDate = date.length === 10 ? `${date} 00:00:00` : date + const visitorTimeZone = '#{config.timezone}' || Intl.DateTimeFormat().resolvedOptions().timeZone + const options = { + timeZone: visitorTimeZone, + year: 'numeric', + month: '2-digit', + day: '2-digit', + hour: '2-digit', + minute: '2-digit', + second: '2-digit', + hour12: false + } + const [day, month, year, hour, minute, second] = new Intl.DateTimeFormat('en-GB', options) + .format(new Date(fullDate)) + .match(/\d+/g) + return `${year}-${month}-${day} ${hour}:${minute}:${second}` + } + + const loadShuoshuo = async () => { + try { + const response = await fetch('!{url_for(page.shuoshuo_url)}') + let data = await response.json() + + data = filterDataByLimit(sortDataByDate(data), limitConfig) + + const container = document.getElementById('article-container') + let start = 0 + + const renderData = (dataSlice) => { + const content = dataSlice.map(item => { + const formattedDate = formatToTimeZone(item.date) + const tags = item.tags && item.tags.map(tag => `${tag}`).join('') || '' + const commentButton = item.key && !{commentsJsLoad} + ? `
+ +
` + : '' + const commentContainer = item.key + ? `
` + : '' + + return ` +
+
+
+
+ +
+
+
${item.author || '!{config.author}'}
+ +
+
+
${item.content}
+
+ ${tags ? `
${tags}
` : ''} + ${commentButton} +
+
+ ${commentContainer} +
` + }).join('') + + container.insertAdjacentHTML('beforeend', content) + + window.lazyLoadInstance.update() + btf.loadLightbox(document.querySelectorAll('#article-container img:not(.no-lightbox)')) + } + + const handleIntersection = (entries) => { + if (!entries[0].isIntersecting) return + observer.unobserve(entries[0].target) + + const slice = data.slice(start, start + 10) + renderData(slice) + start += 10 + + if (start < data.length) { + setTimeout(() => observer.observe(container.lastElementChild), 100) + } else { + observer.disconnect() + } + }; + + const observer = new IntersectionObserver(handleIntersection, { + root: null, + rootMargin: '0px', + threshold: 1.0 + }) + + renderData(data.slice(start, 10)) + start += 10 + + if (container.lastElementChild) observer.observe(container.lastElementChild) + } catch (error) { + console.error(error) + } + }; + + window.pjax ? loadShuoshuo() : window.addEventListener('load', loadShuoshuo) + })() + else + if site.data.shuoshuo + each i in shuoshuoFN(site.data.shuoshuo, page) + .shuoshuo-item + .container + .shuoshuo-item-header + .shuoshuo-avatar + img.no-lightbox(src=i.avatar || url_for(theme.avatar.img)) + .shuoshuo-info + .shuoshuo-author=i.author || config.author + time.shuoshuo-date(title=i.date)=i.date + .shuoshuo-content + !=markdown(i.content) + .shuoshuo-footer(class=i.tags && i.tags.length ? 'flex-between' : 'flex-end') + if i.tags + .shuoshuo-tags + each tag in i.tags + span.shuoshuo-tag=tag + if i.key && commentsJsLoad + .shuoshuo-comment-btn(onclick='addCommentToShuoshuo(event)') + i.fa-solid.fa-comments + if i.key && commentsJsLoad .shuoshuo-comment.no-comment(data-key=i.key) \ No newline at end of file diff --git a/layout/includes/page/tags.pug b/layout/includes/page/tags.pug index b5b62cd..9c48197 100644 --- a/layout/includes/page/tags.pug +++ b/layout/includes/page/tags.pug @@ -1,2 +1,2 @@ -.tag-cloud-list.text-center +.tag-cloud-list.text-center !=cloudTags({source: site.tags, orderby: page.orderby || 'random', order: page.order || 1, minfontsize: 1.2, maxfontsize: 1.5, limit: 0, unit: 'em'}) \ No newline at end of file diff --git a/layout/includes/pagination.pug b/layout/includes/pagination.pug index 96a3d71..bbfc1eb 100644 --- a/layout/includes/pagination.pug +++ b/layout/includes/pagination.pug @@ -1,37 +1,37 @@ -- - var options = { - prev_text: '', - next_text: '', - mid_size: 1, - escape: false - } - -if globalPageType === 'post' - - let paginationOrder = theme.post_pagination === 1 ? { prev: page.prev, next: page.next } : { prev: page.next, next: page.prev } - - nav#pagination.pagination-post - each direction, key in paginationOrder - if direction - - const getPostDesc = direction.postDesc || postDesc(direction) - - let className = key === 'prev' ? (paginationOrder.next ? '' : 'full-width') : (paginationOrder.prev ? '' : 'full-width') - - className = getPostDesc ? className : className + ' no-desc' - - a.pagination-related(class=className href=url_for(direction.path) title=direction.title) - if direction.cover_type === 'img' - img.cover(src=url_for(direction.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt=`cover of ${key === 'prev' ? 'previous' : 'next'} post`) - else - .cover(style=`background: ${direction.cover || 'var(--default-bg-color)'}`) - - .info(class=key === 'prev' ? '' : 'text-right') - .info-1 - .info-item-1=_p(`pagination.${key}`) - .info-item-2!=direction.title - if getPostDesc - .info-2 - .info-item-1!=getPostDesc -else - nav#pagination - .pagination - if globalPageType === 'home' - - options.format = 'page/%d/#content-inner' +- + var options = { + prev_text: '', + next_text: '', + mid_size: 1, + escape: false + } + +if globalPageType === 'post' + - let paginationOrder = theme.post_pagination === 1 ? { prev: page.prev, next: page.next } : { prev: page.next, next: page.prev } + + nav#pagination.pagination-post + each direction, key in paginationOrder + if direction + - const getPostDesc = direction.postDesc || postDesc(direction) + - let className = key === 'prev' ? (paginationOrder.next ? '' : 'full-width') : (paginationOrder.prev ? '' : 'full-width') + - className = getPostDesc ? className : className + ' no-desc' + + a.pagination-related(class=className href=url_for(direction.path) title=direction.title) + if direction.cover_type === 'img' + img.cover(src=url_for(direction.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt=`cover of ${key === 'prev' ? 'previous' : 'next'} post`) + else + .cover(style=`background: ${direction.cover || 'var(--default-bg-color)'}`) + + .info(class=key === 'prev' ? '' : 'text-right') + .info-1 + .info-item-1=_p(`pagination.${key}`) + .info-item-2!=direction.title + if getPostDesc + .info-2 + .info-item-1!=getPostDesc +else + nav#pagination + .pagination + if globalPageType === 'home' + - options.format = 'page/%d/#content-inner' !=paginator(options) \ No newline at end of file diff --git a/layout/includes/post/outdate-notice.pug b/layout/includes/post/outdate-notice.pug index ef72772..b0cd21e 100644 --- a/layout/includes/post/outdate-notice.pug +++ b/layout/includes/post/outdate-notice.pug @@ -1,8 +1,8 @@ -- const { limit_day, message_prev, message_next, position} = theme.noticeOutdate -- const notice_data = { limitDay: limit_day, messagePrev: message_prev, messageNext: message_next, postUpdate: full_date(page.updated)} -if position === 'top' - #post-outdate-notice(data=notice_data hidden) - !=page.content -else - !=page.content +- const { limit_day, message_prev, message_next, position} = theme.noticeOutdate +- const notice_data = { limitDay: limit_day, messagePrev: message_prev, messageNext: message_next, postUpdate: full_date(page.updated)} +if position === 'top' + #post-outdate-notice(data=notice_data hidden) + !=page.content +else + !=page.content #post-outdate-notice(data=notice_data hidden) \ No newline at end of file diff --git a/layout/includes/post/post-copyright.pug b/layout/includes/post/post-copyright.pug index c76f4b4..1f7c50a 100644 --- a/layout/includes/post/post-copyright.pug +++ b/layout/includes/post/post-copyright.pug @@ -1,23 +1,23 @@ -if theme.post_copyright.enable && page.copyright !== false - - const author = page.copyright_author || config.author - - const authorHref = page.copyright_author_href || theme.post_copyright.author_href || config.url - - const url = page.copyright_url || page.permalink - - const info = page.copyright_info || _p('post.copyright.copyright_content', theme.post_copyright.license_url, theme.post_copyright.license, config.url, config.title) - .post-copyright - .post-copyright__author - span.post-copyright-meta - i.fas.fa-circle-user.fa-fw - = _p('post.copyright.author') + ": " - span.post-copyright-info - a(href=authorHref)= author - .post-copyright__type - span.post-copyright-meta - i.fas.fa-square-arrow-up-right.fa-fw - = _p('post.copyright.link') + ": " - span.post-copyright-info - a(href=url_for(url))= theme.post_copyright.decode ? decodeURI(url) : url - .post-copyright__notice - span.post-copyright-meta - i.fas.fa-circle-exclamation.fa-fw - = _p('post.copyright.copyright_notice') + ": " +if theme.post_copyright.enable && page.copyright !== false + - const author = page.copyright_author || config.author + - const authorHref = page.copyright_author_href || theme.post_copyright.author_href || config.url + - const url = page.copyright_url || page.permalink + - const info = page.copyright_info || _p('post.copyright.copyright_content', theme.post_copyright.license_url, theme.post_copyright.license, config.url, config.title) + .post-copyright + .post-copyright__author + span.post-copyright-meta + i.fas.fa-circle-user.fa-fw + = _p('post.copyright.author') + ": " + span.post-copyright-info + a(href=authorHref)= author + .post-copyright__type + span.post-copyright-meta + i.fas.fa-square-arrow-up-right.fa-fw + = _p('post.copyright.link') + ": " + span.post-copyright-info + a(href=url_for(url))= theme.post_copyright.decode ? decodeURI(url) : url + .post-copyright__notice + span.post-copyright-meta + i.fas.fa-circle-exclamation.fa-fw + = _p('post.copyright.copyright_notice') + ": " span.post-copyright-info!= info \ No newline at end of file diff --git a/layout/includes/post/reward.pug b/layout/includes/post/reward.pug index fe62f14..baf525c 100644 --- a/layout/includes/post/reward.pug +++ b/layout/includes/post/reward.pug @@ -1,12 +1,12 @@ -.post-reward - .reward-button - i.fas.fa-qrcode - = theme.reward.text || _p('donate') - .reward-main - ul.reward-all - each item in theme.reward.QR_code - - const clickTo = item.link || item.img - li.reward-item - a(href=url_for(clickTo) target='_blank') - img.post-qr-code-img(src=url_for(item.img) alt=item.text) +.post-reward + .reward-button + i.fas.fa-qrcode + = theme.reward.text || _p('donate') + .reward-main + ul.reward-all + each item in theme.reward.QR_code + - const clickTo = item.link || item.img + li.reward-item + a(href=url_for(clickTo) target='_blank') + img.post-qr-code-img(src=url_for(item.img) alt=item.text) .post-qr-code-desc=item.text \ No newline at end of file diff --git a/layout/includes/rightside.pug b/layout/includes/rightside.pug index abd1851..b7608ad 100644 --- a/layout/includes/rightside.pug +++ b/layout/includes/rightside.pug @@ -1,61 +1,61 @@ -- const { readmode, translate, darkmode, aside, chat } = theme -mixin rightsideItem(array) - each item in array - case item - when 'readmode' - if globalPageType === 'post' && readmode - button#readmode(type="button" title=_p('rightside.readmode_title')) - i.fas.fa-book-open - when 'translate' - if translate.enable - button#translateLink(type="button" title=_p('rightside.translate_title'))= translate.default - when 'darkmode' - if darkmode.enable && darkmode.button - button#darkmode(type="button" title=_p('rightside.night_mode_title')) - i.fas.fa-adjust - when 'hideAside' - if aside.enable && aside.button && page.aside !== false - button#hide-aside-btn(type="button" title=_p('rightside.aside')) - i.fas.fa-arrows-alt-h - when 'toc' - if showToc - button#mobile-toc-button.close(type="button" title=_p("rightside.toc")) - i.fas.fa-list-ul - when 'chat' - if chat.rightside_button && chat.use - button#chat-btn(type="button" title=_p("rightside.chat") style="display:none") - i.fas.fa-message - when 'comment' - if commentsJsLoad - a#to_comment(href="#post-comment" title=_p("rightside.scroll_to_comment")) - i.fas.fa-comments - -#rightside - - const { enable, hide, show } = theme.rightside_item_order - - const hideArray = enable ? hide && hide.split(',') : ['readmode','translate','darkmode','hideAside'] - - const showArray = enable ? show && show.split(',') : ['toc','chat','comment'] - - - #rightside-config-hide - if hideArray - +rightsideItem(hideArray) - #rightside-config-show - if enable - if hide - button#rightside-config(type="button" title=_p("rightside.setting")) - i.fas.fa-cog.fa-spin - else - if globalPageType === 'post' - if (readmode || translate.enable || (darkmode.enable && darkmode.button)) - button#rightside-config(type="button" title=_p("rightside.setting")) - i.fas.fa-cog.fa-spin - else if translate.enable || (darkmode.enable && darkmode.button) - button#rightside-config(type="button" title=_p("rightside.setting")) - i.fas.fa-cog.fa-spin - - if showArray - +rightsideItem(showArray) - - button#go-up(type="button" title=_p("rightside.back_to_top")) - span.scroll-percent +- const { readmode, translate, darkmode, aside, chat } = theme +mixin rightsideItem(array) + each item in array + case item + when 'readmode' + if globalPageType === 'post' && readmode + button#readmode(type="button" title=_p('rightside.readmode_title')) + i.fas.fa-book-open + when 'translate' + if translate.enable + button#translateLink(type="button" title=_p('rightside.translate_title'))= translate.default + when 'darkmode' + if darkmode.enable && darkmode.button + button#darkmode(type="button" title=_p('rightside.night_mode_title')) + i.fas.fa-adjust + when 'hideAside' + if aside.enable && aside.button && page.aside !== false + button#hide-aside-btn(type="button" title=_p('rightside.aside')) + i.fas.fa-arrows-alt-h + when 'toc' + if showToc + button#mobile-toc-button.close(type="button" title=_p("rightside.toc")) + i.fas.fa-list-ul + when 'chat' + if chat.rightside_button && chat.use + button#chat-btn(type="button" title=_p("rightside.chat") style="display:none") + i.fas.fa-message + when 'comment' + if commentsJsLoad + a#to_comment(href="#post-comment" title=_p("rightside.scroll_to_comment")) + i.fas.fa-comments + +#rightside + - const { enable, hide, show } = theme.rightside_item_order + - const hideArray = enable ? hide && hide.split(',') : ['readmode','translate','darkmode','hideAside'] + - const showArray = enable ? show && show.split(',') : ['toc','chat','comment'] + + + #rightside-config-hide + if hideArray + +rightsideItem(hideArray) + #rightside-config-show + if enable + if hide + button#rightside-config(type="button" title=_p("rightside.setting")) + i.fas.fa-cog.fa-spin + else + if globalPageType === 'post' + if (readmode || translate.enable || (darkmode.enable && darkmode.button)) + button#rightside-config(type="button" title=_p("rightside.setting")) + i.fas.fa-cog.fa-spin + else if translate.enable || (darkmode.enable && darkmode.button) + button#rightside-config(type="button" title=_p("rightside.setting")) + i.fas.fa-cog.fa-spin + + if showArray + +rightsideItem(showArray) + + button#go-up(type="button" title=_p("rightside.back_to_top")) + span.scroll-percent i.fas.fa-arrow-up \ No newline at end of file diff --git a/layout/includes/sidebar.pug b/layout/includes/sidebar.pug index 178c420..22abeff 100644 --- a/layout/includes/sidebar.pug +++ b/layout/includes/sidebar.pug @@ -1,18 +1,18 @@ -if theme.menu - #sidebar - #menu-mask - #sidebar-menus - .avatar-img.text-center - img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.flink)}'` alt="avatar") - .site-data.text-center - a(href=`${url_for(config.archive_dir)}/`) - .headline= _p('aside.articles') - .length-num= site.posts.length - a(href=`${url_for(config.tag_dir)}/`) - .headline= _p('aside.tags') - .length-num= site.tags.length - a(href=`${url_for(config.category_dir)}/`) - .headline= _p('aside.categories') - .length-num= site.categories.length - +if theme.menu + #sidebar + #menu-mask + #sidebar-menus + .avatar-img.text-center + img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.flink)}'` alt="avatar") + .site-data.text-center + a(href=`${url_for(config.archive_dir)}/`) + .headline= _p('aside.articles') + .length-num= site.posts.length + a(href=`${url_for(config.tag_dir)}/`) + .headline= _p('aside.tags') + .length-num= site.tags.length + a(href=`${url_for(config.category_dir)}/`) + .headline= _p('aside.categories') + .length-num= site.categories.length + != partial('includes/header/menu_item', {}, { cache: true }) \ No newline at end of file diff --git a/layout/includes/third-party/abcjs/abcjs.pug b/layout/includes/third-party/abcjs/abcjs.pug index a75c37b..453f84b 100644 --- a/layout/includes/third-party/abcjs/abcjs.pug +++ b/layout/includes/third-party/abcjs/abcjs.pug @@ -1,17 +1,17 @@ -script. - (() => { - const abcjsInit = () => { - const abcjsFn = () => setTimeout(() => { - document.querySelectorAll(".abc-music-sheet").forEach(ele => { - if (ele.children.length > 0) return - ABCJS.renderAbc(ele, ele.innerHTML, {responsive: 'resize'}) - }) - }, 100) - - typeof ABCJS === 'object' ? abcjsFn() - : btf.getScript('!{url_for(theme.asset.abcjs_basic_js)}').then(abcjsFn) - } - - window.pjax ? abcjsInit() : window.addEventListener('load', abcjsInit) - btf.addGlobalFn('encrypt', abcjsInit, 'abcjs') +script. + (() => { + const abcjsInit = () => { + const abcjsFn = () => setTimeout(() => { + document.querySelectorAll(".abc-music-sheet").forEach(ele => { + if (ele.children.length > 0) return + ABCJS.renderAbc(ele, ele.innerHTML, {responsive: 'resize'}) + }) + }, 100) + + typeof ABCJS === 'object' ? abcjsFn() + : btf.getScript('!{url_for(theme.asset.abcjs_basic_js)}').then(abcjsFn) + } + + window.pjax ? abcjsInit() : window.addEventListener('load', abcjsInit) + btf.addGlobalFn('encrypt', abcjsInit, 'abcjs') })() \ No newline at end of file diff --git a/layout/includes/third-party/abcjs/index.pug b/layout/includes/third-party/abcjs/index.pug index d187d55..7ae7deb 100644 --- a/layout/includes/third-party/abcjs/index.pug +++ b/layout/includes/third-party/abcjs/index.pug @@ -1,3 +1,3 @@ -if theme.abcjs.enable - if theme.abcjs.per_page && (['post','page'].includes(globalPageType)) || page.abcjs - include ./abcjs.pug +if theme.abcjs.enable + if theme.abcjs.per_page && (['post','page'].includes(globalPageType)) || page.abcjs + include ./abcjs.pug diff --git a/layout/includes/third-party/aplayer.pug b/layout/includes/third-party/aplayer.pug index cf875b6..4e86609 100644 --- a/layout/includes/third-party/aplayer.pug +++ b/layout/includes/third-party/aplayer.pug @@ -1,23 +1,23 @@ -link(rel='stylesheet' href=url_for(theme.asset.aplayer_css) media="print" onload="this.media='all'") -script(src=url_for(theme.asset.aplayer_js)) -script(src=url_for(theme.asset.meting_js)) -if theme.pjax.enable - script. - (() => { - const destroyAplayer = () => { - if (window.aplayers) { - for (let i = 0; i < window.aplayers.length; i++) { - if (!window.aplayers[i].options.fixed) { - window.aplayers[i].destroy() - } - } - } - } - - const runMetingJS = () => { - typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting() - } - - btf.addGlobalFn('pjaxSend', destroyAplayer, 'destroyAplayer') - btf.addGlobalFn('pjaxComplete', loadMeting, 'runMetingJS') - })() +link(rel='stylesheet' href=url_for(theme.asset.aplayer_css) media="print" onload="this.media='all'") +script(src=url_for(theme.asset.aplayer_js)) +script(src=url_for(theme.asset.meting_js)) +if theme.pjax.enable + script. + (() => { + const destroyAplayer = () => { + if (window.aplayers) { + for (let i = 0; i < window.aplayers.length; i++) { + if (!window.aplayers[i].options.fixed) { + window.aplayers[i].destroy() + } + } + } + } + + const runMetingJS = () => { + typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting() + } + + btf.addGlobalFn('pjaxSend', destroyAplayer, 'destroyAplayer') + btf.addGlobalFn('pjaxComplete', loadMeting, 'runMetingJS') + })() diff --git a/layout/includes/third-party/card-post-count/artalk.pug b/layout/includes/third-party/card-post-count/artalk.pug index b5a1056..eeccef3 100644 --- a/layout/includes/third-party/card-post-count/artalk.pug +++ b/layout/includes/third-party/card-post-count/artalk.pug @@ -1,31 +1,31 @@ -- const { server, site } = theme.artalk - -script. - (() => { - const getArtalkCount = async() => { - try { - const eleGroup = document.querySelectorAll('#recent-posts .artalk-count') - const keyArray = Array.from(eleGroup).map(i => i.getAttribute('data-page-key')) - - const headerList = { - method: 'GET', - } - - const searchParams = new URLSearchParams({ - 'site_name': '!{site}', - 'page_keys': keyArray - }) - - const res = await fetch(`!{server}/api/v2/stats/page_comment?${searchParams}`, headerList) - const result = await res.json() - - keyArray.forEach((key, index) => { - eleGroup[index].textContent = result.data[key] || 0 - }) - } catch (err) { - console.error(err) - } - } - - window.pjax ? getArtalkCount() : window.addEventListener('load', getArtalkCount) +- const { server, site } = theme.artalk + +script. + (() => { + const getArtalkCount = async() => { + try { + const eleGroup = document.querySelectorAll('#recent-posts .artalk-count') + const keyArray = Array.from(eleGroup).map(i => i.getAttribute('data-page-key')) + + const headerList = { + method: 'GET', + } + + const searchParams = new URLSearchParams({ + 'site_name': '!{site}', + 'page_keys': keyArray + }) + + const res = await fetch(`!{server}/api/v2/stats/page_comment?${searchParams}`, headerList) + const result = await res.json() + + keyArray.forEach((key, index) => { + eleGroup[index].textContent = result.data[key] || 0 + }) + } catch (err) { + console.error(err) + } + } + + window.pjax ? getArtalkCount() : window.addEventListener('load', getArtalkCount) })() \ No newline at end of file diff --git a/layout/includes/third-party/card-post-count/disqus.pug b/layout/includes/third-party/card-post-count/disqus.pug index 92a2d5b..d039d9a 100644 --- a/layout/includes/third-party/card-post-count/disqus.pug +++ b/layout/includes/third-party/card-post-count/disqus.pug @@ -1,25 +1,25 @@ -- const { shortname, apikey } = theme.disqus -script. - (() => { - const getCount = async () => { - try { - const eleGroup = document.querySelectorAll('#recent-posts .disqus-count') - const cleanedLinks = Array.from(eleGroup).map(i => `thread:link=${i.href.replace(/#post-comment$/, '')}`); - - const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{shortname}&api_key=!{apikey}&${cleanedLinks.join('&')}`,{ - method: 'GET' - }) - const result = await res.json() - - eleGroup.forEach(i => { - const cleanedLink = i.href.replace(/#post-comment$/, '') - const urlData = result.response.find(data => data.link === cleanedLink) || { posts: 0 } - i.textContent = urlData.posts - }) - } catch (err) { - console.error(err) - } - } - - window.pjax ? getCount() : window.addEventListener('load', getCount) - })() +- const { shortname, apikey } = theme.disqus +script. + (() => { + const getCount = async () => { + try { + const eleGroup = document.querySelectorAll('#recent-posts .disqus-count') + const cleanedLinks = Array.from(eleGroup).map(i => `thread:link=${i.href.replace(/#post-comment$/, '')}`); + + const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{shortname}&api_key=!{apikey}&${cleanedLinks.join('&')}`,{ + method: 'GET' + }) + const result = await res.json() + + eleGroup.forEach(i => { + const cleanedLink = i.href.replace(/#post-comment$/, '') + const urlData = result.response.find(data => data.link === cleanedLink) || { posts: 0 } + i.textContent = urlData.posts + }) + } catch (err) { + console.error(err) + } + } + + window.pjax ? getCount() : window.addEventListener('load', getCount) + })() diff --git a/layout/includes/third-party/card-post-count/fb.pug b/layout/includes/third-party/card-post-count/fb.pug index e6daba1..408ec2e 100644 --- a/layout/includes/third-party/card-post-count/fb.pug +++ b/layout/includes/third-party/card-post-count/fb.pug @@ -1,18 +1,18 @@ -- const fbSDKVer = 'v20.0' -- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}` - -script. - (()=>{ - function loadFBComment () { - if (typeof FB === 'object') FB.XFBML.parse(document.getElementById('recent-posts')) - else { - let ele = document.createElement('script') - ele.setAttribute('src','!{fbSDK}') - ele.setAttribute('async', 'true') - ele.setAttribute('defer', 'true') - ele.setAttribute('crossorigin', 'anonymous') - document.body.appendChild(ele) - } - } - window.pjax ? loadFBComment() : window.addEventListener('load', loadFBComment) - })() +- const fbSDKVer = 'v20.0' +- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}` + +script. + (()=>{ + function loadFBComment () { + if (typeof FB === 'object') FB.XFBML.parse(document.getElementById('recent-posts')) + else { + let ele = document.createElement('script') + ele.setAttribute('src','!{fbSDK}') + ele.setAttribute('async', 'true') + ele.setAttribute('defer', 'true') + ele.setAttribute('crossorigin', 'anonymous') + document.body.appendChild(ele) + } + } + window.pjax ? loadFBComment() : window.addEventListener('load', loadFBComment) + })() diff --git a/layout/includes/third-party/card-post-count/index.pug b/layout/includes/third-party/card-post-count/index.pug index 5b2685c..0079318 100644 --- a/layout/includes/third-party/card-post-count/index.pug +++ b/layout/includes/third-party/card-post-count/index.pug @@ -1,16 +1,16 @@ -case theme.comments.use[0] - when 'Twikoo' - include ./twikoo.pug - when 'Disqus' - when 'Disqusjs' - include ./disqus.pug - when 'Valine' - include ./valine.pug - when 'Waline' - include ./waline.pug - when 'Facebook Comments' - include ./fb.pug - when 'Remark42' - include ./remark42.pug - when 'Artalk' +case theme.comments.use[0] + when 'Twikoo' + include ./twikoo.pug + when 'Disqus' + when 'Disqusjs' + include ./disqus.pug + when 'Valine' + include ./valine.pug + when 'Waline' + include ./waline.pug + when 'Facebook Comments' + include ./fb.pug + when 'Remark42' + include ./remark42.pug + when 'Artalk' include ./artalk.pug \ No newline at end of file diff --git a/layout/includes/third-party/card-post-count/remark42.pug b/layout/includes/third-party/card-post-count/remark42.pug index b67164f..5fbb840 100644 --- a/layout/includes/third-party/card-post-count/remark42.pug +++ b/layout/includes/third-party/card-post-count/remark42.pug @@ -1,18 +1,18 @@ -- const { host, siteId, option } = theme.remark42 - -script. - (()=>{ - window.remark_config = Object.assign({ - host: '!{host}', - site_id: '!{siteId}', - },!{JSON.stringify(option)}) - - function getCount () { - const s = document.createElement('script') - s.src = remark_config.host + '/web/counter.js' - s.defer = true - document.head.appendChild(s) - } - - window.pjax ? getCount() : window.addEventListener('load', getCount) +- const { host, siteId, option } = theme.remark42 + +script. + (()=>{ + window.remark_config = Object.assign({ + host: '!{host}', + site_id: '!{siteId}', + },!{JSON.stringify(option)}) + + function getCount () { + const s = document.createElement('script') + s.src = remark_config.host + '/web/counter.js' + s.defer = true + document.head.appendChild(s) + } + + window.pjax ? getCount() : window.addEventListener('load', getCount) })() \ No newline at end of file diff --git a/layout/includes/third-party/card-post-count/twikoo.pug b/layout/includes/third-party/card-post-count/twikoo.pug index 8d47c05..e104fa9 100644 --- a/layout/includes/third-party/card-post-count/twikoo.pug +++ b/layout/includes/third-party/card-post-count/twikoo.pug @@ -1,37 +1,37 @@ -script. - (() => { - const getCommentUrl = () => { - const eleGroup = document.querySelectorAll('#recent-posts .article-title') - let urlArray = [] - eleGroup.forEach(i=>{ - urlArray.push(i.getAttribute('href')) - }) - return urlArray - } - - const getCount = () => { - const runTwikoo = () => { - twikoo.getCommentsCount({ - envId: '!{theme.twikoo.envId}', - region: '!{theme.twikoo.region}', - urls: getCommentUrl(), - includeReply: false - }).then(function (res) { - document.querySelectorAll('#recent-posts .twikoo-count').forEach((item,index) => { - item.textContent = res[index].count - }) - }).catch(function (err) { - console.log(err) - }) - } - - if (typeof twikoo === 'object') { - runTwikoo() - } else { - btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo) - } - } - - window.pjax ? getCount() : window.addEventListener('load', getCount) - +script. + (() => { + const getCommentUrl = () => { + const eleGroup = document.querySelectorAll('#recent-posts .article-title') + let urlArray = [] + eleGroup.forEach(i=>{ + urlArray.push(i.getAttribute('href')) + }) + return urlArray + } + + const getCount = () => { + const runTwikoo = () => { + twikoo.getCommentsCount({ + envId: '!{theme.twikoo.envId}', + region: '!{theme.twikoo.region}', + urls: getCommentUrl(), + includeReply: false + }).then(function (res) { + document.querySelectorAll('#recent-posts .twikoo-count').forEach((item,index) => { + item.textContent = res[index].count + }) + }).catch(function (err) { + console.log(err) + }) + } + + if (typeof twikoo === 'object') { + runTwikoo() + } else { + btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo) + } + } + + window.pjax ? getCount() : window.addEventListener('load', getCount) + })() \ No newline at end of file diff --git a/layout/includes/third-party/card-post-count/valine.pug b/layout/includes/third-party/card-post-count/valine.pug index 1bbddde..6b583e2 100644 --- a/layout/includes/third-party/card-post-count/valine.pug +++ b/layout/includes/third-party/card-post-count/valine.pug @@ -1,20 +1,20 @@ -script. - (() => { - function loadValine () { - function initValine () { - let initData = { - el: '#vcomment', - appId: '#{theme.valine.appId}', - appKey: '#{theme.valine.appKey}', - serverURLs: '#{theme.valine.serverURLs}' - } - - const valine = new Valine(initData) - } - - if (typeof Valine === 'function') initValine() - else btf.getScript('!{url_for(theme.asset.valine)}').then(initValine) - } - - window.pjax ? loadValine() : window.addEventListener('load', loadValine) - })() +script. + (() => { + function loadValine () { + function initValine () { + let initData = { + el: '#vcomment', + appId: '#{theme.valine.appId}', + appKey: '#{theme.valine.appKey}', + serverURLs: '#{theme.valine.serverURLs}' + } + + const valine = new Valine(initData) + } + + if (typeof Valine === 'function') initValine() + else btf.getScript('!{url_for(theme.asset.valine)}').then(initValine) + } + + window.pjax ? loadValine() : window.addEventListener('load', loadValine) + })() diff --git a/layout/includes/third-party/card-post-count/waline.pug b/layout/includes/third-party/card-post-count/waline.pug index a8faf96..96e9657 100644 --- a/layout/includes/third-party/card-post-count/waline.pug +++ b/layout/includes/third-party/card-post-count/waline.pug @@ -1,21 +1,21 @@ -- const serverURL = theme.waline.serverURL.replace(/\/$/, '') -script. - (() => { - async function loadWaline () { - try { - const eleGroup = document.querySelectorAll('#recent-posts .waline-comment-count') - const keyArray = Array.from(eleGroup).map(i => i.getAttribute('data-path')) - - const res = await fetch(`!{serverURL}/api/comment?type=count&url=${keyArray}`, { method: 'GET' }) - const result = await res.json() - - result.data.forEach((count, index) => { - eleGroup[index].textContent = count - }) - } catch (err) { - console.error(err) - } - } - - window.pjax ? loadWaline() : window.addEventListener('load', loadWaline) - })() +- const serverURL = theme.waline.serverURL.replace(/\/$/, '') +script. + (() => { + async function loadWaline () { + try { + const eleGroup = document.querySelectorAll('#recent-posts .waline-comment-count') + const keyArray = Array.from(eleGroup).map(i => i.getAttribute('data-path')) + + const res = await fetch(`!{serverURL}/api/comment?type=count&url=${keyArray}`, { method: 'GET' }) + const result = await res.json() + + result.data.forEach((count, index) => { + eleGroup[index].textContent = count + }) + } catch (err) { + console.error(err) + } + } + + window.pjax ? loadWaline() : window.addEventListener('load', loadWaline) + })() diff --git a/layout/includes/third-party/chat/chatra.pug b/layout/includes/third-party/chat/chatra.pug index 0fad991..e4a6900 100644 --- a/layout/includes/third-party/chat/chatra.pug +++ b/layout/includes/third-party/chat/chatra.pug @@ -1,38 +1,38 @@ -//- https://chatra.io/help/api/ -script. - (() => { - window.ChatraID = '#{theme.chatra.id}' - window.Chatra = window.Chatra || function() { - (window.Chatra.q = window.Chatra.q || []).push(arguments) - } - - btf.getScript('https://call.chatra.io/chatra.js').then(() => { - const isChatBtn = !{theme.chat.rightside_button} - const isChatHideShow = !{theme.chat.button_hide_show} - - if (isChatBtn) { - const close = () => { - Chatra('minimizeWidget') - Chatra('hide') - } - - const open = () => { - Chatra('openChat', true) - Chatra('show') - } - - window.ChatraSetup = { startHidden: true } - - window.chatBtnFn = () => document.getElementById('chatra').classList.contains('chatra--expanded') ? close() : open() - - document.getElementById('chat-btn').style.display = 'block' - } else if (isChatHideShow) { - window.chatBtn = { - hide: () => Chatra('hide'), - show: () => Chatra('show') - } - } - }) - })() - - +//- https://chatra.io/help/api/ +script. + (() => { + window.ChatraID = '#{theme.chatra.id}' + window.Chatra = window.Chatra || function() { + (window.Chatra.q = window.Chatra.q || []).push(arguments) + } + + btf.getScript('https://call.chatra.io/chatra.js').then(() => { + const isChatBtn = !{theme.chat.rightside_button} + const isChatHideShow = !{theme.chat.button_hide_show} + + if (isChatBtn) { + const close = () => { + Chatra('minimizeWidget') + Chatra('hide') + } + + const open = () => { + Chatra('openChat', true) + Chatra('show') + } + + window.ChatraSetup = { startHidden: true } + + window.chatBtnFn = () => document.getElementById('chatra').classList.contains('chatra--expanded') ? close() : open() + + document.getElementById('chat-btn').style.display = 'block' + } else if (isChatHideShow) { + window.chatBtn = { + hide: () => Chatra('hide'), + show: () => Chatra('show') + } + } + }) + })() + + diff --git a/layout/includes/third-party/chat/crisp.pug b/layout/includes/third-party/chat/crisp.pug index 08a1916..6485566 100644 --- a/layout/includes/third-party/chat/crisp.pug +++ b/layout/includes/third-party/chat/crisp.pug @@ -1,32 +1,32 @@ -script. - (() => { - window.$crisp = ['safe', true] - window.CRISP_WEBSITE_ID = "!{theme.crisp.website_id}" - - btf.getScript('https://client.crisp.chat/l.js').then(() => { - const isChatBtn = !{theme.chat.rightside_button} - const isChatHideShow = !{theme.chat.button_hide_show} - - if (isChatBtn) { - const open = () => { - $crisp.push(["do", "chat:show"]) - $crisp.push(["do", "chat:open"]) - } - - const close = () => $crisp.push(["do", "chat:hide"]) - - close() - - $crisp.push(["on", "chat:closed", close]) - - window.chatBtnFn = () => $crisp.is("chat:visible") ? close() : open() - - document.getElementById('chat-btn').style.display = 'block' - } else if (isChatHideShow) { - window.chatBtn = { - hide: () => $crisp.push(["do", "chat:hide"]), - show: () => $crisp.push(["do", "chat:show"]) - } - } - }) +script. + (() => { + window.$crisp = ['safe', true] + window.CRISP_WEBSITE_ID = "!{theme.crisp.website_id}" + + btf.getScript('https://client.crisp.chat/l.js').then(() => { + const isChatBtn = !{theme.chat.rightside_button} + const isChatHideShow = !{theme.chat.button_hide_show} + + if (isChatBtn) { + const open = () => { + $crisp.push(["do", "chat:show"]) + $crisp.push(["do", "chat:open"]) + } + + const close = () => $crisp.push(["do", "chat:hide"]) + + close() + + $crisp.push(["on", "chat:closed", close]) + + window.chatBtnFn = () => $crisp.is("chat:visible") ? close() : open() + + document.getElementById('chat-btn').style.display = 'block' + } else if (isChatHideShow) { + window.chatBtn = { + hide: () => $crisp.push(["do", "chat:hide"]), + show: () => $crisp.push(["do", "chat:show"]) + } + } + }) })() \ No newline at end of file diff --git a/layout/includes/third-party/chat/index.pug b/layout/includes/third-party/chat/index.pug index 273d040..dada453 100644 --- a/layout/includes/third-party/chat/index.pug +++ b/layout/includes/third-party/chat/index.pug @@ -1,7 +1,7 @@ -case theme.chat.use - when 'chatra' - include ./chatra.pug - when 'tidio' - include ./tidio.pug - when 'crisp' +case theme.chat.use + when 'chatra' + include ./chatra.pug + when 'tidio' + include ./tidio.pug + when 'crisp' include ./crisp.pug \ No newline at end of file diff --git a/layout/includes/third-party/chat/tidio.pug b/layout/includes/third-party/chat/tidio.pug index f9d40ea..83ca1ec 100644 --- a/layout/includes/third-party/chat/tidio.pug +++ b/layout/includes/third-party/chat/tidio.pug @@ -1,45 +1,45 @@ -script. - (() => { - btf.getScript('//code.tidio.co/!{theme.tidio.public_key}.js').then(() => { - const isChatBtn = !{theme.chat.rightside_button} - const isChatHideShow = !{theme.chat.button_hide_show} - - if (isChatBtn) { - let isShow = false - const close = () => { - window.tidioChatApi.hide() - isShow = false - } - - const open = () => { - window.tidioChatApi.open() - window.tidioChatApi.show() - isShow = true - } - - const onTidioChatApiReady = () => { - window.tidioChatApi.hide() - window.tidioChatApi.on("close", close) - } - if (window.tidioChatApi) { - window.tidioChatApi.on("ready", onTidioChatApiReady) - } else { - document.addEventListener("tidioChat-ready", onTidioChatApiReady) - } - - window.chatBtnFn = () => { - if (!window.tidioChatApi) return - isShow ? close() : open() - } - - document.getElementById('chat-btn').style.display = 'block' - - } else if (isChatHideShow) { - window.chatBtn = { - hide: () => window.tidioChatApi && window.tidioChatApi.hide(), - show: () => window.tidioChatApi && window.tidioChatApi.show() - } - } - }) - })() - +script. + (() => { + btf.getScript('//code.tidio.co/!{theme.tidio.public_key}.js').then(() => { + const isChatBtn = !{theme.chat.rightside_button} + const isChatHideShow = !{theme.chat.button_hide_show} + + if (isChatBtn) { + let isShow = false + const close = () => { + window.tidioChatApi.hide() + isShow = false + } + + const open = () => { + window.tidioChatApi.open() + window.tidioChatApi.show() + isShow = true + } + + const onTidioChatApiReady = () => { + window.tidioChatApi.hide() + window.tidioChatApi.on("close", close) + } + if (window.tidioChatApi) { + window.tidioChatApi.on("ready", onTidioChatApiReady) + } else { + document.addEventListener("tidioChat-ready", onTidioChatApiReady) + } + + window.chatBtnFn = () => { + if (!window.tidioChatApi) return + isShow ? close() : open() + } + + document.getElementById('chat-btn').style.display = 'block' + + } else if (isChatHideShow) { + window.chatBtn = { + hide: () => window.tidioChatApi && window.tidioChatApi.hide(), + show: () => window.tidioChatApi && window.tidioChatApi.show() + } + } + }) + })() + diff --git a/layout/includes/third-party/comments/artalk.pug b/layout/includes/third-party/comments/artalk.pug index 0113fc3..7d0e857 100644 --- a/layout/includes/third-party/comments/artalk.pug +++ b/layout/includes/third-party/comments/artalk.pug @@ -1,73 +1,73 @@ -- const { server, site, option } = theme.artalk -- const { use, lazyload } = theme.comments - -script. - (() => { - let artalkItem = null - const option = !{JSON.stringify(option)} - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - - const destroyArtalk = () => { - if (artalkItem) { - artalkItem.destroy() - artalkItem = null - } - } - - const artalkChangeMode = theme => artalkItem && artalkItem.setDarkMode(theme === 'dark') - - const initArtalk = (el = document, pageKey = location.pathname) => { - artalkItem = Artalk.init({ - el: el.querySelector('#artalk-wrap'), - server: '!{server}', - site: '!{site}', - darkMode: document.documentElement.getAttribute('data-theme') === 'dark', - ...option, - pageKey: isShuoshuo ? pageKey : (option && option.pageKey) || pageKey - }) - - if (GLOBAL_CONFIG.lightbox === 'null') return - artalkItem.on('list-loaded', () => { - artalkItem.ctx.get('list').getCommentNodes().forEach(comment => { - const $content = comment.getRender().$content - btf.loadLightbox($content.querySelectorAll('img:not([atk-emoticon])')) - }) - }) - - if (isShuoshuo) { - window.shuoshuoComment.destroyArtalk = () => { - destroyArtalk() - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - btf.addGlobalFn('pjaxSendOnce', destroyArtalk, 'destroyArtalk') - btf.addGlobalFn('themeChange', artalkChangeMode, 'artalk') - } - - const loadArtalk = async (el, pageKey) => { - if (typeof Artalk === 'object') initArtalk(el, pageKey) - else { - await btf.getCSS('!{theme.asset.artalk_css}') - await btf.getScript('!{theme.asset.artalk_js}') - initArtalk(el, pageKey) - } - } - - if (isShuoshuo) { - '!{use[0]}' === 'Artalk' - ? window.shuoshuoComment = { loadComment: loadArtalk } - : window.loadOtherComment = loadArtalk - return - } - - if ('!{use[0]}' === 'Artalk' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('artalk-wrap'), loadArtalk) - else setTimeout(loadArtalk, 100) - } else { - window.loadOtherComment = loadArtalk - } +- const { server, site, option } = theme.artalk +- const { use, lazyload } = theme.comments + +script. + (() => { + let artalkItem = null + const option = !{JSON.stringify(option)} + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + + const destroyArtalk = () => { + if (artalkItem) { + artalkItem.destroy() + artalkItem = null + } + } + + const artalkChangeMode = theme => artalkItem && artalkItem.setDarkMode(theme === 'dark') + + const initArtalk = (el = document, pageKey = location.pathname) => { + artalkItem = Artalk.init({ + el: el.querySelector('#artalk-wrap'), + server: '!{server}', + site: '!{site}', + darkMode: document.documentElement.getAttribute('data-theme') === 'dark', + ...option, + pageKey: isShuoshuo ? pageKey : (option && option.pageKey) || pageKey + }) + + if (GLOBAL_CONFIG.lightbox === 'null') return + artalkItem.on('list-loaded', () => { + artalkItem.ctx.get('list').getCommentNodes().forEach(comment => { + const $content = comment.getRender().$content + btf.loadLightbox($content.querySelectorAll('img:not([atk-emoticon])')) + }) + }) + + if (isShuoshuo) { + window.shuoshuoComment.destroyArtalk = () => { + destroyArtalk() + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + btf.addGlobalFn('pjaxSendOnce', destroyArtalk, 'destroyArtalk') + btf.addGlobalFn('themeChange', artalkChangeMode, 'artalk') + } + + const loadArtalk = async (el, pageKey) => { + if (typeof Artalk === 'object') initArtalk(el, pageKey) + else { + await btf.getCSS('!{theme.asset.artalk_css}') + await btf.getScript('!{theme.asset.artalk_js}') + initArtalk(el, pageKey) + } + } + + if (isShuoshuo) { + '!{use[0]}' === 'Artalk' + ? window.shuoshuoComment = { loadComment: loadArtalk } + : window.loadOtherComment = loadArtalk + return + } + + if ('!{use[0]}' === 'Artalk' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('artalk-wrap'), loadArtalk) + else setTimeout(loadArtalk, 100) + } else { + window.loadOtherComment = loadArtalk + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/disqus.pug b/layout/includes/third-party/comments/disqus.pug index eeca5c4..9fe6454 100644 --- a/layout/includes/third-party/comments/disqus.pug +++ b/layout/includes/third-party/comments/disqus.pug @@ -1,80 +1,80 @@ -- const disqusPageTitle = page.title.replace(/'/ig,"\\'") -- const { shortname, apikey } = theme.disqus -- const { use, lazyload, count } = theme.comments - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - - const disqusReset = conf => { - window.DISQUS && window.DISQUS.reset({ - reload: true, - config: conf - }) - } - - const loadDisqus = (el, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyDisqus = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - window.disqus_identifier = isShuoshuo ? path : '!{ url_for(page.path) }' - window.disqus_url = isShuoshuo ? location.origin + path : '!{ page.permalink }' - - const disqus_config = function () { - this.page.url = disqus_url - this.page.identifier = disqus_identifier - this.page.title = '!{ disqusPageTitle }' - } - - if (window.DISQUS) disqusReset(disqus_config) - else { - const script = document.createElement('script') - script.src = 'https://!{shortname}.disqus.com/embed.js' - script.setAttribute('data-timestamp', +new Date()) - document.head.appendChild(script) - } - - btf.addGlobalFn('themeChange', () => disqusReset(disqus_config), 'disqus') - } - - const getCount = async() => { - try { - const eleGroup = document.querySelector('#post-meta .disqus-comment-count') - if (!eleGroup) return - const cleanedLinks = eleGroup.href.replace(/#post-comment$/, '') - - const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{shortname}&api_key=!{apikey}&thread:link=${cleanedLinks}`,{ - method: 'GET' - }) - const result = await res.json() - - const count = result.response.length ? result.response[0].posts : 0 - eleGroup.textContent = count - } catch (err) { - console.error(err) - } - } - - if (isShuoshuo) { - '!{use[0]}' === 'Disqus' - ? window.shuoshuoComment = { loadComment: loadDisqus } - : window.loadOtherComment = loadDisqus - return - } - - if ('!{use[0]}' === 'Disqus' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('disqus_thread'), loadDisqus) - else { - loadDisqus() - !{ count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' } - } - } else { - window.loadOtherComment = loadDisqus - } - })() +- const disqusPageTitle = page.title.replace(/'/ig,"\\'") +- const { shortname, apikey } = theme.disqus +- const { use, lazyload, count } = theme.comments + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + + const disqusReset = conf => { + window.DISQUS && window.DISQUS.reset({ + reload: true, + config: conf + }) + } + + const loadDisqus = (el, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyDisqus = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + window.disqus_identifier = isShuoshuo ? path : '!{ url_for(page.path) }' + window.disqus_url = isShuoshuo ? location.origin + path : '!{ page.permalink }' + + const disqus_config = function () { + this.page.url = disqus_url + this.page.identifier = disqus_identifier + this.page.title = '!{ disqusPageTitle }' + } + + if (window.DISQUS) disqusReset(disqus_config) + else { + const script = document.createElement('script') + script.src = 'https://!{shortname}.disqus.com/embed.js' + script.setAttribute('data-timestamp', +new Date()) + document.head.appendChild(script) + } + + btf.addGlobalFn('themeChange', () => disqusReset(disqus_config), 'disqus') + } + + const getCount = async() => { + try { + const eleGroup = document.querySelector('#post-meta .disqus-comment-count') + if (!eleGroup) return + const cleanedLinks = eleGroup.href.replace(/#post-comment$/, '') + + const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{shortname}&api_key=!{apikey}&thread:link=${cleanedLinks}`,{ + method: 'GET' + }) + const result = await res.json() + + const count = result.response.length ? result.response[0].posts : 0 + eleGroup.textContent = count + } catch (err) { + console.error(err) + } + } + + if (isShuoshuo) { + '!{use[0]}' === 'Disqus' + ? window.shuoshuoComment = { loadComment: loadDisqus } + : window.loadOtherComment = loadDisqus + return + } + + if ('!{use[0]}' === 'Disqus' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('disqus_thread'), loadDisqus) + else { + loadDisqus() + !{ count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' } + } + } else { + window.loadOtherComment = loadDisqus + } + })() diff --git a/layout/includes/third-party/comments/disqusjs.pug b/layout/includes/third-party/comments/disqusjs.pug index ae7ff06..ef2a235 100644 --- a/layout/includes/third-party/comments/disqusjs.pug +++ b/layout/includes/third-party/comments/disqusjs.pug @@ -1,87 +1,87 @@ -- let disqusjsPageTitle = page.title && page.title.replace(/'/ig,"\\'") -- const { shortname:dqShortname, apikey:dqApikey, option:dqOption } = theme.disqusjs - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo' - const dqOption = !{JSON.stringify(dqOption)} - - const destroyDisqusjs = () => { - disqusjs.destroy() - window.disqusjs = null - } - - const themeChange = (el, path) => { - destroyDisqusjs() - initDisqusjs(el, path) - } - - const initDisqusjs = (el = document, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyDisqusjs = () => { - destroyDisqusjs() - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - disqusjs = new DisqusJS({ - shortname: '!{dqShortname}', - title: '!{ disqusjsPageTitle }', - apikey: '!{dqApikey}', - ...dqOption, - identifier: isShuoshuo ? path : (dqOption && dqOption.identifier) || '!{ url_for(page.path) }', - url: isShuoshuo ? location.origin + path : (dqOption && dqOption.url) || '!{ page.permalink }' - }) - - disqusjs.render(el.querySelector('#disqusjs-wrap')) - - btf.addGlobalFn('themeChange', () => themeChange(el, path), 'disqusjs') - } - - const loadDisqusjs = async(el, path) => { - if (window.disqusJsLoad) initDisqusjs(el, path) - else { - await btf.getCSS('!{url_for(theme.asset.disqusjs_css)}') - await btf.getScript('!{url_for(theme.asset.disqusjs)}') - initDisqusjs(el, path) - window.disqusJsLoad = true - } - } - - const getCount = async() => { - try { - const eleGroup = document.querySelector('#post-meta .disqusjs-comment-count') - if (!eleGroup) return - const cleanedLinks = eleGroup.href.replace(/#post-comment$/, '') - - const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{dqShortname}&api_key=!{dqApikey}&thread:link=${cleanedLinks}`,{ - method: 'GET' - }) - const result = await res.json() - const count = result.response.length ? result.response[0].posts : 0 - eleGroup.textContent = count - } catch (err) { - console.error(err) - } - } - - if (isShuoshuo) { - '!{theme.comments.use[0]}' === 'Disqusjs' - ? window.shuoshuoComment = { loadComment: loadDisqusjs } - : window.loadOtherComment = loadDisqusjs - return - } - - if ('!{theme.comments.use[0]}' === 'Disqusjs' || !!{theme.comments.lazyload}) { - if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('disqusjs-wrap'), loadDisqusjs) - else { - loadDisqusjs() - !{ theme.comments.count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' } - } - } else { - window.loadOtherComment = loadDisqusjs - } +- let disqusjsPageTitle = page.title && page.title.replace(/'/ig,"\\'") +- const { shortname:dqShortname, apikey:dqApikey, option:dqOption } = theme.disqusjs + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo' + const dqOption = !{JSON.stringify(dqOption)} + + const destroyDisqusjs = () => { + disqusjs.destroy() + window.disqusjs = null + } + + const themeChange = (el, path) => { + destroyDisqusjs() + initDisqusjs(el, path) + } + + const initDisqusjs = (el = document, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyDisqusjs = () => { + destroyDisqusjs() + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + disqusjs = new DisqusJS({ + shortname: '!{dqShortname}', + title: '!{ disqusjsPageTitle }', + apikey: '!{dqApikey}', + ...dqOption, + identifier: isShuoshuo ? path : (dqOption && dqOption.identifier) || '!{ url_for(page.path) }', + url: isShuoshuo ? location.origin + path : (dqOption && dqOption.url) || '!{ page.permalink }' + }) + + disqusjs.render(el.querySelector('#disqusjs-wrap')) + + btf.addGlobalFn('themeChange', () => themeChange(el, path), 'disqusjs') + } + + const loadDisqusjs = async(el, path) => { + if (window.disqusJsLoad) initDisqusjs(el, path) + else { + await btf.getCSS('!{url_for(theme.asset.disqusjs_css)}') + await btf.getScript('!{url_for(theme.asset.disqusjs)}') + initDisqusjs(el, path) + window.disqusJsLoad = true + } + } + + const getCount = async() => { + try { + const eleGroup = document.querySelector('#post-meta .disqusjs-comment-count') + if (!eleGroup) return + const cleanedLinks = eleGroup.href.replace(/#post-comment$/, '') + + const res = await fetch(`https://disqus.com/api/3.0/threads/set.json?forum=!{dqShortname}&api_key=!{dqApikey}&thread:link=${cleanedLinks}`,{ + method: 'GET' + }) + const result = await res.json() + const count = result.response.length ? result.response[0].posts : 0 + eleGroup.textContent = count + } catch (err) { + console.error(err) + } + } + + if (isShuoshuo) { + '!{theme.comments.use[0]}' === 'Disqusjs' + ? window.shuoshuoComment = { loadComment: loadDisqusjs } + : window.loadOtherComment = loadDisqusjs + return + } + + if ('!{theme.comments.use[0]}' === 'Disqusjs' || !!{theme.comments.lazyload}) { + if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('disqusjs-wrap'), loadDisqusjs) + else { + loadDisqusjs() + !{ theme.comments.count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : '' } + } + } else { + window.loadOtherComment = loadDisqusjs + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/facebook_comments.pug b/layout/includes/third-party/comments/facebook_comments.pug index c62fa30..25945db 100644 --- a/layout/includes/third-party/comments/facebook_comments.pug +++ b/layout/includes/third-party/comments/facebook_comments.pug @@ -1,64 +1,64 @@ -- const fbSDKVer = 'v20.0' -- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}` - -script. - (()=>{ - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo' - - const loadFBComment = (el = document, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyFB = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - document.getElementById('fb-root') ? '' : document.body.insertAdjacentHTML('afterend', '
') - - const themeNow = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' - const $fbComment = el.getElementsByClassName('fb-comments')[0] - $fbComment.setAttribute('data-colorscheme',themeNow) - $fbComment.setAttribute('data-href', isShuoshuo ? '!{urlNoIndex(page.permalink)}' + '#' + path : '!{urlNoIndex(page.permalink)}') - - if (typeof FB === 'object') { - FB.XFBML.parse(document.getElementsByClassName('post-meta-commentcount')[0]) - FB.XFBML.parse(el.querySelector('#post-comment')) - } - else { - let ele = document.createElement('script') - ele.setAttribute('src','!{fbSDK}') - ele.setAttribute('async', 'true') - ele.setAttribute('defer', 'true') - ele.setAttribute('crossorigin', 'anonymous') - ele.setAttribute('id', 'facebook-jssdk') - document.getElementById('fb-root').insertAdjacentElement('afterbegin',ele) - } - } - - const fbModeChange = theme => { - const $fbComment = document.getElementsByClassName('fb-comments')[0] - if ($fbComment && typeof FB === 'object') { - $fbComment.setAttribute('data-colorscheme',theme) - FB.XFBML.parse(document.getElementById('post-comment')) - } - } - - btf.addGlobalFn('themeChange', fbModeChange, 'facebook_comments') - - if (isShuoshuo) { - '!{theme.comments.use[0]}' === 'Facebook Comments' - ? window.shuoshuoComment = { loadComment: loadFBComment } - : window.loadOtherComment = loadFBComment - return - } - - if ('!{theme.comments.use[0]}' === 'Facebook Comments' || !!{theme.comments.lazyload}) { - if (!{theme.comments.lazyload}) btf.loadComment(document.querySelector('#post-comment .fb-comments'), loadFBComment) - else loadFBComment() - } else { - window.loadOtherComment = loadFBComment - } - })() - +- const fbSDKVer = 'v20.0' +- const fbSDK = `https://connect.facebook.net/${theme.facebook_comments.lang}/sdk.js#xfbml=1&version=${fbSDKVer}` + +script. + (()=>{ + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo'== 'shuoshuo' + + const loadFBComment = (el = document, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyFB = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + document.getElementById('fb-root') ? '' : document.body.insertAdjacentHTML('afterend', '
') + + const themeNow = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' + const $fbComment = el.getElementsByClassName('fb-comments')[0] + $fbComment.setAttribute('data-colorscheme',themeNow) + $fbComment.setAttribute('data-href', isShuoshuo ? '!{urlNoIndex(page.permalink)}' + '#' + path : '!{urlNoIndex(page.permalink)}') + + if (typeof FB === 'object') { + FB.XFBML.parse(document.getElementsByClassName('post-meta-commentcount')[0]) + FB.XFBML.parse(el.querySelector('#post-comment')) + } + else { + let ele = document.createElement('script') + ele.setAttribute('src','!{fbSDK}') + ele.setAttribute('async', 'true') + ele.setAttribute('defer', 'true') + ele.setAttribute('crossorigin', 'anonymous') + ele.setAttribute('id', 'facebook-jssdk') + document.getElementById('fb-root').insertAdjacentElement('afterbegin',ele) + } + } + + const fbModeChange = theme => { + const $fbComment = document.getElementsByClassName('fb-comments')[0] + if ($fbComment && typeof FB === 'object') { + $fbComment.setAttribute('data-colorscheme',theme) + FB.XFBML.parse(document.getElementById('post-comment')) + } + } + + btf.addGlobalFn('themeChange', fbModeChange, 'facebook_comments') + + if (isShuoshuo) { + '!{theme.comments.use[0]}' === 'Facebook Comments' + ? window.shuoshuoComment = { loadComment: loadFBComment } + : window.loadOtherComment = loadFBComment + return + } + + if ('!{theme.comments.use[0]}' === 'Facebook Comments' || !!{theme.comments.lazyload}) { + if (!{theme.comments.lazyload}) btf.loadComment(document.querySelector('#post-comment .fb-comments'), loadFBComment) + else loadFBComment() + } else { + window.loadOtherComment = loadFBComment + } + })() + diff --git a/layout/includes/third-party/comments/giscus.pug b/layout/includes/third-party/comments/giscus.pug index c370e98..c4b9389 100644 --- a/layout/includes/third-party/comments/giscus.pug +++ b/layout/includes/third-party/comments/giscus.pug @@ -1,82 +1,82 @@ -- const { use, lazyload } = theme.comments -- const { repo, repo_id, category_id, light_theme, dark_theme, js, option } = theme.giscus -- const giscusUrl = js || 'https://giscus.app/client.js' -- const giscusOriginUrl = new URL(giscusUrl).origin - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const getGiscusTheme = theme => theme === 'dark' ? '!{dark_theme}' : '!{light_theme}' - - const createScriptElement = config => { - const ele = document.createElement('script') - Object.entries(config).forEach(([key, value]) => { - ele.setAttribute(key, value) - }) - return ele - } - - const loadGiscus = (el = document, key) => { - const mappingConfig = isShuoshuo - ? { 'data-mapping': 'specific', 'data-term': key } - : { 'data-mapping': (option && option['data-mapping']) || 'pathname' } - - const giscusConfig = { - src: '!{giscusUrl}', - 'data-repo': '!{repo}', - 'data-repo-id': '!{repo_id}', - 'data-category-id': '!{category_id}', - 'data-theme': getGiscusTheme(document.documentElement.getAttribute('data-theme')), - 'data-reactions-enabled': '1', - crossorigin: 'anonymous', - async: true, - ...option, - ...mappingConfig - } - - const scriptElement = createScriptElement(giscusConfig) - - el.querySelector('#giscus-wrap').appendChild(scriptElement) - - if (isShuoshuo) { - window.shuoshuoComment.destroyGiscus = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - } - - const changeGiscusTheme = theme => { - const iframe = document.querySelector('#giscus-wrap iframe') - if (iframe) { - const message = { - giscus: { - setConfig: { - theme: getGiscusTheme(theme) - } - } - } - iframe.contentWindow.postMessage(message, '!{giscusOriginUrl}') - } - } - - btf.addGlobalFn('themeChange', changeGiscusTheme, 'giscus') - - if (isShuoshuo) { - '!{use[0]}' === 'Giscus' - ? window.shuoshuoComment = { loadComment: loadGiscus } - : window.loadOtherComment = loadGiscus - return - } - - if ('!{use[0]}' === 'Giscus' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('giscus-wrap'), loadGiscus) - else loadGiscus() - } else { - window.loadOtherComment = loadGiscus - } - })() +- const { use, lazyload } = theme.comments +- const { repo, repo_id, category_id, light_theme, dark_theme, js, option } = theme.giscus +- const giscusUrl = js || 'https://giscus.app/client.js' +- const giscusOriginUrl = new URL(giscusUrl).origin + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const getGiscusTheme = theme => theme === 'dark' ? '!{dark_theme}' : '!{light_theme}' + + const createScriptElement = config => { + const ele = document.createElement('script') + Object.entries(config).forEach(([key, value]) => { + ele.setAttribute(key, value) + }) + return ele + } + + const loadGiscus = (el = document, key) => { + const mappingConfig = isShuoshuo + ? { 'data-mapping': 'specific', 'data-term': key } + : { 'data-mapping': (option && option['data-mapping']) || 'pathname' } + + const giscusConfig = { + src: '!{giscusUrl}', + 'data-repo': '!{repo}', + 'data-repo-id': '!{repo_id}', + 'data-category-id': '!{category_id}', + 'data-theme': getGiscusTheme(document.documentElement.getAttribute('data-theme')), + 'data-reactions-enabled': '1', + crossorigin: 'anonymous', + async: true, + ...option, + ...mappingConfig + } + + const scriptElement = createScriptElement(giscusConfig) + + el.querySelector('#giscus-wrap').appendChild(scriptElement) + + if (isShuoshuo) { + window.shuoshuoComment.destroyGiscus = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + } + + const changeGiscusTheme = theme => { + const iframe = document.querySelector('#giscus-wrap iframe') + if (iframe) { + const message = { + giscus: { + setConfig: { + theme: getGiscusTheme(theme) + } + } + } + iframe.contentWindow.postMessage(message, '!{giscusOriginUrl}') + } + } + + btf.addGlobalFn('themeChange', changeGiscusTheme, 'giscus') + + if (isShuoshuo) { + '!{use[0]}' === 'Giscus' + ? window.shuoshuoComment = { loadComment: loadGiscus } + : window.loadOtherComment = loadGiscus + return + } + + if ('!{use[0]}' === 'Giscus' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('giscus-wrap'), loadGiscus) + else loadGiscus() + } else { + window.loadOtherComment = loadGiscus + } + })() diff --git a/layout/includes/third-party/comments/gitalk.pug b/layout/includes/third-party/comments/gitalk.pug index d13bcb3..8a201aa 100644 --- a/layout/includes/third-party/comments/gitalk.pug +++ b/layout/includes/third-party/comments/gitalk.pug @@ -1,64 +1,64 @@ -- const { client_id, client_secret, repo, owner, admin, option } = theme.gitalk - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const commentCount = n => { - const isCommentCount = document.querySelector('#post-meta .gitalk-comment-count') - if (isCommentCount) { - isCommentCount.textContent= n - } - } - - const initGitalk = (el, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyGitalk = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - const gitalk = new Gitalk({ - clientID: '!{client_id}', - clientSecret: '!{client_secret}', - repo: '!{repo}', - owner: '!{owner}', - admin: ['!{admin}'], - updateCountCallback: commentCount, - ...option, - id: isShuoshuo ? path : (option && option.id) || '!{md5(page.path)}' - }) - - gitalk.render('gitalk-container') - } - - const loadGitalk = async(el, path) => { - if (typeof Gitalk === 'function') initGitalk(el, path) - else { - await btf.getCSS('!{url_for(theme.asset.gitalk_css)}') - await btf.getScript('!{url_for(theme.asset.gitalk)}') - initGitalk(el, path) - } - } - - if (isShuoshuo) { - '!{theme.comments.use[0]}' === 'Gitalk' - ? window.shuoshuoComment = { loadComment: loadGitalk } - : window.loadOtherComment = loadGitalk - return - } - - if ('!{theme.comments.use[0]}' === 'Gitalk' || !!{theme.comments.lazyload}) { - if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('gitalk-container'), loadGitalk) - else loadGitalk() - } else { - window.loadOtherComment = loadGitalk - } - })() - - - +- const { client_id, client_secret, repo, owner, admin, option } = theme.gitalk + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const commentCount = n => { + const isCommentCount = document.querySelector('#post-meta .gitalk-comment-count') + if (isCommentCount) { + isCommentCount.textContent= n + } + } + + const initGitalk = (el, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyGitalk = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + const gitalk = new Gitalk({ + clientID: '!{client_id}', + clientSecret: '!{client_secret}', + repo: '!{repo}', + owner: '!{owner}', + admin: ['!{admin}'], + updateCountCallback: commentCount, + ...option, + id: isShuoshuo ? path : (option && option.id) || '!{md5(page.path)}' + }) + + gitalk.render('gitalk-container') + } + + const loadGitalk = async(el, path) => { + if (typeof Gitalk === 'function') initGitalk(el, path) + else { + await btf.getCSS('!{url_for(theme.asset.gitalk_css)}') + await btf.getScript('!{url_for(theme.asset.gitalk)}') + initGitalk(el, path) + } + } + + if (isShuoshuo) { + '!{theme.comments.use[0]}' === 'Gitalk' + ? window.shuoshuoComment = { loadComment: loadGitalk } + : window.loadOtherComment = loadGitalk + return + } + + if ('!{theme.comments.use[0]}' === 'Gitalk' || !!{theme.comments.lazyload}) { + if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('gitalk-container'), loadGitalk) + else loadGitalk() + } else { + window.loadOtherComment = loadGitalk + } + })() + + + diff --git a/layout/includes/third-party/comments/index.pug b/layout/includes/third-party/comments/index.pug index 3b8ceff..001f0bf 100644 --- a/layout/includes/third-party/comments/index.pug +++ b/layout/includes/third-party/comments/index.pug @@ -1,46 +1,46 @@ -- let defaultComment = theme.comments.use[0] -hr.custom-hr -#post-comment - .comment-head - .comment-headline - i.fas.fa-comments.fa-fw - span= ' ' + _p('comment') - - if theme.comments.use.length > 1 - .comment-switch - span.first-comment=defaultComment - span#switch-btn - span.second-comment=theme.comments.use[1] - - - .comment-wrap - each name in theme.comments.use - div - case name - when 'Disqus' - #disqus_thread - when 'Valine' - #vcomment.vcomment - when 'Disqusjs' - #disqusjs-wrap - when 'Livere' - #lv-container(data-id="city" data-uid=theme.livere.uid) - when 'Gitalk' - #gitalk-container - when 'Utterances' - #utterances-wrap - when 'Twikoo' - #twikoo-wrap - when 'Waline' - #waline-wrap - when 'Giscus' - #giscus-wrap - when 'Facebook Comments' - .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light' - data-numposts= theme.facebook_comments.pageSize || 10 - data-order-by= theme.facebook_comments.order_by || 'social' - data-width="100%") - when 'Remark42' - #remark42 - when 'Artalk' - #artalk-wrap +- let defaultComment = theme.comments.use[0] +hr.custom-hr +#post-comment + .comment-head + .comment-headline + i.fas.fa-comments.fa-fw + span= ' ' + _p('comment') + + if theme.comments.use.length > 1 + .comment-switch + span.first-comment=defaultComment + span#switch-btn + span.second-comment=theme.comments.use[1] + + + .comment-wrap + each name in theme.comments.use + div + case name + when 'Disqus' + #disqus_thread + when 'Valine' + #vcomment.vcomment + when 'Disqusjs' + #disqusjs-wrap + when 'Livere' + #lv-container(data-id="city" data-uid=theme.livere.uid) + when 'Gitalk' + #gitalk-container + when 'Utterances' + #utterances-wrap + when 'Twikoo' + #twikoo-wrap + when 'Waline' + #waline-wrap + when 'Giscus' + #giscus-wrap + when 'Facebook Comments' + .fb-comments(data-colorscheme = theme.display_mode === 'dark' ? 'dark' : 'light' + data-numposts= theme.facebook_comments.pageSize || 10 + data-order-by= theme.facebook_comments.order_by || 'social' + data-width="100%") + when 'Remark42' + #remark42 + when 'Artalk' + #artalk-wrap diff --git a/layout/includes/third-party/comments/js.pug b/layout/includes/third-party/comments/js.pug index bf1d872..baa6223 100644 --- a/layout/includes/third-party/comments/js.pug +++ b/layout/includes/third-party/comments/js.pug @@ -1,26 +1,26 @@ -each name in theme.comments.use - case name - when 'Valine' - !=partial('includes/third-party/comments/valine', {}, {cache: true}) - when 'Disqus' - include ./disqus.pug - when 'Disqusjs' - include ./disqusjs.pug - when 'Livere' - !=partial('includes/third-party/comments/livere', {}, {cache: true}) - when 'Gitalk' - include ./gitalk.pug - when 'Utterances' - !=partial('includes/third-party/comments/utterances', {}, {cache: true}) - when 'Twikoo' - !=partial('includes/third-party/comments/twikoo', {}, {cache: true}) - when 'Waline' - !=partial('includes/third-party/comments/waline', {}, {cache: true}) - when 'Giscus' - !=partial('includes/third-party/comments/giscus', {}, {cache: true}) - when 'Facebook Comments' - include ./facebook_comments.pug - when 'Remark42' - !=partial('includes/third-party/comments/remark42', {}, {cache: true}) - when 'Artalk' +each name in theme.comments.use + case name + when 'Valine' + !=partial('includes/third-party/comments/valine', {}, {cache: true}) + when 'Disqus' + include ./disqus.pug + when 'Disqusjs' + include ./disqusjs.pug + when 'Livere' + !=partial('includes/third-party/comments/livere', {}, {cache: true}) + when 'Gitalk' + include ./gitalk.pug + when 'Utterances' + !=partial('includes/third-party/comments/utterances', {}, {cache: true}) + when 'Twikoo' + !=partial('includes/third-party/comments/twikoo', {}, {cache: true}) + when 'Waline' + !=partial('includes/third-party/comments/waline', {}, {cache: true}) + when 'Giscus' + !=partial('includes/third-party/comments/giscus', {}, {cache: true}) + when 'Facebook Comments' + include ./facebook_comments.pug + when 'Remark42' + !=partial('includes/third-party/comments/remark42', {}, {cache: true}) + when 'Artalk' !=partial('includes/third-party/comments/artalk', {}, {cache: true}) \ No newline at end of file diff --git a/layout/includes/third-party/comments/livere.pug b/layout/includes/third-party/comments/livere.pug index f55cd96..b1fe23d 100644 --- a/layout/includes/third-party/comments/livere.pug +++ b/layout/includes/third-party/comments/livere.pug @@ -1,47 +1,47 @@ -- const { use, lazyload } = theme.comments - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - - const loadLivere = (el, path) => { - window.livereOptions = { - refer: path || location.pathname - } - - if (isShuoshuo) { - window.shuoshuoComment.destroyLivere = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - if (typeof LivereTower === 'object') window.LivereTower.init() - else { - (function(d, s) { - var j, e = d.getElementsByTagName(s)[0]; - if (typeof LivereTower === 'function') { return; } - j = d.createElement(s); - j.src = 'https://cdn-city.livere.com/js/embed.dist.js'; - j.async = true; - e.parentNode.insertBefore(j, e); - })(document, 'script'); - } - } - - if (isShuoshuo) { - '!{use[0]}' === 'Livere' - ? window.shuoshuoComment = { loadComment: loadLivere } - : window.loadOtherComment = loadLivere - return - } - - if ('!{use[0]}' === 'Livere' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('lv-container'), loadLivere) - else loadLivere() - } else { - window.loadOtherComment = loadLivere - } +- const { use, lazyload } = theme.comments + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + + const loadLivere = (el, path) => { + window.livereOptions = { + refer: path || location.pathname + } + + if (isShuoshuo) { + window.shuoshuoComment.destroyLivere = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + if (typeof LivereTower === 'object') window.LivereTower.init() + else { + (function(d, s) { + var j, e = d.getElementsByTagName(s)[0]; + if (typeof LivereTower === 'function') { return; } + j = d.createElement(s); + j.src = 'https://cdn-city.livere.com/js/embed.dist.js'; + j.async = true; + e.parentNode.insertBefore(j, e); + })(document, 'script'); + } + } + + if (isShuoshuo) { + '!{use[0]}' === 'Livere' + ? window.shuoshuoComment = { loadComment: loadLivere } + : window.loadOtherComment = loadLivere + return + } + + if ('!{use[0]}' === 'Livere' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('lv-container'), loadLivere) + else loadLivere() + } else { + window.loadOtherComment = loadLivere + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/remark42.pug b/layout/includes/third-party/comments/remark42.pug index 67980cb..2ef7188 100644 --- a/layout/includes/third-party/comments/remark42.pug +++ b/layout/includes/third-party/comments/remark42.pug @@ -1,78 +1,78 @@ -- const { host, siteId, option } = theme.remark42 - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const loadScript = src => { - const script = document.createElement('script') - script.src = src - script.defer = true - document.head.appendChild(script) - } - - const addRemark42 = () => loadScript('!{host}/web/embed.js') - - const getCount = () => document.querySelector('.remark42__counter') && loadScript('!{host}/web/count.js') - - const destroyRemark42 = () => window.remark42Instance && window.remark42Instance.destroy() - - const initRemark42 = remark_config => { - if (window.REMARK42) { - destroyRemark42() - window.remark42Instance = window.REMARK42.createInstance({ - ...remark_config - }) - } - } - - const loadRemark42 = (el, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyRemark42 = () => { - destroyRemark42() - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - window.remark_config = { - host: '!{host}', - site_id: '!{siteId}', - theme: document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light', - ...option, - url: isShuoshuo ? window.location.origin + path : (option && option.url) || window.location.origin + window.location.pathname - } - - if (window.REMARK42) { - initRemark42(remark_config) - getCount() - } else { - addRemark42() - window.addEventListener('REMARK42::ready', () => { - initRemark42(remark_config) - getCount() - }) - } - } - - const remarkChangeMode = theme => window.REMARK42 && window.REMARK42.changeTheme(theme) - - btf.addGlobalFn('themeChange', remarkChangeMode, 'remark42') - - if (isShuoshuo) { - '!{theme.comments.use[0]}' === 'Remark42' - ? window.shuoshuoComment = { loadComment: loadRemark42 } - : window.loadOtherComment = loadRemark42 - return - } - - if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { - if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) - else loadRemark42() - } else { - window.loadOtherComment = loadRemark42 - } +- const { host, siteId, option } = theme.remark42 + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const loadScript = src => { + const script = document.createElement('script') + script.src = src + script.defer = true + document.head.appendChild(script) + } + + const addRemark42 = () => loadScript('!{host}/web/embed.js') + + const getCount = () => document.querySelector('.remark42__counter') && loadScript('!{host}/web/count.js') + + const destroyRemark42 = () => window.remark42Instance && window.remark42Instance.destroy() + + const initRemark42 = remark_config => { + if (window.REMARK42) { + destroyRemark42() + window.remark42Instance = window.REMARK42.createInstance({ + ...remark_config + }) + } + } + + const loadRemark42 = (el, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyRemark42 = () => { + destroyRemark42() + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + window.remark_config = { + host: '!{host}', + site_id: '!{siteId}', + theme: document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light', + ...option, + url: isShuoshuo ? window.location.origin + path : (option && option.url) || window.location.origin + window.location.pathname + } + + if (window.REMARK42) { + initRemark42(remark_config) + getCount() + } else { + addRemark42() + window.addEventListener('REMARK42::ready', () => { + initRemark42(remark_config) + getCount() + }) + } + } + + const remarkChangeMode = theme => window.REMARK42 && window.REMARK42.changeTheme(theme) + + btf.addGlobalFn('themeChange', remarkChangeMode, 'remark42') + + if (isShuoshuo) { + '!{theme.comments.use[0]}' === 'Remark42' + ? window.shuoshuoComment = { loadComment: loadRemark42 } + : window.loadOtherComment = loadRemark42 + return + } + + if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { + if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) + else loadRemark42() + } else { + window.loadOtherComment = loadRemark42 + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/twikoo.pug b/layout/includes/third-party/comments/twikoo.pug index 31fec77..94bc424 100644 --- a/layout/includes/third-party/comments/twikoo.pug +++ b/layout/includes/third-party/comments/twikoo.pug @@ -1,64 +1,64 @@ -- const { envId, region, option } = theme.twikoo -- const { use, lazyload, count } = theme.comments - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const getCount = () => { - const countELement = document.getElementById('twikoo-count') - if(!countELement) return - twikoo.getCommentsCount({ - envId: '!{envId}', - region: '!{region}', - urls: [window.location.pathname], - includeReply: false - }).then(res => { - countELement.textContent = res[0].count - }).catch(err => { - console.error(err) - }) - } - - const init = (el = document, path = location.pathname) => { - twikoo.init({ - el: el.querySelector('#twikoo-wrap'), - envId: '!{envId}', - region: '!{region}', - onCommentLoaded: () => { - btf.loadLightbox(document.querySelectorAll('#twikoo .tk-content img:not(.tk-owo-emotion)')) - }, - ...option, - path: isShuoshuo ? path : (option && option.path) || path - }) - - !{count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : ''} - - isShuoshuo && (window.shuoshuoComment.destroyTwikoo = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - }) - } - - const loadTwikoo = (el, path) => { - if (typeof twikoo === 'object') setTimeout(() => init(el, path), 0) - else btf.getScript('!{url_for(theme.asset.twikoo)}').then(() => init(el, path)) - } - - if (isShuoshuo) { - '!{use[0]}' === 'Twikoo' - ? window.shuoshuoComment = { loadComment: loadTwikoo } - : window.loadOtherComment = loadTwikoo - return - } - - if ('!{use[0]}' === 'Twikoo' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('twikoo-wrap'), loadTwikoo) - else loadTwikoo() - } else { - window.loadOtherComment = loadTwikoo - } +- const { envId, region, option } = theme.twikoo +- const { use, lazyload, count } = theme.comments + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const getCount = () => { + const countELement = document.getElementById('twikoo-count') + if(!countELement) return + twikoo.getCommentsCount({ + envId: '!{envId}', + region: '!{region}', + urls: [window.location.pathname], + includeReply: false + }).then(res => { + countELement.textContent = res[0].count + }).catch(err => { + console.error(err) + }) + } + + const init = (el = document, path = location.pathname) => { + twikoo.init({ + el: el.querySelector('#twikoo-wrap'), + envId: '!{envId}', + region: '!{region}', + onCommentLoaded: () => { + btf.loadLightbox(document.querySelectorAll('#twikoo .tk-content img:not(.tk-owo-emotion)')) + }, + ...option, + path: isShuoshuo ? path : (option && option.path) || path + }) + + !{count ? `GLOBAL_CONFIG_SITE.pageType === 'post' && getCount()` : ''} + + isShuoshuo && (window.shuoshuoComment.destroyTwikoo = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + }) + } + + const loadTwikoo = (el, path) => { + if (typeof twikoo === 'object') setTimeout(() => init(el, path), 0) + else btf.getScript('!{url_for(theme.asset.twikoo)}').then(() => init(el, path)) + } + + if (isShuoshuo) { + '!{use[0]}' === 'Twikoo' + ? window.shuoshuoComment = { loadComment: loadTwikoo } + : window.loadOtherComment = loadTwikoo + return + } + + if ('!{use[0]}' === 'Twikoo' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('twikoo-wrap'), loadTwikoo) + else loadTwikoo() + } else { + window.loadOtherComment = loadTwikoo + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/utterances.pug b/layout/includes/third-party/comments/utterances.pug index 4836557..7084e77 100644 --- a/layout/includes/third-party/comments/utterances.pug +++ b/layout/includes/third-party/comments/utterances.pug @@ -1,63 +1,63 @@ -- const { use, lazyload } = theme.comments -- const { repo, issue_term, light_theme, dark_theme, js, option } = theme.utterances -- const utterancesUrl = js || 'https://utteranc.es/client.js' -- const utterancesOriginUrl = new URL(utterancesUrl).origin - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - const getUtterancesTheme = theme => theme === 'dark' ? '#{dark_theme}' : '#{light_theme}' - - const loadUtterances = (el = document, key) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyUtterances = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - const config = { - src: '!{utterancesUrl}', - repo: '!{repo}', - theme: getUtterancesTheme(document.documentElement.getAttribute('data-theme')), - crossorigin: 'anonymous', - async: true, - ...option, - 'issue-term': isShuoshuo ? key : (option && option['issue-term']) || '!{issue_term}' - } - - const ele = document.createElement('script') - Object.entries(config).forEach(([key, value]) => ele.setAttribute(key, value)) - el.querySelector('#utterances-wrap').appendChild(ele) - } - - const changeUtterancesTheme = theme => { - const iframe = document.querySelector('#utterances-wrap iframe') - if (iframe) { - const message = { - type: 'set-theme', - theme: getUtterancesTheme(theme) - }; - iframe.contentWindow.postMessage(message, '!{utterancesOriginUrl}') - } - } - - btf.addGlobalFn('themeChange', changeUtterancesTheme, 'utterances') - - if (isShuoshuo) { - '!{use[0]}' === 'Utterances' - ? window.shuoshuoComment = { loadComment: loadUtterances } - : window.loadOtherComment = loadUtterances - return - } - - if ('!{use[0]}' === 'Utterances' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('utterances-wrap'), loadUtterances) - else loadUtterances() - } else { - window.loadOtherComment = loadUtterances - } +- const { use, lazyload } = theme.comments +- const { repo, issue_term, light_theme, dark_theme, js, option } = theme.utterances +- const utterancesUrl = js || 'https://utteranc.es/client.js' +- const utterancesOriginUrl = new URL(utterancesUrl).origin + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + const getUtterancesTheme = theme => theme === 'dark' ? '#{dark_theme}' : '#{light_theme}' + + const loadUtterances = (el = document, key) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyUtterances = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + const config = { + src: '!{utterancesUrl}', + repo: '!{repo}', + theme: getUtterancesTheme(document.documentElement.getAttribute('data-theme')), + crossorigin: 'anonymous', + async: true, + ...option, + 'issue-term': isShuoshuo ? key : (option && option['issue-term']) || '!{issue_term}' + } + + const ele = document.createElement('script') + Object.entries(config).forEach(([key, value]) => ele.setAttribute(key, value)) + el.querySelector('#utterances-wrap').appendChild(ele) + } + + const changeUtterancesTheme = theme => { + const iframe = document.querySelector('#utterances-wrap iframe') + if (iframe) { + const message = { + type: 'set-theme', + theme: getUtterancesTheme(theme) + }; + iframe.contentWindow.postMessage(message, '!{utterancesOriginUrl}') + } + } + + btf.addGlobalFn('themeChange', changeUtterancesTheme, 'utterances') + + if (isShuoshuo) { + '!{use[0]}' === 'Utterances' + ? window.shuoshuoComment = { loadComment: loadUtterances } + : window.loadOtherComment = loadUtterances + return + } + + if ('!{use[0]}' === 'Utterances' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('utterances-wrap'), loadUtterances) + else loadUtterances() + } else { + window.loadOtherComment = loadUtterances + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/valine.pug b/layout/includes/third-party/comments/valine.pug index 9ac2c43..83ca9b5 100644 --- a/layout/includes/third-party/comments/valine.pug +++ b/layout/includes/third-party/comments/valine.pug @@ -1,60 +1,60 @@ -- const { use, lazyload } = theme.comments -- const { appId, appKey, avatar, serverURLs, visitor, option } = theme.valine - -- let emojiMaps = '""' -if site.data.valine - - emojiMaps = JSON.stringify(site.data.valine) - -script. - (() => { - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const initValine = (el, path) => { - if (isShuoshuo) { - window.shuoshuoComment.destroyValine = () => { - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - - const valineConfig = { - el: '#vcomment', - appId: '#{appId}', - appKey: '#{appKey}', - avatar: '#{avatar}', - serverURLs: '#{serverURLs}', - emojiMaps: !{emojiMaps}, - visitor: #{visitor}, - ...option, - path: isShuoshuo ? path : (option && option.path) || window.location.pathname - } - - new Valine(valineConfig) - } - - const loadValine = async (el, path) => { - if (typeof Valine === 'function') { - initValine(el, path) - } else { - await btf.getScript('!{url_for(theme.asset.valine)}') - initValine(el, path) - } - } - - if (isShuoshuo) { - '!{use[0]}' === 'Valine' - ? window.shuoshuoComment = { loadComment: loadValine } - : window.loadOtherComment = loadValine - return - } - - if ('!{use[0]}' === 'Valine' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('vcomment'),loadValine) - else setTimeout(loadValine, 0) - } else { - window.loadOtherComment = loadValine - } +- const { use, lazyload } = theme.comments +- const { appId, appKey, avatar, serverURLs, visitor, option } = theme.valine + +- let emojiMaps = '""' +if site.data.valine + - emojiMaps = JSON.stringify(site.data.valine) + +script. + (() => { + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const initValine = (el, path) => { + if (isShuoshuo) { + window.shuoshuoComment.destroyValine = () => { + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + + const valineConfig = { + el: '#vcomment', + appId: '#{appId}', + appKey: '#{appKey}', + avatar: '#{avatar}', + serverURLs: '#{serverURLs}', + emojiMaps: !{emojiMaps}, + visitor: #{visitor}, + ...option, + path: isShuoshuo ? path : (option && option.path) || window.location.pathname + } + + new Valine(valineConfig) + } + + const loadValine = async (el, path) => { + if (typeof Valine === 'function') { + initValine(el, path) + } else { + await btf.getScript('!{url_for(theme.asset.valine)}') + initValine(el, path) + } + } + + if (isShuoshuo) { + '!{use[0]}' === 'Valine' + ? window.shuoshuoComment = { loadComment: loadValine } + : window.loadOtherComment = loadValine + return + } + + if ('!{use[0]}' === 'Valine' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('vcomment'),loadValine) + else setTimeout(loadValine, 0) + } else { + window.loadOtherComment = loadValine + } })() \ No newline at end of file diff --git a/layout/includes/third-party/comments/waline.pug b/layout/includes/third-party/comments/waline.pug index 99657e7..a39c5dc 100644 --- a/layout/includes/third-party/comments/waline.pug +++ b/layout/includes/third-party/comments/waline.pug @@ -1,61 +1,61 @@ -- const { serverURL, option, pageview } = theme.waline -- const { lazyload, count, use } = theme.comments - -script. - (() => { - let initFn = window.walineFn || null - const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' - const option = !{JSON.stringify(option)} - - const destroyWaline = ele => ele.destroy() - - const initWaline = (Fn, el = document, path = window.location.pathname) => { - const waline = Fn({ - el: el.querySelector('#waline-wrap'), - serverURL: '!{serverURL}', - pageview: !{lazyload ? false : pageview}, - dark: 'html[data-theme="dark"]', - comment: !{lazyload ? false : count}, - ...option, - path: isShuoshuo ? path : (option && option.path) || path - }) - - if (isShuoshuo) { - window.shuoshuoComment.destroyWaline = () => { - destroyWaline(waline) - if (el.children.length) { - el.innerHTML = '' - el.classList.add('no-comment') - } - } - } - } - - const loadWaline = (el, path) => { - if (initFn) initWaline(initFn, el, path) - else { - btf.getCSS('!{url_for(theme.asset.waline_css)}') - .then(() => import('!{url_for(theme.asset.waline_js)}')) - .then(({ init }) => { - initFn = init || Waline.init - initWaline(initFn, el, path) - window.walineFn = initFn - }) - } - } - - if (isShuoshuo) { - '!{use[0]}' === 'Waline' - ? window.shuoshuoComment = { loadComment: loadWaline } - : window.loadOtherComment = loadWaline - return - } - - if ('!{use[0]}' === 'Waline' || !!{lazyload}) { - if (!{lazyload}) btf.loadComment(document.getElementById('waline-wrap'),loadWaline) - else setTimeout(loadWaline, 0) - } else { - window.loadOtherComment = loadWaline - } - })() - +- const { serverURL, option, pageview } = theme.waline +- const { lazyload, count, use } = theme.comments + +script. + (() => { + let initFn = window.walineFn || null + const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' + const option = !{JSON.stringify(option)} + + const destroyWaline = ele => ele.destroy() + + const initWaline = (Fn, el = document, path = window.location.pathname) => { + const waline = Fn({ + el: el.querySelector('#waline-wrap'), + serverURL: '!{serverURL}', + pageview: !{lazyload ? false : pageview}, + dark: 'html[data-theme="dark"]', + comment: !{lazyload ? false : count}, + ...option, + path: isShuoshuo ? path : (option && option.path) || path + }) + + if (isShuoshuo) { + window.shuoshuoComment.destroyWaline = () => { + destroyWaline(waline) + if (el.children.length) { + el.innerHTML = '' + el.classList.add('no-comment') + } + } + } + } + + const loadWaline = (el, path) => { + if (initFn) initWaline(initFn, el, path) + else { + btf.getCSS('!{url_for(theme.asset.waline_css)}') + .then(() => import('!{url_for(theme.asset.waline_js)}')) + .then(({ init }) => { + initFn = init || Waline.init + initWaline(initFn, el, path) + window.walineFn = initFn + }) + } + } + + if (isShuoshuo) { + '!{use[0]}' === 'Waline' + ? window.shuoshuoComment = { loadComment: loadWaline } + : window.loadOtherComment = loadWaline + return + } + + if ('!{use[0]}' === 'Waline' || !!{lazyload}) { + if (!{lazyload}) btf.loadComment(document.getElementById('waline-wrap'),loadWaline) + else setTimeout(loadWaline, 0) + } else { + window.loadOtherComment = loadWaline + } + })() + diff --git a/layout/includes/third-party/effect.pug b/layout/includes/third-party/effect.pug index a3b2995..2addbe4 100644 --- a/layout/includes/third-party/effect.pug +++ b/layout/includes/third-party/effect.pug @@ -1,35 +1,35 @@ -if theme.fireworks && theme.fireworks.enable - canvas.fireworks(mobile=`${theme.fireworks.mobile}`) - script(src=url_for(theme.asset.fireworks)) - -if (theme.canvas_ribbon && theme.canvas_ribbon.enable) - script(defer id="ribbon" src=url_for(theme.asset.canvas_ribbon) size=theme.canvas_ribbon.size - alpha=theme.canvas_ribbon.alpha zIndex=theme.canvas_ribbon.zIndex mobile=`${theme.canvas_ribbon.mobile}` data-click=`${theme.canvas_ribbon.click_to_change}`) - -if (theme.canvas_fluttering_ribbon && theme.canvas_fluttering_ribbon.enable) - script(defer id="fluttering_ribbon" mobile=`${theme.canvas_fluttering_ribbon.mobile}` src=url_for(theme.asset.canvas_fluttering_ribbon)) - -if (theme.canvas_nest && theme.canvas_nest.enable) - script#canvas_nest(defer color=theme.canvas_nest.color opacity=theme.canvas_nest.opacity zIndex=theme.canvas_nest.zIndex count=theme.canvas_nest.count mobile=`${theme.canvas_nest.mobile}` src=url_for(theme.asset.canvas_nest)) - -if theme.activate_power_mode.enable - script(src=url_for(theme.asset.activate_power_mode)) - script. - POWERMODE.colorful = !{theme.activate_power_mode.colorful}; - POWERMODE.shake = !{theme.activate_power_mode.shake}; - POWERMODE.mobile = !{theme.activate_power_mode.mobile}; - document.body.addEventListener('input', POWERMODE); - -//- 鼠標特效 -if theme.click_heart && theme.click_heart.enable - script#click-heart(src=url_for(theme.asset.click_heart) async mobile=`${theme.click_heart.mobile}`) - -if theme.clickShowText && theme.clickShowText.enable - script#click-show-text( - src= url_for(theme.asset.clickShowText) - data-mobile= `${theme.clickShowText.mobile}` - data-text= theme.clickShowText.text.join(",") - data-fontsize= theme.clickShowText.fontSize - data-random= `${theme.clickShowText.random}` - async +if theme.fireworks && theme.fireworks.enable + canvas.fireworks(mobile=`${theme.fireworks.mobile}`) + script(src=url_for(theme.asset.fireworks)) + +if (theme.canvas_ribbon && theme.canvas_ribbon.enable) + script(defer id="ribbon" src=url_for(theme.asset.canvas_ribbon) size=theme.canvas_ribbon.size + alpha=theme.canvas_ribbon.alpha zIndex=theme.canvas_ribbon.zIndex mobile=`${theme.canvas_ribbon.mobile}` data-click=`${theme.canvas_ribbon.click_to_change}`) + +if (theme.canvas_fluttering_ribbon && theme.canvas_fluttering_ribbon.enable) + script(defer id="fluttering_ribbon" mobile=`${theme.canvas_fluttering_ribbon.mobile}` src=url_for(theme.asset.canvas_fluttering_ribbon)) + +if (theme.canvas_nest && theme.canvas_nest.enable) + script#canvas_nest(defer color=theme.canvas_nest.color opacity=theme.canvas_nest.opacity zIndex=theme.canvas_nest.zIndex count=theme.canvas_nest.count mobile=`${theme.canvas_nest.mobile}` src=url_for(theme.asset.canvas_nest)) + +if theme.activate_power_mode.enable + script(src=url_for(theme.asset.activate_power_mode)) + script. + POWERMODE.colorful = !{theme.activate_power_mode.colorful}; + POWERMODE.shake = !{theme.activate_power_mode.shake}; + POWERMODE.mobile = !{theme.activate_power_mode.mobile}; + document.body.addEventListener('input', POWERMODE); + +//- 鼠標特效 +if theme.click_heart && theme.click_heart.enable + script#click-heart(src=url_for(theme.asset.click_heart) async mobile=`${theme.click_heart.mobile}`) + +if theme.clickShowText && theme.clickShowText.enable + script#click-show-text( + src= url_for(theme.asset.clickShowText) + data-mobile= `${theme.clickShowText.mobile}` + data-text= theme.clickShowText.text.join(",") + data-fontsize= theme.clickShowText.fontSize + data-random= `${theme.clickShowText.random}` + async ) \ No newline at end of file diff --git a/layout/includes/third-party/math/chartjs.pug b/layout/includes/third-party/math/chartjs.pug index 235d8e4..e51c621 100644 --- a/layout/includes/third-party/math/chartjs.pug +++ b/layout/includes/third-party/math/chartjs.pug @@ -1,91 +1,91 @@ -- const { fontColor, borderColor, scale_ticks_backdropColor } = theme.chartjs - -script. - (() => { - const applyThemeDefaultsConfig = theme => { - if (theme === 'dark-mode') { - Chart.defaults.color = "!{fontColor.dark}" - Chart.defaults.borderColor = "!{borderColor.dark}" - Chart.defaults.scale.ticks.backdropColor = "!{scale_ticks_backdropColor.dark}" - } else { - Chart.defaults.color = "!{fontColor.light}" - Chart.defaults.borderColor = "!{borderColor.light}" - Chart.defaults.scale.ticks.backdropColor = "!{scale_ticks_backdropColor.light}" - } - } - - // Recursively traverse the config object and automatically apply theme-specific color schemes - const applyThemeConfig = (obj, theme) => { - if (typeof obj !== 'object' || obj === null) return - - Object.keys(obj).forEach(key => { - const value = obj[key] - // If the property is an object and has theme-specific options, apply them - if (typeof value === 'object' && value !== null) { - if (value[theme]) { - obj[key] = value[theme] // Apply the value for the current theme - } else { - // Recursively process child objects - applyThemeConfig(value, theme) - } - } - }) - } - - const runChartJS = ele => { - window.loadChartJS = true - - Array.from(ele).forEach((item, index) => { - const chartSrc = item.firstElementChild - const chartID = item.getAttribute('data-chartjs-id') || ('chartjs-' + index) // Use custom ID or default ID - const width = item.getAttribute('data-width') - const existingCanvas = document.getElementById(chartID) - - // If a canvas already exists, remove it to avoid rendering duplicates - if (existingCanvas) { - existingCanvas.parentNode.remove() - } - - const chartDefinition = chartSrc.textContent - const canvas = document.createElement('canvas') - canvas.id = chartID - - const div = document.createElement('div') - div.className = 'chartjs-wrap' - - if (width) { - div.style.width = width - } - - div.appendChild(canvas) - chartSrc.insertAdjacentElement('afterend', div) - - const ctx = document.getElementById(chartID).getContext('2d') - - const config = JSON.parse(chartDefinition) - - const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark-mode' : 'light-mode' - - // Set default styles (initial setup) - applyThemeDefaultsConfig(theme) - - // Automatically traverse the config and apply dual-mode color schemes - applyThemeConfig(config, theme) - - new Chart(ctx, config) - }) - } - - const loadChartJS = () => { - const chartJSEle = document.querySelectorAll('#article-container .chartjs-container') - if (chartJSEle.length === 0) return - - window.loadChartJS ? runChartJS(chartJSEle) : btf.getScript('!{url_for(theme.asset.chartjs)}').then(() => runChartJS(chartJSEle)) - } - - // Listen for theme change events - btf.addGlobalFn('themeChange', loadChartJS, 'chartjs') - btf.addGlobalFn('encrypt', loadChartJS, 'chartjs') - - window.pjax ? loadChartJS() : document.addEventListener('DOMContentLoaded', loadChartJS) - })() +- const { fontColor, borderColor, scale_ticks_backdropColor } = theme.chartjs + +script. + (() => { + const applyThemeDefaultsConfig = theme => { + if (theme === 'dark-mode') { + Chart.defaults.color = "!{fontColor.dark}" + Chart.defaults.borderColor = "!{borderColor.dark}" + Chart.defaults.scale.ticks.backdropColor = "!{scale_ticks_backdropColor.dark}" + } else { + Chart.defaults.color = "!{fontColor.light}" + Chart.defaults.borderColor = "!{borderColor.light}" + Chart.defaults.scale.ticks.backdropColor = "!{scale_ticks_backdropColor.light}" + } + } + + // Recursively traverse the config object and automatically apply theme-specific color schemes + const applyThemeConfig = (obj, theme) => { + if (typeof obj !== 'object' || obj === null) return + + Object.keys(obj).forEach(key => { + const value = obj[key] + // If the property is an object and has theme-specific options, apply them + if (typeof value === 'object' && value !== null) { + if (value[theme]) { + obj[key] = value[theme] // Apply the value for the current theme + } else { + // Recursively process child objects + applyThemeConfig(value, theme) + } + } + }) + } + + const runChartJS = ele => { + window.loadChartJS = true + + Array.from(ele).forEach((item, index) => { + const chartSrc = item.firstElementChild + const chartID = item.getAttribute('data-chartjs-id') || ('chartjs-' + index) // Use custom ID or default ID + const width = item.getAttribute('data-width') + const existingCanvas = document.getElementById(chartID) + + // If a canvas already exists, remove it to avoid rendering duplicates + if (existingCanvas) { + existingCanvas.parentNode.remove() + } + + const chartDefinition = chartSrc.textContent + const canvas = document.createElement('canvas') + canvas.id = chartID + + const div = document.createElement('div') + div.className = 'chartjs-wrap' + + if (width) { + div.style.width = width + } + + div.appendChild(canvas) + chartSrc.insertAdjacentElement('afterend', div) + + const ctx = document.getElementById(chartID).getContext('2d') + + const config = JSON.parse(chartDefinition) + + const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark-mode' : 'light-mode' + + // Set default styles (initial setup) + applyThemeDefaultsConfig(theme) + + // Automatically traverse the config and apply dual-mode color schemes + applyThemeConfig(config, theme) + + new Chart(ctx, config) + }) + } + + const loadChartJS = () => { + const chartJSEle = document.querySelectorAll('#article-container .chartjs-container') + if (chartJSEle.length === 0) return + + window.loadChartJS ? runChartJS(chartJSEle) : btf.getScript('!{url_for(theme.asset.chartjs)}').then(() => runChartJS(chartJSEle)) + } + + // Listen for theme change events + btf.addGlobalFn('themeChange', loadChartJS, 'chartjs') + btf.addGlobalFn('encrypt', loadChartJS, 'chartjs') + + window.pjax ? loadChartJS() : document.addEventListener('DOMContentLoaded', loadChartJS) + })() diff --git a/layout/includes/third-party/math/index.pug b/layout/includes/third-party/math/index.pug index 93302f8..a5bdf41 100644 --- a/layout/includes/third-party/math/index.pug +++ b/layout/includes/third-party/math/index.pug @@ -1,14 +1,14 @@ -case theme.math.use - when 'mathjax' - if (theme.math.per_page && (['post','page'].includes(globalPageType))) || page.mathjax - include ./mathjax.pug - - when 'katex' - if (theme.math.per_page && (['post','page'].includes(globalPageType))) || page.katex - include ./katex.pug - -if theme.mermaid.enable - include ./mermaid.pug - -if theme.chartjs.enable +case theme.math.use + when 'mathjax' + if (theme.math.per_page && (['post','page'].includes(globalPageType))) || page.mathjax + include ./mathjax.pug + + when 'katex' + if (theme.math.per_page && (['post','page'].includes(globalPageType))) || page.katex + include ./katex.pug + +if theme.mermaid.enable + include ./mermaid.pug + +if theme.chartjs.enable include ./chartjs.pug \ No newline at end of file diff --git a/layout/includes/third-party/math/katex.pug b/layout/includes/third-party/math/katex.pug index 0e4195d..6e429a5 100644 --- a/layout/includes/third-party/math/katex.pug +++ b/layout/includes/third-party/math/katex.pug @@ -1,16 +1,16 @@ -script. - (async () => { - const showKatex = () => { - document.querySelectorAll('#article-container .katex').forEach(el => el.classList.add('katex-show')) - } - - if (!window.katex_js_css) { - window.katex_js_css = true - await btf.getCSS('!{url_for(theme.asset.katex)}') - if (!{theme.math.katex.copy_tex}) { - await btf.getScript('!{url_for(theme.asset.katex_copytex)}') - } - } - - showKatex() +script. + (async () => { + const showKatex = () => { + document.querySelectorAll('#article-container .katex').forEach(el => el.classList.add('katex-show')) + } + + if (!window.katex_js_css) { + window.katex_js_css = true + await btf.getCSS('!{url_for(theme.asset.katex)}') + if (!{theme.math.katex.copy_tex}) { + await btf.getScript('!{url_for(theme.asset.katex_copytex)}') + } + } + + showKatex() })() \ No newline at end of file diff --git a/layout/includes/third-party/math/mathjax.pug b/layout/includes/third-party/math/mathjax.pug index f0483ef..e937dbc 100644 --- a/layout/includes/third-party/math/mathjax.pug +++ b/layout/includes/third-party/math/mathjax.pug @@ -1,47 +1,47 @@ -//- Mathjax 3 -- const { tags, enableMenu } = theme.math.mathjax -script. - (() => { - const loadMathjax = () => { - if (!window.MathJax) { - window.MathJax = { - tex: { - inlineMath: [['$', '$'], ['\\(', '\\)']], - tags: '!{tags}', - }, - chtml: { - scale: 1.1 - }, - options: { - enableMenu: !{enableMenu}, - renderActions: { - findScript: [10, doc => { - for (const node of document.querySelectorAll('script[type^="math/tex"]')) { - const display = !!node.type.match(/; *mode=display/) - const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display) - const text = document.createTextNode('') - node.parentNode.replaceChild(text, node) - math.start = {node: text, delim: '', n: 0} - math.end = {node: text, delim: '', n: 0} - doc.math.push(math) - } - }, ''] - } - } - } - - const script = document.createElement('script') - script.src = '!{url_for(theme.asset.mathjax)}' - script.id = 'MathJax-script' - script.async = true - document.head.appendChild(script) - } else { - MathJax.startup.document.state(0) - MathJax.texReset() - MathJax.typesetPromise() - } - } - - btf.addGlobalFn('encrypt', loadMathjax, 'mathjax') - window.pjax ? loadMathjax() : window.addEventListener('load', loadMathjax) +//- Mathjax 3 +- const { tags, enableMenu } = theme.math.mathjax +script. + (() => { + const loadMathjax = () => { + if (!window.MathJax) { + window.MathJax = { + tex: { + inlineMath: [['$', '$'], ['\\(', '\\)']], + tags: '!{tags}', + }, + chtml: { + scale: 1.1 + }, + options: { + enableMenu: !{enableMenu}, + renderActions: { + findScript: [10, doc => { + for (const node of document.querySelectorAll('script[type^="math/tex"]')) { + const display = !!node.type.match(/; *mode=display/) + const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display) + const text = document.createTextNode('') + node.parentNode.replaceChild(text, node) + math.start = {node: text, delim: '', n: 0} + math.end = {node: text, delim: '', n: 0} + doc.math.push(math) + } + }, ''] + } + } + } + + const script = document.createElement('script') + script.src = '!{url_for(theme.asset.mathjax)}' + script.id = 'MathJax-script' + script.async = true + document.head.appendChild(script) + } else { + MathJax.startup.document.state(0) + MathJax.texReset() + MathJax.typesetPromise() + } + } + + btf.addGlobalFn('encrypt', loadMathjax, 'mathjax') + window.pjax ? loadMathjax() : window.addEventListener('load', loadMathjax) })() \ No newline at end of file diff --git a/layout/includes/third-party/math/mermaid.pug b/layout/includes/third-party/math/mermaid.pug index a668659..d28049f 100644 --- a/layout/includes/third-party/math/mermaid.pug +++ b/layout/includes/third-party/math/mermaid.pug @@ -1,51 +1,51 @@ -script. - (() => { - const runMermaid = ele => { - window.loadMermaid = true - const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{theme.mermaid.theme.dark}' : '!{theme.mermaid.theme.light}' - - ele.forEach((item, index) => { - const mermaidSrc = item.firstElementChild - const mermaidThemeConfig = `%%{init:{ 'theme':'${theme}'}}%%\n` - const mermaidID = `mermaid-${index}` - const mermaidDefinition = mermaidThemeConfig + mermaidSrc.textContent - - const renderFn = mermaid.render(mermaidID, mermaidDefinition) - const renderMermaid = svg => { - mermaidSrc.insertAdjacentHTML('afterend', svg) - } - - // mermaid v9 and v10 compatibility - typeof renderFn === 'string' ? renderMermaid(renderFn) : renderFn.then(({ svg }) => renderMermaid(svg)) - }) - } - - const codeToMermaid = () => { - const codeMermaidEle = document.querySelectorAll('pre > code.mermaid') - if (codeMermaidEle.length === 0) return - - codeMermaidEle.forEach(ele => { - const preEle = document.createElement('pre') - preEle.className = 'mermaid-src' - preEle.hidden = true - preEle.textContent = ele.textContent - const newEle = document.createElement('div') - newEle.className = 'mermaid-wrap' - newEle.appendChild(preEle) - ele.parentNode.replaceWith(newEle) - }) - } - - const loadMermaid = () => { - if (!{theme.mermaid.code_write}) codeToMermaid() - const $mermaid = document.querySelectorAll('#article-container .mermaid-wrap') - if ($mermaid.length === 0) return - - const runMermaidFn = () => runMermaid($mermaid) - btf.addGlobalFn('themeChange', runMermaidFn, 'mermaid') - window.loadMermaid ? runMermaidFn() : btf.getScript('!{url_for(theme.asset.mermaid)}').then(runMermaidFn) - } - - btf.addGlobalFn('encrypt', loadMermaid, 'mermaid') - window.pjax ? loadMermaid() : document.addEventListener('DOMContentLoaded', loadMermaid) +script. + (() => { + const runMermaid = ele => { + window.loadMermaid = true + const theme = document.documentElement.getAttribute('data-theme') === 'dark' ? '!{theme.mermaid.theme.dark}' : '!{theme.mermaid.theme.light}' + + ele.forEach((item, index) => { + const mermaidSrc = item.firstElementChild + const mermaidThemeConfig = `%%{init:{ 'theme':'${theme}'}}%%\n` + const mermaidID = `mermaid-${index}` + const mermaidDefinition = mermaidThemeConfig + mermaidSrc.textContent + + const renderFn = mermaid.render(mermaidID, mermaidDefinition) + const renderMermaid = svg => { + mermaidSrc.insertAdjacentHTML('afterend', svg) + } + + // mermaid v9 and v10 compatibility + typeof renderFn === 'string' ? renderMermaid(renderFn) : renderFn.then(({ svg }) => renderMermaid(svg)) + }) + } + + const codeToMermaid = () => { + const codeMermaidEle = document.querySelectorAll('pre > code.mermaid') + if (codeMermaidEle.length === 0) return + + codeMermaidEle.forEach(ele => { + const preEle = document.createElement('pre') + preEle.className = 'mermaid-src' + preEle.hidden = true + preEle.textContent = ele.textContent + const newEle = document.createElement('div') + newEle.className = 'mermaid-wrap' + newEle.appendChild(preEle) + ele.parentNode.replaceWith(newEle) + }) + } + + const loadMermaid = () => { + if (!{theme.mermaid.code_write}) codeToMermaid() + const $mermaid = document.querySelectorAll('#article-container .mermaid-wrap') + if ($mermaid.length === 0) return + + const runMermaidFn = () => runMermaid($mermaid) + btf.addGlobalFn('themeChange', runMermaidFn, 'mermaid') + window.loadMermaid ? runMermaidFn() : btf.getScript('!{url_for(theme.asset.mermaid)}').then(runMermaidFn) + } + + btf.addGlobalFn('encrypt', loadMermaid, 'mermaid') + window.pjax ? loadMermaid() : document.addEventListener('DOMContentLoaded', loadMermaid) })() \ No newline at end of file diff --git a/layout/includes/third-party/newest-comments/artalk.pug b/layout/includes/third-party/newest-comments/artalk.pug index 4e703b2..cf51638 100644 --- a/layout/includes/third-party/newest-comments/artalk.pug +++ b/layout/includes/third-party/newest-comments/artalk.pug @@ -1,67 +1,67 @@ -- const { server, site, option } = theme.artalk -- const avatarCdn = (option !== null && option.gravatar && option.gravatar.mirror) || '' -- const avatarDefault = (option !== null && option.gravatar && (option.gravatar.params || option.gravatar.default)) || '' - -!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true }) - -script. - window.addEventListener('load', () => { - const keyName = 'artalk-newest-comments' - const { changeContent, generateHtml, run } = window.newestComments - - const getAvatarValue = async () => { - const predefinedAvatarCdn = '!{avatarCdn}' - const predefinedAvatarDefault = '!{avatarDefault}' - - const avatarDefaultFormat = e => e.startsWith('d=') ? e : `d=${e}` - - if (predefinedAvatarCdn && predefinedAvatarDefault) { - return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) } - } - - try { - const res = await fetch('!{server}/api/v2/conf') - const result = await res.json() - const { mirror, params, default: defaults } = result.frontend_conf.gravatar - const avatarCdn = predefinedAvatarCdn || mirror - let avatarDefault = avatarDefaultFormat(predefinedAvatarDefault || params || defaults) - return { avatarCdn, avatarDefault} - } catch (e) { - console.error(e) - return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) } - } - } - - const searchParams = new URLSearchParams({ - 'site_name': '!{site}', - 'limit': '!{newestCommentsLimit * 2}', // Fetch more comments to filter pending comments - }) - - const getComment = async (ele) => { - try { - const res = await fetch(`!{server}/api/v2/stats/latest_comments?${searchParams}`) - const result = await res.json() - const { avatarCdn, avatarDefault } = await getAvatarValue() - const artalk = result.data - .filter(e => !e.is_pending) // Filter pending comments - .slice(0, !{newestCommentsLimit}) // Limit the number of comments - .map(e => { - const avatar = avatarCdn && e.email_encrypted ? `${avatarCdn}${e.email_encrypted}?${avatarDefault}` : '' - return { - 'avatar': avatar, - 'content': changeContent(e.content_marked), - 'nick': e.nick, - 'url': e.page_url, - 'date': e.date, - } - }) - btf.saveToLocal.set(keyName, JSON.stringify(artalk), !{theme.aside.card_newest_comments.storage}/(60*24)) - generateHtml(artalk, ele) - } catch (e) { - console.log(e) - ele.textContent= "!{_p('aside.card_newest_comments.error')}" - } - } - - run(keyName, getComment) +- const { server, site, option } = theme.artalk +- const avatarCdn = (option !== null && option.gravatar && option.gravatar.mirror) || '' +- const avatarDefault = (option !== null && option.gravatar && (option.gravatar.params || option.gravatar.default)) || '' + +!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true }) + +script. + window.addEventListener('load', () => { + const keyName = 'artalk-newest-comments' + const { changeContent, generateHtml, run } = window.newestComments + + const getAvatarValue = async () => { + const predefinedAvatarCdn = '!{avatarCdn}' + const predefinedAvatarDefault = '!{avatarDefault}' + + const avatarDefaultFormat = e => e.startsWith('d=') ? e : `d=${e}` + + if (predefinedAvatarCdn && predefinedAvatarDefault) { + return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) } + } + + try { + const res = await fetch('!{server}/api/v2/conf') + const result = await res.json() + const { mirror, params, default: defaults } = result.frontend_conf.gravatar + const avatarCdn = predefinedAvatarCdn || mirror + let avatarDefault = avatarDefaultFormat(predefinedAvatarDefault || params || defaults) + return { avatarCdn, avatarDefault} + } catch (e) { + console.error(e) + return { avatarCdn: predefinedAvatarCdn, avatarDefault: avatarDefaultFormat(predefinedAvatarDefault) } + } + } + + const searchParams = new URLSearchParams({ + 'site_name': '!{site}', + 'limit': '!{newestCommentsLimit * 2}', // Fetch more comments to filter pending comments + }) + + const getComment = async (ele) => { + try { + const res = await fetch(`!{server}/api/v2/stats/latest_comments?${searchParams}`) + const result = await res.json() + const { avatarCdn, avatarDefault } = await getAvatarValue() + const artalk = result.data + .filter(e => !e.is_pending) // Filter pending comments + .slice(0, !{newestCommentsLimit}) // Limit the number of comments + .map(e => { + const avatar = avatarCdn && e.email_encrypted ? `${avatarCdn}${e.email_encrypted}?${avatarDefault}` : '' + return { + 'avatar': avatar, + 'content': changeContent(e.content_marked), + 'nick': e.nick, + 'url': e.page_url, + 'date': e.date, + } + }) + btf.saveToLocal.set(keyName, JSON.stringify(artalk), !{theme.aside.card_newest_comments.storage}/(60*24)) + generateHtml(artalk, ele) + } catch (e) { + console.log(e) + ele.textContent= "!{_p('aside.card_newest_comments.error')}" + } + } + + run(keyName, getComment) }) \ No newline at end of file diff --git a/layout/includes/third-party/newest-comments/common.pug b/layout/includes/third-party/newest-comments/common.pug index f3b88f5..9a0814d 100644 --- a/layout/includes/third-party/newest-comments/common.pug +++ b/layout/includes/third-party/newest-comments/common.pug @@ -1,61 +1,61 @@ -script. - window.newestComments = { - changeContent: content => { - if (content === '') return content - - content = content.replace(/]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link - content = content.replace(/]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url - content = content.replace(/
.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
-      content = content.replace(/<[^>]+>/g, "") // remove html tag
-
-      if (content.length > 150) {
-        content = content.substring(0, 150) + '...'
-      }
-      return content
-    },
-
-    generateHtml: (array, ele) => {
-      let result = ''
-
-      if (array.length) {
-        for (let i = 0; i < array.length; i++) {
-          result += '
'
-
-          if (!{theme.aside.card_newest_comments.avatar} && array[i].avatar) {
-            const imgAttr = '!{theme.lazyload.enable && !theme.lazyload.native ? "data-lazy-src" : "src"}'
-            const lazyloadNative = '!{theme.lazyload.enable && theme.lazyload.native ? "loading=\"lazy\"" : ""}'
-            result += `${array[i].nick}`
-          }
-
-          result += `

-          ${array[i].content}
-          
${array[i].nick} / 

-          
`
-        }
-      } else {
-        result += '!{_p("aside.card_newest_comments.zero")}'
-      }
-
-      ele.innerHTML = result
-      window.lazyLoadInstance && window.lazyLoadInstance.update()
-      window.pjax && window.pjax.refresh(ele)
-    },
-
-    newestCommentInit: (name, getComment) => {
-      const $dom = document.querySelector('#card-newest-comments .aside-list')
-      if ($dom) {
-        const data = btf.saveToLocal.get(name)
-        if (data) {
-          newestComments.generateHtml(JSON.parse(data), $dom)
-        } else {
-          getComment($dom)
-        }
-      }
-    },
-
-    run: (name, getComment) => {
-      newestComments.newestCommentInit(name, getComment)
-      btf.addGlobalFn('pjaxComplete', () => newestComments.newestCommentInit(name, getComment), name)
-    }
+script.
+  window.newestComments = {
+    changeContent: content => {
+      if (content === '') return content
+
+      content = content.replace(/]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link
+      content = content.replace(/]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url
+      content = content.replace(/
.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
+      content = content.replace(/.*?<\/code>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code
+      content = content.replace(/<[^>]+>/g, "") // remove html tag
+
+      if (content.length > 150) {
+        content = content.substring(0, 150) + '...'
+      }
+      return content
+    },
+
+    generateHtml: (array, ele) => {
+      let result = ''
+
+      if (array.length) {
+        for (let i = 0; i < array.length; i++) {
+          result += '
'
+
+          if (!{theme.aside.card_newest_comments.avatar} && array[i].avatar) {
+            const imgAttr = '!{theme.lazyload.enable && !theme.lazyload.native ? "data-lazy-src" : "src"}'
+            const lazyloadNative = '!{theme.lazyload.enable && theme.lazyload.native ? "loading=\"lazy\"" : ""}'
+            result += `${array[i].nick}`
+          }
+
+          result += `

+          ${array[i].content}
+          
${array[i].nick} / 

+          
`
+        }
+      } else {
+        result += '!{_p("aside.card_newest_comments.zero")}'
+      }
+
+      ele.innerHTML = result
+      window.lazyLoadInstance && window.lazyLoadInstance.update()
+      window.pjax && window.pjax.refresh(ele)
+    },
+
+    newestCommentInit: (name, getComment) => {
+      const $dom = document.querySelector('#card-newest-comments .aside-list')
+      if ($dom) {
+        const data = btf.saveToLocal.get(name)
+        if (data) {
+          newestComments.generateHtml(JSON.parse(data), $dom)
+        } else {
+          getComment($dom)
+        }
+      }
+    },
+
+    run: (name, getComment) => {
+      newestComments.newestCommentInit(name, getComment)
+      btf.addGlobalFn('pjaxComplete', () => newestComments.newestCommentInit(name, getComment), name)
+    }
   }
\ No newline at end of file
diff --git a/layout/includes/third-party/newest-comments/disqus-comment.pug b/layout/includes/third-party/newest-comments/disqus-comment.pug
index e26bb41..040d5d0 100644
--- a/layout/includes/third-party/newest-comments/disqus-comment.pug
+++ b/layout/includes/third-party/newest-comments/disqus-comment.pug
@@ -1,34 +1,34 @@
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'disqus-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const getComment = ele => {
-      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{newestCommentsLimit}&api_key=!{apiKey}')
-        .then(response => response.json())
-        .then(data => {
-          const disqusArray = data.response.map(item => {
-            return {
-              'avatar': item.author.avatar.cache,
-              'content': changeContent(item.message),
-              'nick': item.author.name,
-              'url': item.url,
-              'date': item.createdAt
-            }
-          })
-
-          btf.saveToLocal.set(keyName, JSON.stringify(disqusArray), !{theme.aside.card_newest_comments.storage}/(60*24))
-          generateHtml(disqusArray, ele)
-        }).catch(e => {
-          console.error(e)
-          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-        })
-    }
-
-    run(keyName, getComment)
-  })
-
-
-
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'disqus-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const getComment = ele => {
+      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{newestCommentsLimit}&api_key=!{apiKey}')
+        .then(response => response.json())
+        .then(data => {
+          const disqusArray = data.response.map(item => {
+            return {
+              'avatar': item.author.avatar.cache,
+              'content': changeContent(item.message),
+              'nick': item.author.name,
+              'url': item.url,
+              'date': item.createdAt
+            }
+          })
+
+          btf.saveToLocal.set(keyName, JSON.stringify(disqusArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(disqusArray, ele)
+        }).catch(e => {
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
+    }
+
+    run(keyName, getComment)
+  })
+
+
+
diff --git a/layout/includes/third-party/newest-comments/github-issues.pug b/layout/includes/third-party/newest-comments/github-issues.pug
index 7dc418c..5612c8a 100644
--- a/layout/includes/third-party/newest-comments/github-issues.pug
+++ b/layout/includes/third-party/newest-comments/github-issues.pug
@@ -1,62 +1,62 @@
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'github-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const findTrueUrl = (array, ele) => {
-      Promise.all(array.map(item =>
-        fetch(item.url).then(resp => resp.json()).then(data => {
-          let urlArray = data.body ? data.body.match(/(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?/ig) : []
-          if (!Array.isArray(urlArray) || urlArray.length === 0) {
-            urlArray = [`${data.html_url}`]
-          }
-          if (data.user.login === 'utterances-bot') {
-            return urlArray.pop()
-          } else {
-            return urlArray.shift()
-          }
-        })
-      )).then(res => {
-          array = array.map((i,index)=> {
-            return {
-              ...i,
-              url: res[index]
-            }
-          })
-
-          btf.saveToLocal.set(keyName, JSON.stringify(array), !{theme.aside.card_newest_comments.storage}/(60*24))
-          generateHtml(array, ele)
-      });
-    }
-
-    const getComment = ele => {
-      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{newestCommentsLimit}&page=1',{
-        "headers": {
-          Accept: 'application/vnd.github.v3.html+json'
-        }
-      })
-        .then(response => response.json())
-        .then(data => {
-          const githubArray = data.map(item => {
-            return {
-              'avatar': item.user.avatar_url,
-              'content': changeContent(item.body_html || item.body),
-              'nick': item.user.login,
-              'url': item.issue_url,
-              'date': item.updated_at
-            }
-          })
-          findTrueUrl(githubArray, ele)
-        }).catch(e => {
-          console.error(e)
-          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-        })
-    }
-    run(keyName, getComment)
-  })
-
-
-
-
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'github-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const findTrueUrl = (array, ele) => {
+      Promise.all(array.map(item =>
+        fetch(item.url).then(resp => resp.json()).then(data => {
+          let urlArray = data.body ? data.body.match(/(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?/ig) : []
+          if (!Array.isArray(urlArray) || urlArray.length === 0) {
+            urlArray = [`${data.html_url}`]
+          }
+          if (data.user.login === 'utterances-bot') {
+            return urlArray.pop()
+          } else {
+            return urlArray.shift()
+          }
+        })
+      )).then(res => {
+          array = array.map((i,index)=> {
+            return {
+              ...i,
+              url: res[index]
+            }
+          })
+
+          btf.saveToLocal.set(keyName, JSON.stringify(array), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(array, ele)
+      });
+    }
+
+    const getComment = ele => {
+      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{newestCommentsLimit}&page=1',{
+        "headers": {
+          Accept: 'application/vnd.github.v3.html+json'
+        }
+      })
+        .then(response => response.json())
+        .then(data => {
+          const githubArray = data.map(item => {
+            return {
+              'avatar': item.user.avatar_url,
+              'content': changeContent(item.body_html || item.body),
+              'nick': item.user.login,
+              'url': item.issue_url,
+              'date': item.updated_at
+            }
+          })
+          findTrueUrl(githubArray, ele)
+        }).catch(e => {
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
+    }
+    run(keyName, getComment)
+  })
+
+
+
+
diff --git a/layout/includes/third-party/newest-comments/index.pug b/layout/includes/third-party/newest-comments/index.pug
index a2f2c0d..eedb4e7 100644
--- a/layout/includes/third-party/newest-comments/index.pug
+++ b/layout/includes/third-party/newest-comments/index.pug
@@ -1,34 +1,34 @@
-- let { use } = theme.comments
-
-if use
-  -
-    let forum,apiKey,userRepo
-    let { limit:newestCommentsLimit } = theme.aside.card_newest_comments
-    if (newestCommentsLimit > 10 || newestCommentsLimit < 1) newestCommentsLimit = 6
-
-  case use[0]
-    when 'Valine'
-      include ./valine.pug
-    when 'Waline'
-      include ./waline.pug
-    when 'Twikoo'
-      include ./twikoo-comment.pug
-    when 'Disqus'
-      - forum = theme.disqus.shortname
-      - apiKey = theme.disqus.apikey
-      include ./disqus-comment.pug
-    when 'Disqusjs'
-      - forum = theme.disqusjs.shortname
-      - apiKey = theme.disqusjs.apikey
-      include ./disqus-comment.pug
-    when 'Gitalk'
-      - let { repo,owner } = theme.gitalk
-      - userRepo = owner + '/' + repo
-      include ./github-issues.pug
-    when 'Utterances'
-      - userRepo = theme.utterances.repo
-      include ./github-issues.pug
-    when 'Remark42'
-      include ./remark42.pug
-    when 'Artalk'
+- let { use } = theme.comments
+
+if use
+  -
+    let forum,apiKey,userRepo
+    let { limit:newestCommentsLimit } = theme.aside.card_newest_comments
+    if (newestCommentsLimit > 10 || newestCommentsLimit < 1) newestCommentsLimit = 6
+
+  case use[0]
+    when 'Valine'
+      include ./valine.pug
+    when 'Waline'
+      include ./waline.pug
+    when 'Twikoo'
+      include ./twikoo-comment.pug
+    when 'Disqus'
+      - forum = theme.disqus.shortname
+      - apiKey = theme.disqus.apikey
+      include ./disqus-comment.pug
+    when 'Disqusjs'
+      - forum = theme.disqusjs.shortname
+      - apiKey = theme.disqusjs.apikey
+      include ./disqus-comment.pug
+    when 'Gitalk'
+      - let { repo,owner } = theme.gitalk
+      - userRepo = owner + '/' + repo
+      include ./github-issues.pug
+    when 'Utterances'
+      - userRepo = theme.utterances.repo
+      include ./github-issues.pug
+    when 'Remark42'
+      include ./remark42.pug
+    when 'Artalk'
       include ./artalk.pug
\ No newline at end of file
diff --git a/layout/includes/third-party/newest-comments/remark42.pug b/layout/includes/third-party/newest-comments/remark42.pug
index 4321b3b..a335968 100644
--- a/layout/includes/third-party/newest-comments/remark42.pug
+++ b/layout/includes/third-party/newest-comments/remark42.pug
@@ -1,31 +1,31 @@
-- const { host, siteId } = theme.remark42
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'remark42-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const getComment = ele => {
-      fetch('!{host}/api/v1/last/!{newestCommentsLimit}?site=!{siteId}')
-        .then(response => response.json())
-        .then(data => {
-          const remark42 = data.map(e => {
-            return {
-              'avatar': e.user.picture,
-              'content': changeContent(e.text),
-              'nick': e.user.name,
-              'url': e.locator.url,
-              'date': e.time,
-            }
-          })
-          btf.saveToLocal.set(keyName, JSON.stringify(remark42), !{theme.aside.card_newest_comments.storage}/(60*24))
-          generateHtml(remark42, ele)
-        }).catch(e => {
-          console.error(e)
-          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-        })
-    }
-
-    run(keyName, getComment)
-  })
+- const { host, siteId } = theme.remark42
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'remark42-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const getComment = ele => {
+      fetch('!{host}/api/v1/last/!{newestCommentsLimit}?site=!{siteId}')
+        .then(response => response.json())
+        .then(data => {
+          const remark42 = data.map(e => {
+            return {
+              'avatar': e.user.picture,
+              'content': changeContent(e.text),
+              'nick': e.user.name,
+              'url': e.locator.url,
+              'date': e.time,
+            }
+          })
+          btf.saveToLocal.set(keyName, JSON.stringify(remark42), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(remark42, ele)
+        }).catch(e => {
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
+    }
+
+    run(keyName, getComment)
+  })
diff --git a/layout/includes/third-party/newest-comments/twikoo-comment.pug b/layout/includes/third-party/newest-comments/twikoo-comment.pug
index 772c8ec..250efa8 100644
--- a/layout/includes/third-party/newest-comments/twikoo-comment.pug
+++ b/layout/includes/third-party/newest-comments/twikoo-comment.pug
@@ -1,45 +1,45 @@
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'twikoo-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const getComment = ele => {
-      const runTwikoo = () => {
-        twikoo.getRecentComments({
-          envId: '!{theme.twikoo.envId}',
-          region: '!{theme.twikoo.region}',
-          pageSize: !{newestCommentsLimit},
-          includeReply: true
-        }).then(res => {
-          const twikooArray = res.map(e => {
-            return {
-              'content': changeContent(e.comment),
-              'avatar': e.avatar,
-              'nick': e.nick,
-              'url': e.url + '#' + e.id,
-              'date': new Date(e.created).toISOString()
-            }
-          })
-
-          btf.saveToLocal.set(keyName, JSON.stringify(twikooArray), !{theme.aside.card_newest_comments.storage}/(60*24))
-          generateHtml(twikooArray, ele)
-        }).catch(err => {
-          console.error(err)
-          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-        })
-      }
-
-      if (typeof twikoo === 'object') {
-        runTwikoo()
-      } else {
-        btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
-      }
-    }
-
-    run(keyName, getComment)
-  })
-
-
-
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'twikoo-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const getComment = ele => {
+      const runTwikoo = () => {
+        twikoo.getRecentComments({
+          envId: '!{theme.twikoo.envId}',
+          region: '!{theme.twikoo.region}',
+          pageSize: !{newestCommentsLimit},
+          includeReply: true
+        }).then(res => {
+          const twikooArray = res.map(e => {
+            return {
+              'content': changeContent(e.comment),
+              'avatar': e.avatar,
+              'nick': e.nick,
+              'url': e.url + '#' + e.id,
+              'date': new Date(e.created).toISOString()
+            }
+          })
+
+          btf.saveToLocal.set(keyName, JSON.stringify(twikooArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(twikooArray, ele)
+        }).catch(err => {
+          console.error(err)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
+      }
+
+      if (typeof twikoo === 'object') {
+        runTwikoo()
+      } else {
+        btf.getScript('!{url_for(theme.asset.twikoo)}').then(runTwikoo)
+      }
+    }
+
+    run(keyName, getComment)
+  })
+
+
+
diff --git a/layout/includes/third-party/newest-comments/valine.pug b/layout/includes/third-party/newest-comments/valine.pug
index 08af70c..6d7742c 100644
--- a/layout/includes/third-party/newest-comments/valine.pug
+++ b/layout/includes/third-party/newest-comments/valine.pug
@@ -1,51 +1,51 @@
-- let default_avatar = theme.valine.avatar
-
-script(src=url_for(theme.asset.blueimp_md5))
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'valine-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const getIcon = (icon, mail) => {
-      if (icon) return icon
-      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
-      let iconUrl = `https://gravatar.loli.net/avatar/${md5(mail.toLowerCase()) + defaultIcon}`
-      return iconUrl
-    }
-
-    const getComment = ele => {
-      const serverURL = '!{theme.valine.serverURLs || `https://${theme.valine.appId.substring(0,8)}.api.lncldglobal.com` }'
-
-      var settings = {
-        "method": "GET",
-        "headers": {
-          "X-LC-Id": '!{theme.valine.appId}',
-          "X-LC-Key": '!{theme.valine.appKey}',
-          "Content-Type": "application/json"
-        },
-      }
-
-      fetch(`${serverURL}/1.1/classes/Comment?limit=!{newestCommentsLimit}&order=-createdAt`,settings)
-        .then(response => response.json())
-        .then(data => {
-          const valineArray = data.results.map(e => {
-            return {
-              'avatar': getIcon(e.QQAvatar, e.mail),
-              'content': changeContent(e.comment),
-              'nick': e.nick,
-              'url': e.url + '#' + e.objectId,
-              'date': e.updatedAt,
-            }
-          })
-          btf.saveToLocal.set(keyName, JSON.stringify(valineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
-          generateHtml(valineArray, ele)
-        }).catch(e => {
-          console.error(e)
-          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-        })
-    }
-
-    run(keyName, getComment)
-  })
+- let default_avatar = theme.valine.avatar
+
+script(src=url_for(theme.asset.blueimp_md5))
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'valine-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const getIcon = (icon, mail) => {
+      if (icon) return icon
+      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
+      let iconUrl = `https://gravatar.loli.net/avatar/${md5(mail.toLowerCase()) + defaultIcon}`
+      return iconUrl
+    }
+
+    const getComment = ele => {
+      const serverURL = '!{theme.valine.serverURLs || `https://${theme.valine.appId.substring(0,8)}.api.lncldglobal.com` }'
+
+      var settings = {
+        "method": "GET",
+        "headers": {
+          "X-LC-Id": '!{theme.valine.appId}',
+          "X-LC-Key": '!{theme.valine.appKey}',
+          "Content-Type": "application/json"
+        },
+      }
+
+      fetch(`${serverURL}/1.1/classes/Comment?limit=!{newestCommentsLimit}&order=-createdAt`,settings)
+        .then(response => response.json())
+        .then(data => {
+          const valineArray = data.results.map(e => {
+            return {
+              'avatar': getIcon(e.QQAvatar, e.mail),
+              'content': changeContent(e.comment),
+              'nick': e.nick,
+              'url': e.url + '#' + e.objectId,
+              'date': e.updatedAt,
+            }
+          })
+          btf.saveToLocal.set(keyName, JSON.stringify(valineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+          generateHtml(valineArray, ele)
+        }).catch(e => {
+          console.error(e)
+          ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+        })
+    }
+
+    run(keyName, getComment)
+  })
diff --git a/layout/includes/third-party/newest-comments/waline.pug b/layout/includes/third-party/newest-comments/waline.pug
index 72743ea..b8117ef 100644
--- a/layout/includes/third-party/newest-comments/waline.pug
+++ b/layout/includes/third-party/newest-comments/waline.pug
@@ -1,32 +1,32 @@
-- const serverURL = theme.waline.serverURL.replace(/\/$/, '')
-
-!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
-
-script.
-  window.addEventListener('load', () => {
-    const keyName = 'waline-newest-comments'
-    const { changeContent, generateHtml, run } = window.newestComments
-
-    const getComment = async (ele) => {
-      try {
-        const res = await fetch('!{serverURL}/api/comment?type=recent&count=!{newestCommentsLimit}')
-        const result = await res.json()
-        const walineArray = result.data.map(e => {
-          return {
-            'content': changeContent(e.comment),
-            'avatar': e.avatar,
-            'nick': e.nick,
-            'url': e.url + '#' + e.objectId,
-            'date': e.time || e.insertedAt
-          }
-        })
-        btf.saveToLocal.set(keyName, JSON.stringify(walineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
-        generateHtml(walineArray, ele)
-      } catch (err) {
-        console.error(err)
-        ele.textContent= "!{_p('aside.card_newest_comments.error')}"
-      }
-    }
-
-    run(keyName, getComment)
-  })
+- const serverURL = theme.waline.serverURL.replace(/\/$/, '')
+
+!= partial("includes/third-party/newest-comments/common.pug", {}, { cache: true })
+
+script.
+  window.addEventListener('load', () => {
+    const keyName = 'waline-newest-comments'
+    const { changeContent, generateHtml, run } = window.newestComments
+
+    const getComment = async (ele) => {
+      try {
+        const res = await fetch('!{serverURL}/api/comment?type=recent&count=!{newestCommentsLimit}')
+        const result = await res.json()
+        const walineArray = result.data.map(e => {
+          return {
+            'content': changeContent(e.comment),
+            'avatar': e.avatar,
+            'nick': e.nick,
+            'url': e.url + '#' + e.objectId,
+            'date': e.time || e.insertedAt
+          }
+        })
+        btf.saveToLocal.set(keyName, JSON.stringify(walineArray), !{theme.aside.card_newest_comments.storage}/(60*24))
+        generateHtml(walineArray, ele)
+      } catch (err) {
+        console.error(err)
+        ele.textContent= "!{_p('aside.card_newest_comments.error')}"
+      }
+    }
+
+    run(keyName, getComment)
+  })
diff --git a/layout/includes/third-party/pjax.pug b/layout/includes/third-party/pjax.pug
index c63caf1..a8094f1 100644
--- a/layout/includes/third-party/pjax.pug
+++ b/layout/includes/third-party/pjax.pug
@@ -1,63 +1,65 @@
-- var pjaxExclude = 'a:not([target="_blank"])'
-if theme.pjax.exclude
-  each val in theme.pjax.exclude
-    - pjaxExclude += `:not([href="${val}"])`
-
-- let pjaxSelectors = ['head > title', '#config-diff', '#body-wrap', '#rightside-config-hide', '#rightside-config-show', '.js-pjax']
-
-- let choose = theme.comments.use
-if choose
-  if theme.Open_Graph_meta.enable && (choose.includes('Livere') || choose.includes('Utterances') || choose.includes('Giscus'))
-    - pjaxSelectors.unshift('meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]')
-  if choose.includes('Utterances') || choose.includes('Giscus')
-    - pjaxSelectors.unshift('link[rel="canonical"]')
-
-script(src=url_for(theme.asset.pjax))
-script.
-  (() => {
-    const pjaxSelectors = !{JSON.stringify(pjaxSelectors)}
-
-    window.pjax = new Pjax({
-      elements: '!{pjaxExclude}',
-      selectors: pjaxSelectors,
-      cacheBust: false,
-      analytics: !{theme.google_analytics ? true : false},
-      scrollRestoration: false
-    })
-
-    const triggerPjaxFn = (val) => {
-      if (!val) return
-      Object.values(val).forEach(fn => fn())
-    }
-
-    document.addEventListener('pjax:send', () => {
-      // removeEventListener
-      btf.removeGlobalFnEvent('pjaxSendOnce')
-      btf.removeGlobalFnEvent('themeChange')
-
-      // reset readmode
-      const $bodyClassList = document.body.classList
-      if ($bodyClassList.contains('read-mode')) $bodyClassList.remove('read-mode')
-
-      triggerPjaxFn(window.globalFn.pjaxSend)
-    })
-
-    document.addEventListener('pjax:complete', () => {
-      btf.removeGlobalFnEvent('pjaxCompleteOnce')
-      document.querySelectorAll('script[data-pjax]').forEach(item => {
-        const newScript = document.createElement('script')
-        const content = item.text || item.textContent || item.innerHTML || ""
-        Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
-        newScript.appendChild(document.createTextNode(content))
-        item.parentNode.replaceChild(newScript, item)
-      })
-
-      triggerPjaxFn(window.globalFn.pjaxComplete)
-    })
-
-    document.addEventListener('pjax:error', e => {
-      if (e.request.status === 404) {
-        pjax.loadUrl('!{url_for("/404.html")}')
-      }
-    })
+- var pjaxExclude = 'a:not([target="_blank"])'
+if theme.pjax.exclude
+  each val in theme.pjax.exclude
+    - pjaxExclude += `:not([href="${val}"])`
+
+- let pjaxSelectors = ['head > title', '#config-diff', '#body-wrap', '#rightside-config-hide', '#rightside-config-show', '.js-pjax']
+
+- let choose = theme.comments.use
+if choose
+  if choose.includes('Livere') || choose.includes('Utterances') || choose.includes('Giscus')
+    - pjaxSelectors.unshift('link[rel="canonical"]')
+    if theme.Open_Graph_meta.enable
+      - pjaxSelectors.unshift('meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]', 'meta[property="og:description"]')
+    else
+      - pjaxSelectors.unshift('meta[name="description"]')
+
+script(src=url_for(theme.asset.pjax))
+script.
+  (() => {
+    const pjaxSelectors = !{JSON.stringify(pjaxSelectors)}
+
+    window.pjax = new Pjax({
+      elements: '!{pjaxExclude}',
+      selectors: pjaxSelectors,
+      cacheBust: false,
+      analytics: !{theme.google_analytics ? true : false},
+      scrollRestoration: false
+    })
+
+    const triggerPjaxFn = (val) => {
+      if (!val) return
+      Object.values(val).forEach(fn => fn())
+    }
+
+    document.addEventListener('pjax:send', () => {
+      // removeEventListener
+      btf.removeGlobalFnEvent('pjaxSendOnce')
+      btf.removeGlobalFnEvent('themeChange')
+
+      // reset readmode
+      const $bodyClassList = document.body.classList
+      if ($bodyClassList.contains('read-mode')) $bodyClassList.remove('read-mode')
+
+      triggerPjaxFn(window.globalFn.pjaxSend)
+    })
+
+    document.addEventListener('pjax:complete', () => {
+      btf.removeGlobalFnEvent('pjaxCompleteOnce')
+      document.querySelectorAll('script[data-pjax]').forEach(item => {
+        const newScript = document.createElement('script')
+        const content = item.text || item.textContent || item.innerHTML || ""
+        Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
+        newScript.appendChild(document.createTextNode(content))
+        item.parentNode.replaceChild(newScript, item)
+      })
+
+      triggerPjaxFn(window.globalFn.pjaxComplete)
+    })
+
+    document.addEventListener('pjax:error', e => {
+      if (e.request.status === 404) {
+        window.location.href = e.request.responseURL
+      }
+    })
   })()
\ No newline at end of file
diff --git a/layout/includes/third-party/prismjs.pug b/layout/includes/third-party/prismjs.pug
index ee30e8b..b8bc784 100644
--- a/layout/includes/third-party/prismjs.pug
+++ b/layout/includes/third-party/prismjs.pug
@@ -1,23 +1,23 @@
-- const { prismjs_js, prismjs_autoloader, prismjs_lineNumber_js } = theme.asset
-- const { prismjs, syntax_highlighter } = config
-- const { enable, preprocess, line_number } = prismjs
-
-if (syntax_highlighter === 'prismjs' || enable) && !preprocess
-  script.
-    (() => {
-      window.Prism = window.Prism || {}
-      window.Prism.manual = true
-
-      const highlightAll = () => {
-        window.Prism.highlightAll()
-      }
-
-      window.addEventListener('load', highlightAll)
-      btf.addGlobalFn('pjaxComplete', highlightAll, 'prismjs')
-      btf.addGlobalFn('encrypt', highlightAll, 'prismjs')
-    })()
-
-  script(src=url_for(prismjs_js))
-  script(src=url_for(prismjs_autoloader))
-  if (line_number)
+- const { prismjs_js, prismjs_autoloader, prismjs_lineNumber_js } = theme.asset
+- const { prismjs, syntax_highlighter } = config
+- const { enable, preprocess, line_number } = prismjs
+
+if (syntax_highlighter === 'prismjs' || enable) && !preprocess
+  script.
+    (() => {
+      window.Prism = window.Prism || {}
+      window.Prism.manual = true
+
+      const highlightAll = () => {
+        window.Prism.highlightAll()
+      }
+
+      window.addEventListener('load', highlightAll)
+      btf.addGlobalFn('pjaxComplete', highlightAll, 'prismjs')
+      btf.addGlobalFn('encrypt', highlightAll, 'prismjs')
+    })()
+
+  script(src=url_for(prismjs_js))
+  script(src=url_for(prismjs_autoloader))
+  if (line_number)
     script(src=url_for(prismjs_lineNumber_js))
\ No newline at end of file
diff --git a/layout/includes/third-party/search/algolia.pug b/layout/includes/third-party/search/algolia.pug
index 4ef6001..c0dd215 100644
--- a/layout/includes/third-party/search/algolia.pug
+++ b/layout/includes/third-party/search/algolia.pug
@@ -1,22 +1,22 @@
-#algolia-search
-  .search-dialog
-    nav.search-nav
-      span.search-dialog-title= _p('search.title')
-      button.search-close-button
-        i.fas.fa-times
-
-    .search-wrap
-      #algolia-search-input
-      hr
-      #algolia-search-results
-        #algolia-hits
-        #algolia-pagination
-        #algolia-info
-          .algolia-stats
-          .algolia-poweredBy
-
-  #search-mask
-
-  script(src=url_for(theme.asset.algolia_search))
-  script(src=url_for(theme.asset.instantsearch))
+#algolia-search
+  .search-dialog
+    nav.search-nav
+      span.search-dialog-title= _p('search.title')
+      button.search-close-button
+        i.fas.fa-times
+
+    .search-wrap
+      #algolia-search-input
+      hr
+      #algolia-search-results
+        #algolia-hits
+        #algolia-pagination
+        #algolia-info
+          .algolia-stats
+          .algolia-poweredBy
+
+  #search-mask
+
+  script(src=url_for(theme.asset.algolia_search))
+  script(src=url_for(theme.asset.instantsearch))
   script(src=url_for(theme.asset.algolia_js))
\ No newline at end of file
diff --git a/layout/includes/third-party/search/docsearch.pug b/layout/includes/third-party/search/docsearch.pug
index b8e3140..bc23afa 100644
--- a/layout/includes/third-party/search/docsearch.pug
+++ b/layout/includes/third-party/search/docsearch.pug
@@ -1,29 +1,29 @@
-- const { placeholder, docsearch: { appId, apiKey, indexName, option } } = theme.search
-
-.docsearch-wrap
-  #docsearch(style="display:none")
-  link(rel="stylesheet" href=url_for(theme.asset.docsearch_css))
-  script(src=url_for(theme.asset.docsearch_js))
-  script.
-    (() => {
-      docsearch(Object.assign({
-        appId: '!{appId}',
-        apiKey: '!{apiKey}',
-        indexName: '!{indexName}',
-        container: '#docsearch',
-        placeholder: '!{ placeholder || _p("search.input_placeholder")}',
-      }, !{JSON.stringify(option)}))
-
-      const handleClick = () => {
-        document.querySelector('.DocSearch-Button').click()
-      }
-
-      const searchClickFn = () => {
-        btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', handleClick)
-      }
-
-      searchClickFn()
-      window.addEventListener('pjax:complete', searchClickFn)
-    })()
-
-
+- const { placeholder, docsearch: { appId, apiKey, indexName, option } } = theme.search
+
+.docsearch-wrap
+  #docsearch(style="display:none")
+  link(rel="stylesheet" href=url_for(theme.asset.docsearch_css))
+  script(src=url_for(theme.asset.docsearch_js))
+  script.
+    (() => {
+      docsearch(Object.assign({
+        appId: '!{appId}',
+        apiKey: '!{apiKey}',
+        indexName: '!{indexName}',
+        container: '#docsearch',
+        placeholder: '!{ placeholder || _p("search.input_placeholder")}',
+      }, !{JSON.stringify(option)}))
+
+      const handleClick = () => {
+        document.querySelector('.DocSearch-Button').click()
+      }
+
+      const searchClickFn = () => {
+        btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', handleClick)
+      }
+
+      searchClickFn()
+      window.addEventListener('pjax:complete', searchClickFn)
+    })()
+
+
diff --git a/layout/includes/third-party/search/index.pug b/layout/includes/third-party/search/index.pug
index a9d0c69..f96f4f8 100644
--- a/layout/includes/third-party/search/index.pug
+++ b/layout/includes/third-party/search/index.pug
@@ -1,7 +1,7 @@
-case theme.search.use
-  when 'algolia_search'
-    include ./algolia.pug
-  when 'local_search'
-    include ./local-search.pug
-  when 'docsearch'
+case theme.search.use
+  when 'algolia_search'
+    include ./algolia.pug
+  when 'local_search'
+    include ./local-search.pug
+  when 'docsearch'
     include ./docsearch.pug
\ No newline at end of file
diff --git a/layout/includes/third-party/search/local-search.pug b/layout/includes/third-party/search/local-search.pug
index e459a94..6c28dfd 100644
--- a/layout/includes/third-party/search/local-search.pug
+++ b/layout/includes/third-party/search/local-search.pug
@@ -1,22 +1,22 @@
-#local-search
-  .search-dialog
-    nav.search-nav
-      span.search-dialog-title= _p('search.title')
-      span#loading-status
-      button.search-close-button
-        i.fas.fa-times
-
-    #loading-database.text-center
-      i.fas.fa-spinner.fa-pulse
-      span= '  ' + _p("search.load_data")
-
-    .search-wrap
-      #local-search-input
-        .local-search-box
-          input(placeholder=theme.search.placeholder || _p("search.input_placeholder") type="text").local-search-box--input
-      hr
-      #local-search-results
-      #local-search-stats-wrap
-  #search-mask
-
+#local-search
+  .search-dialog
+    nav.search-nav
+      span.search-dialog-title= _p('search.title')
+      span#loading-status
+      button.search-close-button
+        i.fas.fa-times
+
+    #loading-database.text-center
+      i.fas.fa-spinner.fa-pulse
+      span= '  ' + _p("search.load_data")
+
+    .search-wrap
+      #local-search-input
+        .local-search-box
+          input(placeholder=theme.search.placeholder || _p("search.input_placeholder") type="text").local-search-box--input
+      hr
+      #local-search-results
+      #local-search-stats-wrap
+  #search-mask
+
   script(src=url_for(theme.asset.local_search))
\ No newline at end of file
diff --git a/layout/includes/third-party/share/addtoany.pug b/layout/includes/third-party/share/addtoany.pug
index d42f3be..e6633cb 100644
--- a/layout/includes/third-party/share/addtoany.pug
+++ b/layout/includes/third-party/share/addtoany.pug
@@ -1,10 +1,10 @@
-.addtoany
-  .a2a_kit.a2a_kit_size_32.a2a_default_style
-    - let addtoanyItem = theme.addtoany.item.split(',')
-    each name in addtoanyItem
-      a(class="a2a_button_" + name)
-
-    a.a2a_dd(href="https://www.addtoany.com/share")
-script(async src='https://static.addtoany.com/menu/page.js')
-
-
+.addtoany
+  .a2a_kit.a2a_kit_size_32.a2a_default_style
+    - let addtoanyItem = theme.addtoany.item.split(',')
+    each name in addtoanyItem
+      a(class="a2a_button_" + name)
+
+    a.a2a_dd(href="https://www.addtoany.com/share")
+script(async src='https://static.addtoany.com/menu/page.js')
+
+
diff --git a/layout/includes/third-party/share/index.pug b/layout/includes/third-party/share/index.pug
index 447c589..c385bac 100644
--- a/layout/includes/third-party/share/index.pug
+++ b/layout/includes/third-party/share/index.pug
@@ -1,9 +1,9 @@
-- const { use } = theme.share
-
-if use
-  .post-share
-    case use
-      when 'addtoany'
-        !=partial('includes/third-party/share/addtoany', {}, {cache: true})
-      when 'sharejs'
+- const { use } = theme.share
+
+if use
+  .post-share
+    case use
+      when 'addtoany'
+        !=partial('includes/third-party/share/addtoany', {}, {cache: true})
+      when 'sharejs'
         include ./share-js.pug
\ No newline at end of file
diff --git a/layout/includes/third-party/share/share-js.pug b/layout/includes/third-party/share/share-js.pug
index 50d5528..403ccfe 100644
--- a/layout/includes/third-party/share/share-js.pug
+++ b/layout/includes/third-party/share/share-js.pug
@@ -1,4 +1,4 @@
-- const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
-.social-share(data-image=url_for(coverVal) data-sites= theme.share.sharejs.sites)
-link(rel='stylesheet' href=url_for(theme.asset.sharejs_css) media="print" onload="this.media='all'")
+- const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
+.social-share(data-image=url_for(coverVal) data-sites= theme.share.sharejs.sites)
+link(rel='stylesheet' href=url_for(theme.asset.sharejs_css) media="print" onload="this.media='all'")
 script(src=url_for(theme.asset.sharejs) defer)
\ No newline at end of file
diff --git a/layout/includes/third-party/subtitle.pug b/layout/includes/third-party/subtitle.pug
index 4689340..3969604 100644
--- a/layout/includes/third-party/subtitle.pug
+++ b/layout/includes/third-party/subtitle.pug
@@ -1,93 +1,93 @@
-- const { effect,source,sub,typed_option } = theme.subtitle
-- let subContent = sub || new Array()
-
-script.
-  window.typedJSFn = {
-    init: str => {
-      window.typed = new Typed('#subtitle', Object.assign({
-        strings: str,
-        startDelay: 300,
-        typeSpeed: 150,
-        loop: true,
-        backSpeed: 50,
-      }, !{JSON.stringify(typed_option)}))
-    },
-    run: subtitleType => {
-      if (!{effect}) {
-        if (typeof Typed === 'function') {
-          subtitleType()
-        } else {
-          btf.getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
-        }
-      } else {
-        subtitleType()
-      }
-    }
-  }
-  btf.addGlobalFn('pjaxSendOnce', () => { typed.destroy() }, 'typedDestroy')
-
-case source
-  when 1
-    script.
-      function subtitleType () {
-        fetch('https://v1.hitokoto.cn')
-          .then(response => response.json())
-          .then(data => {
-            if (!{effect}) {
-              const from = '出自 ' + data.from
-              const sub = !{JSON.stringify(subContent)}
-              sub.unshift(data.hitokoto, from)
-              typedJSFn.init(sub)
-            } else {
-              document.getElementById('subtitle').textContent = data.hitokoto
-            }
-          })
-      }
-      typedJSFn.run(subtitleType)
-
-  when 2
-    script.
-      function subtitleType () {
-        btf.getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
-          const con = str[0]
-          if (!{effect}) {
-            const from = '出自 ' + str[1]
-            const sub = !{JSON.stringify(subContent)}
-            sub.unshift(con, from)
-            typedJSFn.init(sub)
-          } else {
-            document.getElementById('subtitle').textContent = con
-          }
-        })
-      }
-      typedJSFn.run(subtitleType)
-
-  when 3
-    script.
-      function subtitleType () {
-        btf.getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
-          jinrishici.load(result =>{
-            if (!{effect}) {
-              const sub = !{JSON.stringify(subContent)}
-              const content = result.data.content
-              sub.unshift(content)
-              typedJSFn.init(sub)
-            } else {
-              document.getElementById('subtitle').textContent = result.data.content
-            }
-          })
-        })
-      }
-      typedJSFn.run(subtitleType)
-
-  default
-    - subContent = subContent.length ? subContent : new Array(config.subtitle)
-    script.
-      function subtitleType () {
-        if (!{effect}) {
-          typedJSFn.init(!{JSON.stringify(subContent)})
-        } else {
-          document.getElementById("subtitle").textContent = !{JSON.stringify(subContent[0])}
-        }
-      }
+- const { effect,source,sub,typed_option } = theme.subtitle
+- let subContent = sub || new Array()
+
+script.
+  window.typedJSFn = {
+    init: str => {
+      window.typed = new Typed('#subtitle', Object.assign({
+        strings: str,
+        startDelay: 300,
+        typeSpeed: 150,
+        loop: true,
+        backSpeed: 50,
+      }, !{JSON.stringify(typed_option)}))
+    },
+    run: subtitleType => {
+      if (!{effect}) {
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          btf.getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
+        }
+      } else {
+        subtitleType()
+      }
+    }
+  }
+  btf.addGlobalFn('pjaxSendOnce', () => { typed.destroy() }, 'typedDestroy')
+
+case source
+  when 1
+    script.
+      function subtitleType () {
+        fetch('https://v1.hitokoto.cn')
+          .then(response => response.json())
+          .then(data => {
+            if (!{effect}) {
+              const from = '出自 ' + data.from
+              const sub = !{JSON.stringify(subContent)}
+              sub.unshift(data.hitokoto, from)
+              typedJSFn.init(sub)
+            } else {
+              document.getElementById('subtitle').textContent = data.hitokoto
+            }
+          })
+      }
+      typedJSFn.run(subtitleType)
+
+  when 2
+    script.
+      function subtitleType () {
+        btf.getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
+          const con = str[0]
+          if (!{effect}) {
+            const from = '出自 ' + str[1]
+            const sub = !{JSON.stringify(subContent)}
+            sub.unshift(con, from)
+            typedJSFn.init(sub)
+          } else {
+            document.getElementById('subtitle').textContent = con
+          }
+        })
+      }
+      typedJSFn.run(subtitleType)
+
+  when 3
+    script.
+      function subtitleType () {
+        btf.getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
+          jinrishici.load(result =>{
+            if (!{effect}) {
+              const sub = !{JSON.stringify(subContent)}
+              const content = result.data.content
+              sub.unshift(content)
+              typedJSFn.init(sub)
+            } else {
+              document.getElementById('subtitle').textContent = result.data.content
+            }
+          })
+        })
+      }
+      typedJSFn.run(subtitleType)
+
+  default
+    - subContent = subContent.length ? subContent : new Array(config.subtitle)
+    script.
+      function subtitleType () {
+        if (!{effect}) {
+          typedJSFn.init(!{JSON.stringify(subContent)})
+        } else {
+          document.getElementById("subtitle").textContent = !{JSON.stringify(subContent[0])}
+        }
+      }
       typedJSFn.run(subtitleType)
\ No newline at end of file
diff --git a/layout/includes/third-party/umami_analytics.pug b/layout/includes/third-party/umami_analytics.pug
index 3534c20..7487425 100644
--- a/layout/includes/third-party/umami_analytics.pug
+++ b/layout/includes/third-party/umami_analytics.pug
@@ -1,65 +1,65 @@
-- let { serverURL, website_id, option, UV_PV } = theme.umami_analytics
-- const isServerURL = !!serverURL
-- const baseURL = serverURL ? serverURL.replace(/\/$/, '') : 'https://cloud.umami.is'
-- const apiUrl = serverURL ? serverURL.replace(/\/$/, '') + '/api' : 'https://api.umami.is/v1'
-
-script.
-  (() => {
-    const option = !{JSON.stringify(option)}
-    const config = !{JSON.stringify(UV_PV)}
-
-    const runTrack = () => {
-      umami.track(props => ({ ...props, url: window.location.pathname, title: GLOBAL_CONFIG_SITE.title }))
-    }
-
-    const loadUmamiJS = () => {
-      btf.getScript('!{baseURL}/script.js', {
-        'data-website-id': '!{website_id}',
-        'data-auto-track': 'false',
-        ...option
-      }).then(runTrack)
-    }
-
-    const getData = async (isPost) => {
-      const now = Date.now()
-      const keyUrl = isPost ? `&url=${window.location.pathname}` : ''
-      const headerList = { 'Accept': 'application/json' }
-      if (!{isServerURL}) headerList['Authorization'] = `Bearer ${config.token}`
-      else headerList['x-umami-api-key'] = config.token
-      const res = await fetch(`!{apiUrl}/websites/!{website_id}/stats?startAt=0000000000&endAt=${now}${keyUrl}`, {
-        method: "GET",
-        headers: headerList
-      })
-      return await res.json()
-    }
-
-    const insertData = async () => {
-      try {
-        if (GLOBAL_CONFIG_SITE.pageType === 'post' && config.page_pv) {
-          const pagePV = document.getElementById('umamiPV')
-          if (pagePV) {
-            const data = await getData(true)
-            pagePV.textContent = data.pageviews.value
-          }
-        } else {
-          const data = (config.site_uv || config.site_pv) && await getData()
-          if (config.site_uv) {
-            const siteUV = document.getElementById('umami-site-uv')
-            if (siteUV) siteUV.textContent = data.visitors.value
-          }
-          if (config.site_pv) {
-            const sitePV = document.getElementById('umami-site-pv')
-            if (sitePV) sitePV.textContent = data.pageviews.value
-          }
-        }
-      } catch (e) {
-        console.error('Failed to load Umami Analytics:', e)
-      }
-    }
-
-    btf.addGlobalFn('pjaxComplete', runTrack, 'umami_analytics_run_track')
-    btf.addGlobalFn('pjaxComplete', insertData, 'umami_analytics_insert')
-
-    loadUmamiJS()
-    insertData()
+- let { serverURL, website_id, option, UV_PV } = theme.umami_analytics
+- const isServerURL = !!serverURL
+- const baseURL = serverURL ? serverURL.replace(/\/$/, '') : 'https://cloud.umami.is'
+- const apiUrl = serverURL ? serverURL.replace(/\/$/, '') + '/api' : 'https://api.umami.is/v1'
+
+script.
+  (() => {
+    const option = !{JSON.stringify(option)}
+    const config = !{JSON.stringify(UV_PV)}
+
+    const runTrack = () => {
+      umami.track(props => ({ ...props, url: window.location.pathname, title: GLOBAL_CONFIG_SITE.title }))
+    }
+
+    const loadUmamiJS = () => {
+      btf.getScript('!{baseURL}/script.js', {
+        'data-website-id': '!{website_id}',
+        'data-auto-track': 'false',
+        ...option
+      }).then(runTrack)
+    }
+
+    const getData = async (isPost) => {
+      const now = Date.now()
+      const keyUrl = isPost ? `&url=${window.location.pathname}` : ''
+      const headerList = { 'Accept': 'application/json' }
+      if (!{isServerURL}) headerList['Authorization'] = `Bearer ${config.token}`
+      else headerList['x-umami-api-key'] = config.token
+      const res = await fetch(`!{apiUrl}/websites/!{website_id}/stats?startAt=0000000000&endAt=${now}${keyUrl}`, {
+        method: "GET",
+        headers: headerList
+      })
+      return await res.json()
+    }
+
+    const insertData = async () => {
+      try {
+        if (GLOBAL_CONFIG_SITE.pageType === 'post' && config.page_pv) {
+          const pagePV = document.getElementById('umamiPV')
+          if (pagePV) {
+            const data = await getData(true)
+            pagePV.textContent = data.pageviews.value
+          }
+        } else {
+          const data = (config.site_uv || config.site_pv) && await getData()
+          if (config.site_uv) {
+            const siteUV = document.getElementById('umami-site-uv')
+            if (siteUV) siteUV.textContent = data.visitors.value
+          }
+          if (config.site_pv) {
+            const sitePV = document.getElementById('umami-site-pv')
+            if (sitePV) sitePV.textContent = data.pageviews.value
+          }
+        }
+      } catch (e) {
+        console.error('Failed to load Umami Analytics:', e)
+      }
+    }
+
+    btf.addGlobalFn('pjaxComplete', runTrack, 'umami_analytics_run_track')
+    btf.addGlobalFn('pjaxComplete', insertData, 'umami_analytics_insert')
+
+    loadUmamiJS()
+    insertData()
   })()
\ No newline at end of file
diff --git a/layout/includes/widget/card_ad.pug b/layout/includes/widget/card_ad.pug
index b8e00fd..d088f0e 100644
--- a/layout/includes/widget/card_ad.pug
+++ b/layout/includes/widget/card_ad.pug
@@ -1,3 +1,3 @@
-if theme.ad && theme.ad.aside
-  .card-widget.ads-wrap
-    != theme.ad.aside
+if theme.ad && theme.ad.aside
+  .card-widget.ads-wrap
+    != theme.ad.aside
diff --git a/layout/includes/widget/card_announcement.pug b/layout/includes/widget/card_announcement.pug
index 9e63627..a96d06d 100644
--- a/layout/includes/widget/card_announcement.pug
+++ b/layout/includes/widget/card_announcement.pug
@@ -1,6 +1,6 @@
-if theme.aside.card_announcement.enable
-  .card-widget.card-announcement
-    .item-headline
-      i.fas.fa-bullhorn.fa-shake
-      span= _p('aside.card_announcement')
+if theme.aside.card_announcement.enable
+  .card-widget.card-announcement
+    .item-headline
+      i.fas.fa-bullhorn.fa-shake
+      span= _p('aside.card_announcement')
     .announcement_content!= theme.aside.card_announcement.content
\ No newline at end of file
diff --git a/layout/includes/widget/card_archives.pug b/layout/includes/widget/card_archives.pug
index bb0e78e..0fcd17a 100644
--- a/layout/includes/widget/card_archives.pug
+++ b/layout/includes/widget/card_archives.pug
@@ -1,7 +1,7 @@
-if theme.aside.card_archives.enable
-  .card-widget.card-archives
-    - let type = theme.aside.card_archives.type || 'monthly'
-    - let format = theme.aside.card_archives.format || 'MMMM YYYY'
-    - let order = theme.aside.card_archives.order || -1
-    - let limit = theme.aside.card_archives.limit === 0 ? 0 : theme.aside.card_archives.limit || 8
-    != aside_archives({ type:type, format: format, order: order, limit: limit })
+if theme.aside.card_archives.enable
+  .card-widget.card-archives
+    - let type = theme.aside.card_archives.type || 'monthly'
+    - let format = theme.aside.card_archives.format || 'MMMM YYYY'
+    - let order = theme.aside.card_archives.order || -1
+    - let limit = theme.aside.card_archives.limit === 0 ? 0 : theme.aside.card_archives.limit || 8
+    != aside_archives({ type:type, format: format, order: order, limit: limit })
diff --git a/layout/includes/widget/card_author.pug b/layout/includes/widget/card_author.pug
index 9f7e687..7a30df7 100644
--- a/layout/includes/widget/card_author.pug
+++ b/layout/includes/widget/card_author.pug
@@ -1,26 +1,26 @@
-if theme.aside.card_author.enable
-  .card-widget.card-info.text-center
-    .avatar-img
-      img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
-    .author-info-name= config.author
-    .author-info-description!= theme.aside.card_author.description || config.description
-
-    .site-data
-      a(href=url_for(config.archive_dir) + '/')
-        .headline= _p('aside.articles')
-        .length-num= site.posts.length
-      a(href=url_for(config.tag_dir) + '/')
-        .headline= _p('aside.tags')
-        .length-num= site.tags.length
-      a(href=url_for(config.category_dir) + '/')
-        .headline= _p('aside.categories')
-        .length-num= site.categories.length
-
-    if theme.aside.card_author.button.enable
-      a#card-info-btn(href=theme.aside.card_author.button.link)
-        i(class=theme.aside.card_author.button.icon)
-        span=theme.aside.card_author.button.text
-
-    if(theme.social)
-      .card-info-social-icons
-        !=partial('includes/header/social', {}, {cache: true})
+if theme.aside.card_author.enable
+  .card-widget.card-info.text-center
+    .avatar-img
+      img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
+    .author-info-name= config.author
+    .author-info-description!= theme.aside.card_author.description || config.description
+
+    .site-data
+      a(href=url_for(config.archive_dir) + '/')
+        .headline= _p('aside.articles')
+        .length-num= site.posts.length
+      a(href=url_for(config.tag_dir) + '/')
+        .headline= _p('aside.tags')
+        .length-num= site.tags.length
+      a(href=url_for(config.category_dir) + '/')
+        .headline= _p('aside.categories')
+        .length-num= site.categories.length
+
+    if theme.aside.card_author.button.enable
+      a#card-info-btn(href=theme.aside.card_author.button.link)
+        i(class=theme.aside.card_author.button.icon)
+        span=theme.aside.card_author.button.text
+
+    if(theme.social)
+      .card-info-social-icons
+        !=partial('includes/header/social', {}, {cache: true})
diff --git a/layout/includes/widget/card_bottom_self.pug b/layout/includes/widget/card_bottom_self.pug
index e32907d..31ce298 100644
--- a/layout/includes/widget/card_bottom_self.pug
+++ b/layout/includes/widget/card_bottom_self.pug
@@ -1,9 +1,9 @@
-if site.data.widget && site.data.widget.bottom
-  each item in site.data.widget.bottom
-    .card-widget(class=item.class_name id=item.id_name style=item.order ? `order: ${item.order}` : '')
-      .item-headline
-        i(class=item.icon)
-        span=item.name
-      .item-content
-        !=item.html
-
+if site.data.widget && site.data.widget.bottom
+  each item in site.data.widget.bottom
+    .card-widget(class=item.class_name id=item.id_name style=item.order ? `order: ${item.order}` : '')
+      .item-headline
+        i(class=item.icon)
+        span=item.name
+      .item-content
+        !=item.html
+
diff --git a/layout/includes/widget/card_categories.pug b/layout/includes/widget/card_categories.pug
index 529ea55..770d035 100644
--- a/layout/includes/widget/card_categories.pug
+++ b/layout/includes/widget/card_categories.pug
@@ -1,4 +1,4 @@
-if theme.aside.card_categories.enable
-  if site.categories.length
-    .card-widget.card-categories
-      !=aside_categories({ limit: theme.aside.card_categories.limit === 0 ? 0 : theme.aside.card_categories.limit || 8 , expand: theme.aside.card_categories.expand })
+if theme.aside.card_categories.enable
+  if site.categories.length
+    .card-widget.card-categories
+      !=aside_categories({ limit: theme.aside.card_categories.limit === 0 ? 0 : theme.aside.card_categories.limit || 8 , expand: theme.aside.card_categories.expand })
diff --git a/layout/includes/widget/card_newest_comment.pug b/layout/includes/widget/card_newest_comment.pug
index 3a0bb18..6f7d5d2 100644
--- a/layout/includes/widget/card_newest_comment.pug
+++ b/layout/includes/widget/card_newest_comment.pug
@@ -1,7 +1,7 @@
-if theme.aside.card_newest_comments.enable && theme.comments.use && !['Livere','Facebook Comments','Giscus'].includes(theme.comments.use[0])
-  .card-widget#card-newest-comments
-    .item-headline
-      i.fas.fa-comment-dots
-      span= _p('aside.card_newest_comments.headline')
-    .aside-list
-      span= _p('aside.card_newest_comments.loading_text')
+if theme.aside.card_newest_comments.enable && theme.comments.use && !['Livere','Facebook Comments','Giscus'].includes(theme.comments.use[0])
+  .card-widget#card-newest-comments
+    .item-headline
+      i.fas.fa-comment-dots
+      span= _p('aside.card_newest_comments.headline')
+    .aside-list
+      span= _p('aside.card_newest_comments.loading_text')
diff --git a/layout/includes/widget/card_post_series.pug b/layout/includes/widget/card_post_series.pug
index 38f857b..06b82d6 100644
--- a/layout/includes/widget/card_post_series.pug
+++ b/layout/includes/widget/card_post_series.pug
@@ -1,21 +1,21 @@
-if theme.aside.card_post_series.enable
-  - const array = fragment_cache('seriesArr', groupPosts)
-  .card-widget.card-post-series
-    .item-headline
-      i.fa-solid.fa-layer-group
-      span= theme.aside.card_post_series.series_title ? page.series : _p('aside.card_post_series')
-    .aside-list
-      each item in array[page.series]
-        - const { path, title = _p('no_title'), cover, cover_type, date:dateA } = item
-        - let link = url_for(path)
-        - let no_cover = cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
-        .aside-list-item(class=no_cover)
-          if cover && theme.cover.aside_enable
-            a.thumbnail(href=link title=title)
-              if cover_type === 'img'
-                img(src=url_for(cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
-              else
-                div(style=`background: ${cover}`)
-          .content
-            a.title(href=link title=title)= title
-            time(datetime=date_xml(dateA) title=_p('post.created') + ' ' + full_date(dateA)) #[=date(dateA, config.date_format)]
+if theme.aside.card_post_series.enable
+  - const array = fragment_cache('seriesArr', groupPosts)
+  .card-widget.card-post-series
+    .item-headline
+      i.fa-solid.fa-layer-group
+      span= theme.aside.card_post_series.series_title ? page.series : _p('aside.card_post_series')
+    .aside-list
+      each item in array[page.series]
+        - const { path, title = _p('no_title'), cover, cover_type, date:dateA } = item
+        - let link = url_for(path)
+        - let no_cover = cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
+        .aside-list-item(class=no_cover)
+          if cover && theme.cover.aside_enable
+            a.thumbnail(href=link title=title)
+              if cover_type === 'img'
+                img(src=url_for(cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+              else
+                div(style=`background: ${cover}`)
+          .content
+            a.title(href=link title=title)= title
+            time(datetime=date_xml(dateA) title=_p('post.created') + ' ' + full_date(dateA)) #[=date(dateA, config.date_format)]
diff --git a/layout/includes/widget/card_post_toc.pug b/layout/includes/widget/card_post_toc.pug
index cd30d50..93f350f 100644
--- a/layout/includes/widget/card_post_toc.pug
+++ b/layout/includes/widget/card_post_toc.pug
@@ -1,14 +1,14 @@
-- let tocNumber = typeof page.toc_number === 'boolean' ? page.toc_number : theme.toc.number
-- let tocExpand = typeof page.toc_expand === 'boolean' ? page.toc_expand : theme.toc.expand
-- let tocExpandClass = tocExpand ? 'is-expand' : ''
-
-#card-toc.card-widget
-  .item-headline
-    i.fas.fa-stream
-    span= _p('aside.card_toc')
-    span.toc-percentage
-
-  if (page.encrypt == true)
-    .toc-content.toc-div-class(class=tocExpandClass style="display:none")!=toc(page.origin, {list_number: tocNumber})
-  else
-    .toc-content(class=tocExpandClass)!=toc(page.content, {list_number: tocNumber})
+- let tocNumber = typeof page.toc_number === 'boolean' ? page.toc_number : theme.toc.number
+- let tocExpand = typeof page.toc_expand === 'boolean' ? page.toc_expand : theme.toc.expand
+- let tocExpandClass = tocExpand ? 'is-expand' : ''
+
+#card-toc.card-widget
+  .item-headline
+    i.fas.fa-stream
+    span= _p('aside.card_toc')
+    span.toc-percentage
+
+  if (page.encrypt == true)
+    .toc-content.toc-div-class(class=tocExpandClass style="display:none")!=toc(page.origin, {list_number: tocNumber})
+  else
+    .toc-content(class=tocExpandClass)!=toc(page.content, {list_number: tocNumber})
diff --git a/layout/includes/widget/card_recent_post.pug b/layout/includes/widget/card_recent_post.pug
index dddf0fc..a8c4647 100644
--- a/layout/includes/widget/card_recent_post.pug
+++ b/layout/includes/widget/card_recent_post.pug
@@ -1,27 +1,27 @@
-if theme.aside.card_recent_post.enable
-  .card-widget.card-recent-post
-    .item-headline
-      i.fas.fa-history
-      span= _p('aside.card_recent_post')
-    .aside-list
-      - let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
-      - let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
-      - site.posts.sort(sort, -1).limit(postLimit).each(function(article){
-        - let link = article.link || article.path
-        - let title = article.title || _p('no_title')
-        - let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
-        - let post_cover = article.cover
-        .aside-list-item(class=no_cover)
-          if post_cover && theme.cover.aside_enable
-            a.thumbnail(href=url_for(link) title=title)
-              if article.cover_type === 'img'
-                img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
-              else
-                div(style=`background: ${post_cover}`)
-          .content
-            a.title(href=url_for(link) title=title)= title
-            if theme.aside.card_recent_post.sort === 'updated'
-              time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]
-            else
-              time(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date)) #[=date(article.date, config.date_format)]
+if theme.aside.card_recent_post.enable
+  .card-widget.card-recent-post
+    .item-headline
+      i.fas.fa-history
+      span= _p('aside.card_recent_post')
+    .aside-list
+      - let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
+      - let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
+      - site.posts.sort(sort, -1).limit(postLimit).each(function(article){
+        - let link = article.link || article.path
+        - let title = article.title || _p('no_title')
+        - let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
+        - let post_cover = article.cover
+        .aside-list-item(class=no_cover)
+          if post_cover && theme.cover.aside_enable
+            a.thumbnail(href=url_for(link) title=title)
+              if article.cover_type === 'img'
+                img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+              else
+                div(style=`background: ${post_cover}`)
+          .content
+            a.title(href=url_for(link) title=title)= title
+            if theme.aside.card_recent_post.sort === 'updated'
+              time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]
+            else
+              time(datetime=date_xml(article.date) title=_p('post.created') + ' ' + full_date(article.date)) #[=date(article.date, config.date_format)]
       - })
\ No newline at end of file
diff --git a/layout/includes/widget/card_tags.pug b/layout/includes/widget/card_tags.pug
index 49296b7..b0aaa97 100644
--- a/layout/includes/widget/card_tags.pug
+++ b/layout/includes/widget/card_tags.pug
@@ -1,14 +1,14 @@
-if theme.aside.card_tags.enable
-  if site.tags.length
-    .card-widget.card-tags
-      .item-headline
-        i.fas.fa-tags
-        span= _p('aside.card_tags')
-
-      - let { limit, orderby, order } = theme.aside.card_tags
-      - limit = limit === 0 ? 0 : limit || 40
-
-      if theme.aside.card_tags.color
-        .card-tag-cloud!= cloudTags({source: site.tags, orderby: orderby, order: order, minfontsize: 1.15, maxfontsize: 1.45, limit: limit, unit: 'em'})
-      else
-        .card-tag-cloud!= tagcloud({orderby: orderby, order: order, min_font: 1.1, max_font: 1.5, amount: limit , color: true, start_color: '#999', end_color: '#99a9bf', unit: 'em'})
+if theme.aside.card_tags.enable
+  if site.tags.length
+    .card-widget.card-tags
+      .item-headline
+        i.fas.fa-tags
+        span= _p('aside.card_tags')
+
+      - let { limit, orderby, order } = theme.aside.card_tags
+      - limit = limit === 0 ? 0 : limit || 40
+
+      if theme.aside.card_tags.color
+        .card-tag-cloud!= cloudTags({source: site.tags, orderby: orderby, order: order, minfontsize: 1.15, maxfontsize: 1.45, limit: limit, unit: 'em'})
+      else
+        .card-tag-cloud!= tagcloud({orderby: orderby, order: order, min_font: 1.1, max_font: 1.5, amount: limit , color: true, start_color: '#999', end_color: '#99a9bf', unit: 'em'})
diff --git a/layout/includes/widget/card_top_self.pug b/layout/includes/widget/card_top_self.pug
index 6e81059..3cbfca2 100644
--- a/layout/includes/widget/card_top_self.pug
+++ b/layout/includes/widget/card_top_self.pug
@@ -1,8 +1,8 @@
-if site.data.widget && site.data.widget.top
-  each item in site.data.widget.top
-    .card-widget(class=item.class_name id=item.id_name)
-      .item-headline
-        i(class=item.icon)
-        span=item.name
-      .item-content
+if site.data.widget && site.data.widget.top
+  each item in site.data.widget.top
+    .card-widget(class=item.class_name id=item.id_name)
+      .item-headline
+        i(class=item.icon)
+        span=item.name
+      .item-content
         !=item.html
\ No newline at end of file
diff --git a/layout/includes/widget/card_webinfo.pug b/layout/includes/widget/card_webinfo.pug
index 7ea4d98..6e481e4 100644
--- a/layout/includes/widget/card_webinfo.pug
+++ b/layout/includes/widget/card_webinfo.pug
@@ -1,44 +1,44 @@
-if theme.aside.card_webinfo.enable
-  .card-widget.card-webinfo
-    .item-headline
-      i.fas.fa-chart-line
-      span= _p('aside.card_webinfo.headline')
-    .webinfo
-      if theme.aside.card_webinfo.post_count
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.article_name')} :`
-          .item-count= site.posts.length
-      if theme.aside.card_webinfo.runtime_date
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.runtime.name')} :`
-          .item-count#runtimeshow(data-publishDate=date_xml(theme.aside.card_webinfo.runtime_date))
-            i.fa-solid.fa-spinner.fa-spin
-      if theme.wordcount.enable && theme.wordcount.total_wordcount
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.site_wordcount')} :`
-          .item-count= totalcount(site)
-      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_uv
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
-          .item-count#umami-site-uv
-            i.fa-solid.fa-spinner.fa-spin
-      else if theme.busuanzi.site_uv
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
-          .item-count#busuanzi_value_site_uv
-            i.fa-solid.fa-spinner.fa-spin
-      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_pv
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
-          .item-count#umami-site-pv
-            i.fa-solid.fa-spinner.fa-spin
-      else if theme.busuanzi.site_pv
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
-          .item-count#busuanzi_value_site_pv
-            i.fa-solid.fa-spinner.fa-spin
-      if theme.aside.card_webinfo.last_push_date
-        .webinfo-item
-          .item-name= `${_p('aside.card_webinfo.last_push_date.name')} :`
-          .item-count#last-push-date(data-lastPushDate=date_xml(Date.now()))
+if theme.aside.card_webinfo.enable
+  .card-widget.card-webinfo
+    .item-headline
+      i.fas.fa-chart-line
+      span= _p('aside.card_webinfo.headline')
+    .webinfo
+      if theme.aside.card_webinfo.post_count
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.article_name')} :`
+          .item-count= site.posts.length
+      if theme.aside.card_webinfo.runtime_date
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.runtime.name')} :`
+          .item-count#runtimeshow(data-publishDate=date_xml(theme.aside.card_webinfo.runtime_date))
+            i.fa-solid.fa-spinner.fa-spin
+      if theme.wordcount.enable && theme.wordcount.total_wordcount
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.site_wordcount')} :`
+          .item-count= totalcount(site)
+      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_uv
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
+          .item-count#umami-site-uv
+            i.fa-solid.fa-spinner.fa-spin
+      else if theme.busuanzi.site_uv
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.site_uv_name')} :`
+          .item-count#busuanzi_value_site_uv
+            i.fa-solid.fa-spinner.fa-spin
+      if theme.umami_analytics.enable && theme.umami_analytics.UV_PV.site_pv
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
+          .item-count#umami-site-pv
+            i.fa-solid.fa-spinner.fa-spin
+      else if theme.busuanzi.site_pv
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.site_pv_name')} :`
+          .item-count#busuanzi_value_site_pv
+            i.fa-solid.fa-spinner.fa-spin
+      if theme.aside.card_webinfo.last_push_date
+        .webinfo-item
+          .item-name= `${_p('aside.card_webinfo.last_push_date.name')} :`
+          .item-count#last-push-date(data-lastPushDate=date_xml(Date.now()))
             i.fa-solid.fa-spinner.fa-spin
\ No newline at end of file
diff --git a/layout/includes/widget/index.pug b/layout/includes/widget/index.pug
index b298878..d9d3d01 100644
--- a/layout/includes/widget/index.pug
+++ b/layout/includes/widget/index.pug
@@ -1,36 +1,36 @@
-#aside-content.aside-content
-  //- post
-  if globalPageType === 'post'
-    - const tocStyle = page.toc_style_simple
-    - const tocStyleVal = tocStyle === true || tocStyle === false ? tocStyle : theme.toc.style_simple
-    if showToc && tocStyleVal
-      .sticky_layout
-        include ./card_post_toc.pug
-    else
-      !=partial('includes/widget/card_author', {}, {cache: true})
-      !=partial('includes/widget/card_announcement', {}, {cache: true})
-      !=partial('includes/widget/card_top_self', {}, {cache: true})
-      .sticky_layout
-        if showToc
-          include ./card_post_toc.pug
-        if page.series
-          include ./card_post_series.pug
-        !=partial('includes/widget/card_recent_post', {}, {cache: true})
-        !=partial('includes/widget/card_ad', {}, {cache: true})
-  else
-    //- page
-    !=partial('includes/widget/card_author', {}, {cache: true})
-    !=partial('includes/widget/card_announcement', {}, {cache: true})
-    !=partial('includes/widget/card_top_self', {}, {cache: true})
-
-    .sticky_layout
-      if showToc
-        include ./card_post_toc.pug
-      !=partial('includes/widget/card_recent_post', {}, {cache: true})
-      !=partial('includes/widget/card_ad', {}, {cache: true})
-      !=partial('includes/widget/card_newest_comment', {}, {cache: true})
-      !=partial('includes/widget/card_categories', {}, {cache: true})
-      !=partial('includes/widget/card_tags', {}, {cache: true})
-      !=partial('includes/widget/card_archives', {}, {cache: true})
-      !=partial('includes/widget/card_webinfo', {}, {cache: true})
+#aside-content.aside-content
+  //- post
+  if globalPageType === 'post'
+    - const tocStyle = page.toc_style_simple
+    - const tocStyleVal = tocStyle === true || tocStyle === false ? tocStyle : theme.toc.style_simple
+    if showToc && tocStyleVal
+      .sticky_layout
+        include ./card_post_toc.pug
+    else
+      !=partial('includes/widget/card_author', {}, {cache: true})
+      !=partial('includes/widget/card_announcement', {}, {cache: true})
+      !=partial('includes/widget/card_top_self', {}, {cache: true})
+      .sticky_layout
+        if showToc
+          include ./card_post_toc.pug
+        if page.series
+          include ./card_post_series.pug
+        !=partial('includes/widget/card_recent_post', {}, {cache: true})
+        !=partial('includes/widget/card_ad', {}, {cache: true})
+  else
+    //- page
+    !=partial('includes/widget/card_author', {}, {cache: true})
+    !=partial('includes/widget/card_announcement', {}, {cache: true})
+    !=partial('includes/widget/card_top_self', {}, {cache: true})
+
+    .sticky_layout
+      if showToc
+        include ./card_post_toc.pug
+      !=partial('includes/widget/card_recent_post', {}, {cache: true})
+      !=partial('includes/widget/card_ad', {}, {cache: true})
+      !=partial('includes/widget/card_newest_comment', {}, {cache: true})
+      !=partial('includes/widget/card_categories', {}, {cache: true})
+      !=partial('includes/widget/card_tags', {}, {cache: true})
+      !=partial('includes/widget/card_archives', {}, {cache: true})
+      !=partial('includes/widget/card_webinfo', {}, {cache: true})
       !=partial('includes/widget/card_bottom_self', {}, {cache: true})
\ No newline at end of file
diff --git a/layout/index.pug b/layout/index.pug
index 7705655..94e6ec7 100644
--- a/layout/index.pug
+++ b/layout/index.pug
@@ -1,5 +1,5 @@
-extends includes/layout.pug
-
-block content
-  include ./includes/mixins/indexPostUI.pug
+extends includes/layout.pug
+
+block content
+  include ./includes/mixins/indexPostUI.pug
   +indexPostUI
\ No newline at end of file
diff --git a/layout/page.pug b/layout/page.pug
index 2374681..f980fde 100644
--- a/layout/page.pug
+++ b/layout/page.pug
@@ -1,32 +1,32 @@
-extends includes/layout.pug
-
-block content
-  - const noCardLayout = ['shuoshuo', '404'].includes(page.type) ? 'nc' : ''
-  - var commentsJsLoad = false
-
-  mixin commentLoad
-    if page.comments !== false && theme.comments.use
-      - commentsJsLoad = true
-      !=partial('includes/third-party/comments/index', {}, {cache: true})
-
-  #page(class=noCardLayout)
-    if top_img === false && page.title
-      .page-title= page.title
-
-    case page.type
-      when 'tags'
-        include includes/page/tags.pug
-        +commentLoad
-      when 'link'
-        include includes/page/flink.pug
-        +commentLoad
-      when 'categories'
-        include includes/page/categories.pug
-        +commentLoad
-      when '404'
-        include includes/page/404.pug
-      when 'shuoshuo'
-        include includes/page/shuoshuo.pug
-      default
-        include includes/page/default-page.pug
+extends includes/layout.pug
+
+block content
+  - const noCardLayout = ['shuoshuo', '404'].includes(page.type) ? 'nc' : ''
+  - var commentsJsLoad = false
+
+  mixin commentLoad
+    if page.comments !== false && theme.comments.use
+      - commentsJsLoad = true
+      !=partial('includes/third-party/comments/index', {}, {cache: true})
+
+  #page(class=noCardLayout)
+    if top_img === false && page.title
+      .page-title= page.title
+
+    case page.type
+      when 'tags'
+        include includes/page/tags.pug
+        +commentLoad
+      when 'link'
+        include includes/page/flink.pug
+        +commentLoad
+      when 'categories'
+        include includes/page/categories.pug
+        +commentLoad
+      when '404'
+        include includes/page/404.pug
+      when 'shuoshuo'
+        include includes/page/shuoshuo.pug
+      default
+        include includes/page/default-page.pug
         +commentLoad
\ No newline at end of file
diff --git a/layout/post.pug b/layout/post.pug
index 9a44282..46007fb 100644
--- a/layout/post.pug
+++ b/layout/post.pug
@@ -1,35 +1,35 @@
-extends includes/layout.pug
-
-block content
-  #post
-    if top_img === false
-      include includes/header/post-info.pug
-
-    article#article-container.container.post-content
-      if theme.noticeOutdate.enable && page.noticeOutdate !== false
-        include includes/post/outdate-notice.pug
-      else
-        !=page.content
-    include includes/post/post-copyright.pug
-    .tag_share
-      if (page.tags.length > 0 && theme.post_meta.post.tags)
-        .post-meta__tag-list
-          each item, index in page.tags.data
-            a(href=url_for(item.path)).post-meta__tags #[=item.name]
-      include includes/third-party/share/index.pug
-
-    if theme.reward.enable && theme.reward.QR_code
-      !=partial('includes/post/reward', {}, {cache: true})
-
-    //- ad
-    if theme.ad && theme.ad.post
-      .ads-wrap!=theme.ad.post
-
-    if theme.post_pagination
-      include includes/pagination.pug
-    if theme.related_post && theme.related_post.enable
-      != related_posts(page,site.posts)
-
-    if page.comments !== false && theme.comments.use
-      - var commentsJsLoad = true
-      !=partial('includes/third-party/comments/index', {}, {cache: true})
+extends includes/layout.pug
+
+block content
+  #post
+    if top_img === false
+      include includes/header/post-info.pug
+
+    article#article-container.container.post-content
+      if theme.noticeOutdate.enable && page.noticeOutdate !== false
+        include includes/post/outdate-notice.pug
+      else
+        !=page.content
+    include includes/post/post-copyright.pug
+    .tag_share
+      if (page.tags.length > 0 && theme.post_meta.post.tags)
+        .post-meta__tag-list
+          each item, index in page.tags.data
+            a(href=url_for(item.path)).post-meta__tags #[=item.name]
+      include includes/third-party/share/index.pug
+
+    if theme.reward.enable && theme.reward.QR_code
+      !=partial('includes/post/reward', {}, {cache: true})
+
+    //- ad
+    if theme.ad && theme.ad.post
+      .ads-wrap!=theme.ad.post
+
+    if theme.post_pagination
+      include includes/pagination.pug
+    if theme.related_post && theme.related_post.enable
+      != related_posts(page,site.posts)
+
+    if page.comments !== false && theme.comments.use
+      - var commentsJsLoad = true
+      !=partial('includes/third-party/comments/index', {}, {cache: true})
diff --git a/layout/tag.pug b/layout/tag.pug
index 3d4c067..1022544 100644
--- a/layout/tag.pug
+++ b/layout/tag.pug
@@ -1,12 +1,12 @@
-extends includes/layout.pug
-
-block content
-  if theme.tag_ui == 'index'
-    include ./includes/mixins/indexPostUI.pug
-    +indexPostUI
-  else
-    include ./includes/mixins/article-sort.pug
-    #tag
-      .article-sort-title= _p('page.tag') + ' - ' + page.tag
-      +articleSort(page.posts)
+extends includes/layout.pug
+
+block content
+  if theme.tag_ui == 'index'
+    include ./includes/mixins/indexPostUI.pug
+    +indexPostUI
+  else
+    include ./includes/mixins/article-sort.pug
+    #tag
+      .article-sort-title= _p('page.tag') + ' - ' + page.tag
+      +articleSort(page.posts)
       include includes/pagination.pug
\ No newline at end of file
diff --git a/package.json b/package.json
index 094a021..27543bf 100644
--- a/package.json
+++ b/package.json
@@ -1,32 +1,32 @@
-{
-  "name": "hexo-theme-butterfly",
-  "version": "5.3.2",
-  "description": "A Simple and Card UI Design theme for Hexo",
-  "main": "package.json",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "keywords": [
-    "hexo",
-    "theme",
-    "butterfly",
-    "Card UI Design",
-    "Jerry",
-    "hexo-theme-butterfly"
-  ],
-  "repository": {
-    "type" : "git",
-    "url" : "https://github.com/jerryc127/hexo-theme-butterfly.git"
-  },
-  "bugs": {
-    "url": "https://github.com/jerryc127/hexo-theme-butterfly/issues",
-    "email": "my@crazywong.com"
-  },
-  "dependencies": {
-    "hexo-renderer-stylus": "^3.0.1",
-    "hexo-renderer-pug": "^3.0.0"
-  },
-  "homepage": "https://butterfly.js.org/",
-  "author": "Jerry ",
-  "license": "Apache-2.0"
-}
+{
+  "name": "hexo-theme-butterfly",
+  "version": "5.3.3",
+  "description": "A Simple and Card UI Design theme for Hexo",
+  "main": "package.json",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "hexo",
+    "theme",
+    "butterfly",
+    "Card UI Design",
+    "Jerry",
+    "hexo-theme-butterfly"
+  ],
+  "repository": {
+    "type" : "git",
+    "url" : "https://github.com/jerryc127/hexo-theme-butterfly.git"
+  },
+  "bugs": {
+    "url": "https://github.com/jerryc127/hexo-theme-butterfly/issues",
+    "email": "my@crazywong.com"
+  },
+  "dependencies": {
+    "hexo-renderer-stylus": "^3.0.1",
+    "hexo-renderer-pug": "^3.0.0"
+  },
+  "homepage": "https://butterfly.js.org/",
+  "author": "Jerry ",
+  "license": "Apache-2.0"
+}
diff --git a/plugins.yml b/plugins.yml
index d0474e2..dd0e9d7 100644
--- a/plugins.yml
+++ b/plugins.yml
@@ -1,211 +1,211 @@
-abcjs_basic_js:
-  name: abcjs
-  file: dist/abcjs-basic-min.js
-  version: 6.4.4
-activate_power_mode:
-  name: butterfly-extsrc
-  file: dist/activate-power-mode.min.js
-  version: 1.1.4
-algolia_search:
-  name: algoliasearch
-  file: dist/lite/builds/browser.umd.js
-  version: 5.19.0
-aplayer_css:
-  name: aplayer
-  file: dist/APlayer.min.css
-  version: 1.10.1
-aplayer_js:
-  name: aplayer
-  file: dist/APlayer.min.js
-  version: 1.10.1
-artalk_css:
-  name: artalk
-  file: dist/Artalk.css
-  version: 2.9.1
-artalk_js:
-  name: artalk
-  file: dist/Artalk.js
-  version: 2.9.1
-blueimp_md5:
-  name: blueimp-md5
-  file: js/md5.min.js
-  version: 2.19.0
-canvas_fluttering_ribbon:
-  name: butterfly-extsrc
-  file: dist/canvas-fluttering-ribbon.min.js
-  version: 1.1.4
-canvas_nest:
-  name: butterfly-extsrc
-  file: dist/canvas-nest.min.js
-  version: 1.1.4
-canvas_ribbon:
-  name: butterfly-extsrc
-  file: dist/canvas-ribbon.min.js
-  version: 1.1.4
-chartjs:
-  name: chart.js
-  file: dist/chart.umd.js
-  version: 4.4.7
-clickShowText:
-  name: butterfly-extsrc
-  file: dist/click-show-text.min.js
-  version: 1.1.4
-click_heart:
-  name: butterfly-extsrc
-  file: dist/click-heart.min.js
-  version: 1.1.4
-disqusjs:
-  name: disqusjs
-  file: dist/browser/disqusjs.es2015.umd.min.js
-  version: 3.0.2
-disqusjs_css:
-  name: disqusjs
-  file: dist/browser/styles/disqusjs.css
-  version: 3.0.2
-docsearch_css:
-  name: '@docsearch/css'
-  other_name: docsearch-css
-  file: dist/style.css
-  version: 3.8.2
-docsearch_js:
-  name: '@docsearch/js'
-  other_name: docsearch-js
-  file: dist/umd/index.js
-  version: 3.8.2
-egjs_infinitegrid:
-  name: '@egjs/infinitegrid'
-  other_name: egjs-infinitegrid
-  file: dist/infinitegrid.min.js
-  version: 4.12.0
-fancybox:
-  name: '@fancyapps/ui'
-  file: dist/fancybox/fancybox.umd.js
-  version: 5.0.36
-  other_name: fancyapps-ui
-fancybox_css:
-  name: '@fancyapps/ui'
-  file: dist/fancybox/fancybox.css
-  version: 5.0.36
-  other_name: fancyapps-ui
-fireworks:
-  name: butterfly-extsrc
-  file: dist/fireworks.min.js
-  version: 1.1.4
-fontawesome:
-  name: '@fortawesome/fontawesome-free'
-  file: css/all.min.css
-  other_name: font-awesome
-  version: 6.7.2
-gitalk:
-  name: gitalk
-  file: dist/gitalk.min.js
-  version: 1.8.0
-gitalk_css:
-  name: gitalk
-  file: dist/gitalk.css
-  version: 1.8.0
-instantpage:
-  name: instant.page
-  file: instantpage.js
-  version: 5.2.0
-instantsearch:
-  name: instantsearch.js
-  file: dist/instantsearch.production.min.js
-  version: 4.75.7
-katex:
-  name: katex
-  file: dist/katex.min.css
-  other_name: KaTeX
-  version: 0.16.19
-katex_copytex:
-  name: katex
-  file: dist/contrib/copy-tex.min.js
-  other_name: KaTeX
-  version: 0.16.19
-lazyload:
-  name: vanilla-lazyload
-  file: dist/lazyload.iife.min.js
-  version: 19.1.3
-mathjax:
-  name: mathjax
-  file: es5/tex-mml-chtml.js
-  version: 3.2.2
-medium_zoom:
-  name: medium-zoom
-  file: dist/medium-zoom.min.js
-  version: 1.1.0
-mermaid:
-  name: mermaid
-  file: dist/mermaid.min.js
-  version: 11.4.1
-meting_js:
-  name: butterfly-extsrc
-  file: metingjs/dist/Meting.min.js
-  version: 1.1.4
-pace_default_css:
-  name: pace-js
-  other_name: pace
-  file: themes/blue/pace-theme-minimal.css
-  version: 1.2.4
-pace_js:
-  name: pace-js
-  other_name: pace
-  file: pace.min.js
-  version: 1.2.4
-pjax:
-  name: pjax
-  file: pjax.min.js
-  version: 0.2.8
-prismjs_autoloader:
-  name: prismjs
-  file: plugins/autoloader/prism-autoloader.min.js
-  other_name: prism
-  version: 1.29.0
-prismjs_js:
-  name: prismjs
-  file: prism.js
-  other_name: prism
-  version: 1.29.0
-prismjs_lineNumber_js:
-  name: prismjs
-  file: plugins/line-numbers/prism-line-numbers.min.js
-  other_name: prism
-  version: 1.29.0
-sharejs:
-  name: butterfly-extsrc
-  file: sharejs/dist/js/social-share.min.js
-  version: 1.1.4
-sharejs_css:
-  name: butterfly-extsrc
-  file: sharejs/dist/css/share.min.css
-  version: 1.1.4
-snackbar:
-  name: node-snackbar
-  file: dist/snackbar.min.js
-  version: 0.1.16
-snackbar_css:
-  name: node-snackbar
-  file: dist/snackbar.min.css
-  version: 0.1.16
-twikoo:
-  name: twikoo
-  file: dist/twikoo.all.min.js
-  version: 1.6.41
-typed:
-  name: typed.js
-  file: dist/typed.umd.js
-  version: 2.1.0
-valine:
-  name: valine
-  file: dist/Valine.min.js
-  version: 1.5.3
-waline_css:
-  name: '@waline/client'
-  file: dist/waline.css
-  other_name: waline
-  version: 3.4.3
-waline_js:
-  name: '@waline/client'
-  file: dist/waline.js
-  other_name: waline
-  version: 3.4.3
+abcjs_basic_js:
+  name: abcjs
+  file: dist/abcjs-basic-min.js
+  version: 6.4.4
+activate_power_mode:
+  name: butterfly-extsrc
+  file: dist/activate-power-mode.min.js
+  version: 1.1.4
+algolia_search:
+  name: algoliasearch
+  file: dist/lite/builds/browser.umd.js
+  version: 5.20.2
+aplayer_css:
+  name: aplayer
+  file: dist/APlayer.min.css
+  version: 1.10.1
+aplayer_js:
+  name: aplayer
+  file: dist/APlayer.min.js
+  version: 1.10.1
+artalk_css:
+  name: artalk
+  file: dist/Artalk.css
+  version: 2.9.1
+artalk_js:
+  name: artalk
+  file: dist/Artalk.js
+  version: 2.9.1
+blueimp_md5:
+  name: blueimp-md5
+  file: js/md5.min.js
+  version: 2.19.0
+canvas_fluttering_ribbon:
+  name: butterfly-extsrc
+  file: dist/canvas-fluttering-ribbon.min.js
+  version: 1.1.4
+canvas_nest:
+  name: butterfly-extsrc
+  file: dist/canvas-nest.min.js
+  version: 1.1.4
+canvas_ribbon:
+  name: butterfly-extsrc
+  file: dist/canvas-ribbon.min.js
+  version: 1.1.4
+chartjs:
+  name: chart.js
+  file: dist/chart.umd.js
+  version: 4.4.7
+clickShowText:
+  name: butterfly-extsrc
+  file: dist/click-show-text.min.js
+  version: 1.1.4
+click_heart:
+  name: butterfly-extsrc
+  file: dist/click-heart.min.js
+  version: 1.1.4
+disqusjs:
+  name: disqusjs
+  file: dist/browser/disqusjs.es2015.umd.min.js
+  version: 3.0.2
+disqusjs_css:
+  name: disqusjs
+  file: dist/browser/styles/disqusjs.css
+  version: 3.0.2
+docsearch_css:
+  name: '@docsearch/css'
+  other_name: docsearch-css
+  file: dist/style.css
+  version: 3.8.3
+docsearch_js:
+  name: '@docsearch/js'
+  other_name: docsearch-js
+  file: dist/umd/index.js
+  version: 3.8.3
+egjs_infinitegrid:
+  name: '@egjs/infinitegrid'
+  other_name: egjs-infinitegrid
+  file: dist/infinitegrid.min.js
+  version: 4.12.0
+fancybox:
+  name: '@fancyapps/ui'
+  file: dist/fancybox/fancybox.umd.js
+  version: 5.0.36
+  other_name: fancyapps-ui
+fancybox_css:
+  name: '@fancyapps/ui'
+  file: dist/fancybox/fancybox.css
+  version: 5.0.36
+  other_name: fancyapps-ui
+fireworks:
+  name: butterfly-extsrc
+  file: dist/fireworks.min.js
+  version: 1.1.4
+fontawesome:
+  name: '@fortawesome/fontawesome-free'
+  file: css/all.min.css
+  other_name: font-awesome
+  version: 6.7.2
+gitalk:
+  name: gitalk
+  file: dist/gitalk.min.js
+  version: 1.8.0
+gitalk_css:
+  name: gitalk
+  file: dist/gitalk.css
+  version: 1.8.0
+instantpage:
+  name: instant.page
+  file: instantpage.js
+  version: 5.2.0
+instantsearch:
+  name: instantsearch.js
+  file: dist/instantsearch.production.min.js
+  version: 4.77.3
+katex:
+  name: katex
+  file: dist/katex.min.css
+  other_name: KaTeX
+  version: 0.16.21
+katex_copytex:
+  name: katex
+  file: dist/contrib/copy-tex.min.js
+  other_name: KaTeX
+  version: 0.16.21
+lazyload:
+  name: vanilla-lazyload
+  file: dist/lazyload.iife.min.js
+  version: 19.1.3
+mathjax:
+  name: mathjax
+  file: es5/tex-mml-chtml.js
+  version: 3.2.2
+medium_zoom:
+  name: medium-zoom
+  file: dist/medium-zoom.min.js
+  version: 1.1.0
+mermaid:
+  name: mermaid
+  file: dist/mermaid.min.js
+  version: 11.4.1
+meting_js:
+  name: butterfly-extsrc
+  file: metingjs/dist/Meting.min.js
+  version: 1.1.4
+pace_default_css:
+  name: pace-js
+  other_name: pace
+  file: themes/blue/pace-theme-minimal.css
+  version: 1.2.4
+pace_js:
+  name: pace-js
+  other_name: pace
+  file: pace.min.js
+  version: 1.2.4
+pjax:
+  name: pjax
+  file: pjax.min.js
+  version: 0.2.8
+prismjs_autoloader:
+  name: prismjs
+  file: plugins/autoloader/prism-autoloader.min.js
+  other_name: prism
+  version: 1.29.0
+prismjs_js:
+  name: prismjs
+  file: prism.js
+  other_name: prism
+  version: 1.29.0
+prismjs_lineNumber_js:
+  name: prismjs
+  file: plugins/line-numbers/prism-line-numbers.min.js
+  other_name: prism
+  version: 1.29.0
+sharejs:
+  name: butterfly-extsrc
+  file: sharejs/dist/js/social-share.min.js
+  version: 1.1.4
+sharejs_css:
+  name: butterfly-extsrc
+  file: sharejs/dist/css/share.min.css
+  version: 1.1.4
+snackbar:
+  name: node-snackbar
+  file: dist/snackbar.min.js
+  version: 0.1.16
+snackbar_css:
+  name: node-snackbar
+  file: dist/snackbar.min.css
+  version: 0.1.16
+twikoo:
+  name: twikoo
+  file: dist/twikoo.all.min.js
+  version: 1.6.41
+typed:
+  name: typed.js
+  file: dist/typed.umd.js
+  version: 2.1.0
+valine:
+  name: valine
+  file: dist/Valine.min.js
+  version: 1.5.3
+waline_css:
+  name: '@waline/client'
+  file: dist/waline.css
+  other_name: waline
+  version: 3.5.2
+waline_js:
+  name: '@waline/client'
+  file: dist/waline.js
+  other_name: waline
+  version: 3.5.2
diff --git a/scripts/common/postDesc.js b/scripts/common/postDesc.js
index e20e86e..f2d547f 100644
--- a/scripts/common/postDesc.js
+++ b/scripts/common/postDesc.js
@@ -1,36 +1,36 @@
-'use strict'
-
-const { stripHTML, truncate } = require('hexo-util')
-
-// Truncates the given content to a specified length, removing HTML tags and replacing newlines with spaces.
-const truncateContent = (content, length) => {
-  return truncate(stripHTML(content), { length, separator: ' ' }).replace(/\n/g, ' ')
-}
-
-// Generates a post description based on the provided data and theme configuration.
-const postDesc = (data, hexo) => {
-  const { description, content, postDesc } = data
-
-  if (postDesc) return postDesc
-
-  const { length, method } = hexo.theme.config.index_post_content
-
-  if (method === false) return
-
-  let result
-  switch (method) {
-    case 1:
-      result = description
-      break
-    case 2:
-      result = description || truncateContent(content, length)
-      break
-    default:
-      result = truncateContent(content, length)
-  }
-
-  data.postDesc = result
-  return result
-}
-
-module.exports = { truncateContent, postDesc }
+'use strict'
+
+const { stripHTML, truncate } = require('hexo-util')
+
+// Truncates the given content to a specified length, removing HTML tags and replacing newlines with spaces.
+const truncateContent = (content, length) => {
+  return truncate(stripHTML(content), { length, separator: ' ' }).replace(/\n/g, ' ')
+}
+
+// Generates a post description based on the provided data and theme configuration.
+const postDesc = (data, hexo) => {
+  const { description, content, postDesc } = data
+
+  if (postDesc) return postDesc
+
+  const { length, method } = hexo.theme.config.index_post_content
+
+  if (method === false) return
+
+  let result
+  switch (method) {
+    case 1:
+      result = description
+      break
+    case 2:
+      result = description || truncateContent(content, length)
+      break
+    default:
+      result = truncateContent(content, length)
+  }
+
+  data.postDesc = result
+  return result
+}
+
+module.exports = { truncateContent, postDesc }
diff --git a/scripts/events/404.js b/scripts/events/404.js
index 17a05e9..157ef06 100644
--- a/scripts/events/404.js
+++ b/scripts/events/404.js
@@ -1,20 +1,20 @@
-/**
- * Butterfly
- * 404 error page
- */
-
-'use strict'
-
-hexo.extend.generator.register('404', function (locals) {
-  if (!hexo.theme.config.error_404.enable) return
-  return {
-    path: '404.html',
-    layout: ['page'],
-    data: {
-      type: '404',
-      top_img: false,
-      comments: false,
-      aside: false
-    }
-  }
-})
+/**
+ * Butterfly
+ * 404 error page
+ */
+
+'use strict'
+
+hexo.extend.generator.register('404', function (locals) {
+  if (!hexo.theme.config.error_404.enable) return
+  return {
+    path: '404.html',
+    layout: ['page'],
+    data: {
+      type: '404',
+      top_img: false,
+      comments: false,
+      aside: false
+    }
+  }
+})
diff --git a/scripts/events/cdn.js b/scripts/events/cdn.js
index b83404f..7d3e31e 100644
--- a/scripts/events/cdn.js
+++ b/scripts/events/cdn.js
@@ -1,97 +1,97 @@
-/**
- * Butterfly
- * Merge CDN
- */
-
-'use strict'
-
-const { version } = require('../../package.json')
-const path = require('path')
-
-hexo.extend.filter.register('before_generate', () => {
-  const themeConfig = hexo.theme.config
-  const { CDN } = themeConfig
-
-  const thirdPartySrc = hexo.render.renderSync({ path: path.join(hexo.theme_dir, '/plugins.yml'), engine: 'yaml' })
-  const internalSrc = {
-    main: {
-      name: 'hexo-theme-butterfly',
-      file: 'js/main.js',
-      version
-    },
-    utils: {
-      name: 'hexo-theme-butterfly',
-      file: 'js/utils.js',
-      version
-    },
-    translate: {
-      name: 'hexo-theme-butterfly',
-      file: 'js/tw_cn.js',
-      version
-    },
-    local_search: {
-      name: 'hexo-theme-butterfly',
-      file: 'js/search/local-search.js',
-      version
-    },
-    algolia_js: {
-      name: 'hexo-theme-butterfly',
-      file: 'js/search/algolia.js',
-      version
-    }
-  }
-
-  const minFile = file => {
-    return file.replace(/(? '.min' + ext)
-  }
-
-  const createCDNLink = (data, type, cond = '') => {
-    Object.keys(data).forEach(key => {
-      let { name, version, file, other_name } = data[key]
-      const cdnjs_name = other_name || name
-      const cdnjs_file = file.replace(/^[lib|dist]*\/|browser\//g, '')
-      const min_cdnjs_file = minFile(cdnjs_file)
-      if (cond === 'internal') file = `source/${file}`
-      const min_file = minFile(file)
-      const verType = CDN.version ? (type === 'local' ? `?v=${version}` : `@${version}`) : ''
-
-      const value = {
-        version,
-        name,
-        file,
-        cdnjs_file,
-        min_file,
-        min_cdnjs_file,
-        cdnjs_name
-      }
-
-      const cdnSource = {
-        local: cond === 'internal' ? `${cdnjs_file + verType}` : `/pluginsSrc/${name}/${file + verType}`,
-        jsdelivr: `https://cdn.jsdelivr.net/npm/${name}${verType}/${min_file}`,
-        unpkg: `https://unpkg.com/${name}${verType}/${file}`,
-        cdnjs: `https://cdnjs.cloudflare.com/ajax/libs/${cdnjs_name}/${version}/${min_cdnjs_file}`,
-        custom: (CDN.custom_format || '').replace(/\$\{(.+?)\}/g, (match, $1) => value[$1])
-      }
-
-      data[key] = cdnSource[type]
-    })
-
-    if (cond === 'internal') data.main_css = 'css/index.css' + (CDN.version ? `?v=${version}` : '')
-    return data
-  }
-
-  // delete null value
-  const deleteNullValue = obj => {
-    if (!obj) return
-    for (const i in obj) {
-      obj[i] === null && delete obj[i]
-    }
-    return obj
-  }
-
-  themeConfig.asset = Object.assign(
-    createCDNLink(internalSrc, CDN.internal_provider, 'internal'),
-    createCDNLink(thirdPartySrc, CDN.third_party_provider),
-    deleteNullValue(CDN.option)
-  )
-})
+/**
+ * Butterfly
+ * Merge CDN
+ */
+
+'use strict'
+
+const { version } = require('../../package.json')
+const path = require('path')
+
+hexo.extend.filter.register('before_generate', () => {
+  const themeConfig = hexo.theme.config
+  const { CDN } = themeConfig
+
+  const thirdPartySrc = hexo.render.renderSync({ path: path.join(hexo.theme_dir, '/plugins.yml'), engine: 'yaml' })
+  const internalSrc = {
+    main: {
+      name: 'hexo-theme-butterfly',
+      file: 'js/main.js',
+      version
+    },
+    utils: {
+      name: 'hexo-theme-butterfly',
+      file: 'js/utils.js',
+      version
+    },
+    translate: {
+      name: 'hexo-theme-butterfly',
+      file: 'js/tw_cn.js',
+      version
+    },
+    local_search: {
+      name: 'hexo-theme-butterfly',
+      file: 'js/search/local-search.js',
+      version
+    },
+    algolia_js: {
+      name: 'hexo-theme-butterfly',
+      file: 'js/search/algolia.js',
+      version
+    }
+  }
+
+  const minFile = file => {
+    return file.replace(/(? '.min' + ext)
+  }
+
+  const createCDNLink = (data, type, cond = '') => {
+    Object.keys(data).forEach(key => {
+      let { name, version, file, other_name } = data[key]
+      const cdnjs_name = other_name || name
+      const cdnjs_file = file.replace(/^[lib|dist]*\/|browser\//g, '')
+      const min_cdnjs_file = minFile(cdnjs_file)
+      if (cond === 'internal') file = `source/${file}`
+      const min_file = minFile(file)
+      const verType = CDN.version ? (type === 'local' ? `?v=${version}` : `@${version}`) : ''
+
+      const value = {
+        version,
+        name,
+        file,
+        cdnjs_file,
+        min_file,
+        min_cdnjs_file,
+        cdnjs_name
+      }
+
+      const cdnSource = {
+        local: cond === 'internal' ? `${cdnjs_file + verType}` : `/pluginsSrc/${name}/${file + verType}`,
+        jsdelivr: `https://cdn.jsdelivr.net/npm/${name}${verType}/${min_file}`,
+        unpkg: `https://unpkg.com/${name}${verType}/${file}`,
+        cdnjs: `https://cdnjs.cloudflare.com/ajax/libs/${cdnjs_name}/${version}/${min_cdnjs_file}`,
+        custom: (CDN.custom_format || '').replace(/\$\{(.+?)\}/g, (match, $1) => value[$1])
+      }
+
+      data[key] = cdnSource[type]
+    })
+
+    if (cond === 'internal') data.main_css = 'css/index.css' + (CDN.version ? `?v=${version}` : '')
+    return data
+  }
+
+  // delete null value
+  const deleteNullValue = obj => {
+    if (!obj) return
+    for (const i in obj) {
+      obj[i] === null && delete obj[i]
+    }
+    return obj
+  }
+
+  themeConfig.asset = Object.assign(
+    createCDNLink(internalSrc, CDN.internal_provider, 'internal'),
+    createCDNLink(thirdPartySrc, CDN.third_party_provider),
+    deleteNullValue(CDN.option)
+  )
+})
diff --git a/scripts/events/comment.js b/scripts/events/comment.js
index 16da948..83a67e9 100644
--- a/scripts/events/comment.js
+++ b/scripts/events/comment.js
@@ -1,24 +1,24 @@
-/**
- * Capitalize the first letter of comment name
- */
-
-hexo.extend.filter.register('before_generate', () => {
-  const themeConfig = hexo.theme.config
-  let { use } = themeConfig.comments
-  if (!use) return
-
-  // Make sure use is an array
-  use = Array.isArray(use) ? use : use.split(',')
-
-  // Capitalize the first letter of each comment name
-  use = use.map(item =>
-    item.trim().toLowerCase().replace(/\b[a-z]/g, s => s.toUpperCase())
-  )
-
-  // Disqus and Disqusjs conflict, only keep the first one
-  if (use.includes('Disqus') && use.includes('Disqusjs')) {
-    use = [use[0]]
-  }
-
-  themeConfig.comments.use = use
-})
+/**
+ * Capitalize the first letter of comment name
+ */
+
+hexo.extend.filter.register('before_generate', () => {
+  const themeConfig = hexo.theme.config
+  let { use } = themeConfig.comments
+  if (!use) return
+
+  // Make sure use is an array
+  use = Array.isArray(use) ? use : use.split(',')
+
+  // Capitalize the first letter of each comment name
+  use = use.map(item =>
+    item.trim().toLowerCase().replace(/\b[a-z]/g, s => s.toUpperCase())
+  )
+
+  // Disqus and Disqusjs conflict, only keep the first one
+  if (use.includes('Disqus') && use.includes('Disqusjs')) {
+    use = [use[0]]
+  }
+
+  themeConfig.comments.use = use
+})
diff --git a/scripts/events/init.js b/scripts/events/init.js
index 36304d8..dab4696 100644
--- a/scripts/events/init.js
+++ b/scripts/events/init.js
@@ -1,20 +1,20 @@
-hexo.extend.filter.register('before_generate', () => {
-  // Get first two digits of the Hexo version number
-  const { version, log, locals } = hexo
-  const hexoVer = version.replace(/(^.*\..*)\..*/, '$1')
-
-  if (hexoVer < 5.3) {
-    log.error('Please update Hexo to V5.3.0 or higher!')
-    log.error('請把 Hexo 升級到 V5.3.0 或更高的版本！')
-    process.exit(-1)
-  }
-
-  if (locals.get) {
-    const data = locals.get('data')
-    if (data && data.butterfly) {
-      log.error("'butterfly.yml' is deprecated. Please use '_config.butterfly.yml'")
-      log.error("'butterfly.yml' 已經棄用，請使用 '_config.butterfly.yml'")
-      process.exit(-1)
-    }
-  }
-})
+hexo.extend.filter.register('before_generate', () => {
+  // Get first two digits of the Hexo version number
+  const { version, log, locals } = hexo
+  const hexoVer = version.replace(/(^.*\..*)\..*/, '$1')
+
+  if (hexoVer < 5.3) {
+    log.error('Please update Hexo to V5.3.0 or higher!')
+    log.error('請把 Hexo 升級到 V5.3.0 或更高的版本！')
+    process.exit(-1)
+  }
+
+  if (locals.get) {
+    const data = locals.get('data')
+    if (data && data.butterfly) {
+      log.error("'butterfly.yml' is deprecated. Please use '_config.butterfly.yml'")
+      log.error("'butterfly.yml' 已經棄用，請使用 '_config.butterfly.yml'")
+      process.exit(-1)
+    }
+  }
+})
diff --git a/scripts/events/merge_config.js b/scripts/events/merge_config.js
index c14c57c..eb27857 100644
--- a/scripts/events/merge_config.js
+++ b/scripts/events/merge_config.js
@@ -1,583 +1,583 @@
-const { deepMerge } = require('hexo-util')
-
-hexo.extend.filter.register('before_generate', () => {
-  const defaultConfig = {
-    nav: {
-      logo: null,
-      display_title: true,
-      fixed: false
-    },
-    menu: null,
-    code_blocks: {
-      theme: 'light',
-      macStyle: false,
-      height_limit: false,
-      word_wrap: false,
-      copy: true,
-      language: true,
-      shrink: false,
-      fullpage: false
-    },
-    social: null,
-    favicon: '/img/favicon.png',
-    avatar: {
-      img: '/img/butterfly-icon.png',
-      effect: false
-    },
-    disable_top_img: false,
-    default_top_img: null,
-    index_img: null,
-    archive_img: null,
-    tag_img: null,
-    tag_per_img: null,
-    category_img: null,
-    category_per_img: null,
-    footer_img: false,
-    background: null,
-    cover: {
-      index_enable: true,
-      aside_enable: true,
-      archives_enable: true,
-      default_cover: null
-    },
-    error_img: {
-      flink: '/img/friend_404.gif',
-      post_page: '/img/404.jpg'
-    },
-    error_404: {
-      enable: false,
-      subtitle: 'Page Not Found',
-      background: '/img/error-page.png'
-    },
-    post_meta: {
-      page: {
-        date_type: 'created',
-        date_format: 'date',
-        categories: true,
-        tags: false,
-        label: true
-      },
-      post: {
-        position: 'left',
-        date_type: 'both',
-        date_format: 'date',
-        categories: true,
-        tags: true,
-        label: true
-      }
-    },
-    index_site_info_top: null,
-    index_top_img_height: null,
-    subtitle: {
-      enable: false,
-      effect: true,
-      typed_option: null,
-      source: false,
-      sub: null
-    },
-    index_layout: 3,
-    index_post_content: {
-      method: 3,
-      length: 500
-    },
-    toc: {
-      post: true,
-      page: false,
-      number: true,
-      expand: false,
-      style_simple: false,
-      scroll_percent: true
-    },
-    post_copyright: {
-      enable: true,
-      decode: false,
-      author_href: null,
-      license: 'CC BY-NC-SA 4.0',
-      license_url: 'https://creativecommons.org/licenses/by-nc-sa/4.0/'
-    },
-    reward: {
-      enable: false,
-      text: null,
-      QR_code: null
-    },
-    post_edit: {
-      enable: false,
-      url: null
-    },
-    related_post: {
-      enable: true,
-      limit: 6,
-      date_type: 'created'
-    },
-    post_pagination: 1,
-    noticeOutdate: {
-      enable: false,
-      style: 'flat',
-      limit_day: 365,
-      position: 'top',
-      message_prev: 'It has been',
-      message_next: 'days since the last update, the content of the article may be outdated.'
-    },
-    footer: {
-      owner: {
-        enable: true,
-        since: 2019
-      },
-      custom_text: null,
-      copyright: true
-    },
-    aside: {
-      enable: true,
-      hide: false,
-      button: true,
-      mobile: true,
-      position: 'right',
-      display: {
-        archive: true,
-        tag: true,
-        category: true
-      },
-      card_author: {
-        enable: true,
-        description: null,
-        button: {
-          enable: true,
-          icon: 'fab fa-github',
-          text: 'Follow Me',
-          link: 'https://github.com/xxxxxx'
-        }
-      },
-      card_announcement: {
-        enable: true,
-        content: 'This is my Blog'
-      },
-      card_recent_post: {
-        enable: true,
-        limit: 5,
-        sort: 'date',
-        sort_order: null
-      },
-      card_newest_comments: {
-        enable: false,
-        sort_order: null,
-        limit: 6,
-        storage: 10,
-        avatar: true
-      },
-      card_categories: {
-        enable: true,
-        limit: 8,
-        expand: 'none',
-        sort_order: null
-      },
-      card_tags: {
-        enable: true,
-        limit: 40,
-        color: false,
-        orderby: 'random',
-        order: 1,
-        sort_order: null
-      },
-      card_archives: {
-        enable: true,
-        type: 'monthly',
-        format: 'MMMM YYYY',
-        order: -1,
-        limit: 8,
-        sort_order: null
-      },
-      card_post_series: {
-        enable: true,
-        series_title: false,
-        orderBy: 'date',
-        order: -1
-      },
-      card_webinfo: {
-        enable: true,
-        post_count: true,
-        last_push_date: true,
-        sort_order: null,
-        runtime_date: null
-      }
-    },
-    rightside_bottom: null,
-    translate: {
-      enable: false,
-      default: '繁',
-      defaultEncoding: 2,
-      translateDelay: 0,
-      msgToTraditionalChinese: '繁',
-      msgToSimplifiedChinese: '簡'
-    },
-    readmode: true,
-    darkmode: {
-      enable: true,
-      button: true,
-      autoChangeMode: false,
-      start: null,
-      end: null
-    },
-    rightside_scroll_percent: false,
-    rightside_item_order: {
-      enable: false,
-      hide: null,
-      show: null
-    },
-    anchor: {
-      auto_update: false,
-      click_to_scroll: false
-    },
-    photofigcaption: false,
-    copy: {
-      enable: true,
-      copyright: {
-        enable: false,
-        limit_count: 150
-      }
-    },
-    wordcount: {
-      enable: false,
-      post_wordcount: true,
-      min2read: true,
-      total_wordcount: true
-    },
-    busuanzi: {
-      site_uv: true,
-      site_pv: true,
-      page_pv: true
-    },
-    math: {
-      use: null,
-      per_page: true,
-      hide_scrollbar: false,
-      mathjax: {
-        enableMenu: true,
-        tags: 'none'
-      },
-      katex: {
-        copy_tex: false
-      }
-    },
-    search: {
-      use: null,
-      placeholder: null,
-      algolia_search: {
-        hitsPerPage: 6
-      },
-      local_search: {
-        preload: false,
-        top_n_per_article: 1,
-        unescape: false,
-        CDN: null
-      },
-      docsearch: {
-        appId: null,
-        apiKey: null,
-        indexName: null,
-        option: null
-      }
-    },
-    share: {
-      use: 'sharejs',
-      sharejs: {
-        sites: 'facebook,twitter,wechat,weibo,qq'
-      },
-      addtoany: {
-        item: 'facebook,twitter,wechat,sina_weibo,facebook_messenger,email,copy_link'
-      }
-    },
-    comments: {
-      use: null,
-      text: true,
-      lazyload: false,
-      count: false,
-      card_post_count: false
-    },
-    disqus: {
-      shortname: null,
-      apikey: null
-    },
-    disqusjs: {
-      shortname: null,
-      apikey: null,
-      option: null
-    },
-    livere: {
-      uid: null
-    },
-    gitalk: {
-      client_id: null,
-      client_secret: null,
-      repo: null,
-      owner: null,
-      admin: null,
-      option: null
-    },
-    valine: {
-      appId: null,
-      appKey: null,
-      avatar: 'monsterid',
-      serverURLs: null,
-      bg: null,
-      visitor: false,
-      option: null
-    },
-    waline: {
-      serverURL: null,
-      bg: null,
-      pageview: false,
-      option: null
-    },
-    utterances: {
-      repo: null,
-      issue_term: 'pathname',
-      light_theme: 'github-light',
-      dark_theme: 'photon-dark',
-      js: null,
-      option: null
-    },
-    facebook_comments: {
-      app_id: null,
-      user_id: null,
-      pageSize: 10,
-      order_by: 'social',
-      lang: 'en_US'
-    },
-    twikoo: {
-      envId: null,
-      region: null,
-      visitor: false,
-      option: null
-    },
-    giscus: {
-      repo: null,
-      repo_id: null,
-      category_id: null,
-      light_theme: 'light',
-      dark_theme: 'dark',
-      js: null,
-      option: null
-    },
-    remark42: {
-      host: null,
-      siteId: null,
-      option: null
-    },
-    artalk: {
-      server: null,
-      site: null,
-      visitor: false,
-      option: null
-    },
-    chat: {
-      use: null,
-      rightside_button: false,
-      button_hide_show: false
-    },
-    chatra: {
-      id: null
-    },
-    tidio: {
-      public_key: null
-    },
-    crisp: {
-      website_id: null
-    },
-    baidu_analytics: null,
-    google_analytics: null,
-    cloudflare_analytics: null,
-    microsoft_clarity: null,
-    umami_analytics: {
-      enable: false,
-      serverURL: null,
-      website_id: null,
-      option: null,
-      UV_PV: {
-        site_uv: false,
-        site_pv: false,
-        page_pv: false,
-        token: null
-      }
-    },
-    google_adsense: {
-      enable: false,
-      auto_ads: true,
-      js: 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js',
-      client: null,
-      enable_page_level_ads: true
-    },
-    ad: {
-      index: null,
-      aside: null,
-      post: null
-    },
-    site_verification: null,
-    category_ui: null,
-    tag_ui: null,
-    rounded_corners_ui: true,
-    text_align_justify: false,
-    mask: {
-      header: true,
-      footer: true
-    },
-    preloader: {
-      enable: false,
-      source: 1,
-      pace_css_url: null
-    },
-    enter_transitions: true,
-    display_mode: 'light',
-    beautify: {
-      enable: false,
-      field: 'post',
-      title_prefix_icon: null,
-      title_prefix_icon_color: null
-    },
-    font: {
-      global_font_size: null,
-      code_font_size: null,
-      font_family: null,
-      code_font_family: null
-    },
-    blog_title_font: {
-      font_link: null,
-      font_family: null
-    },
-    hr_icon: {
-      enable: true,
-      icon: null,
-      icon_top: null
-    },
-    activate_power_mode: {
-      enable: false,
-      colorful: true,
-      shake: true,
-      mobile: false
-    },
-    canvas_ribbon: {
-      enable: false,
-      size: 150,
-      alpha: 0.6,
-      zIndex: -1,
-      click_to_change: false,
-      mobile: false
-    },
-    canvas_fluttering_ribbon: {
-      enable: false,
-      mobile: false
-    },
-    canvas_nest: {
-      enable: false,
-      color: '0,0,255',
-      opacity: 0.7,
-      zIndex: -1,
-      count: 99,
-      mobile: false
-    },
-    fireworks: {
-      enable: false,
-      zIndex: 9999,
-      mobile: false
-    },
-    click_heart: {
-      enable: false,
-      mobile: false
-    },
-    clickShowText: {
-      enable: false,
-      text: null,
-      fontSize: '15px',
-      random: false,
-      mobile: false
-    },
-    lightbox: null,
-    series: {
-      enable: false,
-      orderBy: 'title',
-      order: 1,
-      number: true
-    },
-    abcjs: {
-      enable: false,
-      per_page: true
-    },
-    mermaid: {
-      enable: false,
-      code_write: false,
-      theme: {
-        light: 'default',
-        dark: 'dark'
-      }
-    },
-    chartjs: {
-      enable: false,
-      fontColor: {
-        light: 'rgba(0, 0, 0, 0.8)',
-        dark: 'rgba(255, 255, 255, 0.8)'
-      },
-      borderColor: {
-        light: 'rgba(0, 0, 0, 0.1)',
-        dark: 'rgba(255, 255, 255, 0.2)'
-      },
-      scale_ticks_backdropColor: {
-        light: 'transparent',
-        dark: 'transparent'
-      }
-    },
-    note: {
-      style: 'flat',
-      icons: true,
-      border_radius: 3,
-      light_bg_offset: 0
-    },
-    pjax: {
-      enable: false,
-      exclude: null
-    },
-    aplayerInject: {
-      enable: false,
-      per_page: true
-    },
-    snackbar: {
-      enable: false,
-      position: 'bottom-left',
-      bg_light: '#49b1f5',
-      bg_dark: '#1f1f1f'
-    },
-    instantpage: false,
-    lazyload: {
-      enable: false,
-      native: false,
-      field: 'site',
-      placeholder: null,
-      blur: false
-    },
-    pwa: {
-      enable: false,
-      manifest: null,
-      apple_touch_icon: null,
-      favicon_32_32: null,
-      favicon_16_16: null,
-      mask_icon: null
-    },
-    Open_Graph_meta: {
-      enable: true,
-      option: null
-    },
-    structured_data: true,
-    css_prefix: true,
-    inject: {
-      head: null,
-      bottom: null
-    },
-    CDN: {
-      internal_provider: 'local',
-      third_party_provider: 'jsdelivr',
-      version: false,
-      custom_format: null,
-      option: null
-    }
-  }
-
-  hexo.theme.config = deepMerge(defaultConfig, hexo.theme.config)
-}, 1)
+const { deepMerge } = require('hexo-util')
+
+hexo.extend.filter.register('before_generate', () => {
+  const defaultConfig = {
+    nav: {
+      logo: null,
+      display_title: true,
+      fixed: false
+    },
+    menu: null,
+    code_blocks: {
+      theme: 'light',
+      macStyle: false,
+      height_limit: false,
+      word_wrap: false,
+      copy: true,
+      language: true,
+      shrink: false,
+      fullpage: false
+    },
+    social: null,
+    favicon: '/img/favicon.png',
+    avatar: {
+      img: '/img/butterfly-icon.png',
+      effect: false
+    },
+    disable_top_img: false,
+    default_top_img: null,
+    index_img: null,
+    archive_img: null,
+    tag_img: null,
+    tag_per_img: null,
+    category_img: null,
+    category_per_img: null,
+    footer_img: false,
+    background: null,
+    cover: {
+      index_enable: true,
+      aside_enable: true,
+      archives_enable: true,
+      default_cover: null
+    },
+    error_img: {
+      flink: '/img/friend_404.gif',
+      post_page: '/img/404.jpg'
+    },
+    error_404: {
+      enable: false,
+      subtitle: 'Page Not Found',
+      background: '/img/error-page.png'
+    },
+    post_meta: {
+      page: {
+        date_type: 'created',
+        date_format: 'date',
+        categories: true,
+        tags: false,
+        label: true
+      },
+      post: {
+        position: 'left',
+        date_type: 'both',
+        date_format: 'date',
+        categories: true,
+        tags: true,
+        label: true
+      }
+    },
+    index_site_info_top: null,
+    index_top_img_height: null,
+    subtitle: {
+      enable: false,
+      effect: true,
+      typed_option: null,
+      source: false,
+      sub: null
+    },
+    index_layout: 3,
+    index_post_content: {
+      method: 3,
+      length: 500
+    },
+    toc: {
+      post: true,
+      page: false,
+      number: true,
+      expand: false,
+      style_simple: false,
+      scroll_percent: true
+    },
+    post_copyright: {
+      enable: true,
+      decode: false,
+      author_href: null,
+      license: 'CC BY-NC-SA 4.0',
+      license_url: 'https://creativecommons.org/licenses/by-nc-sa/4.0/'
+    },
+    reward: {
+      enable: false,
+      text: null,
+      QR_code: null
+    },
+    post_edit: {
+      enable: false,
+      url: null
+    },
+    related_post: {
+      enable: true,
+      limit: 6,
+      date_type: 'created'
+    },
+    post_pagination: 1,
+    noticeOutdate: {
+      enable: false,
+      style: 'flat',
+      limit_day: 365,
+      position: 'top',
+      message_prev: 'It has been',
+      message_next: 'days since the last update, the content of the article may be outdated.'
+    },
+    footer: {
+      owner: {
+        enable: true,
+        since: 2019
+      },
+      custom_text: null,
+      copyright: true
+    },
+    aside: {
+      enable: true,
+      hide: false,
+      button: true,
+      mobile: true,
+      position: 'right',
+      display: {
+        archive: true,
+        tag: true,
+        category: true
+      },
+      card_author: {
+        enable: true,
+        description: null,
+        button: {
+          enable: true,
+          icon: 'fab fa-github',
+          text: 'Follow Me',
+          link: 'https://github.com/xxxxxx'
+        }
+      },
+      card_announcement: {
+        enable: true,
+        content: 'This is my Blog'
+      },
+      card_recent_post: {
+        enable: true,
+        limit: 5,
+        sort: 'date',
+        sort_order: null
+      },
+      card_newest_comments: {
+        enable: false,
+        sort_order: null,
+        limit: 6,
+        storage: 10,
+        avatar: true
+      },
+      card_categories: {
+        enable: true,
+        limit: 8,
+        expand: 'none',
+        sort_order: null
+      },
+      card_tags: {
+        enable: true,
+        limit: 40,
+        color: false,
+        orderby: 'random',
+        order: 1,
+        sort_order: null
+      },
+      card_archives: {
+        enable: true,
+        type: 'monthly',
+        format: 'MMMM YYYY',
+        order: -1,
+        limit: 8,
+        sort_order: null
+      },
+      card_post_series: {
+        enable: true,
+        series_title: false,
+        orderBy: 'date',
+        order: -1
+      },
+      card_webinfo: {
+        enable: true,
+        post_count: true,
+        last_push_date: true,
+        sort_order: null,
+        runtime_date: null
+      }
+    },
+    rightside_bottom: null,
+    translate: {
+      enable: false,
+      default: '繁',
+      defaultEncoding: 2,
+      translateDelay: 0,
+      msgToTraditionalChinese: '繁',
+      msgToSimplifiedChinese: '簡'
+    },
+    readmode: true,
+    darkmode: {
+      enable: true,
+      button: true,
+      autoChangeMode: false,
+      start: null,
+      end: null
+    },
+    rightside_scroll_percent: false,
+    rightside_item_order: {
+      enable: false,
+      hide: null,
+      show: null
+    },
+    anchor: {
+      auto_update: false,
+      click_to_scroll: false
+    },
+    photofigcaption: false,
+    copy: {
+      enable: true,
+      copyright: {
+        enable: false,
+        limit_count: 150
+      }
+    },
+    wordcount: {
+      enable: false,
+      post_wordcount: true,
+      min2read: true,
+      total_wordcount: true
+    },
+    busuanzi: {
+      site_uv: true,
+      site_pv: true,
+      page_pv: true
+    },
+    math: {
+      use: null,
+      per_page: true,
+      hide_scrollbar: false,
+      mathjax: {
+        enableMenu: true,
+        tags: 'none'
+      },
+      katex: {
+        copy_tex: false
+      }
+    },
+    search: {
+      use: null,
+      placeholder: null,
+      algolia_search: {
+        hitsPerPage: 6
+      },
+      local_search: {
+        preload: false,
+        top_n_per_article: 1,
+        unescape: false,
+        CDN: null
+      },
+      docsearch: {
+        appId: null,
+        apiKey: null,
+        indexName: null,
+        option: null
+      }
+    },
+    share: {
+      use: 'sharejs',
+      sharejs: {
+        sites: 'facebook,twitter,wechat,weibo,qq'
+      },
+      addtoany: {
+        item: 'facebook,twitter,wechat,sina_weibo,facebook_messenger,email,copy_link'
+      }
+    },
+    comments: {
+      use: null,
+      text: true,
+      lazyload: false,
+      count: false,
+      card_post_count: false
+    },
+    disqus: {
+      shortname: null,
+      apikey: null
+    },
+    disqusjs: {
+      shortname: null,
+      apikey: null,
+      option: null
+    },
+    livere: {
+      uid: null
+    },
+    gitalk: {
+      client_id: null,
+      client_secret: null,
+      repo: null,
+      owner: null,
+      admin: null,
+      option: null
+    },
+    valine: {
+      appId: null,
+      appKey: null,
+      avatar: 'monsterid',
+      serverURLs: null,
+      bg: null,
+      visitor: false,
+      option: null
+    },
+    waline: {
+      serverURL: null,
+      bg: null,
+      pageview: false,
+      option: null
+    },
+    utterances: {
+      repo: null,
+      issue_term: 'pathname',
+      light_theme: 'github-light',
+      dark_theme: 'photon-dark',
+      js: null,
+      option: null
+    },
+    facebook_comments: {
+      app_id: null,
+      user_id: null,
+      pageSize: 10,
+      order_by: 'social',
+      lang: 'en_US'
+    },
+    twikoo: {
+      envId: null,
+      region: null,
+      visitor: false,
+      option: null
+    },
+    giscus: {
+      repo: null,
+      repo_id: null,
+      category_id: null,
+      light_theme: 'light',
+      dark_theme: 'dark',
+      js: null,
+      option: null
+    },
+    remark42: {
+      host: null,
+      siteId: null,
+      option: null
+    },
+    artalk: {
+      server: null,
+      site: null,
+      visitor: false,
+      option: null
+    },
+    chat: {
+      use: null,
+      rightside_button: false,
+      button_hide_show: false
+    },
+    chatra: {
+      id: null
+    },
+    tidio: {
+      public_key: null
+    },
+    crisp: {
+      website_id: null
+    },
+    baidu_analytics: null,
+    google_analytics: null,
+    cloudflare_analytics: null,
+    microsoft_clarity: null,
+    umami_analytics: {
+      enable: false,
+      serverURL: null,
+      website_id: null,
+      option: null,
+      UV_PV: {
+        site_uv: false,
+        site_pv: false,
+        page_pv: false,
+        token: null
+      }
+    },
+    google_adsense: {
+      enable: false,
+      auto_ads: true,
+      js: 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js',
+      client: null,
+      enable_page_level_ads: true
+    },
+    ad: {
+      index: null,
+      aside: null,
+      post: null
+    },
+    site_verification: null,
+    category_ui: null,
+    tag_ui: null,
+    rounded_corners_ui: true,
+    text_align_justify: false,
+    mask: {
+      header: true,
+      footer: true
+    },
+    preloader: {
+      enable: false,
+      source: 1,
+      pace_css_url: null
+    },
+    enter_transitions: true,
+    display_mode: 'light',
+    beautify: {
+      enable: false,
+      field: 'post',
+      title_prefix_icon: null,
+      title_prefix_icon_color: null
+    },
+    font: {
+      global_font_size: null,
+      code_font_size: null,
+      font_family: null,
+      code_font_family: null
+    },
+    blog_title_font: {
+      font_link: null,
+      font_family: null
+    },
+    hr_icon: {
+      enable: true,
+      icon: null,
+      icon_top: null
+    },
+    activate_power_mode: {
+      enable: false,
+      colorful: true,
+      shake: true,
+      mobile: false
+    },
+    canvas_ribbon: {
+      enable: false,
+      size: 150,
+      alpha: 0.6,
+      zIndex: -1,
+      click_to_change: false,
+      mobile: false
+    },
+    canvas_fluttering_ribbon: {
+      enable: false,
+      mobile: false
+    },
+    canvas_nest: {
+      enable: false,
+      color: '0,0,255',
+      opacity: 0.7,
+      zIndex: -1,
+      count: 99,
+      mobile: false
+    },
+    fireworks: {
+      enable: false,
+      zIndex: 9999,
+      mobile: false
+    },
+    click_heart: {
+      enable: false,
+      mobile: false
+    },
+    clickShowText: {
+      enable: false,
+      text: null,
+      fontSize: '15px',
+      random: false,
+      mobile: false
+    },
+    lightbox: null,
+    series: {
+      enable: false,
+      orderBy: 'title',
+      order: 1,
+      number: true
+    },
+    abcjs: {
+      enable: false,
+      per_page: true
+    },
+    mermaid: {
+      enable: false,
+      code_write: false,
+      theme: {
+        light: 'default',
+        dark: 'dark'
+      }
+    },
+    chartjs: {
+      enable: false,
+      fontColor: {
+        light: 'rgba(0, 0, 0, 0.8)',
+        dark: 'rgba(255, 255, 255, 0.8)'
+      },
+      borderColor: {
+        light: 'rgba(0, 0, 0, 0.1)',
+        dark: 'rgba(255, 255, 255, 0.2)'
+      },
+      scale_ticks_backdropColor: {
+        light: 'transparent',
+        dark: 'transparent'
+      }
+    },
+    note: {
+      style: 'flat',
+      icons: true,
+      border_radius: 3,
+      light_bg_offset: 0
+    },
+    pjax: {
+      enable: false,
+      exclude: null
+    },
+    aplayerInject: {
+      enable: false,
+      per_page: true
+    },
+    snackbar: {
+      enable: false,
+      position: 'bottom-left',
+      bg_light: '#49b1f5',
+      bg_dark: '#1f1f1f'
+    },
+    instantpage: false,
+    lazyload: {
+      enable: false,
+      native: false,
+      field: 'site',
+      placeholder: null,
+      blur: false
+    },
+    pwa: {
+      enable: false,
+      manifest: null,
+      apple_touch_icon: null,
+      favicon_32_32: null,
+      favicon_16_16: null,
+      mask_icon: null
+    },
+    Open_Graph_meta: {
+      enable: true,
+      option: null
+    },
+    structured_data: true,
+    css_prefix: true,
+    inject: {
+      head: null,
+      bottom: null
+    },
+    CDN: {
+      internal_provider: 'local',
+      third_party_provider: 'jsdelivr',
+      version: false,
+      custom_format: null,
+      option: null
+    }
+  }
+
+  hexo.theme.config = deepMerge(defaultConfig, hexo.theme.config)
+}, 1)
diff --git a/scripts/events/stylus.js b/scripts/events/stylus.js
index 15ca4ff..486a83e 100644
--- a/scripts/events/stylus.js
+++ b/scripts/events/stylus.js
@@ -1,24 +1,24 @@
-/**
- * Stylus renderer
- */
-
-'use strict'
-
-hexo.extend.filter.register('stylus:renderer', style => {
-  const { syntax_highlighter: syntaxHighlighter, highlight, prismjs } = hexo.config
-  let { enable: highlightEnable, line_number: highlightLineNumber } = highlight
-  let { enable: prismjsEnable, line_number: prismjsLineNumber } = prismjs
-
-  // for hexo > 7.0
-  if (syntaxHighlighter) {
-    highlightEnable = syntaxHighlighter === 'highlight.js'
-    prismjsEnable = syntaxHighlighter === 'prismjs'
-  }
-
-  style.define('$highlight_enable', highlightEnable)
-    .define('$highlight_line_number', highlightLineNumber)
-    .define('$prismjs_enable', prismjsEnable)
-    .define('$prismjs_line_number', prismjsLineNumber)
-    .define('$language', hexo.config.language)
-  // .import(`${this.source_dir.replace(/\\/g, '/')}_data/css/*`)
-})
+/**
+ * Stylus renderer
+ */
+
+'use strict'
+
+hexo.extend.filter.register('stylus:renderer', style => {
+  const { syntax_highlighter: syntaxHighlighter, highlight, prismjs } = hexo.config
+  let { enable: highlightEnable, line_number: highlightLineNumber } = highlight
+  let { enable: prismjsEnable, line_number: prismjsLineNumber } = prismjs
+
+  // for hexo > 7.0
+  if (syntaxHighlighter) {
+    highlightEnable = syntaxHighlighter === 'highlight.js'
+    prismjsEnable = syntaxHighlighter === 'prismjs'
+  }
+
+  style.define('$highlight_enable', highlightEnable)
+    .define('$highlight_line_number', highlightLineNumber)
+    .define('$prismjs_enable', prismjsEnable)
+    .define('$prismjs_line_number', prismjsLineNumber)
+    .define('$language', hexo.config.language)
+  // .import(`${this.source_dir.replace(/\\/g, '/')}_data/css/*`)
+})
diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js
index f4c018a..188763c 100644
--- a/scripts/events/welcome.js
+++ b/scripts/events/welcome.js
@@ -1,13 +1,13 @@
-hexo.on('ready', () => {
-  const { version } = require('../../package.json')
-  hexo.log.info(`
-  ===================================================================
-      #####  #    # ##### ##### ###### #####  ###### #      #   #
-      #    # #    #   #     #   #      #    # #      #       # #
-      #####  #    #   #     #   #####  #    # #####  #        #
-      #    # #    #   #     #   #      #####  #      #        #
-      #    # #    #   #     #   #      #   #  #      #        #
-      #####   ####    #     #   ###### #    # #      ######   #
-                            ${version}
-  ===================================================================`)
-})
+hexo.on('ready', () => {
+  const { version } = require('../../package.json')
+  hexo.log.info(`
+  ===================================================================
+      #####  #    # ##### ##### ###### #####  ###### #      #   #
+      #    # #    #   #     #   #      #    # #      #       # #
+      #####  #    #   #     #   #####  #    # #####  #        #
+      #    # #    #   #     #   #      #####  #      #        #
+      #    # #    #   #     #   #      #   #  #      #        #
+      #####   ####    #     #   ###### #    # #      ######   #
+                            ${version}
+  ===================================================================`)
+})
diff --git a/scripts/filters/post_lazyload.js b/scripts/filters/post_lazyload.js
index 7ad6339..98aa681 100644
--- a/scripts/filters/post_lazyload.js
+++ b/scripts/filters/post_lazyload.js
@@ -1,31 +1,31 @@
-/**
- * Butterfly
- * lazyload
- * replace src to data-lazy-src
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-
-const lazyload = htmlContent => {
-  if (hexo.theme.config.lazyload.native) {
-    return htmlContent.replace(/()/ig, '$1 loading=\'lazy\'$2')
-  }
-
-  const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
-  return htmlContent.replace(/( {
-  const { enable, field } = hexo.theme.config.lazyload
-  if (!enable || field !== 'site') return
-  return lazyload(data)
-})
-
-hexo.extend.filter.register('after_post_render', data => {
-  const { enable, field } = hexo.theme.config.lazyload
-  if (!enable || field !== 'post') return
-  data.content = lazyload(data.content)
-  return data
-})
+/**
+ * Butterfly
+ * lazyload
+ * replace src to data-lazy-src
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+
+const lazyload = htmlContent => {
+  if (hexo.theme.config.lazyload.native) {
+    return htmlContent.replace(/()/ig, '$1 loading=\'lazy\'$2')
+  }
+
+  const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
+  return htmlContent.replace(/( {
+  const { enable, field } = hexo.theme.config.lazyload
+  if (!enable || field !== 'site') return
+  return lazyload(data)
+})
+
+hexo.extend.filter.register('after_post_render', data => {
+  const { enable, field } = hexo.theme.config.lazyload
+  if (!enable || field !== 'post') return
+  data.content = lazyload(data.content)
+  return data
+})
diff --git a/scripts/filters/random_cover.js b/scripts/filters/random_cover.js
index e7cc24d..7bccbee 100644
--- a/scripts/filters/random_cover.js
+++ b/scripts/filters/random_cover.js
@@ -1,82 +1,82 @@
-/**
- * Random cover for posts
- */
-
-'use strict'
-
-hexo.extend.generator.register('post', locals => {
-  const previousIndexes = []
-
-  const getRandomCover = defaultCover => {
-    if (!defaultCover) return false
-    if (!Array.isArray(defaultCover)) return defaultCover
-
-    const coverCount = defaultCover.length
-
-    if (coverCount === 1) {
-      return defaultCover[0]
-    }
-
-    const maxPreviousIndexes = coverCount === 2 ? 1 : (coverCount === 3 ? 2 : 3)
-
-    let index
-    do {
-      index = Math.floor(Math.random() * coverCount)
-    } while (previousIndexes.includes(index) && previousIndexes.length < coverCount)
-
-    previousIndexes.push(index)
-    if (previousIndexes.length > maxPreviousIndexes) {
-      previousIndexes.shift()
-    }
-
-    return defaultCover[index]
-  }
-
-  const handleImg = data => {
-    const imgTestReg = /\.(png|jpe?g|gif|svg|webp|avif)(\?.*)?$/i
-    let { cover: coverVal, top_img: topImg } = data
-
-    // Add path to top_img and cover if post_asset_folder is enabled
-    if (hexo.config.post_asset_folder) {
-      if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) {
-        data.top_img = `${data.path}${topImg}`
-      }
-      if (coverVal && coverVal.indexOf('/') === -1 && imgTestReg.test(coverVal)) {
-        data.cover = `${data.path}${coverVal}`
-      }
-    }
-
-    if (coverVal === false) return data
-
-    // If cover is not set, use random cover
-    if (!coverVal) {
-      const { cover: { default_cover: defaultCover } } = hexo.theme.config
-      const randomCover = getRandomCover(defaultCover)
-      data.cover = randomCover
-      coverVal = randomCover // update coverVal
-    }
-
-    if (coverVal && (coverVal.indexOf('//') !== -1 || imgTestReg.test(coverVal))) {
-      data.cover_type = 'img'
-    }
-
-    return data
-  }
-
-  // https://github.com/hexojs/hexo/blob/master/lib%2Fplugins%2Fgenerator%2Fpost.ts
-  const posts = locals.posts.sort('date').toArray()
-  const { length } = posts
-
-  return posts.map((post, i) => {
-    if (i) post.prev = posts[i - 1]
-    if (i < length - 1) post.next = posts[i + 1]
-
-    post.__post = true
-
-    return {
-      data: handleImg(post),
-      layout: 'post',
-      path: post.path
-    }
-  })
-})
+/**
+ * Random cover for posts
+ */
+
+'use strict'
+
+hexo.extend.generator.register('post', locals => {
+  const previousIndexes = []
+
+  const getRandomCover = defaultCover => {
+    if (!defaultCover) return false
+    if (!Array.isArray(defaultCover)) return defaultCover
+
+    const coverCount = defaultCover.length
+
+    if (coverCount === 1) {
+      return defaultCover[0]
+    }
+
+    const maxPreviousIndexes = coverCount === 2 ? 1 : (coverCount === 3 ? 2 : 3)
+
+    let index
+    do {
+      index = Math.floor(Math.random() * coverCount)
+    } while (previousIndexes.includes(index) && previousIndexes.length < coverCount)
+
+    previousIndexes.push(index)
+    if (previousIndexes.length > maxPreviousIndexes) {
+      previousIndexes.shift()
+    }
+
+    return defaultCover[index]
+  }
+
+  const handleImg = data => {
+    const imgTestReg = /\.(png|jpe?g|gif|svg|webp|avif)(\?.*)?$/i
+    let { cover: coverVal, top_img: topImg } = data
+
+    // Add path to top_img and cover if post_asset_folder is enabled
+    if (hexo.config.post_asset_folder) {
+      if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) {
+        data.top_img = `${data.path}${topImg}`
+      }
+      if (coverVal && coverVal.indexOf('/') === -1 && imgTestReg.test(coverVal)) {
+        data.cover = `${data.path}${coverVal}`
+      }
+    }
+
+    if (coverVal === false) return data
+
+    // If cover is not set, use random cover
+    if (!coverVal) {
+      const { cover: { default_cover: defaultCover } } = hexo.theme.config
+      const randomCover = getRandomCover(defaultCover)
+      data.cover = randomCover
+      coverVal = randomCover // update coverVal
+    }
+
+    if (coverVal && (coverVal.indexOf('//') !== -1 || imgTestReg.test(coverVal))) {
+      data.cover_type = 'img'
+    }
+
+    return data
+  }
+
+  // https://github.com/hexojs/hexo/blob/master/lib%2Fplugins%2Fgenerator%2Fpost.ts
+  const posts = locals.posts.sort('date').toArray()
+  const { length } = posts
+
+  return posts.map((post, i) => {
+    if (i) post.prev = posts[i - 1]
+    if (i < length - 1) post.next = posts[i + 1]
+
+    post.__post = true
+
+    return {
+      data: handleImg(post),
+      layout: 'post',
+      path: post.path
+    }
+  })
+})
diff --git a/scripts/helpers/aside_archives.js b/scripts/helpers/aside_archives.js
index df24317..dd07b57 100644
--- a/scripts/helpers/aside_archives.js
+++ b/scripts/helpers/aside_archives.js
@@ -1,118 +1,118 @@
-'use strict'
-
-hexo.extend.helper.register('aside_archives', function (options = {}) {
-  const { config, page, site, url_for, _p } = this
-  const {
-    archive_dir: archiveDir,
-    timezone,
-    language
-  } = config
-
-  // Destructure and set default options with object destructuring
-  const {
-    type = 'monthly',
-    format = type === 'monthly' ? 'MMMM YYYY' : 'YYYY',
-    show_count: showCount = true,
-    order = -1,
-    limit,
-    transform
-  } = options
-
-  // Optimize locale handling
-  const lang = toMomentLocale(page.lang || page.language || language)
-
-  // Memoize comparison function to improve performance
-  const compareFunc = type === 'monthly'
-    ? (yearA, monthA, yearB, monthB) => yearA === yearB && monthA === monthB
-    : (yearA, yearB) => yearA === yearB
-
-  // Early return if no posts
-  if (!site.posts.length) return ''
-
-  // Use reduce for more efficient data processing
-  const data = site.posts
-    .sort('date', order)
-    .reduce((acc, post) => {
-      let date = post.date.clone()
-      if (timezone) date = date.tz(timezone)
-
-      const year = date.year()
-      const month = date.month() + 1
-
-      if (lang) date = date.locale(lang)
-
-      // Find or create archive entry
-      const lastEntry = acc[acc.length - 1]
-      if (!lastEntry || !compareFunc(
-        lastEntry.year,
-        lastEntry.month,
-        year,
-        month
-      )) {
-        acc.push({
-          name: date.format(format),
-          year,
-          month,
-          count: 1
-        })
-      } else {
-        lastEntry.count++
-      }
-
-      return acc
-    }, [])
-
-  // Create link generator function
-  const createArchiveLink = item => {
-    let url = `${archiveDir}/${item.year}/`
-    if (type === 'monthly') {
-      url += item.month < 10 ? `0${item.month}/` : `${item.month}/`
-    }
-    return url_for(url)
-  }
-
-  // Limit results efficiently
-  const limitedData = limit > 0
-    ? data.slice(0, Math.min(data.length, limit))
-    : data
-
-  // Use template literal for better readability
-  const archiveHeader = `
-    

-      
-      ${_p('aside.card_archives')}
-      ${data.length > limitedData.length
-        ? `
-            
-          `
-        : ''}
-    

-  `
-
-  // Use map for generating list items, join for performance
-  const archiveList = `
-    
-  `
-
-  return archiveHeader + archiveList
-})
-
-// Improved locale conversion function
-const toMomentLocale = lang => {
-  if (!lang || ['en', 'default'].includes(lang)) return 'en'
-  return lang.toLowerCase().replace('_', '-')
-}
+'use strict'
+
+hexo.extend.helper.register('aside_archives', function (options = {}) {
+  const { config, page, site, url_for, _p } = this
+  const {
+    archive_dir: archiveDir,
+    timezone,
+    language
+  } = config
+
+  // Destructure and set default options with object destructuring
+  const {
+    type = 'monthly',
+    format = type === 'monthly' ? 'MMMM YYYY' : 'YYYY',
+    show_count: showCount = true,
+    order = -1,
+    limit,
+    transform
+  } = options
+
+  // Optimize locale handling
+  const lang = toMomentLocale(page.lang || page.language || language)
+
+  // Memoize comparison function to improve performance
+  const compareFunc = type === 'monthly'
+    ? (yearA, monthA, yearB, monthB) => yearA === yearB && monthA === monthB
+    : (yearA, yearB) => yearA === yearB
+
+  // Early return if no posts
+  if (!site.posts.length) return ''
+
+  // Use reduce for more efficient data processing
+  const data = site.posts
+    .sort('date', order)
+    .reduce((acc, post) => {
+      let date = post.date.clone()
+      if (timezone) date = date.tz(timezone)
+
+      const year = date.year()
+      const month = date.month() + 1
+
+      if (lang) date = date.locale(lang)
+
+      // Find or create archive entry
+      const lastEntry = acc[acc.length - 1]
+      if (!lastEntry || !compareFunc(
+        lastEntry.year,
+        lastEntry.month,
+        year,
+        month
+      )) {
+        acc.push({
+          name: date.format(format),
+          year,
+          month,
+          count: 1
+        })
+      } else {
+        lastEntry.count++
+      }
+
+      return acc
+    }, [])
+
+  // Create link generator function
+  const createArchiveLink = item => {
+    let url = `${archiveDir}/${item.year}/`
+    if (type === 'monthly') {
+      url += item.month < 10 ? `0${item.month}/` : `${item.month}/`
+    }
+    return url_for(url)
+  }
+
+  // Limit results efficiently
+  const limitedData = limit > 0
+    ? data.slice(0, Math.min(data.length, limit))
+    : data
+
+  // Use template literal for better readability
+  const archiveHeader = `
+    

+      
+      ${_p('aside.card_archives')}
+      ${data.length > limitedData.length
+        ? `
+            
+          `
+        : ''}
+    

+  `
+
+  // Use map for generating list items, join for performance
+  const archiveList = `
+    
+  `
+
+  return archiveHeader + archiveList
+})
+
+// Improved locale conversion function
+const toMomentLocale = lang => {
+  if (!lang || ['en', 'default'].includes(lang)) return 'en'
+  return lang.toLowerCase().replace('_', '-')
+}
diff --git a/scripts/helpers/aside_categories.js b/scripts/helpers/aside_categories.js
index 4fb3135..faeba94 100644
--- a/scripts/helpers/aside_categories.js
+++ b/scripts/helpers/aside_categories.js
@@ -1,81 +1,81 @@
-'use strict'
-
-hexo.extend.helper.register('aside_categories', function (categories, options = {}) {
-  if (!categories || !Object.prototype.hasOwnProperty.call(categories, 'length')) {
-    options = categories || {}
-    categories = this.site.categories
-  }
-
-  if (!categories || !categories.length) return ''
-
-  const { config } = this
-  const showCount = Object.prototype.hasOwnProperty.call(options, 'show_count') ? options.show_count : true
-  const depth = options.depth ? parseInt(options.depth, 10) : 0
-  const orderby = options.orderby || 'name'
-  const order = options.order || 1
-  const categoryDir = this.url_for(config.category_dir)
-  const limit = options.limit === 0 ? categories.length : (options.limit || categories.length)
-  const isExpand = options.expand !== 'none'
-  const expandClass = isExpand && options.expand === true ? 'expand' : ''
-  const buttonLabel = this._p('aside.more_button')
-
-  const prepareQuery = parent => {
-    const query = parent ? { parent } : { parent: { $exists: false } }
-    return categories.find(query).sort(orderby, order).filter(cat => cat.length)
-  }
-
-  const hierarchicalList = (remaining, level = 0, parent) => {
-    let result = ''
-    if (remaining > 0) {
-      prepareQuery(parent).forEach(cat => {
-        if (remaining > 0) {
-          remaining -= 1
-          let child = ''
-          if (!depth || level + 1 < depth) {
-            const childList = hierarchicalList(remaining, level + 1, cat._id)
-            child = childList.result
-            remaining = childList.remaining
-          }
-
-          const parentClass = isExpand && !parent && child ? 'parent' : ''
-          result += `
  • `
-          result += ``
-          result += `${cat.name}`
-
-          if (showCount) {
-            result += `${cat.length}`
-          }
-
-          if (isExpand && !parent && child) {
-            result += ``
-          }
-
-          result += ''
-
-          if (child) {
-            result += `
      ${child}
    `
-          }
-
-          result += '
    • '
-        }
-      })
-    }
-    return { result, remaining }
-  }
-
-  const list = hierarchicalList(limit)
-
-  const moreButton = categories.length > limit
-    ? `
-      `
-    : ''
-
-  return `
    
-            
-            ${this._p('aside.card_categories')}
-            ${moreButton}
-          
    
-          
      
-            ${list.result}
-          
    `
-})
+'use strict'
+
+hexo.extend.helper.register('aside_categories', function (categories, options = {}) {
+  if (!categories || !Object.prototype.hasOwnProperty.call(categories, 'length')) {
+    options = categories || {}
+    categories = this.site.categories
+  }
+
+  if (!categories || !categories.length) return ''
+
+  const { config } = this
+  const showCount = Object.prototype.hasOwnProperty.call(options, 'show_count') ? options.show_count : true
+  const depth = options.depth ? parseInt(options.depth, 10) : 0
+  const orderby = options.orderby || 'name'
+  const order = options.order || 1
+  const categoryDir = this.url_for(config.category_dir)
+  const limit = options.limit === 0 ? categories.length : (options.limit || categories.length)
+  const isExpand = options.expand !== 'none'
+  const expandClass = isExpand && options.expand === true ? 'expand' : ''
+  const buttonLabel = this._p('aside.more_button')
+
+  const prepareQuery = parent => {
+    const query = parent ? { parent } : { parent: { $exists: false } }
+    return categories.find(query).sort(orderby, order).filter(cat => cat.length)
+  }
+
+  const hierarchicalList = (remaining, level = 0, parent) => {
+    let result = ''
+    if (remaining > 0) {
+      prepareQuery(parent).forEach(cat => {
+        if (remaining > 0) {
+          remaining -= 1
+          let child = ''
+          if (!depth || level + 1 < depth) {
+            const childList = hierarchicalList(remaining, level + 1, cat._id)
+            child = childList.result
+            remaining = childList.remaining
+          }
+
+          const parentClass = isExpand && !parent && child ? 'parent' : ''
+          result += `
  • `
+          result += ``
+          result += `${cat.name}`
+
+          if (showCount) {
+            result += `${cat.length}`
+          }
+
+          if (isExpand && !parent && child) {
+            result += ``
+          }
+
+          result += ''
+
+          if (child) {
+            result += `
      ${child}
    `
+          }
+
+          result += '
    • '
+        }
+      })
+    }
+    return { result, remaining }
+  }
+
+  const list = hierarchicalList(limit)
+
+  const moreButton = categories.length > limit
+    ? `
+      `
+    : ''
+
+  return `
    
+            
+            ${this._p('aside.card_categories')}
+            ${moreButton}
+          
    
+          
      
+            ${list.result}
+          
    `
+})
diff --git a/scripts/helpers/getArchiveLength.js b/scripts/helpers/getArchiveLength.js
index 1ff35c8..bdeb87c 100644
--- a/scripts/helpers/getArchiveLength.js
+++ b/scripts/helpers/getArchiveLength.js
@@ -1,45 +1,45 @@
-hexo.extend.helper.register('getArchiveLength', function () {
-  const archiveGenerator = hexo.config.archive_generator
-  const posts = this.site.posts
-
-  const { yearly, monthly, daily } = archiveGenerator
-  const { year, month, day } = this.page
-
-  // Archives Page
-  if (!year) return posts.length
-
-  // Function to generate a unique key based on the granularity
-  const getKey = (post, type) => {
-    const date = post.date.clone()
-    const y = date.year()
-    const m = date.month() + 1
-    const d = date.date()
-    if (type === 'year') return `${y}`
-    if (type === 'month') return `${y}-${m}`
-    if (type === 'day') return `${y}-${m}-${d}`
-  }
-
-  // Create a map to count posts per period
-  const mapData = this.fragment_cache('createArchiveObj', () => {
-    const map = new Map()
-    posts.forEach(post => {
-      const keyYear = getKey(post, 'year')
-      const keyMonth = getKey(post, 'month')
-      const keyDay = getKey(post, 'day')
-
-      if (yearly) map.set(keyYear, (map.get(keyYear) || 0) + 1)
-      if (monthly) map.set(keyMonth, (map.get(keyMonth) || 0) + 1)
-      if (daily) map.set(keyDay, (map.get(keyDay) || 0) + 1)
-    })
-    return map
-  })
-
-  // Determine the appropriate key to fetch based on current page context
-  let key
-  if (yearly && year) key = `${year}`
-  if (monthly && month) key = `${year}-${month}`
-  if (daily && day) key = `${year}-${month}-${day}`
-
-  // Return the count for the current period or default to the total posts
-  return mapData.get(key) || posts.length
-})
+hexo.extend.helper.register('getArchiveLength', function () {
+  const archiveGenerator = hexo.config.archive_generator
+  const posts = this.site.posts
+
+  const { yearly, monthly, daily } = archiveGenerator
+  const { year, month, day } = this.page
+
+  // Archives Page
+  if (!year) return posts.length
+
+  // Function to generate a unique key based on the granularity
+  const getKey = (post, type) => {
+    const date = post.date.clone()
+    const y = date.year()
+    const m = date.month() + 1
+    const d = date.date()
+    if (type === 'year') return `${y}`
+    if (type === 'month') return `${y}-${m}`
+    if (type === 'day') return `${y}-${m}-${d}`
+  }
+
+  // Create a map to count posts per period
+  const mapData = this.fragment_cache('createArchiveObj', () => {
+    const map = new Map()
+    posts.forEach(post => {
+      const keyYear = getKey(post, 'year')
+      const keyMonth = getKey(post, 'month')
+      const keyDay = getKey(post, 'day')
+
+      if (yearly) map.set(keyYear, (map.get(keyYear) || 0) + 1)
+      if (monthly) map.set(keyMonth, (map.get(keyMonth) || 0) + 1)
+      if (daily) map.set(keyDay, (map.get(keyDay) || 0) + 1)
+    })
+    return map
+  })
+
+  // Determine the appropriate key to fetch based on current page context
+  let key
+  if (yearly && year) key = `${year}`
+  if (monthly && month) key = `${year}-${month}`
+  if (daily && day) key = `${year}-${month}-${day}`
+
+  // Return the count for the current period or default to the total posts
+  return mapData.get(key) || posts.length
+})
diff --git a/scripts/helpers/inject_head_js.js b/scripts/helpers/inject_head_js.js
index 3cf31cb..5598674 100644
--- a/scripts/helpers/inject_head_js.js
+++ b/scripts/helpers/inject_head_js.js
@@ -1,155 +1,155 @@
-'use strict'
-
-hexo.extend.helper.register('inject_head_js', function () {
-  const { darkmode, aside, pjax } = this.theme
-  const start = darkmode.start || 6
-  const end = darkmode.end || 18
-  const { theme_color } = hexo.theme.config
-  const themeColorLight = theme_color && theme_color.enable ? theme_color.meta_theme_color_light : '#ffffff'
-  const themeColorDark = theme_color && theme_color.enable ? theme_color.meta_theme_color_dark : '#0d0d0d'
-
-  const createCustomJs = () => `
-    const saveToLocal = {
-      set: (key, value, ttl) => {
-        if (!ttl) return
-        const expiry = Date.now() + ttl * 86400000
-        localStorage.setItem(key, JSON.stringify({ value, expiry }))
-      },
-      get: key => {
-        const itemStr = localStorage.getItem(key)
-        if (!itemStr) return undefined
-        const { value, expiry } = JSON.parse(itemStr)
-        if (Date.now() > expiry) {
-          localStorage.removeItem(key)
-          return undefined
-        }
-        return value
-      }
-    }
-
-    window.btf = {
-      saveToLocal,
-      getScript: (url, attr = {}) => new Promise((resolve, reject) => {
-        const script = document.createElement('script')
-        script.src = url
-        script.async = true
-        Object.entries(attr).forEach(([key, val]) => script.setAttribute(key, val))
-        script.onload = script.onreadystatechange = () => {
-          if (!script.readyState || /loaded|complete/.test(script.readyState)) resolve()
-        }
-        script.onerror = reject
-        document.head.appendChild(script)
-      }),
-      getCSS: (url, id) => new Promise((resolve, reject) => {
-        const link = document.createElement('link')
-        link.rel = 'stylesheet'
-        link.href = url
-        if (id) link.id = id
-        link.onload = link.onreadystatechange = () => {
-          if (!link.readyState || /loaded|complete/.test(link.readyState)) resolve()
-        }
-        link.onerror = reject
-        document.head.appendChild(link)
-      }),
-      addGlobalFn: (key, fn, name = false, parent = window) => {
-        if (!${pjax.enable} && key.startsWith('pjax')) return
-        const globalFn = parent.globalFn || {}
-        globalFn[key] = globalFn[key] || {}
-        globalFn[key][name || Object.keys(globalFn[key]).length] = fn
-        parent.globalFn = globalFn
-      }
-    }
-  `
-
-  const createDarkmodeJs = () => {
-    if (!darkmode.enable) return ''
-
-    let darkmodeJs = `
-      const activateDarkMode = () => {
-        document.documentElement.setAttribute('data-theme', 'dark')
-        if (document.querySelector('meta[name="theme-color"]') !== null) {
-          document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorDark}')
-        }
-      }
-      const activateLightMode = () => {
-        document.documentElement.setAttribute('data-theme', 'light')
-        if (document.querySelector('meta[name="theme-color"]') !== null) {
-          document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorLight}')
-        }
-      }
-
-      btf.activateDarkMode = activateDarkMode
-      btf.activateLightMode = activateLightMode
-
-      const theme = saveToLocal.get('theme')
-    `
-
-    switch (darkmode.autoChangeMode) {
-      case 1:
-        darkmodeJs += `
-          const mediaQueryDark = window.matchMedia('(prefers-color-scheme: dark)')
-          const mediaQueryLight = window.matchMedia('(prefers-color-scheme: light)')
-          
-          if (theme === undefined) {
-            if (mediaQueryLight.matches) activateLightMode()
-            else if (mediaQueryDark.matches) activateDarkMode()
-            else {
-              const hour = new Date().getHours()
-              const isNight = hour <= ${start} || hour >= ${end}
-              isNight ? activateDarkMode() : activateLightMode()
-            }
-            mediaQueryDark.addEventListener('change', () => {
-              if (saveToLocal.get('theme') === undefined) {
-                e.matches ? activateDarkMode() : activateLightMode()
-              }
-            })
-          } else {
-            theme === 'light' ? activateLightMode() : activateDarkMode()
-          }
-        `
-        break
-      case 2:
-        darkmodeJs += `
-          const hour = new Date().getHours()
-          const isNight = hour <= ${start} || hour >= ${end}
-          if (theme === undefined) isNight ? activateDarkMode() : activateLightMode()
-          else theme === 'light' ? activateLightMode() : activateDarkMode()
-        `
-        break
-      default:
-        darkmodeJs += `
-          theme === 'dark' ? activateDarkMode() : theme === 'light' ? activateLightMode() : null
-        `
-    }
-
-    return darkmodeJs
-  }
-
-  const createAsideStatusJs = () => {
-    if (!aside.enable || !aside.button) return ''
-    return `
-      const asideStatus = saveToLocal.get('aside-status')
-      if (asideStatus !== undefined) {
-        document.documentElement.classList.toggle('hide-aside', asideStatus === 'hide')
-      }
-    `
-  }
-
-  const createDetectAppleJs = () => `
-    const detectApple = () => {
-      if (/iPad|iPhone|iPod|Macintosh/.test(navigator.userAgent)) {
-        document.documentElement.classList.add('apple')
-      }
-    }
-    detectApple()
-  `
-
-  return ``
-})
+'use strict'
+
+hexo.extend.helper.register('inject_head_js', function () {
+  const { darkmode, aside, pjax } = this.theme
+  const start = darkmode.start || 6
+  const end = darkmode.end || 18
+  const { theme_color } = hexo.theme.config
+  const themeColorLight = theme_color && theme_color.enable ? theme_color.meta_theme_color_light : '#ffffff'
+  const themeColorDark = theme_color && theme_color.enable ? theme_color.meta_theme_color_dark : '#0d0d0d'
+
+  const createCustomJs = () => `
+    const saveToLocal = {
+      set: (key, value, ttl) => {
+        if (!ttl) return
+        const expiry = Date.now() + ttl * 86400000
+        localStorage.setItem(key, JSON.stringify({ value, expiry }))
+      },
+      get: key => {
+        const itemStr = localStorage.getItem(key)
+        if (!itemStr) return undefined
+        const { value, expiry } = JSON.parse(itemStr)
+        if (Date.now() > expiry) {
+          localStorage.removeItem(key)
+          return undefined
+        }
+        return value
+      }
+    }
+
+    window.btf = {
+      saveToLocal,
+      getScript: (url, attr = {}) => new Promise((resolve, reject) => {
+        const script = document.createElement('script')
+        script.src = url
+        script.async = true
+        Object.entries(attr).forEach(([key, val]) => script.setAttribute(key, val))
+        script.onload = script.onreadystatechange = () => {
+          if (!script.readyState || /loaded|complete/.test(script.readyState)) resolve()
+        }
+        script.onerror = reject
+        document.head.appendChild(script)
+      }),
+      getCSS: (url, id) => new Promise((resolve, reject) => {
+        const link = document.createElement('link')
+        link.rel = 'stylesheet'
+        link.href = url
+        if (id) link.id = id
+        link.onload = link.onreadystatechange = () => {
+          if (!link.readyState || /loaded|complete/.test(link.readyState)) resolve()
+        }
+        link.onerror = reject
+        document.head.appendChild(link)
+      }),
+      addGlobalFn: (key, fn, name = false, parent = window) => {
+        if (!${pjax.enable} && key.startsWith('pjax')) return
+        const globalFn = parent.globalFn || {}
+        globalFn[key] = globalFn[key] || {}
+        globalFn[key][name || Object.keys(globalFn[key]).length] = fn
+        parent.globalFn = globalFn
+      }
+    }
+  `
+
+  const createDarkmodeJs = () => {
+    if (!darkmode.enable) return ''
+
+    let darkmodeJs = `
+      const activateDarkMode = () => {
+        document.documentElement.setAttribute('data-theme', 'dark')
+        if (document.querySelector('meta[name="theme-color"]') !== null) {
+          document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorDark}')
+        }
+      }
+      const activateLightMode = () => {
+        document.documentElement.setAttribute('data-theme', 'light')
+        if (document.querySelector('meta[name="theme-color"]') !== null) {
+          document.querySelector('meta[name="theme-color"]').setAttribute('content', '${themeColorLight}')
+        }
+      }
+
+      btf.activateDarkMode = activateDarkMode
+      btf.activateLightMode = activateLightMode
+
+      const theme = saveToLocal.get('theme')
+    `
+
+    switch (darkmode.autoChangeMode) {
+      case 1:
+        darkmodeJs += `
+          const mediaQueryDark = window.matchMedia('(prefers-color-scheme: dark)')
+          const mediaQueryLight = window.matchMedia('(prefers-color-scheme: light)')
+          
+          if (theme === undefined) {
+            if (mediaQueryLight.matches) activateLightMode()
+            else if (mediaQueryDark.matches) activateDarkMode()
+            else {
+              const hour = new Date().getHours()
+              const isNight = hour <= ${start} || hour >= ${end}
+              isNight ? activateDarkMode() : activateLightMode()
+            }
+            mediaQueryDark.addEventListener('change', () => {
+              if (saveToLocal.get('theme') === undefined) {
+                e.matches ? activateDarkMode() : activateLightMode()
+              }
+            })
+          } else {
+            theme === 'light' ? activateLightMode() : activateDarkMode()
+          }
+        `
+        break
+      case 2:
+        darkmodeJs += `
+          const hour = new Date().getHours()
+          const isNight = hour <= ${start} || hour >= ${end}
+          if (theme === undefined) isNight ? activateDarkMode() : activateLightMode()
+          else theme === 'light' ? activateLightMode() : activateDarkMode()
+        `
+        break
+      default:
+        darkmodeJs += `
+          theme === 'dark' ? activateDarkMode() : theme === 'light' ? activateLightMode() : null
+        `
+    }
+
+    return darkmodeJs
+  }
+
+  const createAsideStatusJs = () => {
+    if (!aside.enable || !aside.button) return ''
+    return `
+      const asideStatus = saveToLocal.get('aside-status')
+      if (asideStatus !== undefined) {
+        document.documentElement.classList.toggle('hide-aside', asideStatus === 'hide')
+      }
+    `
+  }
+
+  const createDetectAppleJs = () => `
+    const detectApple = () => {
+      if (/iPad|iPhone|iPod|Macintosh/.test(navigator.userAgent)) {
+        document.documentElement.classList.add('apple')
+      }
+    }
+    detectApple()
+  `
+
+  return ``
+})
diff --git a/scripts/helpers/page.js b/scripts/helpers/page.js
index 3259640..9084919 100644
--- a/scripts/helpers/page.js
+++ b/scripts/helpers/page.js
@@ -1,147 +1,152 @@
-'use strict'
-
-const { truncateContent, postDesc } = require('../common/postDesc')
-const { prettyUrls } = require('hexo-util')
-const crypto = require('crypto')
-const moment = require('moment-timezone')
-
-hexo.extend.helper.register('truncate', truncateContent)
-
-hexo.extend.helper.register('postDesc', data => {
-  return postDesc(data, hexo)
-})
-
-hexo.extend.helper.register('cloudTags', function (options = {}) {
-  const env = this
-  let { source, minfontsize, maxfontsize, limit, unit = 'px', orderby, order } = options
-
-  if (limit > 0) {
-    source = source.limit(limit)
-  }
-
-  const sizes = [...new Set(source.map(tag => tag.length).sort((a, b) => a - b))]
-
-  const getRandomColor = () => {
-    const randomColor = () => Math.floor(Math.random() * 201)
-    const r = randomColor()
-    const g = randomColor()
-    const b = randomColor()
-    return `rgb(${Math.max(r, 50)}, ${Math.max(g, 50)}, ${Math.max(b, 50)})`
-  }
-
-  const generateStyle = (size, unit) =>
-    `font-size: ${parseFloat(size.toFixed(2)) + unit}; color: ${getRandomColor()};`
-
-  const length = sizes.length - 1
-  const result = source.sort(orderby, order).map(tag => {
-    const ratio = length ? sizes.indexOf(tag.length) / length : 0
-    const size = minfontsize + ((maxfontsize - minfontsize) * ratio)
-    const style = generateStyle(size, unit)
-    return `${tag.name}`
-  }).join('')
-
-  return result
-})
-
-hexo.extend.helper.register('urlNoIndex', function (url = null, trailingIndex = false, trailingHtml = false) {
-  return prettyUrls(url || this.url, { trailing_index: trailingIndex, trailing_html: trailingHtml })
-})
-
-hexo.extend.helper.register('md5', function (path) {
-  return crypto.createHash('md5').update(decodeURI(this.url_for(path))).digest('hex')
-})
-
-hexo.extend.helper.register('injectHtml', data => {
-  return data ? data.join('') : ''
-})
-
-hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) {
-  if (page.year) {
-    const dateStr = page.month ? `${page.year}-${page.month}` : `${page.year}`
-    const dateFormat = page.month ? hexo.theme.config.aside.card_archives.format : 'YYYY'
-    return date(dateStr, dateFormat)
-  }
-
-  const defaultTitle = this._p('page.archives')
-  if (!menu) return defaultTitle
-
-  const loop = (m) => {
-    for (const key in m) {
-      if (typeof m[key] === 'object') {
-        const result = loop(m[key])
-        if (result) return result
-      }
-
-      if (/\/archives\//.test(m[key])) {
-        return key
-      }
-    }
-  }
-
-  return loop(menu) || defaultTitle
-})
-
-hexo.extend.helper.register('getBgPath', path => {
-  if (!path) return ''
-
-  const absoluteUrlPattern = /^(?:[a-z][a-z\d+.-]*:)?\/\//i
-  const relativeUrlPattern = /^(\.\/|\.\.\/|\/|[^/]+\/).*$/
-  const colorPattern = /^(#|rgb|rgba|hsl|hsla)/i
-
-  if (colorPattern.test(path)) {
-    return `background-color: ${path};`
-  } else if (absoluteUrlPattern.test(path) || relativeUrlPattern.test(path)) {
-    return `background-image: url(${path});`
-  } else {
-    return `background: ${path};`
-  }
-})
-
-hexo.extend.helper.register('shuoshuoFN', (data, page) => {
-  const { limit } = page
-  let finalResult = ''
-
-  // Check if limit.value is a valid date
-  const isValidDate = date => !isNaN(Date.parse(date))
-
-  // order by date
-  const orderByDate = data => data.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))
-
-  // Apply number limit or time limit conditionally
-  const limitData = data => {
-    if (limit && limit.type === 'num' && limit.value > 0) {
-      return data.slice(0, limit.value)
-    } else if (limit && limit.type === 'date' && isValidDate(limit.value)) {
-      const limitDate = Date.parse(limit.value)
-      return data.filter(item => Date.parse(item.date) >= limitDate)
-    }
-
-    return data
-  }
-
-  orderByDate(data)
-  finalResult = limitData(data)
-
-  // This is a hack method, because hexo treats time as UTC time
-  // so you need to manually convert the time zone
-  finalResult.forEach(item => {
-    const utcDate = moment.utc(item.date).format('YYYY-MM-DD HH:mm:ss')
-    item.date = moment.tz(utcDate, hexo.config.timezone).format('YYYY-MM-DD HH:mm:ss')
-  })
-
-  return finalResult
-})
-
-hexo.extend.helper.register('getPageType', (page, isHome) => {
-  const { layout, tag, category, type, archive } = page
-  if (layout) return layout
-  if (tag) return 'tag'
-  if (category) return 'category'
-  if (archive) return 'archive'
-  if (type) {
-    if (type === 'tags' || type === 'categories') return type
-    else return 'page'
-  }
-  if (isHome) return 'home'
-  return 'post'
-})
+'use strict'
+
+const { truncateContent, postDesc } = require('../common/postDesc')
+const { prettyUrls } = require('hexo-util')
+const crypto = require('crypto')
+const moment = require('moment-timezone')
+
+hexo.extend.helper.register('truncate', truncateContent)
+
+hexo.extend.helper.register('postDesc', data => {
+  return postDesc(data, hexo)
+})
+
+hexo.extend.helper.register('cloudTags', function (options = {}) {
+  const env = this
+  let { source, minfontsize, maxfontsize, limit, unit = 'px', orderby, order } = options
+
+  if (limit > 0) {
+    source = source.limit(limit)
+  }
+
+  const sizes = [...new Set(source.map(tag => tag.length).sort((a, b) => a - b))]
+
+  const getRandomColor = () => {
+    const randomColor = () => Math.floor(Math.random() * 201)
+    const r = randomColor()
+    const g = randomColor()
+    const b = randomColor()
+    return `rgb(${Math.max(r, 50)}, ${Math.max(g, 50)}, ${Math.max(b, 50)})`
+  }
+
+  const generateStyle = (size, unit) =>
+    `font-size: ${parseFloat(size.toFixed(2)) + unit}; color: ${getRandomColor()};`
+
+  const length = sizes.length - 1
+  const result = source.sort(orderby, order).map(tag => {
+    const ratio = length ? sizes.indexOf(tag.length) / length : 0
+    const size = minfontsize + ((maxfontsize - minfontsize) * ratio)
+    const style = generateStyle(size, unit)
+    return `${tag.name}`
+  }).join('')
+
+  return result
+})
+
+hexo.extend.helper.register('urlNoIndex', function (url = null, trailingIndex = false, trailingHtml = false) {
+  return prettyUrls(url || this.url, { trailing_index: trailingIndex, trailing_html: trailingHtml })
+})
+
+hexo.extend.helper.register('md5', function (path) {
+  return crypto.createHash('md5').update(decodeURI(this.url_for(path))).digest('hex')
+})
+
+hexo.extend.helper.register('injectHtml', data => {
+  return data ? data.join('') : ''
+})
+
+hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) {
+  if (page.year) {
+    const dateStr = page.month ? `${page.year}-${page.month}` : `${page.year}`
+    const dateFormat = page.month ? hexo.theme.config.aside.card_archives.format : 'YYYY'
+    return date(dateStr, dateFormat)
+  }
+
+  const defaultTitle = this._p('page.archives')
+  if (!menu) return defaultTitle
+
+  const loop = (m) => {
+    for (const key in m) {
+      if (typeof m[key] === 'object') {
+        const result = loop(m[key])
+        if (result) return result
+      }
+
+      if (/\/archives\//.test(m[key])) {
+        return key
+      }
+    }
+  }
+
+  return loop(menu) || defaultTitle
+})
+
+hexo.extend.helper.register('getBgPath', path => {
+  if (!path) return ''
+
+  const absoluteUrlPattern = /^(?:[a-z][a-z\d+.-]*:)?\/\//i
+  const relativeUrlPattern = /^(\.\/|\.\.\/|\/|[^/]+\/).*$/
+  const colorPattern = /^(#|rgb|rgba|hsl|hsla)/i
+
+  if (colorPattern.test(path)) {
+    return `background-color: ${path};`
+  } else if (absoluteUrlPattern.test(path) || relativeUrlPattern.test(path)) {
+    return `background-image: url(${path});`
+  } else {
+    return `background: ${path};`
+  }
+})
+
+hexo.extend.helper.register('shuoshuoFN', (data, page) => {
+  const { limit } = page
+  let finalResult = ''
+
+  // Check if limit.value is a valid date
+  const isValidDate = date => !isNaN(Date.parse(date))
+
+  // order by date
+  const orderByDate = data => data.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))
+
+  // Apply number limit or time limit conditionally
+  const limitData = data => {
+    if (limit && limit.type === 'num' && limit.value > 0) {
+      return data.slice(0, limit.value)
+    } else if (limit && limit.type === 'date' && isValidDate(limit.value)) {
+      const limitDate = Date.parse(limit.value)
+      return data.filter(item => Date.parse(item.date) >= limitDate)
+    }
+
+    return data
+  }
+
+  orderByDate(data)
+  finalResult = limitData(data)
+
+  // This is a hack method, because hexo treats time as UTC time
+  // so you need to manually convert the time zone
+  finalResult.forEach(item => {
+    const utcDate = moment.utc(item.date).format('YYYY-MM-DD HH:mm:ss')
+    item.date = moment.tz(utcDate, hexo.config.timezone).format('YYYY-MM-DD HH:mm:ss')
+  })
+
+  return finalResult
+})
+
+hexo.extend.helper.register('getPageType', (page, isHome) => {
+  const { layout, tag, category, type, archive } = page
+  if (layout) return layout
+  if (tag) return 'tag'
+  if (category) return 'category'
+  if (archive) return 'archive'
+  if (type) {
+    if (type === 'tags' || type === 'categories') return type
+    else return 'page'
+  }
+  if (isHome) return 'home'
+  return 'post'
+})
+
+hexo.extend.helper.register('getVersion', () => {
+  const { version } = require('../../package.json')
+  return { hexo: hexo.version, theme: version }
+})
diff --git a/scripts/helpers/related_post.js b/scripts/helpers/related_post.js
index 8059dbe..69d9aaa 100644
--- a/scripts/helpers/related_post.js
+++ b/scripts/helpers/related_post.js
@@ -1,97 +1,97 @@
-/* eslint-disable camelcase */
-/**
- * Butterfly
- * Related Posts
- * According the tag
- */
-
-'use strict'
-
-const { postDesc } = require('../common/postDesc')
-
-hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
-  let relatedPosts = []
-  const tagsData = currentPost.tags
-  tagsData.length && tagsData.forEach(function (tag) {
-    allPosts.forEach(function (post) {
-      if (currentPost.path !== post.path && isTagRelated(tag.name, post.tags)) {
-        const getPostDesc = post.postDesc || postDesc(post, hexo)
-        const relatedPost = {
-          title: post.title,
-          path: post.path,
-          cover: post.cover,
-          cover_type: post.cover_type,
-          weight: 1,
-          updated: post.updated,
-          created: post.date,
-          postDesc: getPostDesc
-        }
-        const index = findItem(relatedPosts, 'path', post.path)
-        if (index !== -1) {
-          relatedPosts[index].weight += 1
-        } else {
-          relatedPosts.push(relatedPost)
-        }
-      }
-    })
-  })
-
-  if (relatedPosts.length === 0) {
-    return ''
-  }
-  let result = ''
-  const hexoConfig = hexo.config
-  const config = hexo.theme.config
-
-  const limitNum = config.related_post.limit || 6
-  const dateType = config.related_post.date_type || 'created'
-  const headlineLang = this._p('post.recommend')
-
-  relatedPosts = relatedPosts.sort(compare('weight'))
-
-  if (relatedPosts.length > 0) {
-    result += '
    '
-    result += `
    ${headlineLang}
    `
-    result += '
    '
-
-    for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
-      let { cover, title, path, cover_type, created, updated, postDesc } = relatedPosts[i]
-      const { escape_html, url_for, date } = this
-      cover = cover || 'var(--default-bg-color)'
-      title = escape_html(title)
-      const className = postDesc ? 'pagination-related' : 'pagination-related no-desc'
-      result += ``
-      if (cover_type === 'img') {
-        result += `cover`
-      } else {
-        result += `
    `
-      }
-      if (dateType === 'created') {
-        result += `
     ${date(created, hexoConfig.date_format)}
    `
-      } else {
-        result += `
     ${date(updated, hexoConfig.date_format)}
    `
-      }
-      result += `
    ${title}
    `
-
-      if (postDesc) {
-        result += `
    ${postDesc}
    `
-      }
-      result += '
    '
-    }
-
-    result += '
    '
-    return result
-  }
-})
-
-function isTagRelated (tagName, tags) {
-  return tags.some(tag => tag.name === tagName)
-}
-
-function findItem (arrayToSearch, attr, val) {
-  return arrayToSearch.findIndex(item => item[attr] === val)
-}
-
-function compare (attr) {
-  return (a, b) => b[attr] - a[attr]
-}
+/* eslint-disable camelcase */
+/**
+ * Butterfly
+ * Related Posts
+ * According the tag
+ */
+
+'use strict'
+
+const { postDesc } = require('../common/postDesc')
+
+hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
+  let relatedPosts = []
+  const tagsData = currentPost.tags
+  tagsData.length && tagsData.forEach(function (tag) {
+    allPosts.forEach(function (post) {
+      if (currentPost.path !== post.path && isTagRelated(tag.name, post.tags)) {
+        const getPostDesc = post.postDesc || postDesc(post, hexo)
+        const relatedPost = {
+          title: post.title,
+          path: post.path,
+          cover: post.cover,
+          cover_type: post.cover_type,
+          weight: 1,
+          updated: post.updated,
+          created: post.date,
+          postDesc: getPostDesc
+        }
+        const index = findItem(relatedPosts, 'path', post.path)
+        if (index !== -1) {
+          relatedPosts[index].weight += 1
+        } else {
+          relatedPosts.push(relatedPost)
+        }
+      }
+    })
+  })
+
+  if (relatedPosts.length === 0) {
+    return ''
+  }
+  let result = ''
+  const hexoConfig = hexo.config
+  const config = hexo.theme.config
+
+  const limitNum = config.related_post.limit || 6
+  const dateType = config.related_post.date_type || 'created'
+  const headlineLang = this._p('post.recommend')
+
+  relatedPosts = relatedPosts.sort(compare('weight'))
+
+  if (relatedPosts.length > 0) {
+    result += '
    '
+    result += `
    ${headlineLang}
    `
+    result += '
    '
+
+    for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
+      let { cover, title, path, cover_type, created, updated, postDesc } = relatedPosts[i]
+      const { escape_html, url_for, date } = this
+      cover = cover || 'var(--default-bg-color)'
+      title = escape_html(title)
+      const className = postDesc ? 'pagination-related' : 'pagination-related no-desc'
+      result += ``
+      if (cover_type === 'img') {
+        result += `cover`
+      } else {
+        result += `
    `
+      }
+      if (dateType === 'created') {
+        result += `
     ${date(created, hexoConfig.date_format)}
    `
+      } else {
+        result += `
     ${date(updated, hexoConfig.date_format)}
    `
+      }
+      result += `
    ${title}
    `
+
+      if (postDesc) {
+        result += `
    ${postDesc}
    `
+      }
+      result += '
    '
+    }
+
+    result += '
    '
+    return result
+  }
+})
+
+function isTagRelated (tagName, tags) {
+  return tags.some(tag => tag.name === tagName)
+}
+
+function findItem (arrayToSearch, attr, val) {
+  return arrayToSearch.findIndex(item => item[attr] === val)
+}
+
+function compare (attr) {
+  return (a, b) => b[attr] - a[attr]
+}
diff --git a/scripts/helpers/series.js b/scripts/helpers/series.js
index ba202af..bd4e65f 100644
--- a/scripts/helpers/series.js
+++ b/scripts/helpers/series.js
@@ -1,22 +1,22 @@
-'use strict'
-
-hexo.extend.helper.register('groupPosts', function () {
-  const getGroupArray = array => {
-    return array.reduce((groups, item) => {
-      const key = item.series
-      if (key) {
-        groups[key] = groups[key] || []
-        groups[key].push(item)
-      }
-      return groups
-    }, {})
-  }
-
-  const sortPosts = posts => {
-    const { orderBy = 'date', order = 1 } = this.theme.aside.card_post_series
-    if (orderBy === 'title') return posts.sort('title', order)
-    return posts.sort('date', order)
-  }
-
-  return getGroupArray(sortPosts(this.site.posts))
-})
+'use strict'
+
+hexo.extend.helper.register('groupPosts', function () {
+  const getGroupArray = array => {
+    return array.reduce((groups, item) => {
+      const key = item.series
+      if (key) {
+        groups[key] = groups[key] || []
+        groups[key].push(item)
+      }
+      return groups
+    }, {})
+  }
+
+  const sortPosts = posts => {
+    const { orderBy = 'date', order = 1 } = this.theme.aside.card_post_series
+    if (orderBy === 'title') return posts.sort('title', order)
+    return posts.sort('date', order)
+  }
+
+  return getGroupArray(sortPosts(this.site.posts))
+})
diff --git a/scripts/tag/button.js b/scripts/tag/button.js
index 44f6648..c8303c2 100644
--- a/scripts/tag/button.js
+++ b/scripts/tag/button.js
@@ -1,21 +1,21 @@
-/**
- * Button
- * {% btn url text icon option %}
- * option: color outline center block larger
- * color : default/blue/pink/red/purple/orange/green
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-
-const btn = args => {
-  const [url = '', text = '', icon = '', option = ''] = args.join(' ').split(',').map(arg => arg.trim())
-
-  const iconHTML = icon ? `` : ''
-  const textHTML = text ? `${text}` : ''
-
-  return `${iconHTML}${textHTML}`
-}
-
-hexo.extend.tag.register('btn', btn, { ends: false })
+/**
+ * Button
+ * {% btn url text icon option %}
+ * option: color outline center block larger
+ * color : default/blue/pink/red/purple/orange/green
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+
+const btn = args => {
+  const [url = '', text = '', icon = '', option = ''] = args.join(' ').split(',').map(arg => arg.trim())
+
+  const iconHTML = icon ? `` : ''
+  const textHTML = text ? `${text}` : ''
+
+  return `${iconHTML}${textHTML}`
+}
+
+hexo.extend.tag.register('btn', btn, { ends: false })
diff --git a/scripts/tag/chartjs.js b/scripts/tag/chartjs.js
index e17af7c..b59902a 100644
--- a/scripts/tag/chartjs.js
+++ b/scripts/tag/chartjs.js
@@ -1,49 +1,49 @@
-/**
- * Butterfly
- * chartjs
- * https://www.chartjs.org/
- * {% chartjs [width, abreast, chartId] %}
- * 
- * 
- * 
- * 
- * {% endchartjs %}
- */
-
-'use strict'
-
-const { escapeHTML } = require('hexo-util')
-
-const chartjs = (args, content) => {
-  if (!content) return
-
-  const chartRegex = /\n([\w\W\s\S]*?)/
-  const descRegex = /\n([\w\W\s\S]*?)/
-  const selfConfig = args.join(' ').trim()
-
-  const [width = '', layout = false, chartId = ''] = selfConfig.split(',').map(s => s.trim())
-
-  const chartMatch = content.match(chartRegex)
-  const descMatch = content.match(descRegex)
-
-  if (!chartMatch) {
-    hexo.log.warn('chartjs tag: chart content is required!')
-    return
-  }
-
-  const chartConfig = chartMatch && chartMatch[1] ? chartMatch[1] : ''
-  const descContent = descMatch && descMatch[1] ? descMatch[1] : ''
-
-  const renderedDesc = descContent ? hexo.render.renderSync({ text: descContent, engine: 'markdown' }).trim() : ''
-
-  const descDOM = renderedDesc ? `
    ${renderedDesc}
    ` : ''
-  const abreastClass = layout ? ' chartjs-abreast' : ''
-  const widthStyle = width ? `data-width="${width}%"` : ''
-
-  return `
    
-            
-            ${descDOM}
-          
    `
-}
-
-hexo.extend.tag.register('chartjs', chartjs, { ends: true })
+/**
+ * Butterfly
+ * chartjs
+ * https://www.chartjs.org/
+ * {% chartjs [width, abreast, chartId] %}
+ * 
+ * 
+ * 
+ * 
+ * {% endchartjs %}
+ */
+
+'use strict'
+
+const { escapeHTML } = require('hexo-util')
+
+const chartjs = (args, content) => {
+  if (!content) return
+
+  const chartRegex = /\n([\w\W\s\S]*?)/
+  const descRegex = /\n([\w\W\s\S]*?)/
+  const selfConfig = args.join(' ').trim()
+
+  const [width = '', layout = false, chartId = ''] = selfConfig.split(',').map(s => s.trim())
+
+  const chartMatch = content.match(chartRegex)
+  const descMatch = content.match(descRegex)
+
+  if (!chartMatch) {
+    hexo.log.warn('chartjs tag: chart content is required!')
+    return
+  }
+
+  const chartConfig = chartMatch && chartMatch[1] ? chartMatch[1] : ''
+  const descContent = descMatch && descMatch[1] ? descMatch[1] : ''
+
+  const renderedDesc = descContent ? hexo.render.renderSync({ text: descContent, engine: 'markdown' }).trim() : ''
+
+  const descDOM = renderedDesc ? `
    ${renderedDesc}
    ` : ''
+  const abreastClass = layout ? ' chartjs-abreast' : ''
+  const widthStyle = width ? `data-width="${width}%"` : ''
+
+  return `
    
+            
+            ${descDOM}
+          
    `
+}
+
+hexo.extend.tag.register('chartjs', chartjs, { ends: true })
diff --git a/scripts/tag/flink.js b/scripts/tag/flink.js
index b54ccec..1d77841 100644
--- a/scripts/tag/flink.js
+++ b/scripts/tag/flink.js
@@ -1,34 +1,34 @@
-/**
- * flink
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-
-const flinkFn = (args, content) => {
-  const data = hexo.render.renderSync({ text: content, engine: 'yaml' })
-  let result = ''
-
-  data.forEach(item => {
-    const className = item.class_name ? `
    ${item.class_name}
    ` : ''
-    const classDesc = item.class_desc ? `
    ${item.class_desc}
    ` : ''
-
-    const listResult = item.link_list.map(link => `
-      
    
-        
-          
    
-            ${link.name}
-          
    
-          
    ${link.name}
    
-          
    ${link.descr}
    
-            
-      
    `).join('')
-
-    result += `${className}${classDesc}
    ${listResult}
    `
-  })
-
-  return `
    ${result}
    `
-}
-
-hexo.extend.tag.register('flink', flinkFn, { ends: true })
+/**
+ * flink
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+
+const flinkFn = (args, content) => {
+  const data = hexo.render.renderSync({ text: content, engine: 'yaml' })
+  let result = ''
+
+  data.forEach(item => {
+    const className = item.class_name ? `
    ${item.class_name}
    ` : ''
+    const classDesc = item.class_desc ? `
    ${item.class_desc}
    ` : ''
+
+    const listResult = item.link_list.map(link => `
+      
    
+        
+          
    
+            ${link.name}
+          
    
+          
    ${link.name}
    
+          
    ${link.descr}
    
+            
+      
    `).join('')
+
+    result += `${className}${classDesc}
    ${listResult}
    `
+  })
+
+  return `
    ${result}
    `
+}
+
+hexo.extend.tag.register('flink', flinkFn, { ends: true })
diff --git a/scripts/tag/gallery.js b/scripts/tag/gallery.js
index f4bfab1..e50bf70 100644
--- a/scripts/tag/gallery.js
+++ b/scripts/tag/gallery.js
@@ -1,76 +1,76 @@
-/**
- * Butterfly
- * galleryGroup and gallery
- * {% galleryGroup [name] [descr] [url] [img] %}
- *
- * {% gallery [button],[limit],[firstLimit] %}
- * {% gallery url,[url],[button] %}
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-
-const DEFAULT_LIMIT = 10
-const DEFAULT_FIRST_LIMIT = 10
-const IMAGE_REGEX = /!\[(.*?)\]\(([^\s]*)\s*(?:["'](.*?)["']?)?\s*\)/g
-
-// Helper functions
-const parseGalleryArgs = args => {
-  const [type, ...rest] = args.join(' ').split(',').map(arg => arg.trim())
-  return {
-    isUrl: type === 'url',
-    params: type === 'url' ? rest : [type, ...rest]
-  }
-}
-
-const parseImageContent = content => {
-  const images = []
-  let match
-
-  while ((match = IMAGE_REGEX.exec(content)) !== null) {
-    images.push({
-      url: match[2],
-      alt: match[1] || '',
-      title: match[3] || ''
-    })
-  }
-
-  return images
-}
-
-const createGalleryHTML = (type, dataStr, button, limit, firstLimit) => {
-  return `
    
-    
    ${dataStr}
    
-  
    `
-}
-
-const gallery = (args, content) => {
-  const { isUrl, params } = parseGalleryArgs(args)
-
-  if (isUrl) {
-    const [dataStr, button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
-    return createGalleryHTML('url', urlFor(dataStr), button, limit, firstLimit)
-  }
-
-  const [button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
-  const images = parseImageContent(content)
-  return createGalleryHTML('data', JSON.stringify(images), button, limit, firstLimit)
-}
-
-const galleryGroup = args => {
-  const [name = '', descr = '', url = '', img = ''] = args.map(arg => arg.trim())
-
-  return `
    
-    Group Image Gallery
-    
    
-      
    ${name}
    
-      
    ${descr}
    
-      
-    
    
-  
    `
-}
-
-// Register tags
-hexo.extend.tag.register('gallery', gallery, { ends: true })
-hexo.extend.tag.register('galleryGroup', galleryGroup)
+/**
+ * Butterfly
+ * galleryGroup and gallery
+ * {% galleryGroup [name] [descr] [url] [img] %}
+ *
+ * {% gallery [button],[limit],[firstLimit] %}
+ * {% gallery url,[url],[button] %}
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+
+const DEFAULT_LIMIT = 10
+const DEFAULT_FIRST_LIMIT = 10
+const IMAGE_REGEX = /!\[(.*?)\]\(([^\s]*)\s*(?:["'](.*?)["']?)?\s*\)/g
+
+// Helper functions
+const parseGalleryArgs = args => {
+  const [type, ...rest] = args.join(' ').split(',').map(arg => arg.trim())
+  return {
+    isUrl: type === 'url',
+    params: type === 'url' ? rest : [type, ...rest]
+  }
+}
+
+const parseImageContent = content => {
+  const images = []
+  let match
+
+  while ((match = IMAGE_REGEX.exec(content)) !== null) {
+    images.push({
+      url: match[2],
+      alt: match[1] || '',
+      title: match[3] || ''
+    })
+  }
+
+  return images
+}
+
+const createGalleryHTML = (type, dataStr, button, limit, firstLimit) => {
+  return `
    
+    
    ${dataStr}
    
+  
    `
+}
+
+const gallery = (args, content) => {
+  const { isUrl, params } = parseGalleryArgs(args)
+
+  if (isUrl) {
+    const [dataStr, button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
+    return createGalleryHTML('url', urlFor(dataStr), button, limit, firstLimit)
+  }
+
+  const [button = false, limit = DEFAULT_LIMIT, firstLimit = DEFAULT_FIRST_LIMIT] = params
+  const images = parseImageContent(content)
+  return createGalleryHTML('data', JSON.stringify(images), button, limit, firstLimit)
+}
+
+const galleryGroup = args => {
+  const [name = '', descr = '', url = '', img = ''] = args.map(arg => arg.trim())
+
+  return `
    
+    Group Image Gallery
+    
    
+      
    ${name}
    
+      
    ${descr}
    
+      
+    
    
+  
    `
+}
+
+// Register tags
+hexo.extend.tag.register('gallery', gallery, { ends: true })
+hexo.extend.tag.register('galleryGroup', galleryGroup)
diff --git a/scripts/tag/hide.js b/scripts/tag/hide.js
index 3a58bec..f2556fe 100644
--- a/scripts/tag/hide.js
+++ b/scripts/tag/hide.js
@@ -1,52 +1,52 @@
-/**
- * Butterfly
- * @example
- * hideInline
- * {% hideInline content,display,bg,color %}
- * content不能包含當引號，可用 '
- * hideBlock
- * {% hideBlock display,bg,color %}
- * content
- * {% endhideBlock %}
- * hideToggle
- * {% hideToggle display,bg,color %}
- * content
- * {% endhideToggle %}
- */
-
-'use strict'
-
-const parseArgs = args => args.join(' ').split(',')
-
-const generateStyle = (bg, color) => {
-  let style = 'style="'
-  if (bg) style += `background-color: ${bg};`
-  if (color) style += `color: ${color}`
-  style += '"'
-  return style
-}
-
-const hideInline = args => {
-  const [content, display = 'Click', bg = false, color = false] = parseArgs(args)
-  const style = generateStyle(bg, color)
-  return `${content}`
-}
-
-const hideBlock = (args, content) => {
-  const [display = 'Click', bg = false, color = false] = parseArgs(args)
-  const style = generateStyle(bg, color)
-  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
-  return `
    ${renderedContent}
    `
-}
-
-const hideToggle = (args, content) => {
-  const [display, bg = false, color = false] = parseArgs(args)
-  const style = generateStyle(bg, color)
-  const border = bg ? `style="border: 1px solid ${bg}"` : ''
-  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
-  return `
    ${display}
    ${renderedContent}
    `
-}
-
-hexo.extend.tag.register('hideInline', hideInline)
-hexo.extend.tag.register('hideBlock', hideBlock, { ends: true })
+/**
+ * Butterfly
+ * @example
+ * hideInline
+ * {% hideInline content,display,bg,color %}
+ * content不能包含當引號，可用 '
+ * hideBlock
+ * {% hideBlock display,bg,color %}
+ * content
+ * {% endhideBlock %}
+ * hideToggle
+ * {% hideToggle display,bg,color %}
+ * content
+ * {% endhideToggle %}
+ */
+
+'use strict'
+
+const parseArgs = args => args.join(' ').split(',')
+
+const generateStyle = (bg, color) => {
+  let style = 'style="'
+  if (bg) style += `background-color: ${bg};`
+  if (color) style += `color: ${color}`
+  style += '"'
+  return style
+}
+
+const hideInline = args => {
+  const [content, display = 'Click', bg = false, color = false] = parseArgs(args)
+  const style = generateStyle(bg, color)
+  return `${content}`
+}
+
+const hideBlock = (args, content) => {
+  const [display = 'Click', bg = false, color = false] = parseArgs(args)
+  const style = generateStyle(bg, color)
+  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
+  return `
    ${renderedContent}
    `
+}
+
+const hideToggle = (args, content) => {
+  const [display, bg = false, color = false] = parseArgs(args)
+  const style = generateStyle(bg, color)
+  const border = bg ? `style="border: 1px solid ${bg}"` : ''
+  const renderedContent = hexo.render.renderSync({ text: content, engine: 'markdown' })
+  return `
    ${display}
    ${renderedContent}
    `
+}
+
+hexo.extend.tag.register('hideInline', hideInline)
+hexo.extend.tag.register('hideBlock', hideBlock, { ends: true })
 hexo.extend.tag.register('hideToggle', hideToggle, { ends: true })
\ No newline at end of file
diff --git a/scripts/tag/inlineImg.js b/scripts/tag/inlineImg.js
index a0357eb..dd95fc5 100644
--- a/scripts/tag/inlineImg.js
+++ b/scripts/tag/inlineImg.js
@@ -1,19 +1,19 @@
-/**
- * inlineImg
- * @param {Array} args - Image name and height
- * @param {string} args[0] - Image name
- * @param {number} args[1] - Image height
- * @returns {string} - Image tag
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-
-const inlineImg = ([img, height = '']) => {
-  const heightStyle = height ? `style="height:${height}"` : ''
-  const src = urlFor(img)
-  return ``
-}
-
-hexo.extend.tag.register('inlineImg', inlineImg, { ends: false })
+/**
+ * inlineImg
+ * @param {Array} args - Image name and height
+ * @param {string} args[0] - Image name
+ * @param {number} args[1] - Image height
+ * @returns {string} - Image tag
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+
+const inlineImg = ([img, height = '']) => {
+  const heightStyle = height ? `style="height:${height}"` : ''
+  const src = urlFor(img)
+  return ``
+}
+
+hexo.extend.tag.register('inlineImg', inlineImg, { ends: false })
diff --git a/scripts/tag/label.js b/scripts/tag/label.js
index cae17ca..b6421ce 100644
--- a/scripts/tag/label.js
+++ b/scripts/tag/label.js
@@ -1,14 +1,14 @@
-/**
- * Butterfly
- * label
- * {% label text color %}
- */
-
-'use strict'
-
-const addLabel = args => {
-  const [text, className = 'default'] = args
-  return `${text}`
-}
-
-hexo.extend.tag.register('label', addLabel, { ends: false })
+/**
+ * Butterfly
+ * label
+ * {% label text color %}
+ */
+
+'use strict'
+
+const addLabel = args => {
+  const [text, className = 'default'] = args
+  return `${text}`
+}
+
+hexo.extend.tag.register('label', addLabel, { ends: false })
diff --git a/scripts/tag/mermaid.js b/scripts/tag/mermaid.js
index bf6b1e5..4fe59c0 100644
--- a/scripts/tag/mermaid.js
+++ b/scripts/tag/mermaid.js
@@ -1,17 +1,17 @@
-/**
- * Butterfly
- * mermaid
- * https://github.com/mermaid-js/mermaid
- */
-
-'use strict'
-
-const { escapeHTML } = require('hexo-util')
-
-const mermaid = (args, content) => {
-  return `
    `
-}
-
-hexo.extend.tag.register('mermaid', mermaid, { ends: true })
+/**
+ * Butterfly
+ * mermaid
+ * https://github.com/mermaid-js/mermaid
+ */
+
+'use strict'
+
+const { escapeHTML } = require('hexo-util')
+
+const mermaid = (args, content) => {
+  return `
    `
+}
+
+hexo.extend.tag.register('mermaid', mermaid, { ends: true })
diff --git a/scripts/tag/note.js b/scripts/tag/note.js
index 125bc61..4c988d6 100644
--- a/scripts/tag/note.js
+++ b/scripts/tag/note.js
@@ -1,27 +1,27 @@
-/**
- * note.js
- * transplant from hexo-theme-next
- * Modify by Jerry
- */
-
-'use strict'
-
-const postNote = (args, content) => {
-  const styleConfig = hexo.theme.config.note.style
-  const noteTag = ['flat', 'modern', 'simple', 'disabled']
-  if (!noteTag.includes(args[args.length - 1])) {
-    args.push(styleConfig)
-  }
-
-  let icon = ''
-  const iconArray = args[args.length - 2]
-  if (iconArray && iconArray.startsWith('fa')) {
-    icon = ``
-    args[args.length - 2] = 'icon-padding'
-  }
-
-  return `
    ${icon + hexo.render.renderSync({ text: content, engine: 'markdown' })}
    `
-}
-
-hexo.extend.tag.register('note', postNote, { ends: true })
-hexo.extend.tag.register('subnote', postNote, { ends: true })
+/**
+ * note.js
+ * transplant from hexo-theme-next
+ * Modify by Jerry
+ */
+
+'use strict'
+
+const postNote = (args, content) => {
+  const styleConfig = hexo.theme.config.note.style
+  const noteTag = ['flat', 'modern', 'simple', 'disabled']
+  if (!noteTag.includes(args[args.length - 1])) {
+    args.push(styleConfig)
+  }
+
+  let icon = ''
+  const iconArray = args[args.length - 2]
+  if (iconArray && iconArray.startsWith('fa')) {
+    icon = ``
+    args[args.length - 2] = 'icon-padding'
+  }
+
+  return `
    ${icon + hexo.render.renderSync({ text: content, engine: 'markdown' })}
    `
+}
+
+hexo.extend.tag.register('note', postNote, { ends: true })
+hexo.extend.tag.register('subnote', postNote, { ends: true })
diff --git a/scripts/tag/score.js b/scripts/tag/score.js
index 441247b..dc380a5 100644
--- a/scripts/tag/score.js
+++ b/scripts/tag/score.js
@@ -1,22 +1,22 @@
-/**
- * Music Score
- * {% score %}
- */
-
-'use strict'
-
-const score = (args, content) => {
-  const escapeHtmlTags = s => {
-    const lookup = {
-      '&': '&',
-      '"': '"',
-      '\'': ''',
-      '<': '<',
-      '>': '>'
-    }
-    return s.replace(/[&"'<>]/g, c => lookup[c])
-  }
-  return `
    ${escapeHtmlTags(content)}
    `
-}
-
-hexo.extend.tag.register('score', score, { ends: true })
+/**
+ * Music Score
+ * {% score %}
+ */
+
+'use strict'
+
+const score = (args, content) => {
+  const escapeHtmlTags = s => {
+    const lookup = {
+      '&': '&',
+      '"': '"',
+      '\'': ''',
+      '<': '<',
+      '>': '>'
+    }
+    return s.replace(/[&"'<>]/g, c => lookup[c])
+  }
+  return `
    ${escapeHtmlTags(content)}
    `
+}
+
+hexo.extend.tag.register('score', score, { ends: true })
diff --git a/scripts/tag/series.js b/scripts/tag/series.js
index 4d811ea..77f87c7 100644
--- a/scripts/tag/series.js
+++ b/scripts/tag/series.js
@@ -1,63 +1,63 @@
-/**
- * series plugin
- * Syntax:
- *  {% series [series name] %}
- * Usage:
- * {% series %}
- * {% series series1 %}
- */
-
-'use strict'
-
-const urlFor = require('hexo-util').url_for.bind(hexo)
-const groups = {}
-
-hexo.extend.filter.register('before_post_render', data => {
-  if (!hexo.theme.config.series.enable) return data
-
-  const { layout, series } = data
-  if (layout === 'post' && series) {
-    if (!groups[series]) groups[series] = []
-    groups[series].push({
-      title: data.title,
-      path: data.path,
-      date: data.date.unix()
-    })
-  }
-  return data
-})
-
-function series (args) {
-  const { series } = hexo.theme.config
-  if (!series.enable) {
-    hexo.log.warn('Series plugin is disabled in the theme config')
-    return ''
-  }
-
-  const seriesArr = args.length ? groups[args[0]] : groups[this.series]
-
-  if (!seriesArr) {
-    hexo.log.warn(`There is no series named "${args[0]}"`)
-    return ''
-  }
-
-  const isAsc = (series.order || 1) === 1 // 1: asc, -1: desc
-  const isSortByTitle = series.orderBy === 'title'
-
-  const compareFn = (a, b) => {
-    const itemA = isSortByTitle ? a.title.toUpperCase() : a.date
-    const itemB = isSortByTitle ? b.title.toUpperCase() : b.date
-
-    return itemA < itemB ? (isAsc ? -1 : 1) : itemA > itemB ? (isAsc ? 1 : -1) : 0
-  }
-
-  seriesArr.sort(compareFn)
-
-  const listItems = seriesArr.map(ele =>
-    `
  • ${ele.title}
    • `
-  ).join('')
-
-  return series.number ? `
      ${listItems}
    ` : `
      ${listItems}
    `
-}
-
-hexo.extend.tag.register('series', series, { ends: false })
+/**
+ * series plugin
+ * Syntax:
+ *  {% series [series name] %}
+ * Usage:
+ * {% series %}
+ * {% series series1 %}
+ */
+
+'use strict'
+
+const urlFor = require('hexo-util').url_for.bind(hexo)
+const groups = {}
+
+hexo.extend.filter.register('before_post_render', data => {
+  if (!hexo.theme.config.series.enable) return data
+
+  const { layout, series } = data
+  if (layout === 'post' && series) {
+    if (!groups[series]) groups[series] = []
+    groups[series].push({
+      title: data.title,
+      path: data.path,
+      date: data.date.unix()
+    })
+  }
+  return data
+})
+
+function series (args) {
+  const { series } = hexo.theme.config
+  if (!series.enable) {
+    hexo.log.warn('Series plugin is disabled in the theme config')
+    return ''
+  }
+
+  const seriesArr = args.length ? groups[args[0]] : groups[this.series]
+
+  if (!seriesArr) {
+    hexo.log.warn(`There is no series named "${args[0]}"`)
+    return ''
+  }
+
+  const isAsc = (series.order || 1) === 1 // 1: asc, -1: desc
+  const isSortByTitle = series.orderBy === 'title'
+
+  const compareFn = (a, b) => {
+    const itemA = isSortByTitle ? a.title.toUpperCase() : a.date
+    const itemB = isSortByTitle ? b.title.toUpperCase() : b.date
+
+    return itemA < itemB ? (isAsc ? -1 : 1) : itemA > itemB ? (isAsc ? 1 : -1) : 0
+  }
+
+  seriesArr.sort(compareFn)
+
+  const listItems = seriesArr.map(ele =>
+    `
  • ${ele.title}
    • `
+  ).join('')
+
+  return series.number ? `
      ${listItems}
    ` : `
      ${listItems}
    `
+}
+
+hexo.extend.tag.register('series', series, { ends: false })
diff --git a/scripts/tag/tabs.js b/scripts/tag/tabs.js
index 8fffa93..c51161d 100644
--- a/scripts/tag/tabs.js
+++ b/scripts/tag/tabs.js
@@ -1,51 +1,51 @@
-/**
- * Tabs
- * transplant from hexo-theme-next
- * modify by Jerry
- */
-
-'use strict'
-
-const postTabs = (args, content) => {
-  const tabBlock = /\n([\w\W\s\S]*?)/g
-  args = args.join(' ').split(',')
-  const tabName = args[0] || 'tab'
-  const tabActive = Number(args[1]) || 0
-  const matches = []
-  let match
-  let tabId = 0
-  let tabNav = ''
-  let tabContent = ''
-  let noDefault = true
-
-  while ((match = tabBlock.exec(content)) !== null) {
-    matches.push(match[1], match[2])
-  }
-
-  for (let i = 0; i < matches.length; i += 2) {
-    const [tabCaption = '', tabIcon = ''] = matches[i].split('@')
-    let postContent = matches[i + 1]
-
-    postContent = hexo.render.renderSync({ text: postContent, engine: 'markdown' }).trim()
-    tabId += 1
-
-    const caption = (tabCaption || tabIcon) ? tabCaption : `${tabName} ${tabId}`
-    const iconHtml = tabIcon ? `` : ''
-    const isActive = (tabActive > 0 && tabActive === tabId) || (tabActive === 0 && tabId === 1) ? ' active' : ''
-
-    if (isActive) noDefault = false
-
-    tabNav += ``
-    tabContent += `
    ${postContent}
    `
-  }
-
-  const toTop = '
    '
-  tabNav = `
    ${tabNav}
    `
-  tabContent = `
    ${tabContent}
    `
-
-  return `
    ${tabNav}${tabContent}${toTop}
    `
-}
-
-hexo.extend.tag.register('tabs', postTabs, { ends: true })
-hexo.extend.tag.register('subtabs', postTabs, { ends: true })
-hexo.extend.tag.register('subsubtabs', postTabs, { ends: true })
+/**
+ * Tabs
+ * transplant from hexo-theme-next
+ * modify by Jerry
+ */
+
+'use strict'
+
+const postTabs = (args, content) => {
+  const tabBlock = /\n([\w\W\s\S]*?)/g
+  args = args.join(' ').split(',')
+  const tabName = args[0] || 'tab'
+  const tabActive = Number(args[1]) || 0
+  const matches = []
+  let match
+  let tabId = 0
+  let tabNav = ''
+  let tabContent = ''
+  let noDefault = true
+
+  while ((match = tabBlock.exec(content)) !== null) {
+    matches.push(match[1], match[2])
+  }
+
+  for (let i = 0; i < matches.length; i += 2) {
+    const [tabCaption = '', tabIcon = ''] = matches[i].split('@')
+    let postContent = matches[i + 1]
+
+    postContent = hexo.render.renderSync({ text: postContent, engine: 'markdown' }).trim()
+    tabId += 1
+
+    const caption = (tabCaption || tabIcon) ? tabCaption : `${tabName} ${tabId}`
+    const iconHtml = tabIcon ? `` : ''
+    const isActive = (tabActive > 0 && tabActive === tabId) || (tabActive === 0 && tabId === 1) ? ' active' : ''
+
+    if (isActive) noDefault = false
+
+    tabNav += ``
+    tabContent += `
    ${postContent}
    `
+  }
+
+  const toTop = '
    '
+  tabNav = `
    ${tabNav}
    `
+  tabContent = `
    ${tabContent}
    `
+
+  return `
    ${tabNav}${tabContent}${toTop}
    `
+}
+
+hexo.extend.tag.register('tabs', postTabs, { ends: true })
+hexo.extend.tag.register('subtabs', postTabs, { ends: true })
+hexo.extend.tag.register('subsubtabs', postTabs, { ends: true })
diff --git a/scripts/tag/timeline.js b/scripts/tag/timeline.js
index 945454c..ead459c 100644
--- a/scripts/tag/timeline.js
+++ b/scripts/tag/timeline.js
@@ -1,50 +1,50 @@
-/**
- * Timeline tag for Hexo
- * Syntax:
- * {% timeline [headline],[color] %}
- * 
- * [content]
- * 
- * 
- * [content]
- * 
- * {% endtimeline %}
- */
-
-'use strict'
-
-const timeLineFn = (args, content) => {
-  // Use named capture groups for better readability
-  const tlBlock = /\n(?[\s\S]*?)/g
-
-  // Pre-compile markdown render function
-  const renderMd = text => hexo.render.renderSync({ text, engine: 'markdown' })
-
-  // Parse arguments more efficiently
-  const [text, color = ''] = args.length ? args.join(' ').split(',') : []
-
-  // Build initial headline if text exists
-  const headline = text
-    ? `
    
-        
    
-          
    ${renderMd(text)}
    
-        
    
-      
    `
-    : ''
-
-  // Match all timeline blocks in one pass and transform
-  const items = Array.from(content.matchAll(tlBlock))
-    .map(({ groups: { title, content } }) =>
-      `
    
-        
    
-          
    ${renderMd(title)}
    
-        
    
-        
    ${renderMd(content)}
    
-      
    `
-    )
-    .join('')
-
-  return `
    ${headline}${items}
    `
-}
-
-hexo.extend.tag.register('timeline', timeLineFn, { ends: true })
+/**
+ * Timeline tag for Hexo
+ * Syntax:
+ * {% timeline [headline],[color] %}
+ * 
+ * [content]
+ * 
+ * 
+ * [content]
+ * 
+ * {% endtimeline %}
+ */
+
+'use strict'
+
+const timeLineFn = (args, content) => {
+  // Use named capture groups for better readability
+  const tlBlock = /\n(?[\s\S]*?)/g
+
+  // Pre-compile markdown render function
+  const renderMd = text => hexo.render.renderSync({ text, engine: 'markdown' })
+
+  // Parse arguments more efficiently
+  const [text, color = ''] = args.length ? args.join(' ').split(',') : []
+
+  // Build initial headline if text exists
+  const headline = text
+    ? `
    
+        
    
+          
    ${renderMd(text)}
    
+        
    
+      
    `
+    : ''
+
+  // Match all timeline blocks in one pass and transform
+  const items = Array.from(content.matchAll(tlBlock))
+    .map(({ groups: { title, content } }) =>
+      `
    
+        
    
+          
    ${renderMd(title)}
    
+        
    
+        
    ${renderMd(content)}
    
+      
    `
+    )
+    .join('')
+
+  return `
    ${headline}${items}
    `
+}
+
+hexo.extend.tag.register('timeline', timeLineFn, { ends: true })
diff --git a/source/css/_global/function.styl b/source/css/_global/function.styl
index 771e1b3..e1a173c 100644
--- a/source/css/_global/function.styl
+++ b/source/css/_global/function.styl
@@ -1,280 +1,280 @@
-.limit-one-line
-  overflow: hidden
-  text-overflow: ellipsis
-  white-space: nowrap
-
-.limit-more-line
-  display: -webkit-box
-  overflow: hidden
-  -webkit-box-orient: vertical
-
-.fontawesomeIcon
-  display: inline-block
-  font-weight: 600
-  font-family: 'Font Awesome 6 Free'
-  text-rendering: auto
-  -webkit-font-smoothing: antialiased
-
-addBorderRadius(x = 6, hide = false)
-  if hexo-config('rounded_corners_ui')
-    border-radius: unit(x, 'px')
-
-    if hide
-      overflow: hidden
-
-// card hover
-.cardHover
-  background: var(--card-bg)
-  box-shadow: var(--card-box-shadow)
-  transition: all .3s
-  addBorderRadius(8)
-
-  &:hover
-    box-shadow: var(--card-hover-box-shadow)
-
-.imgHover
-  width: 100%
-  height: 100%
-  transition: filter 375ms ease-in .2s, transform .6s
-  object-fit: cover
-
-  &:hover
-    transform: scale(1.1)
-
-.postImgHover
-  &:hover
-    .cover
-      opacity: .5
-      transform: scale(1.1)
-
-  .cover
-    width: 100%
-    height: 100%
-    opacity: .4
-    transition: all .6s, filter 375ms ease-in .2s
-    object-fit: cover
-
-.list-beauty
-  list-style: none
-
-  li
-    position: relative
-    padding: .12em .4em .12em 1.4em
-
-    &:hover
-      &:before
-        border-color: var(--pseudo-hover)
-
-    &:before
-      position: absolute
-      top: .67em
-      left: 0
-      width: w = .43em
-      height: h = w
-      border: .5 * w solid $light-blue
-      border-radius: w
-      background: transparent
-      content: ''
-      cursor: pointer
-      transition: all .3s ease-out
-
-.custom-hr
-  position: relative
-  margin: 40px auto
-  border: 2px dashed var(--hr-border)
-
-  if hexo-config('hr_icon.enable')
-    width: calc(100% - 4px)
-
-    &:hover
-      &:before
-        left: calc(95% - 20px)
-
-    &:before
-      position: absolute
-      top: $hr-icon-top
-      left: 5%
-      z-index: 1
-      color: var(--hr-before-color)
-      content: $hr-icon
-      font-size: 20px
-      line-height: 1
-      transition: all 1s ease-in-out
-      @extend .fontawesomeIcon
-
-.verticalCenter
-  position: absolute
-  top: 50%
-  width: 100%
-  transform: translate(0, -50%)
-
-maxWidth600()
-  @media screen and (max-width: 600px)
-    {block}
-
-maxWidth768()
-  @media screen and (max-width: 768px)
-    {block}
-
-minWidth768()
-  @media screen and (min-width: 768px)
-    {block}
-
-maxWidth1024()
-  @media screen and (max-width: 1024px)
-    {block}
-
-minWidth1024()
-  @media screen and (min-width: 1024px)
-    {block}
-
-maxWidth900()
-  @media screen and (max-width: 900px)
-    {block}
-
-minWidth901()
-  @media screen and (min-width: 901px)
-    {block}
-
-minWidth900()
-  @media screen and (min-width: 900px)
-    {block}
-
-minWidth2000()
-  @media screen and (min-width: 2000px)
-    {block}
-
-// animation
-if hexo-config('enter_transitions')
-  #content-inner,
-  #footer
-    animation: bottom-top 1s
-
-  #page-header:not(.full_page),
-  #nav.show
-    animation: header-effect 1s
-
-  #site-title,
-  #site-subtitle
-    animation: titleScale 1s
-
-  canvas:not(#ribbon-canvas),
-  #web_bg
-    animation: to_show 4s
-
-  #ribbon-canvas
-    animation: ribbon_to_show 4s
-
-  #sidebar-menus
-    &.open
-      for i in 1 2 3 4
-        > :nth-child({i})
-          animation: sidebarItem (i / 5s)
-
-.scroll-down-effects
-  animation: scroll-down-effect 1.5s infinite
-
-if hexo-config('avatar.effect') == true
-  .avatar-img
-    animation: avatar_turn_around 2s linear infinite
-
-.reward-main
-  animation: donate_effcet .3s .1s ease both
-
-@keyframes scroll-down-effect
-  0%
-    opacity: .4
-    transform: translate(0, 0)
-
-  50%
-    opacity: 1
-    transform: translate(0, -16px)
-
-  100%
-    opacity: .4
-    transform: translate(0, 0)
-
-@keyframes header-effect
-  0%
-    transform: translateY(-35px)
-
-  100%
-    transform: translateY(0)
-
-@keyframes bottom-top
-  0%
-    transform: translateY(35px)
-
-  100%
-    transform: translateY(0)
-
-@keyframes titleScale
-  0%
-    opacity: 0
-    transform: scale(.7)
-
-  100%
-    opacity: 1
-    transform: scale(1)
-
-@keyframes search_close
-  0%
-    opacity: 1
-    transform: scale(1)
-
-  100%
-    opacity: 0
-    transform: scale(.7)
-
-@keyframes to_show
-  0%
-    opacity: 0
-
-  100%
-    opacity: 1
-
-@keyframes to_hide
-  0%
-    opacity: 1
-
-  100%
-    opacity: 0
-
-@keyframes ribbon_to_show
-  0%
-    opacity: 0
-
-  100%
-    opacity: hexo-config('canvas_ribbon.alpha')
-
-@keyframes avatar_turn_around
-  from
-    transform: rotate(0)
-
-  to
-    transform: rotate(360deg)
-
-@keyframes sub_menus
-  0%
-    opacity: 0
-    transform: translateY(10px)
-
-  100%
-    opacity: 1
-    transform: translateY(0)
-
-@keyframes donate_effcet
-  0%
-    opacity: 0
-    transform: translateY(-20px)
-
-  100%
-    opacity: 1
-    transform: translateY(0)
-
-@keyframes sidebarItem
-  0%
-    transform: translateX(200px)
-
-  100%
-    transform: translateX(0)
+.limit-one-line
+  overflow: hidden
+  text-overflow: ellipsis
+  white-space: nowrap
+
+.limit-more-line
+  display: -webkit-box
+  overflow: hidden
+  -webkit-box-orient: vertical
+
+.fontawesomeIcon
+  display: inline-block
+  font-weight: 600
+  font-family: 'Font Awesome 6 Free'
+  text-rendering: auto
+  -webkit-font-smoothing: antialiased
+
+addBorderRadius(x = 6, hide = false)
+  if hexo-config('rounded_corners_ui')
+    border-radius: unit(x, 'px')
+
+    if hide
+      overflow: hidden
+
+// card hover
+.cardHover
+  background: var(--card-bg)
+  box-shadow: var(--card-box-shadow)
+  transition: all .3s
+  addBorderRadius(8)
+
+  &:hover
+    box-shadow: var(--card-hover-box-shadow)
+
+.imgHover
+  width: 100%
+  height: 100%
+  transition: filter 375ms ease-in .2s, transform .6s
+  object-fit: cover
+
+  &:hover
+    transform: scale(1.1)
+
+.postImgHover
+  &:hover
+    .cover
+      opacity: .5
+      transform: scale(1.1)
+
+  .cover
+    width: 100%
+    height: 100%
+    opacity: .4
+    transition: all .6s, filter 375ms ease-in .2s
+    object-fit: cover
+
+.list-beauty
+  list-style: none
+
+  li
+    position: relative
+    padding: .12em .4em .12em 1.4em
+
+    &:hover
+      &:before
+        border-color: var(--pseudo-hover)
+
+    &:before
+      position: absolute
+      top: .67em
+      left: 0
+      width: w = .43em
+      height: h = w
+      border: .5 * w solid $light-blue
+      border-radius: w
+      background: transparent
+      content: ''
+      cursor: pointer
+      transition: all .3s ease-out
+
+.custom-hr
+  position: relative
+  margin: 40px auto
+  border: 2px dashed var(--hr-border)
+
+  if hexo-config('hr_icon.enable')
+    width: calc(100% - 4px)
+
+    &:hover
+      &:before
+        left: calc(95% - 20px)
+
+    &:before
+      position: absolute
+      top: $hr-icon-top
+      left: 5%
+      z-index: 1
+      color: var(--hr-before-color)
+      content: $hr-icon
+      font-size: 20px
+      line-height: 1
+      transition: all 1s ease-in-out
+      @extend .fontawesomeIcon
+
+.verticalCenter
+  position: absolute
+  top: 50%
+  width: 100%
+  transform: translate(0, -50%)
+
+maxWidth600()
+  @media screen and (max-width: 600px)
+    {block}
+
+maxWidth768()
+  @media screen and (max-width: 768px)
+    {block}
+
+minWidth768()
+  @media screen and (min-width: 768px)
+    {block}
+
+maxWidth1024()
+  @media screen and (max-width: 1024px)
+    {block}
+
+minWidth1024()
+  @media screen and (min-width: 1024px)
+    {block}
+
+maxWidth900()
+  @media screen and (max-width: 900px)
+    {block}
+
+minWidth901()
+  @media screen and (min-width: 901px)
+    {block}
+
+minWidth900()
+  @media screen and (min-width: 900px)
+    {block}
+
+minWidth2000()
+  @media screen and (min-width: 2000px)
+    {block}
+
+// animation
+if hexo-config('enter_transitions')
+  #content-inner,
+  #footer
+    animation: bottom-top 1s
+
+  #page-header:not(.full_page),
+  #nav.show
+    animation: header-effect 1s
+
+  #site-title,
+  #site-subtitle
+    animation: titleScale 1s
+
+  canvas:not(#ribbon-canvas),
+  #web_bg
+    animation: to_show 4s
+
+  #ribbon-canvas
+    animation: ribbon_to_show 4s
+
+  #sidebar-menus
+    &.open
+      for i in 1 2 3 4
+        > :nth-child({i})
+          animation: sidebarItem (i / 5s)
+
+.scroll-down-effects
+  animation: scroll-down-effect 1.5s infinite
+
+if hexo-config('avatar.effect') == true
+  .avatar-img
+    animation: avatar_turn_around 2s linear infinite
+
+.reward-main
+  animation: donate_effcet .3s .1s ease both
+
+@keyframes scroll-down-effect
+  0%
+    opacity: .4
+    transform: translate(0, 0)
+
+  50%
+    opacity: 1
+    transform: translate(0, -16px)
+
+  100%
+    opacity: .4
+    transform: translate(0, 0)
+
+@keyframes header-effect
+  0%
+    transform: translateY(-35px)
+
+  100%
+    transform: translateY(0)
+
+@keyframes bottom-top
+  0%
+    transform: translateY(35px)
+
+  100%
+    transform: translateY(0)
+
+@keyframes titleScale
+  0%
+    opacity: 0
+    transform: scale(.7)
+
+  100%
+    opacity: 1
+    transform: scale(1)
+
+@keyframes search_close
+  0%
+    opacity: 1
+    transform: scale(1)
+
+  100%
+    opacity: 0
+    transform: scale(.7)
+
+@keyframes to_show
+  0%
+    opacity: 0
+
+  100%
+    opacity: 1
+
+@keyframes to_hide
+  0%
+    opacity: 1
+
+  100%
+    opacity: 0
+
+@keyframes ribbon_to_show
+  0%
+    opacity: 0
+
+  100%
+    opacity: hexo-config('canvas_ribbon.alpha')
+
+@keyframes avatar_turn_around
+  from
+    transform: rotate(0)
+
+  to
+    transform: rotate(360deg)
+
+@keyframes sub_menus
+  0%
+    opacity: 0
+    transform: translateY(10px)
+
+  100%
+    opacity: 1
+    transform: translateY(0)
+
+@keyframes donate_effcet
+  0%
+    opacity: 0
+    transform: translateY(-20px)
+
+  100%
+    opacity: 1
+    transform: translateY(0)
+
+@keyframes sidebarItem
+  0%
+    transform: translateX(200px)
+
+  100%
+    transform: translateX(0)
diff --git a/source/css/_global/index.styl b/source/css/_global/index.styl
index 58093a7..0ddabb0 100644
--- a/source/css/_global/index.styl
+++ b/source/css/_global/index.styl
@@ -1,224 +1,224 @@
-:root
-  --global-font-size: $font-size
-  --global-bg: $body-bg
-  --font-color: $font-black
-  --hr-border: lighten($theme-hr-color, 50%)
-  --hr-before-color: lighten($theme-hr-color, 30%)
-  --search-bg: $search-bg
-  --search-input-color: $search-input-color
-  --search-a-color: $search-a-color
-  --preloader-bg: $preloader-bg
-  --preloader-color: $preloader-word-color
-  --tab-border-color: $tab-border-color
-  --tab-botton-bg: $tab-botton-bg
-  --tab-botton-color: $tab-botton-color
-  --tab-button-hover-bg: $tab-button-hover-bg
-  --tab-button-active-bg: $tab-button-active-bg
-  --card-bg: $card-bg
-  --card-meta: $theme-meta-color
-  --sidebar-bg: $sidebar-background
-  --sidebar-menu-bg: $white
-  --btn-hover-color: $button-hover-color
-  --btn-color: $button-color
-  --btn-bg: $button-bg
-  --text-bg-hover: rgba($text-bg-hover, .7)
-  --light-grey: $light-grey
-  --dark-grey: $dark-grey
-  --white: $white
-  --text-highlight-color: $text-highlight-color
-  --blockquote-color: $blockquote-color
-  --blockquote-bg: $blockquote-background-color
-  --reward-pop: $reward-pop-up-bg
-  --toc-link-color: $toc-link-color
-  --card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .05)
-  --card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .09)
-  --pseudo-hover: $pseudo-hover
-  --headline-presudo: #a0a0a0
-  --scrollbar-color: $scrollbar-color
-  --default-bg-color: $theme-color
-  --zoom-bg: #fff
-  --mark-bg: alpha($dark-black, .3)
-
-body
-  position: relative
-  overflow-y: scroll
-  min-height: 100%
-  background: var(--global-bg)
-  color: var(--font-color)
-  font-size: var(--global-font-size)
-  font-family: $font-family
-  line-height: $text-line-height
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
-  scroll-behavior: smooth
-
-  if !hexo-config('copy.enable')
-    user-select: none
-    -webkit-user-select: none
-
-// scrollbar - firefox
-@-moz-document url-prefix()
-  *
-    scrollbar-width: thin
-    scrollbar-color: var(--scrollbar-color) transparent
-
-// scrollbar - chrome/safari
-*::-webkit-scrollbar
-  width: 5px
-  height: 5px
-
-*::-webkit-scrollbar-thumb
-  background: var(--scrollbar-color)
-
-*::-webkit-scrollbar-track
-  background-color: transparent
-
-input::placeholder
-  color: var(--font-color)
-
-if hexo-config('background')
-  #web_bg
-    position: fixed
-    z-index: -999
-    width: 100%
-    height: 100%
-    background-attachment: local
-    background-position: center
-    background-size: cover
-    background-repeat: no-repeat
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6
-  position: relative
-  margin: 20px 0 14px
-  color: var(--text-highlight-color)
-  font-weight: bold
-
-  code
-    font-size: inherit !important
-
-*
-  box-sizing: border-box
-
-.table-wrap
-  overflow-x: scroll
-  margin: 0 0 20px
-
-  if hexo-config('rounded_corners_ui')
-    $borderRadius = 5px
-    border-radius: $borderRadius
-
-    table
-      border-radius: $borderRadius
-
-      thead > tr:first-child
-        th:first-child
-          border-top-left-radius: $borderRadius
-
-        th:last-child
-          border-top-right-radius: $borderRadius
-
-      tbody > tr:last-child
-        td:first-child
-          border-bottom-left-radius: $borderRadius
-
-        td:last-child
-          border-bottom-right-radius: $borderRadius
-
-table
-  display: table
-  width: 100%
-  border-spacing: 0
-  border-collapse: separate
-  border-top: 1px solid var(--light-grey)
-  border-left: 1px solid var(--light-grey)
-  empty-cells: show
-
-  thead
-    background: alpha($table-thead-bg, 10%)
-
-  th,
-  td
-    padding: 6px 12px
-    border: 1px solid var(--light-grey)
-    border-top: none
-    border-left: none
-    vertical-align: middle
-
-*::selection
-  background: $theme-text-selection-color
-  color: #F7F7F7
-
-button
-  padding: 0
-  outline: 0
-  border: none
-  background: none
-  cursor: pointer
-  touch-action: manipulation
-
-a
-  color: $a-link-color
-  text-decoration: none
-  word-wrap: break-word
-  transition: all .2s
-  overflow-wrap: break-word
-
-  &:hover
-    color: $light-blue
-
-// font
-if $site-name-font
-  #site-title,
-  #site-subtitle,
-  .site-name,
-  #aside-content .author-info-name,
-  #aside-content .author-info-description
-    font-family: $site-name-font
-
-.text-center
-  text-align: center
-
-.text-right
-  text-align: right
-
-img
-  &[src=''],
-  &:not([src])
-    opacity: 0
-
-// lazyload blur
-if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
-  img
-    &[data-lazy-src]:not(.loaded)
-      filter: blur(8px) brightness(1)
-
-    &[data-lazy-src].error
-      filter: none
-
-.img-alt
-  margin: -10px 0 10px
-  color: #858585
-
-  &:hover
-    text-decoration: none !important
-
-blockquote
-  margin: 0 0 20px
-  padding: 7px 15px
-  border-left: 4px solid $blockquote-padding-color
-  background-color: var(--blockquote-bg)
-  color: var(--blockquote-color)
-  addBorderRadius()
-
-  footer
-    cite
-      &:before
-        padding: 0 5px
-        content: '—'
-
-  & > :last-child
-    margin-bottom: 0 !important
+:root
+  --global-font-size: $font-size
+  --global-bg: $body-bg
+  --font-color: $font-black
+  --hr-border: lighten($theme-hr-color, 50%)
+  --hr-before-color: lighten($theme-hr-color, 30%)
+  --search-bg: $search-bg
+  --search-input-color: $search-input-color
+  --search-a-color: $search-a-color
+  --preloader-bg: $preloader-bg
+  --preloader-color: $preloader-word-color
+  --tab-border-color: $tab-border-color
+  --tab-botton-bg: $tab-botton-bg
+  --tab-botton-color: $tab-botton-color
+  --tab-button-hover-bg: $tab-button-hover-bg
+  --tab-button-active-bg: $tab-button-active-bg
+  --card-bg: $card-bg
+  --card-meta: $theme-meta-color
+  --sidebar-bg: $sidebar-background
+  --sidebar-menu-bg: $white
+  --btn-hover-color: $button-hover-color
+  --btn-color: $button-color
+  --btn-bg: $button-bg
+  --text-bg-hover: rgba($text-bg-hover, .7)
+  --light-grey: $light-grey
+  --dark-grey: $dark-grey
+  --white: $white
+  --text-highlight-color: $text-highlight-color
+  --blockquote-color: $blockquote-color
+  --blockquote-bg: $blockquote-background-color
+  --reward-pop: $reward-pop-up-bg
+  --toc-link-color: $toc-link-color
+  --card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .05)
+  --card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .09)
+  --pseudo-hover: $pseudo-hover
+  --headline-presudo: #a0a0a0
+  --scrollbar-color: $scrollbar-color
+  --default-bg-color: $theme-color
+  --zoom-bg: #fff
+  --mark-bg: alpha($dark-black, .3)
+
+body
+  position: relative
+  overflow-y: scroll
+  min-height: 100%
+  background: var(--global-bg)
+  color: var(--font-color)
+  font-size: var(--global-font-size)
+  font-family: $font-family
+  line-height: $text-line-height
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
+  scroll-behavior: smooth
+
+  if !hexo-config('copy.enable')
+    user-select: none
+    -webkit-user-select: none
+
+// scrollbar - firefox
+@-moz-document url-prefix()
+  *
+    scrollbar-width: thin
+    scrollbar-color: var(--scrollbar-color) transparent
+
+// scrollbar - chrome/safari
+*::-webkit-scrollbar
+  width: 5px
+  height: 5px
+
+*::-webkit-scrollbar-thumb
+  background: var(--scrollbar-color)
+
+*::-webkit-scrollbar-track
+  background-color: transparent
+
+input::placeholder
+  color: var(--font-color)
+
+if hexo-config('background')
+  #web_bg
+    position: fixed
+    z-index: -999
+    width: 100%
+    height: 100%
+    background-attachment: local
+    background-position: center
+    background-size: cover
+    background-repeat: no-repeat
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6
+  position: relative
+  margin: 20px 0 14px
+  color: var(--text-highlight-color)
+  font-weight: bold
+
+  code
+    font-size: inherit !important
+
+*
+  box-sizing: border-box
+
+.table-wrap
+  overflow-x: scroll
+  margin: 0 0 20px
+
+  if hexo-config('rounded_corners_ui')
+    $borderRadius = 5px
+    border-radius: $borderRadius
+
+    table
+      border-radius: $borderRadius
+
+      thead > tr:first-child
+        th:first-child
+          border-top-left-radius: $borderRadius
+
+        th:last-child
+          border-top-right-radius: $borderRadius
+
+      tbody > tr:last-child
+        td:first-child
+          border-bottom-left-radius: $borderRadius
+
+        td:last-child
+          border-bottom-right-radius: $borderRadius
+
+table
+  display: table
+  width: 100%
+  border-spacing: 0
+  border-collapse: separate
+  border-top: 1px solid var(--light-grey)
+  border-left: 1px solid var(--light-grey)
+  empty-cells: show
+
+  thead
+    background: alpha($table-thead-bg, 10%)
+
+  th,
+  td
+    padding: 6px 12px
+    border: 1px solid var(--light-grey)
+    border-top: none
+    border-left: none
+    vertical-align: middle
+
+*::selection
+  background: $theme-text-selection-color
+  color: #F7F7F7
+
+button
+  padding: 0
+  outline: 0
+  border: none
+  background: none
+  cursor: pointer
+  touch-action: manipulation
+
+a
+  color: $a-link-color
+  text-decoration: none
+  word-wrap: break-word
+  transition: all .2s
+  overflow-wrap: break-word
+
+  &:hover
+    color: $light-blue
+
+// font
+if $site-name-font
+  #site-title,
+  #site-subtitle,
+  .site-name,
+  #aside-content .author-info-name,
+  #aside-content .author-info-description
+    font-family: $site-name-font
+
+.text-center
+  text-align: center
+
+.text-right
+  text-align: right
+
+img
+  &[src=''],
+  &:not([src])
+    opacity: 0
+
+// lazyload blur
+if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
+  img
+    &[data-lazy-src]:not(.loaded)
+      filter: blur(8px) brightness(1)
+
+    &[data-lazy-src].error
+      filter: none
+
+.img-alt
+  margin: -10px 0 10px
+  color: #858585
+
+  &:hover
+    text-decoration: none !important
+
+blockquote
+  margin: 0 0 20px
+  padding: 7px 15px
+  border-left: 4px solid $blockquote-padding-color
+  background-color: var(--blockquote-bg)
+  color: var(--blockquote-color)
+  addBorderRadius()
+
+  footer
+    cite
+      &:before
+        padding: 0 5px
+        content: '—'
+
+  & > :last-child
+    margin-bottom: 0 !important
diff --git a/source/css/_highlight/highlight.styl b/source/css/_highlight/highlight.styl
index ab0e4ff..657da67 100644
--- a/source/css/_highlight/highlight.styl
+++ b/source/css/_highlight/highlight.styl
@@ -1,281 +1,281 @@
-$highlight_theme = hexo-config('code_blocks.theme')
-$highlight_macstyle = hexo-config('code_blocks.macStyle')
-wordWrap = $highlight_enable && !$highlight_line_number && hexo-config('code_blocks.word_wrap')
-
-@require 'theme'
-
-:root
-  --hl-color: $highlight-foreground
-  --hl-bg: $highlight-background
-  --hltools-bg: $highlight-tools.bg-color
-  --hltools-color: $highlight-tools.color
-  --hlnumber-bg: $highlight-gutter.bg-color
-  --hlnumber-color: $highlight-gutter.color
-  --hlscrollbar-bg: $highlight-scrollbar
-  --hlexpand-bg: linear-gradient(180deg, rgba($highlight-background, .6), rgba($highlight-background, .9))
-
-[data-theme='dark']
-  --hl-color: alpha(#FFFFFF, .7)
-  --hl-bg: lighten(#121212, 2)
-  --hltools-bg: lighten(#121212, 3)
-  --hltools-color: #90a4ae
-  --hlnumber-bg: lighten(#121212, 2)
-  --hlnumber-color: alpha(#FFFFFF, .4)
-  --hlscrollbar-bg: lighten(#121212, 5)
-  --hlexpand-bg: linear-gradient(180deg, rgba(lighten(#121212, 2), .6), rgba(lighten(#121212, 2), .9))
-
-if $highlight_enable
-  @require 'highlight/index'
-
-if $prismjs_enable
-  @require 'prismjs/index'
-
-$code-block
-  overflow: auto
-  margin: 0 0 20px
-  padding: 0
-  background: var(--hl-bg)
-  color: var(--hl-color)
-  line-height: $line-height-code-block
-
-  if wordWrap
-    counter-reset: line
-    white-space: pre-wrap
-
-.container
-  pre,
-  code
-    font-size: $code-font-size
-    font-family: $code-font-family !important
-    addBorderRadius()
-
-  code
-    padding: 2px 5px
-    background: $code-background
-    color: $code-foreground
-
-  pre
-    @extend $code-block
-    padding: 10px 20px
-
-    code
-      padding: 0
-      background: none
-      color: var(--hl-color)
-      text-shadow: none
-
-  figure.highlight
-    @extend $code-block
-    position: relative
-    addBorderRadius()
-
-    pre
-      margin: 0
-      padding: 8px 0
-      border: none
-
-    figcaption,
-    .caption
-      padding: 6px 0 2px 14px
-      font-size: $code-font-size
-      line-height: 1em
-
-      a
-        float: right
-        padding-right: 10px
-        color: var(--hl-color)
-
-        &:hover
-          border-bottom-color: var(--hl-color)
-
-    &.copy-true
-      user-select: all
-      -webkit-user-select: all
-
-      & > table,
-      & > pre
-        display: block !important
-        opacity: 0
-
-  .highlight-tools
-    display: flex
-    align-items: center
-    padding: 0 8px
-    min-height: 24px
-    height: 2.15em
-    background: var(--hltools-bg)
-    color: var(--hltools-color)
-    font-size: $code-font-size
-    overflow: hidden
-
-    & > *
-      padding: 5px
-
-    i
-      cursor: pointer
-      transition: all .3s
-
-      &:hover
-        color: $theme-color
-
-    &.closed
-      & ~ *
-        display: none
-
-      .expand
-        transform: rotate(-90deg)
-
-    if !$highlight_macstyle
-      & > .macStyle
-        padding: 0
-
-    .code-lang
-      flex: 1
-      text-transform: uppercase
-      font-weight: bold
-      font-size: 1.15em
-      user-select: none
-      -webkit-user-select: none
-      padding 2px
-
-    .copy-notice
-      padding-right: 2px
-      opacity: 0
-      transition: opacity .4s
-
-    if hexo-config('code_blocks.language')
-      .code-lang
-        flex: 1
-    else if (!$highlight_macstyle && hexo-config('code_blocks.shrink') != 'none')
-      & > div:nth-child(2)
-        flex: 1
-    else
-      .macStyle
-        flex: 1
-
-  .gutter
-    user-select: none
-    -webkit-user-select: none
-
-  .gist table
-    width: auto
-
-    td
-      border: none
-
-if $highlight_macstyle
-  .container
-    figure.highlight
-      margin: 0 0 24px
-      border-radius: 7px
-      box-shadow: 0 5px 10px 0 $highlight-mac-border
-      -webkit-transform: translateZ(0)
-
-      .highlight-tools
-        .macStyle
-          display: flex
-
-          & > *
-            margin-right: 8px
-            width: 12px
-            height: 12px
-            border-radius: 50%
-
-          & > :last-child
-            margin-right: 5px
-
-          .mac-close
-            background: #fc625d
-
-          .mac-minimize
-            background: #fdbc40
-
-          .mac-maximize
-            background: #35cd4b
-
-        if hexo-config('code_blocks.shrink') != 'none'
-          & > :nth-child(2)
-            order: 8
-
-          &.closed
-            .expand
-              transform: rotate(90deg)
-
-if hexo-config('code_blocks.height_limit')
-  .container
-    .code-expand-btn
-      position: absolute
-      bottom: 0
-      z-index: 10
-      width: 100%
-      background: var(--hlexpand-bg)
-      text-align: center
-      font-size: $code-font-size
-      cursor: pointer
-
-      i
-        padding: 6px 0
-        color: var(--hlnumber-color)
-        animation: code-expand-key 1.2s infinite
-
-      &.expand-done
-        & > i
-          transform: rotate(180deg)
-
-        & + table,
-        & + pre
-          margin-bottom: 1.8em
-
-      &:not(.expand-done)
-        & ~ table,
-        & ~ pre
-          overflow: hidden
-          height: unit(hexo-config('code_blocks.height_limit'), px)
-  
-  @keyframes code-expand-key
-    0%
-      opacity: .6
-
-    50%
-      opacity: .1
-
-    100%
-      opacity: .6
-
-if hexo-config('code_blocks.fullpage')
-  .container
-    figure.highlight.code-fullpage
-      position: fixed
-      top: 0
-      right: 0
-      bottom: 0
-      left: 0
-      z-index: 9999
-      margin: 0
-      border-radius: 0
-      animation: code-fullpage .3s
-
-      .code-expand-btn,
-      .expand
-        display: none
-
-      .highlight-tools
-        & ~ pre,
-        & ~ table
-          display: block
-          overflow: auto
-          height: calc(100vh - 2.15em)
-          margin-bottom: 0
-
-  @keyframes code-fullpage
-    0%,
-    100%
-      transform: translateX(0)
-
-    20%,
-    60%
-      transform: translateX(-5px)
-
-    40%,
-    80%
+$highlight_theme = hexo-config('code_blocks.theme')
+$highlight_macstyle = hexo-config('code_blocks.macStyle')
+wordWrap = $highlight_enable && !$highlight_line_number && hexo-config('code_blocks.word_wrap')
+
+@require 'theme'
+
+:root
+  --hl-color: $highlight-foreground
+  --hl-bg: $highlight-background
+  --hltools-bg: $highlight-tools.bg-color
+  --hltools-color: $highlight-tools.color
+  --hlnumber-bg: $highlight-gutter.bg-color
+  --hlnumber-color: $highlight-gutter.color
+  --hlscrollbar-bg: $highlight-scrollbar
+  --hlexpand-bg: linear-gradient(180deg, rgba($highlight-background, .6), rgba($highlight-background, .9))
+
+[data-theme='dark']
+  --hl-color: alpha(#FFFFFF, .7)
+  --hl-bg: lighten(#121212, 2)
+  --hltools-bg: lighten(#121212, 3)
+  --hltools-color: #90a4ae
+  --hlnumber-bg: lighten(#121212, 2)
+  --hlnumber-color: alpha(#FFFFFF, .4)
+  --hlscrollbar-bg: lighten(#121212, 5)
+  --hlexpand-bg: linear-gradient(180deg, rgba(lighten(#121212, 2), .6), rgba(lighten(#121212, 2), .9))
+
+if $highlight_enable
+  @require 'highlight/index'
+
+if $prismjs_enable
+  @require 'prismjs/index'
+
+$code-block
+  overflow: auto
+  margin: 0 0 20px
+  padding: 0
+  background: var(--hl-bg)
+  color: var(--hl-color)
+  line-height: $line-height-code-block
+
+  if wordWrap
+    counter-reset: line
+    white-space: pre-wrap
+
+.container
+  pre,
+  code
+    font-size: $code-font-size
+    font-family: $code-font-family !important
+    addBorderRadius()
+
+  code
+    padding: 2px 5px
+    background: $code-background
+    color: $code-foreground
+
+  pre
+    @extend $code-block
+    padding: 10px 20px
+
+    code
+      padding: 0
+      background: none
+      color: var(--hl-color)
+      text-shadow: none
+
+  figure.highlight
+    @extend $code-block
+    position: relative
+    addBorderRadius()
+
+    pre
+      margin: 0
+      padding: 8px 0
+      border: none
+
+    figcaption,
+    .caption
+      padding: 6px 0 2px 14px
+      font-size: $code-font-size
+      line-height: 1em
+
+      a
+        float: right
+        padding-right: 10px
+        color: var(--hl-color)
+
+        &:hover
+          border-bottom-color: var(--hl-color)
+
+    &.copy-true
+      user-select: all
+      -webkit-user-select: all
+
+      & > table,
+      & > pre
+        display: block !important
+        opacity: 0
+
+  .highlight-tools
+    display: flex
+    align-items: center
+    padding: 0 8px
+    min-height: 24px
+    height: 2.15em
+    background: var(--hltools-bg)
+    color: var(--hltools-color)
+    font-size: $code-font-size
+    overflow: hidden
+
+    & > *
+      padding: 5px
+
+    i
+      cursor: pointer
+      transition: all .3s
+
+      &:hover
+        color: $theme-color
+
+    &.closed
+      & ~ *
+        display: none
+
+      .expand
+        transform: rotate(-90deg)
+
+    if !$highlight_macstyle
+      & > .macStyle
+        padding: 0
+
+    .code-lang
+      flex: 1
+      text-transform: uppercase
+      font-weight: bold
+      font-size: 1.15em
+      user-select: none
+      -webkit-user-select: none
+      padding 2px
+
+    .copy-notice
+      padding-right: 2px
+      opacity: 0
+      transition: opacity .4s
+
+    if hexo-config('code_blocks.language')
+      .code-lang
+        flex: 1
+    else if (!$highlight_macstyle && hexo-config('code_blocks.shrink') != 'none')
+      & > div:nth-child(2)
+        flex: 1
+    else
+      .macStyle
+        flex: 1
+
+  .gutter
+    user-select: none
+    -webkit-user-select: none
+
+  .gist table
+    width: auto
+
+    td
+      border: none
+
+if $highlight_macstyle
+  .container
+    figure.highlight
+      margin: 0 0 24px
+      border-radius: 7px
+      box-shadow: 0 5px 10px 0 $highlight-mac-border
+      -webkit-transform: translateZ(0)
+
+      .highlight-tools
+        .macStyle
+          display: flex
+
+          & > *
+            margin-right: 8px
+            width: 12px
+            height: 12px
+            border-radius: 50%
+
+          & > :last-child
+            margin-right: 5px
+
+          .mac-close
+            background: #fc625d
+
+          .mac-minimize
+            background: #fdbc40
+
+          .mac-maximize
+            background: #35cd4b
+
+        if hexo-config('code_blocks.shrink') != 'none'
+          & > :nth-child(2)
+            order: 8
+
+          &.closed
+            .expand
+              transform: rotate(90deg)
+
+if hexo-config('code_blocks.height_limit')
+  .container
+    .code-expand-btn
+      position: absolute
+      bottom: 0
+      z-index: 10
+      width: 100%
+      background: var(--hlexpand-bg)
+      text-align: center
+      font-size: $code-font-size
+      cursor: pointer
+
+      i
+        padding: 6px 0
+        color: var(--hlnumber-color)
+        animation: code-expand-key 1.2s infinite
+
+      &.expand-done
+        & > i
+          transform: rotate(180deg)
+
+        & + table,
+        & + pre
+          margin-bottom: 1.8em
+
+      &:not(.expand-done)
+        & ~ table,
+        & ~ pre
+          overflow: hidden
+          height: unit(hexo-config('code_blocks.height_limit'), px)
+  
+  @keyframes code-expand-key
+    0%
+      opacity: .6
+
+    50%
+      opacity: .1
+
+    100%
+      opacity: .6
+
+if hexo-config('code_blocks.fullpage')
+  .container
+    figure.highlight.code-fullpage
+      position: fixed
+      top: 0
+      right: 0
+      bottom: 0
+      left: 0
+      z-index: 9999
+      margin: 0
+      border-radius: 0
+      animation: code-fullpage .3s
+
+      .code-expand-btn,
+      .expand
+        display: none
+
+      .highlight-tools
+        & ~ pre,
+        & ~ table
+          display: block
+          overflow: auto
+          height: calc(100vh - 2.15em)
+          margin-bottom: 0
+
+  @keyframes code-fullpage
+    0%,
+    100%
+      transform: translateX(0)
+
+    20%,
+    60%
+      transform: translateX(-5px)
+
+    40%,
+    80%
       transform: translateX(5px)
\ No newline at end of file
diff --git a/source/css/_highlight/highlight/diff.styl b/source/css/_highlight/highlight/diff.styl
index 6d8db97..728bc55 100644
--- a/source/css/_highlight/highlight/diff.styl
+++ b/source/css/_highlight/highlight/diff.styl
@@ -1,81 +1,81 @@
-figure.highlight
-  table
-    // scrollbar - firefox
-    @-moz-document url-prefix()
-      scrollbar-color: var(--hlscrollbar-bg) transparent
-
-    &::-webkit-scrollbar-thumb
-      background: var(--hlscrollbar-bg)
-
-  pre .deletion
-    color: $highlight-deletion
-
-  pre .addition
-    color: $highlight-addition
-
-  pre .meta
-    color: $highlight-purple
-
-  pre
-    .comment
-      color: $highlight-comment
-
-    .variable,
-    .attribute,
-    .regexp,
-    .ruby .constant,
-    .xml .tag .title,
-    .xml .pi,
-    .xml .doctype,
-    .html .doctype,
-    .css .id,
-    .tag .name,
-    .css .class,
-    .css .pseudo
-      color: $highlight-red
-
-    .tag
-      color: $highlight-aqua
-
-    .number,
-    .preprocessor,
-    .literal,
-    .params,
-    .constant,
-    .command
-      color: $highlight-orange
-
-    .built_in
-      color: $highlight-yellow
-
-    .ruby .class .title,
-    .css .rules .attribute,
-    .string,
-    .value,
-    .inheritance,
-    .header,
-    .ruby .symbol,
-    .xml .cdata,
-    .special,
-    .number,
-    .formula
-      color: $highlight-green
-
-    .keyword,
-    .title,
-    .css .hexcolor
-      color: $highlight-aqua
-
-    .function,
-    .python .decorator,
-    .python .title,
-    .ruby .function .title,
-    .ruby .title .keyword,
-    .perl .sub,
-    .javascript .title,
-    .coffeescript .title
-      color: $highlight-blue
-
-    .tag .attr,
-    .javascript .function
-      color: $highlight-purple
+figure.highlight
+  table
+    // scrollbar - firefox
+    @-moz-document url-prefix()
+      scrollbar-color: var(--hlscrollbar-bg) transparent
+
+    &::-webkit-scrollbar-thumb
+      background: var(--hlscrollbar-bg)
+
+  pre .deletion
+    color: $highlight-deletion
+
+  pre .addition
+    color: $highlight-addition
+
+  pre .meta
+    color: $highlight-purple
+
+  pre
+    .comment
+      color: $highlight-comment
+
+    .variable,
+    .attribute,
+    .regexp,
+    .ruby .constant,
+    .xml .tag .title,
+    .xml .pi,
+    .xml .doctype,
+    .html .doctype,
+    .css .id,
+    .tag .name,
+    .css .class,
+    .css .pseudo
+      color: $highlight-red
+
+    .tag
+      color: $highlight-aqua
+
+    .number,
+    .preprocessor,
+    .literal,
+    .params,
+    .constant,
+    .command
+      color: $highlight-orange
+
+    .built_in
+      color: $highlight-yellow
+
+    .ruby .class .title,
+    .css .rules .attribute,
+    .string,
+    .value,
+    .inheritance,
+    .header,
+    .ruby .symbol,
+    .xml .cdata,
+    .special,
+    .number,
+    .formula
+      color: $highlight-green
+
+    .keyword,
+    .title,
+    .css .hexcolor
+      color: $highlight-aqua
+
+    .function,
+    .python .decorator,
+    .python .title,
+    .ruby .function .title,
+    .ruby .title .keyword,
+    .perl .sub,
+    .javascript .title,
+    .coffeescript .title
+      color: $highlight-blue
+
+    .tag .attr,
+    .javascript .function
+      color: $highlight-purple
diff --git a/source/css/_highlight/highlight/index.styl b/source/css/_highlight/highlight/index.styl
index b241d98..72aa879 100644
--- a/source/css/_highlight/highlight/index.styl
+++ b/source/css/_highlight/highlight/index.styl
@@ -1,39 +1,39 @@
-if $highlight_theme != false
-  @require 'diff'
-
-.container
-  figure.highlight
-    .line
-      if wordWrap
-        &:before
-          display: inline-block
-          padding: 0 6px 0 0
-          min-width: 30px
-          color: var(--hlnumber-color)
-          content: counter(line)
-          counter-increment: line
-          text-align: left
-
-      &.marked
-        background-color: $highlight-selection
-
-    table
-      display: block
-      overflow: auto
-      border: none
-
-      td
-        padding: 0
-        border: none
-
-    .gutter pre
-      padding-right: 10px
-      padding-left: 10px
-      background-color: var(--hlnumber-bg)
-      color: var(--hlnumber-color)
-      text-align: right
-
-    .code pre
-      padding-right: 10px
-      padding-left: 10px
-      width: 100%
+if $highlight_theme != false
+  @require 'diff'
+
+.container
+  figure.highlight
+    .line
+      if wordWrap
+        &:before
+          display: inline-block
+          padding: 0 6px 0 0
+          min-width: 30px
+          color: var(--hlnumber-color)
+          content: counter(line)
+          counter-increment: line
+          text-align: left
+
+      &.marked
+        background-color: $highlight-selection
+
+    table
+      display: block
+      overflow: auto
+      border: none
+
+      td
+        padding: 0
+        border: none
+
+    .gutter pre
+      padding-right: 10px
+      padding-left: 10px
+      background-color: var(--hlnumber-bg)
+      color: var(--hlnumber-color)
+      text-align: right
+
+    .code pre
+      padding-right: 10px
+      padding-left: 10px
+      width: 100%
diff --git a/source/css/_highlight/prismjs/diff.styl b/source/css/_highlight/prismjs/diff.styl
index 7ebf786..5f6e9f8 100644
--- a/source/css/_highlight/prismjs/diff.styl
+++ b/source/css/_highlight/prismjs/diff.styl
@@ -1,302 +1,302 @@
-if $highlight_theme == 'light'
-  // prism-base16-ateliersulphurpool.light
-  pre[class*='language-']
-    .token.function
-      color: #ffb62c
-
-    .token.comment,
-    .token.prolog,
-    .token.doctype,
-    .token.cdata
-      color: rgba(149, 165, 166, .8)
-
-    .token.punctuation
-      color: #5e6687
-
-    .token.namespace
-      opacity: .7
-
-    .token.operator,
-    .token.boolean,
-    .token.number
-      color: #c76b29
-
-    .token.property
-      color: #c08b30
-
-    .token.tag
-      color: #3d8fd1
-
-    .token.string
-      color: #22a2c9
-
-    .token.selector
-      color: #6679cc
-
-    .token.attr-name
-      color: #c76b29
-
-    .token.entity,
-    .token.url,
-    .language-css .token.string,
-    .style .token.string
-      color: #22a2c9
-
-    .token.attr-value,
-    .token.keyword,
-    .token.control,
-    .token.directive,
-    .token.unit
-      color: #ac9739
-
-    .token.statement,
-    .token.regex,
-    .token.atrule
-      color: #22a2c9
-
-    .token.placeholder,
-    .token.variable
-      color: #3d8fd1
-
-    .token.deleted
-      text-decoration: line-through
-
-    .token.inserted
-      border-bottom: 1px dotted #202746
-      text-decoration: none
-
-    .token.italic
-      font-style: italic
-
-    .token.important,
-    .token.bold
-      font-weight: bold
-
-    .token.important
-      color: #c94922
-
-    .token.entity
-      cursor: help
-
-    pre > code.highlight
-      outline: .4em solid #c94922
-      outline-offset: .4em
-
-if $highlight_theme == 'darker'
-  // prism-atom-dark
-  pre[class*='language-']
-    .token.comment,
-    .token.prolog,
-    .token.doctype,
-    .token.cdata
-      color: #7C7C7C
-
-    .token.punctuation
-      color: #c5c8c6
-
-    .namespace
-      opacity: .7
-
-    .token.property,
-    .token.keyword,
-    .token.tag
-      color: #96CBFE
-
-    .token.class-name
-      color: #FFFFB6
-
-    .token.boolean,
-    .token.constant
-      color: #99CC99
-
-    .token.symbol,
-    .token.deleted
-      color: #f92672
-
-    .token.number
-      color: #FF73FD
-
-    .token.selector,
-    .token.attr-name,
-    .token.string,
-    .token.char,
-    .token.builtin,
-    .token.inserted
-      color: #A8FF60
-
-    .token.variable
-      color: #C6C5FE
-
-    .token.operator
-      color: #EDEDED
-
-    .token.entity
-      color: #FFFFB6
-      cursor: help
-
-    .token.url
-      color: #96CBFE
-
-    .language-css .token.string,
-    .style .token.string
-      color: #87C38A
-
-    .token.atrule,
-    .token.attr-value
-      color: #F9EE98
-
-    .token.function
-      color: #DAD085
-
-    .token.regex
-      color: #E9C062
-
-    .token.important
-      color: #fd971f
-
-    .token.important,
-    .token.bold
-      font-weight: bold
-
-    .token.italic
-      font-style: italic
-
-if $highlight_theme == 'pale night'
-  // prism-dracula
-  pre[class*='language-']
-    .token.comment,
-    .token.prolog,
-    .token.doctype,
-    .token.cdata
-      color: #6272a4
-
-    .token.punctuation
-      color: #f8f8f2
-
-    .namespace
-      opacity: .7
-
-    .token.property,
-    .token.tag,
-    .token.constant,
-    .token.symbol,
-    .token.deleted
-      color: #ff79c6
-
-    .token.boolean,
-    .token.number
-      color: #bd93f9
-
-    .token.selector,
-    .token.attr-name,
-    .token.string,
-    .token.char,
-    .token.builtin,
-    .token.inserted
-      color: #50fa7b
-
-    .token.operator,
-    .token.entity,
-    .token.url,
-    .language-css .token.string,
-    .style .token.string,
-    .token.variable
-      color: #f8f8f2
-
-    .token.atrule,
-    .token.attr-value,
-    .token.function,
-    .token.class-name
-      color: #f1fa8c
-
-    .token.keyword
-      color: #8be9fd
-
-    .token.regex,
-    .token.important
-      color: #ffb86c
-
-    .token.important,
-    .token.bold
-      font-weight: bold
-
-    .token.italic
-      font-style: italic
-
-    .token.entity
-      cursor: help
-
-if $highlight_theme == 'ocean'
-  // prism-material-oceanic
-  pre[class*='language-']
-    &.language-css > code,
-    &.language-sass > code,
-    &.language-scss > code
-      color: #fd9170 !important
-
-    .namespace
-      opacity: .7
-
-    .token.atrule,
-    .token.symbol,
-    .token.constant,
-    .token.boolean,
-    .token.function
-      color: #c792ea
-
-    .token.attr-name,
-    .token.builtin,
-    .token.class
-      color: #ffcb6b
-
-    .token.attr-value,
-    .token.attribute,
-    .token.pseudo-class,
-    .token.pseudo-element,
-    .token.string
-      color: #c3e88d
-
-    .token.cdata,
-    .token.property,
-    .token.char,
-    .token.inserted
-      color: #80cbc4
-
-    .token.class-name,
-    .token.color,
-    .token.hexcode,
-    .token.regex
-      color: #f2ff00
-
-    .token.comment,
-    .token.prolog,
-    .token.doctype
-      color: #546e7a
-
-    .token.deleted,
-    .token.variable,
-    .token.entity,
-    .token.selector,
-    .token.tag,
-    .token.unit
-      color: #f07178
-
-    .token.id
-      color: #c792ea
-      font-weight: bold
-
-    .token.important
-      color: #c792ea
-      font-weight: bold
-
-    .token.keyword
-      color: #c792ea
-      font-style: italic
-
-    .token.number,
-    .token.url
-      color: #fd9170
-
-    .token.operator,
-    .token.punctuation
+if $highlight_theme == 'light'
+  // prism-base16-ateliersulphurpool.light
+  pre[class*='language-']
+    .token.function
+      color: #ffb62c
+
+    .token.comment,
+    .token.prolog,
+    .token.doctype,
+    .token.cdata
+      color: rgba(149, 165, 166, .8)
+
+    .token.punctuation
+      color: #5e6687
+
+    .token.namespace
+      opacity: .7
+
+    .token.operator,
+    .token.boolean,
+    .token.number
+      color: #c76b29
+
+    .token.property
+      color: #c08b30
+
+    .token.tag
+      color: #3d8fd1
+
+    .token.string
+      color: #22a2c9
+
+    .token.selector
+      color: #6679cc
+
+    .token.attr-name
+      color: #c76b29
+
+    .token.entity,
+    .token.url,
+    .language-css .token.string,
+    .style .token.string
+      color: #22a2c9
+
+    .token.attr-value,
+    .token.keyword,
+    .token.control,
+    .token.directive,
+    .token.unit
+      color: #ac9739
+
+    .token.statement,
+    .token.regex,
+    .token.atrule
+      color: #22a2c9
+
+    .token.placeholder,
+    .token.variable
+      color: #3d8fd1
+
+    .token.deleted
+      text-decoration: line-through
+
+    .token.inserted
+      border-bottom: 1px dotted #202746
+      text-decoration: none
+
+    .token.italic
+      font-style: italic
+
+    .token.important,
+    .token.bold
+      font-weight: bold
+
+    .token.important
+      color: #c94922
+
+    .token.entity
+      cursor: help
+
+    pre > code.highlight
+      outline: .4em solid #c94922
+      outline-offset: .4em
+
+if $highlight_theme == 'darker'
+  // prism-atom-dark
+  pre[class*='language-']
+    .token.comment,
+    .token.prolog,
+    .token.doctype,
+    .token.cdata
+      color: #7C7C7C
+
+    .token.punctuation
+      color: #c5c8c6
+
+    .namespace
+      opacity: .7
+
+    .token.property,
+    .token.keyword,
+    .token.tag
+      color: #96CBFE
+
+    .token.class-name
+      color: #FFFFB6
+
+    .token.boolean,
+    .token.constant
+      color: #99CC99
+
+    .token.symbol,
+    .token.deleted
+      color: #f92672
+
+    .token.number
+      color: #FF73FD
+
+    .token.selector,
+    .token.attr-name,
+    .token.string,
+    .token.char,
+    .token.builtin,
+    .token.inserted
+      color: #A8FF60
+
+    .token.variable
+      color: #C6C5FE
+
+    .token.operator
+      color: #EDEDED
+
+    .token.entity
+      color: #FFFFB6
+      cursor: help
+
+    .token.url
+      color: #96CBFE
+
+    .language-css .token.string,
+    .style .token.string
+      color: #87C38A
+
+    .token.atrule,
+    .token.attr-value
+      color: #F9EE98
+
+    .token.function
+      color: #DAD085
+
+    .token.regex
+      color: #E9C062
+
+    .token.important
+      color: #fd971f
+
+    .token.important,
+    .token.bold
+      font-weight: bold
+
+    .token.italic
+      font-style: italic
+
+if $highlight_theme == 'pale night'
+  // prism-dracula
+  pre[class*='language-']
+    .token.comment,
+    .token.prolog,
+    .token.doctype,
+    .token.cdata
+      color: #6272a4
+
+    .token.punctuation
+      color: #f8f8f2
+
+    .namespace
+      opacity: .7
+
+    .token.property,
+    .token.tag,
+    .token.constant,
+    .token.symbol,
+    .token.deleted
+      color: #ff79c6
+
+    .token.boolean,
+    .token.number
+      color: #bd93f9
+
+    .token.selector,
+    .token.attr-name,
+    .token.string,
+    .token.char,
+    .token.builtin,
+    .token.inserted
+      color: #50fa7b
+
+    .token.operator,
+    .token.entity,
+    .token.url,
+    .language-css .token.string,
+    .style .token.string,
+    .token.variable
+      color: #f8f8f2
+
+    .token.atrule,
+    .token.attr-value,
+    .token.function,
+    .token.class-name
+      color: #f1fa8c
+
+    .token.keyword
+      color: #8be9fd
+
+    .token.regex,
+    .token.important
+      color: #ffb86c
+
+    .token.important,
+    .token.bold
+      font-weight: bold
+
+    .token.italic
+      font-style: italic
+
+    .token.entity
+      cursor: help
+
+if $highlight_theme == 'ocean'
+  // prism-material-oceanic
+  pre[class*='language-']
+    &.language-css > code,
+    &.language-sass > code,
+    &.language-scss > code
+      color: #fd9170 !important
+
+    .namespace
+      opacity: .7
+
+    .token.atrule,
+    .token.symbol,
+    .token.constant,
+    .token.boolean,
+    .token.function
+      color: #c792ea
+
+    .token.attr-name,
+    .token.builtin,
+    .token.class
+      color: #ffcb6b
+
+    .token.attr-value,
+    .token.attribute,
+    .token.pseudo-class,
+    .token.pseudo-element,
+    .token.string
+      color: #c3e88d
+
+    .token.cdata,
+    .token.property,
+    .token.char,
+    .token.inserted
+      color: #80cbc4
+
+    .token.class-name,
+    .token.color,
+    .token.hexcode,
+    .token.regex
+      color: #f2ff00
+
+    .token.comment,
+    .token.prolog,
+    .token.doctype
+      color: #546e7a
+
+    .token.deleted,
+    .token.variable,
+    .token.entity,
+    .token.selector,
+    .token.tag,
+    .token.unit
+      color: #f07178
+
+    .token.id
+      color: #c792ea
+      font-weight: bold
+
+    .token.important
+      color: #c792ea
+      font-weight: bold
+
+    .token.keyword
+      color: #c792ea
+      font-style: italic
+
+    .token.number,
+    .token.url
+      color: #fd9170
+
+    .token.operator,
+    .token.punctuation
       color: #89ddff
\ No newline at end of file
diff --git a/source/css/_highlight/prismjs/index.styl b/source/css/_highlight/prismjs/index.styl
index b76b6ec..30637d7 100644
--- a/source/css/_highlight/prismjs/index.styl
+++ b/source/css/_highlight/prismjs/index.styl
@@ -1,24 +1,24 @@
-if $prismjs_line_number
-  @require 'line-number'
-
-if $highlight_theme != false
-  @require 'diff'
-
-.container
-  pre[class*='language-']
-    // scrollbar - firefox
-    @-moz-document url-prefix()
-      scrollbar-color: var(--hlscrollbar-bg) transparent
-
-    &::-webkit-scrollbar-thumb
-      background: var(--hlscrollbar-bg)
-
-    &:not(.line-numbers)
-      padding: 10px 20px
-
-    .caption
-      margin-left: -3.8em
-      padding: 4px 16px !important
-
-      a
-        padding: 0 !important
+if $prismjs_line_number
+  @require 'line-number'
+
+if $highlight_theme != false
+  @require 'diff'
+
+.container
+  pre[class*='language-']
+    // scrollbar - firefox
+    @-moz-document url-prefix()
+      scrollbar-color: var(--hlscrollbar-bg) transparent
+
+    &::-webkit-scrollbar-thumb
+      background: var(--hlscrollbar-bg)
+
+    &:not(.line-numbers)
+      padding: 10px 20px
+
+    .caption
+      margin-left: -3.8em
+      padding: 4px 16px !important
+
+      a
+        padding: 0 !important
diff --git a/source/css/_highlight/prismjs/line-number.styl b/source/css/_highlight/prismjs/line-number.styl
index 85d4376..761e465 100644
--- a/source/css/_highlight/prismjs/line-number.styl
+++ b/source/css/_highlight/prismjs/line-number.styl
@@ -1,42 +1,42 @@
-.container
-  pre[class*='language-']
-    &.line-numbers
-      position: relative
-      padding-left: 3.8em
-      counter-reset: linenumber
-      line-height: $line-height-code-block
-
-      > code
-        position: relative
-        line-height: $line-height-code-block
-
-        if hexo-config('code_blocks.word_wrap')
-          white-space: pre-wrap
-        else
-          white-space: inherit
-          word-wrap: normal
-          word-break: normal
-          overflow-wrap: normal
-
-      .line-numbers-rows
-        position: absolute
-        top: 0
-        left: -3.8em
-        width: 3em
-        letter-spacing: -1px
-        font-size: 100%
-        pointer-events: none
-        user-select: none
-        -webkit-user-select: none
-
-        & > span
-          display: block
-          counter-increment: linenumber
-          pointer-events: none
-
-          &:before
-            display: block
-            padding-right: .8em
-            color: var(--hlnumber-color)
-            content: counter(linenumber)
-            text-align: right
+.container
+  pre[class*='language-']
+    &.line-numbers
+      position: relative
+      padding-left: 3.8em
+      counter-reset: linenumber
+      line-height: $line-height-code-block
+
+      > code
+        position: relative
+        line-height: $line-height-code-block
+
+        if hexo-config('code_blocks.word_wrap')
+          white-space: pre-wrap
+        else
+          white-space: inherit
+          word-wrap: normal
+          word-break: normal
+          overflow-wrap: normal
+
+      .line-numbers-rows
+        position: absolute
+        top: 0
+        left: -3.8em
+        width: 3em
+        letter-spacing: -1px
+        font-size: 100%
+        pointer-events: none
+        user-select: none
+        -webkit-user-select: none
+
+        & > span
+          display: block
+          counter-increment: linenumber
+          pointer-events: none
+
+          &:before
+            display: block
+            padding-right: .8em
+            color: var(--hlnumber-color)
+            content: counter(linenumber)
+            text-align: right
diff --git a/source/css/_highlight/theme.styl b/source/css/_highlight/theme.styl
index 8c66335..4d07938 100644
--- a/source/css/_highlight/theme.styl
+++ b/source/css/_highlight/theme.styl
@@ -1,121 +1,121 @@
-if $highlight_theme == 'darker'
-  $highlight-background = #212121
-  $highlight-selection = #61616150
-  $highlight-foreground = #EEFFFF
-  $highlight-mac-border = rgba(0, 0, 0, .4)
-  $highlight-gutter = {
-    color: alpha($highlight-foreground, .5),
-    bg-color: $highlight-background
-  }
-  $highlight-tools = {
-    color: alpha($highlight-foreground, .8),
-    bg-color: darken($highlight-background, 2)
-  }
-  $highlight-scrollbar = lighten($highlight-background, 8)
-
-  if $highlight_enable
-    $highlight-comment = #969896
-    $highlight-red = #FF5370
-    $highlight-orange = #F78C6C
-    $highlight-yellow = #FFCB6B
-    $highlight-green = #C3E88D
-    $highlight-aqua = #89DDFF
-    $highlight-blue = #82AAFF
-    $highlight-purple = #C792EA
-    $highlight-deletion = #BF42BF
-    $highlight-addition = #105EDE
-
-if $highlight_theme == 'pale night'
-  $highlight-background = #292D3E
-  $highlight-selection = #717CB450
-  $highlight-foreground = #A6ACCD
-  $highlight-mac-border = rgba($highlight-background, .4)
-  $highlight-gutter = {
-    color: alpha($highlight-foreground, .5),
-    bg-color: $highlight-background
-  }
-  $highlight-tools = {
-    color: $highlight-foreground,
-    bg-color: darken($highlight-background, 2)
-  }
-  $highlight-scrollbar = lighten($highlight-background, 8)
-
-  if $highlight_enable
-    $highlight-comment = #676E95
-    $highlight-red = #FF5370
-    $highlight-orange = #F78C6C
-    $highlight-yellow = #FFCB6B
-    $highlight-green = #C3E88D
-    $highlight-aqua = #89DDFF
-    $highlight-blue = #82AAFF
-    $highlight-purple = #C792EA
-    $highlight-deletion = #BF42BF
-    $highlight-addition = #105EDE
-
-if $highlight_theme == 'ocean'
-  $highlight-background = #0F111A
-  $highlight-selection = #717CB450
-  $highlight-foreground = #8F93A2
-  $highlight-mac-border = rgba($highlight-background, .4)
-  $highlight-gutter = {
-    color: alpha($highlight-foreground, .5),
-    bg-color: $highlight-background
-  }
-  $highlight-tools = {
-    color: $highlight-foreground,
-    bg-color: darken($highlight-background, 2)
-  }
-  $highlight-scrollbar = lighten($highlight-background, 8)
-
-  if $highlight_enable
-    $highlight-comment = rgba(101, 115, 126, .8)
-    $highlight-red = #FF5370
-    $highlight-orange = #F78C6C
-    $highlight-yellow = #FFCB6B
-    $highlight-green = #C3E88D
-    $highlight-aqua = #89DDFF
-    $highlight-blue = #82AAFF
-    $highlight-purple = #C792EA
-    $highlight-deletion = #BF42BF
-    $highlight-addition = #105EDE
-
-if $highlight_theme == 'light'
-  $highlight-background = #F6F8FA
-  $highlight-selection = #80CBC440
-  $highlight-foreground = #90A4AE
-  $highlight-mac-border = rgba(144, 164, 174, .4)
-  $highlight-tools = {
-    color: $highlight-foreground,
-    bg-color: darken($highlight-background, 5)
-  }
-  $highlight-gutter = {
-    color: alpha($highlight-foreground, .5),
-    bg-color: $highlight-background
-  }
-  $highlight-scrollbar = darken($highlight-background, 8)
-
-  if $highlight_enable
-    $highlight-comment = rgba(149, 165, 166, .8)
-    $highlight-red = #E53935
-    $highlight-orange = #F76D47
-    $highlight-yellow = #FFB62C
-    $highlight-green = #91B859
-    $highlight-aqua = #39ADB5
-    $highlight-blue = #6182B8
-    $highlight-purple = #7C4DFF
-    $highlight-deletion = #BF42BF
-    $highlight-addition = #105EDE
-
-if $highlight_theme == false
-  $highlight-background = #F6F8FA
-  $highlight-foreground = #90A4AE
-  $highlight-selection = #80CBC440
-  $highlight-gutter = {
-    color: alpha($highlight-foreground, .5),
-    bg-color: $highlight-background
-  }
-  $highlight-tools = {
-    color: $highlight-foreground,
-    bg-color: darken($highlight-background, 5)
-  }
-  $highlight-scrollbar = darken($highlight-background, 8)
+if $highlight_theme == 'darker'
+  $highlight-background = #212121
+  $highlight-selection = #61616150
+  $highlight-foreground = #EEFFFF
+  $highlight-mac-border = rgba(0, 0, 0, .4)
+  $highlight-gutter = {
+    color: alpha($highlight-foreground, .5),
+    bg-color: $highlight-background
+  }
+  $highlight-tools = {
+    color: alpha($highlight-foreground, .8),
+    bg-color: darken($highlight-background, 2)
+  }
+  $highlight-scrollbar = lighten($highlight-background, 8)
+
+  if $highlight_enable
+    $highlight-comment = #969896
+    $highlight-red = #FF5370
+    $highlight-orange = #F78C6C
+    $highlight-yellow = #FFCB6B
+    $highlight-green = #C3E88D
+    $highlight-aqua = #89DDFF
+    $highlight-blue = #82AAFF
+    $highlight-purple = #C792EA
+    $highlight-deletion = #BF42BF
+    $highlight-addition = #105EDE
+
+if $highlight_theme == 'pale night'
+  $highlight-background = #292D3E
+  $highlight-selection = #717CB450
+  $highlight-foreground = #A6ACCD
+  $highlight-mac-border = rgba($highlight-background, .4)
+  $highlight-gutter = {
+    color: alpha($highlight-foreground, .5),
+    bg-color: $highlight-background
+  }
+  $highlight-tools = {
+    color: $highlight-foreground,
+    bg-color: darken($highlight-background, 2)
+  }
+  $highlight-scrollbar = lighten($highlight-background, 8)
+
+  if $highlight_enable
+    $highlight-comment = #676E95
+    $highlight-red = #FF5370
+    $highlight-orange = #F78C6C
+    $highlight-yellow = #FFCB6B
+    $highlight-green = #C3E88D
+    $highlight-aqua = #89DDFF
+    $highlight-blue = #82AAFF
+    $highlight-purple = #C792EA
+    $highlight-deletion = #BF42BF
+    $highlight-addition = #105EDE
+
+if $highlight_theme == 'ocean'
+  $highlight-background = #0F111A
+  $highlight-selection = #717CB450
+  $highlight-foreground = #8F93A2
+  $highlight-mac-border = rgba($highlight-background, .4)
+  $highlight-gutter = {
+    color: alpha($highlight-foreground, .5),
+    bg-color: $highlight-background
+  }
+  $highlight-tools = {
+    color: $highlight-foreground,
+    bg-color: darken($highlight-background, 2)
+  }
+  $highlight-scrollbar = lighten($highlight-background, 8)
+
+  if $highlight_enable
+    $highlight-comment = rgba(101, 115, 126, .8)
+    $highlight-red = #FF5370
+    $highlight-orange = #F78C6C
+    $highlight-yellow = #FFCB6B
+    $highlight-green = #C3E88D
+    $highlight-aqua = #89DDFF
+    $highlight-blue = #82AAFF
+    $highlight-purple = #C792EA
+    $highlight-deletion = #BF42BF
+    $highlight-addition = #105EDE
+
+if $highlight_theme == 'light'
+  $highlight-background = #F6F8FA
+  $highlight-selection = #80CBC440
+  $highlight-foreground = #90A4AE
+  $highlight-mac-border = rgba(144, 164, 174, .4)
+  $highlight-tools = {
+    color: $highlight-foreground,
+    bg-color: darken($highlight-background, 5)
+  }
+  $highlight-gutter = {
+    color: alpha($highlight-foreground, .5),
+    bg-color: $highlight-background
+  }
+  $highlight-scrollbar = darken($highlight-background, 8)
+
+  if $highlight_enable
+    $highlight-comment = rgba(149, 165, 166, .8)
+    $highlight-red = #E53935
+    $highlight-orange = #F76D47
+    $highlight-yellow = #FFB62C
+    $highlight-green = #91B859
+    $highlight-aqua = #39ADB5
+    $highlight-blue = #6182B8
+    $highlight-purple = #7C4DFF
+    $highlight-deletion = #BF42BF
+    $highlight-addition = #105EDE
+
+if $highlight_theme == false
+  $highlight-background = #F6F8FA
+  $highlight-foreground = #90A4AE
+  $highlight-selection = #80CBC440
+  $highlight-gutter = {
+    color: alpha($highlight-foreground, .5),
+    bg-color: $highlight-background
+  }
+  $highlight-tools = {
+    color: $highlight-foreground,
+    bg-color: darken($highlight-background, 5)
+  }
+  $highlight-scrollbar = darken($highlight-background, 8)
diff --git a/source/css/_layout/aside.styl b/source/css/_layout/aside.styl
index 47c7e76..5495097 100644
--- a/source/css/_layout/aside.styl
+++ b/source/css/_layout/aside.styl
@@ -1,424 +1,424 @@
-#aside-content
-  width: 26%
-
-  +minWidth900()
-    if hexo-config('aside.position') == 'right'
-      padding-left: 15px
-    else
-      padding-right: 15px
-
-  +maxWidth900()
-    margin-top: 20px
-    width: 100%
-
-  .card-widget
-    @extend .cardHover
-    position: relative
-    overflow: hidden
-    margin-bottom: 20px
-    padding: 20px 24px
-
-    if hexo-config('aside.mobile') == false
-      +maxWidth768()
-        &:not(#card-toc)
-          display: none
-
-    &:last-child
-      margin-bottom: 0
-
-  .card-info
-    .author-info
-      &-name
-        font-weight: 500
-        font-size: 1.57em
-
-      &-description
-        margin-top: -.42em
-
-    .site-data
-      margin: 14px 0 4px
-
-    .card-info-social-icons
-      margin: 6px 0 -6px
-
-      .social-icon
-        margin: 0 10px
-        color: var(--font-color)
-        font-size: 1.4em
-
-      i
-        transition: all .3s
-
-        &:hover
-          transform: rotate(360deg)
-
-    #card-info-btn
-      display: block
-      margin-top: 14px
-      background-color: var(--btn-bg)
-      color: var(--btn-color)
-      text-align: center
-      line-height: 2.4
-      addBorderRadius(7)
-
-      &:hover
-        background-color: var(--btn-hover-color)
-
-      span
-        padding-left: 10px
-
-  .item-headline
-    padding-bottom: 6px
-    font-size: 1.2em
-
-    span
-      margin-left: 6px
-
-  .sticky_layout
-    +minWidth900()
-      position: sticky
-      position: -webkit-sticky
-      top: 20px
-      transition: top .3s
-
-  .card-tag-cloud
-    a
-      display: inline-block
-      padding: 0 4px
-      line-height: 1.8
-
-      &:hover
-        color: $text-hover !important
-
-  .aside-list
-    & > span
-      display: block
-      margin-bottom: 10px
-      text-align: center
-
-    & > .aside-list-item
-      display: flex
-      align-items: center
-      padding: 6px 0
-
-      &:first-child
-        padding-top: 0
-
-      &:not(:last-child)
-        border-bottom: 1px dashed #f5f5f5
-
-      &:last-child
-        padding-bottom: 0
-
-      .thumbnail
-        overflow: hidden
-        width: w = 4em
-        height: w
-        addBorderRadius()
-
-        :first-child
-          @extend .imgHover
-
-      .content
-        flex: 1
-        padding-left: 10px
-        word-break: break-all
-
-        & > .name
-          @extend .limit-more-line
-          -webkit-line-clamp: 1
-
-        & > time,
-        & > .name
-          display: block
-          color: var(--card-meta)
-          font-size: .85em
-
-        & > .title,
-        & > .comment
-          @extend .limit-more-line
-          color: var(--font-color)
-          // font-size: 95%
-          line-height: 1.5
-          -webkit-line-clamp: 2
-
-          &:hover
-            color: $text-hover
-
-      &.no-cover
-        min-height: 4.4em
-
-  .card-archives ul.card-archive-list,
-  .card-categories ul.card-category-list
-    margin: 0
-    padding: 0
-    list-style: none
-
-  .card-archives ul.card-archive-list > .card-archive-list-item,
-  .card-categories ul.card-category-list > .card-category-list-item
-    a
-      display: flex
-      flex-direction: row
-      margin: 2px 0
-      padding: 2px 8px
-      color: var(--font-color)
-      transition: all .3s
-      addBorderRadius()
-
-      &:hover
-        padding: 2px 12px
-        background-color: var(--text-bg-hover)
-        color: var(--white)
-
-      span
-        @extend .limit-one-line
-
-        &:first-child
-          flex: 1
-
-  .card-categories
-    .card-category-list
-      &.child
-        padding: 0 0 0 16px
-
-      > .parent
-        > a
-          &.expand
-            i
-              transform: rotate(-90deg)
-
-            & + .child
-              display: block
-
-          .card-category-list
-            &-name
-              width: 70% !important
-
-            &-count
-              width: calc(100% - 70% - 20px)
-              text-align: right
-
-          i
-            float: right
-            margin-right: -.5em
-            padding: .5em
-            transition: transform .3s
-            transform: rotate(0)
-
-        if hexo-config('aside.card_categories.expand') == false
-          > .child
-            display: none
-
-  .card-webinfo
-    .webinfo
-      .webinfo-item
-        display: flex
-        align-items: center
-        padding: 2px 10px 0
-
-        div
-          &:first-child
-            flex: 1
-            padding-right: 20px
-
-  // toc
-  #card-toc
-    +minWidth901()
-      right: 0 !important
-
-    +maxWidth900()
-      position: fixed
-      right: 55px
-      bottom: 30px
-      z-index: 100
-      max-width: $toc-mobile-maxWidth
-      max-height: calc(100% - 60px)
-      width: $toc-mobile-width
-      transition: none
-      transform: scale(0)
-      transform-origin: right bottom
-
-      &.open
-        transform: scale(1)
-
-    .toc-percentage
-      float: right
-      margin-top: -9px
-      color: #a9a9a9
-      font-style: italic
-      font-size: 140%
-
-    .toc-content
-      overflow-y: scroll
-      overflow-y: overlay
-      margin: 0 -24px
-      max-height: calc(100vh - 120px)
-      width: calc(100% + 48px)
-
-      +maxWidth900()
-        max-height: calc(100vh - 140px)
-
-      & > *
-        margin: 0 20px !important
-
-        & > .toc-item > .toc-child
-          margin-left: 10px
-          padding-left: 10px
-          border-left: 1px solid var(--dark-grey)
-
-      &:not(.is-expand)
-        .toc-child
-          display: none
-
-          +maxWidth900()
-            display: block !important
-
-        .toc-item
-          &.active
-            .toc-child
-              display: block
-
-      ol,
-      li
-        list-style: none
-
-      > ol
-        padding: 0 !important
-
-      ol
-        margin: 0
-        padding-left: 18px
-
-      .toc-link
-        display: block
-        margin: 4px 0
-        padding: 1px 8px
-        color: var(--toc-link-color)
-        transition: all .2s ease-in-out
-        addBorderRadius()
-
-        &:hover
-          color: $theme-color
-
-        &.active
-          background: $theme-toc-color
-          color: $toc-active-color
-
-  .sticky_layout:only-child
-    > :first-child
-      margin-top: 0
-
-  .card-more-btn
-    float: right
-    color: inherit
-
-    &:hover
-      animation: more-btn-move 1s infinite
-
-  .card-announcement
-    .item-headline
-      i
-        color: #FF0000
-
-.avatar-img
-  overflow: hidden
-  margin: 0 auto
-  width: 110px
-  height: 110px
-  border-radius: 70px
-
-  img
-    width: 100%
-    height: 100%
-    transition: filter 375ms ease-in .2s, transform .3s
-    object-fit: cover
-
-    &:hover
-      transform: rotate(360deg)
-
-.site-data
-  display: table
-  width: 100%
-  table-layout: fixed
-
-  & > a
-    display: table-cell
-
-    div
-      transition: all .3s
-
-    &:hover
-      div
-        color: $theme-color !important
-
-    .headline
-      @extend .limit-one-line
-      color: var(--font-color)
-      font-size: .95em
-
-    .length-num
-      margin-top: -.45em
-      color: var(--text-highlight-color)
-      font-size: 1.2em
-
-@keyframes more-btn-move
-  0%,
-  100%
-    transform: translateX(0)
-
-  50%
-    transform: translateX(3px)
-
-@keyframes toc-open
-  0%
-    transform: scale(.7)
-
-  100%
-    transform: scale(1)
-
-@keyframes toc-close
-  0%
-    transform: scale(1)
-
-  100%
-    transform: scale(.7)
-
-+minWidth900()
-  html.hide-aside
-    .layout
-      justify-content: center
-
-      > .aside-content
-        display: none
-
-      > div:first-child
-        width: 80%
-
-.page
-  .sticky_layout
-    display: flex
-    flex-direction: column
-
-  if hexo-config('aside.card_recent_post.sort_order')
-    .card-recent-post
-      order: hexo-config('aside.card_recent_post.sort_order')
-
-  if hexo-config('aside.card_newest_comments.sort_order')
-    #card-newest-comments
-      order: hexo-config('aside.card_newest_comments.sort_order')
-
-  if hexo-config('aside.card_categories.sort_order')
-    .card-categories
-      order: hexo-config('aside.card_categories.sort_order')
-
-  if hexo-config('aside.card_tags.sort_order')
-    .card-tags
-      order: hexo-config('aside.card_tags.sort_order')
-
-  if hexo-config('aside.card_archives.sort_order')
-    .card-archives
-      order: hexo-config('aside.card_archives.sort_order')
-
-  if hexo-config('aside.card_webinfo.sort_order')
-    .card-webinfo
-      order: hexo-config('aside.card_webinfo.sort_order')
+#aside-content
+  width: 26%
+
+  +minWidth900()
+    if hexo-config('aside.position') == 'right'
+      padding-left: 15px
+    else
+      padding-right: 15px
+
+  +maxWidth900()
+    margin-top: 20px
+    width: 100%
+
+  .card-widget
+    @extend .cardHover
+    position: relative
+    overflow: hidden
+    margin-bottom: 20px
+    padding: 20px 24px
+
+    if hexo-config('aside.mobile') == false
+      +maxWidth768()
+        &:not(#card-toc)
+          display: none
+
+    &:last-child
+      margin-bottom: 0
+
+  .card-info
+    .author-info
+      &-name
+        font-weight: 500
+        font-size: 1.57em
+
+      &-description
+        margin-top: -.42em
+
+    .site-data
+      margin: 14px 0 4px
+
+    .card-info-social-icons
+      margin: 6px 0 -6px
+
+      .social-icon
+        margin: 0 10px
+        color: var(--font-color)
+        font-size: 1.4em
+
+      i
+        transition: all .3s
+
+        &:hover
+          transform: rotate(360deg)
+
+    #card-info-btn
+      display: block
+      margin-top: 14px
+      background-color: var(--btn-bg)
+      color: var(--btn-color)
+      text-align: center
+      line-height: 2.4
+      addBorderRadius(7)
+
+      &:hover
+        background-color: var(--btn-hover-color)
+
+      span
+        padding-left: 10px
+
+  .item-headline
+    padding-bottom: 6px
+    font-size: 1.2em
+
+    span
+      margin-left: 6px
+
+  .sticky_layout
+    +minWidth900()
+      position: sticky
+      position: -webkit-sticky
+      top: 20px
+      transition: top .3s
+
+  .card-tag-cloud
+    a
+      display: inline-block
+      padding: 0 4px
+      line-height: 1.8
+
+      &:hover
+        color: $text-hover !important
+
+  .aside-list
+    & > span
+      display: block
+      margin-bottom: 10px
+      text-align: center
+
+    & > .aside-list-item
+      display: flex
+      align-items: center
+      padding: 6px 0
+
+      &:first-child
+        padding-top: 0
+
+      &:not(:last-child)
+        border-bottom: 1px dashed #f5f5f5
+
+      &:last-child
+        padding-bottom: 0
+
+      .thumbnail
+        overflow: hidden
+        width: w = 4em
+        height: w
+        addBorderRadius()
+
+        :first-child
+          @extend .imgHover
+
+      .content
+        flex: 1
+        padding-left: 10px
+        word-break: break-all
+
+        & > .name
+          @extend .limit-more-line
+          -webkit-line-clamp: 1
+
+        & > time,
+        & > .name
+          display: block
+          color: var(--card-meta)
+          font-size: .85em
+
+        & > .title,
+        & > .comment
+          @extend .limit-more-line
+          color: var(--font-color)
+          // font-size: 95%
+          line-height: 1.5
+          -webkit-line-clamp: 2
+
+          &:hover
+            color: $text-hover
+
+      &.no-cover
+        min-height: 4.4em
+
+  .card-archives ul.card-archive-list,
+  .card-categories ul.card-category-list
+    margin: 0
+    padding: 0
+    list-style: none
+
+  .card-archives ul.card-archive-list > .card-archive-list-item,
+  .card-categories ul.card-category-list > .card-category-list-item
+    a
+      display: flex
+      flex-direction: row
+      margin: 2px 0
+      padding: 2px 8px
+      color: var(--font-color)
+      transition: all .3s
+      addBorderRadius()
+
+      &:hover
+        padding: 2px 12px
+        background-color: var(--text-bg-hover)
+        color: var(--white)
+
+      span
+        @extend .limit-one-line
+
+        &:first-child
+          flex: 1
+
+  .card-categories
+    .card-category-list
+      &.child
+        padding: 0 0 0 16px
+
+      > .parent
+        > a
+          &.expand
+            i
+              transform: rotate(-90deg)
+
+            & + .child
+              display: block
+
+          .card-category-list
+            &-name
+              width: 70% !important
+
+            &-count
+              width: calc(100% - 70% - 20px)
+              text-align: right
+
+          i
+            float: right
+            margin-right: -.5em
+            padding: .5em
+            transition: transform .3s
+            transform: rotate(0)
+
+        if hexo-config('aside.card_categories.expand') == false
+          > .child
+            display: none
+
+  .card-webinfo
+    .webinfo
+      .webinfo-item
+        display: flex
+        align-items: center
+        padding: 2px 10px 0
+
+        div
+          &:first-child
+            flex: 1
+            padding-right: 20px
+
+  // toc
+  #card-toc
+    +minWidth901()
+      right: 0 !important
+
+    +maxWidth900()
+      position: fixed
+      right: 55px
+      bottom: 30px
+      z-index: 100
+      max-width: $toc-mobile-maxWidth
+      max-height: calc(100% - 60px)
+      width: $toc-mobile-width
+      transition: none
+      transform: scale(0)
+      transform-origin: right bottom
+
+      &.open
+        transform: scale(1)
+
+    .toc-percentage
+      float: right
+      margin-top: -9px
+      color: #a9a9a9
+      font-style: italic
+      font-size: 140%
+
+    .toc-content
+      overflow-y: scroll
+      overflow-y: overlay
+      margin: 0 -24px
+      max-height: calc(100vh - 120px)
+      width: calc(100% + 48px)
+
+      +maxWidth900()
+        max-height: calc(100vh - 140px)
+
+      & > *
+        margin: 0 20px !important
+
+        & > .toc-item > .toc-child
+          margin-left: 10px
+          padding-left: 10px
+          border-left: 1px solid var(--dark-grey)
+
+      &:not(.is-expand)
+        .toc-child
+          display: none
+
+          +maxWidth900()
+            display: block !important
+
+        .toc-item
+          &.active
+            .toc-child
+              display: block
+
+      ol,
+      li
+        list-style: none
+
+      > ol
+        padding: 0 !important
+
+      ol
+        margin: 0
+        padding-left: 18px
+
+      .toc-link
+        display: block
+        margin: 4px 0
+        padding: 1px 8px
+        color: var(--toc-link-color)
+        transition: all .2s ease-in-out
+        addBorderRadius()
+
+        &:hover
+          color: $theme-color
+
+        &.active
+          background: $theme-toc-color
+          color: $toc-active-color
+
+  .sticky_layout:only-child
+    > :first-child
+      margin-top: 0
+
+  .card-more-btn
+    float: right
+    color: inherit
+
+    &:hover
+      animation: more-btn-move 1s infinite
+
+  .card-announcement
+    .item-headline
+      i
+        color: #FF0000
+
+.avatar-img
+  overflow: hidden
+  margin: 0 auto
+  width: 110px
+  height: 110px
+  border-radius: 70px
+
+  img
+    width: 100%
+    height: 100%
+    transition: filter 375ms ease-in .2s, transform .3s
+    object-fit: cover
+
+    &:hover
+      transform: rotate(360deg)
+
+.site-data
+  display: table
+  width: 100%
+  table-layout: fixed
+
+  & > a
+    display: table-cell
+
+    div
+      transition: all .3s
+
+    &:hover
+      div
+        color: $theme-color !important
+
+    .headline
+      @extend .limit-one-line
+      color: var(--font-color)
+      font-size: .95em
+
+    .length-num
+      margin-top: -.45em
+      color: var(--text-highlight-color)
+      font-size: 1.2em
+
+@keyframes more-btn-move
+  0%,
+  100%
+    transform: translateX(0)
+
+  50%
+    transform: translateX(3px)
+
+@keyframes toc-open
+  0%
+    transform: scale(.7)
+
+  100%
+    transform: scale(1)
+
+@keyframes toc-close
+  0%
+    transform: scale(1)
+
+  100%
+    transform: scale(.7)
+
++minWidth900()
+  html.hide-aside
+    .layout
+      justify-content: center
+
+      > .aside-content
+        display: none
+
+      > div:first-child
+        width: 80%
+
+.page
+  .sticky_layout
+    display: flex
+    flex-direction: column
+
+  if hexo-config('aside.card_recent_post.sort_order')
+    .card-recent-post
+      order: hexo-config('aside.card_recent_post.sort_order')
+
+  if hexo-config('aside.card_newest_comments.sort_order')
+    #card-newest-comments
+      order: hexo-config('aside.card_newest_comments.sort_order')
+
+  if hexo-config('aside.card_categories.sort_order')
+    .card-categories
+      order: hexo-config('aside.card_categories.sort_order')
+
+  if hexo-config('aside.card_tags.sort_order')
+    .card-tags
+      order: hexo-config('aside.card_tags.sort_order')
+
+  if hexo-config('aside.card_archives.sort_order')
+    .card-archives
+      order: hexo-config('aside.card_archives.sort_order')
+
+  if hexo-config('aside.card_webinfo.sort_order')
+    .card-webinfo
+      order: hexo-config('aside.card_webinfo.sort_order')
diff --git a/source/css/_layout/chat.styl b/source/css/_layout/chat.styl
index ebe464d..9faaf86 100644
--- a/source/css/_layout/chat.styl
+++ b/source/css/_layout/chat.styl
@@ -1,9 +1,9 @@
-// chat
-if hexo-config('chat.rightside_button') == true
-  if hexo-config('chat.use') == 'chatra'
-    #chatra:not(.chatra--expanded)
-      visibility: hidden !important
-      width: 1px !important
-      height: 1px !important
-      opacity: 0 !important
+// chat
+if hexo-config('chat.rightside_button') == true
+  if hexo-config('chat.use') == 'chatra'
+    #chatra:not(.chatra--expanded)
+      visibility: hidden !important
+      width: 1px !important
+      height: 1px !important
+      opacity: 0 !important
       pointer-events: none
\ No newline at end of file
diff --git a/source/css/_layout/comments.styl b/source/css/_layout/comments.styl
index f2feebd..e1493a3 100644
--- a/source/css/_layout/comments.styl
+++ b/source/css/_layout/comments.styl
@@ -1,81 +1,81 @@
-#post-comment
-  .comment-head
-    margin-bottom: 20px
-
-    &:after
-      display: block
-      clear: both
-      content: ''
-
-    .comment-headline
-      display: inline-block
-      vertical-align: middle
-      font-weight: 700
-      font-size: 1.43em
-
-    .comment-switch
-      display: inline-block
-
-      if hexo-config('comments.text')
-        float: right
-        margin: 2px auto 0
-        padding: 4px 16px
-        width: max-content
-        border-radius: 8px
-        background: $comments-switch-bg
-      else
-        vertical-align: middle
-
-        > span
-          display: none
-
-      .first-comment
-        color: $comments-switch-first-text
-
-      .second-comment
-        color: $comments-switch-second-text
-
-      #switch-btn
-        position: relative
-        display: inline-block
-        margin: -4px 8px 0
-        width: 42px
-        height: 22px
-        border-radius: 34px
-        background-color: $comments-switch-first-text
-        vertical-align: middle
-        cursor: pointer
-        transition: .4s
-
-        &:before
-          position: absolute
-          bottom: 4px
-          left: 4px
-          width: 14px
-          height: 14px
-          border-radius: 50%
-          background-color: $comments-switch-round
-          content: ''
-          transition: .4s
-
-  .comment-wrap
-    > div
-      animation: tabshow .5s
-
-      &:nth-child(2)
-        display: none
-
-  &.move
-    #switch-btn
-      background-color: $comments-switch-second-text
-
-      &:before
-        transform: translateX(20px)
-
-    .comment-wrap
-      > div
-        &:first-child
-          display: none
-
-        &:last-child
+#post-comment
+  .comment-head
+    margin-bottom: 20px
+
+    &:after
+      display: block
+      clear: both
+      content: ''
+
+    .comment-headline
+      display: inline-block
+      vertical-align: middle
+      font-weight: 700
+      font-size: 1.43em
+
+    .comment-switch
+      display: inline-block
+
+      if hexo-config('comments.text')
+        float: right
+        margin: 2px auto 0
+        padding: 4px 16px
+        width: max-content
+        border-radius: 8px
+        background: $comments-switch-bg
+      else
+        vertical-align: middle
+
+        > span
+          display: none
+
+      .first-comment
+        color: $comments-switch-first-text
+
+      .second-comment
+        color: $comments-switch-second-text
+
+      #switch-btn
+        position: relative
+        display: inline-block
+        margin: -4px 8px 0
+        width: 42px
+        height: 22px
+        border-radius: 34px
+        background-color: $comments-switch-first-text
+        vertical-align: middle
+        cursor: pointer
+        transition: .4s
+
+        &:before
+          position: absolute
+          bottom: 4px
+          left: 4px
+          width: 14px
+          height: 14px
+          border-radius: 50%
+          background-color: $comments-switch-round
+          content: ''
+          transition: .4s
+
+  .comment-wrap
+    > div
+      animation: tabshow .5s
+
+      &:nth-child(2)
+        display: none
+
+  &.move
+    #switch-btn
+      background-color: $comments-switch-second-text
+
+      &:before
+        transform: translateX(20px)
+
+    .comment-wrap
+      > div
+        &:first-child
+          display: none
+
+        &:last-child
           display: block
\ No newline at end of file
diff --git a/source/css/_layout/footer.styl b/source/css/_layout/footer.styl
index 69553f3..b47a04d 100644
--- a/source/css/_layout/footer.styl
+++ b/source/css/_layout/footer.styl
@@ -1,35 +1,35 @@
-#footer
-  position: relative
-  background-color: $light-blue
-  background-attachment: scroll
-  background-position: bottom
-  background-size: cover
-
-  if hexo-config('footer_img') != false && hexo-config('mask.footer')
-    &:before
-      position: absolute
-      width: 100%
-      height: 100%
-      background-color: var(--mark-bg)
-      content: ''
-
-#footer-wrap
-  position: relative
-  padding: 40px 20px
-  color: var(--light-grey)
-  text-align: center
-
-  a
-    color: var(--light-grey)
-
-    &:hover
-      text-decoration: underline
-
-  .footer-separator
-    margin: 0 4px
-
-  .icp-icon
-    padding: 0 4px
-    max-height: 1.4em
-    width: auto
-    vertical-align: text-bottom
+#footer
+  position: relative
+  background-color: $light-blue
+  background-attachment: scroll
+  background-position: bottom
+  background-size: cover
+
+  if hexo-config('footer_img') != false && hexo-config('mask.footer')
+    &:before
+      position: absolute
+      width: 100%
+      height: 100%
+      background-color: var(--mark-bg)
+      content: ''
+
+#footer-wrap
+  position: relative
+  padding: 40px 20px
+  color: var(--light-grey)
+  text-align: center
+
+  a
+    color: var(--light-grey)
+
+    &:hover
+      text-decoration: underline
+
+  .footer-separator
+    margin: 0 4px
+
+  .icp-icon
+    padding: 0 4px
+    max-height: 1.4em
+    width: auto
+    vertical-align: text-bottom
diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl
index 95de083..2ec1d9a 100644
--- a/source/css/_layout/head.styl
+++ b/source/css/_layout/head.styl
@@ -1,438 +1,438 @@
-#page-header
-  position: relative
-  width: 100%
-  background-color: $light-blue
-  background-position: center center
-  background-size: cover
-  background-repeat: no-repeat
-  transition: all .5s
-
-  if hexo-config('mask.header')
-    &:not(.not-top-img):before
-      position: absolute
-      width: 100%
-      height: 100%
-      background-color: var(--mark-bg)
-      content: ''
-
-  // index
-  &.full_page
-    height: $index_top_img_height
-    background-attachment: fixed
-
-    #site-info
-      position: absolute
-      top: $index_site_info_top
-      padding: 0 10px
-      width: 100%
-
-  #site-title,
-  #site-subtitle,
-  #scroll-down .scroll-down-effects
-    text-align: center
-    text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
-    line-height: 1.5
-
-  #site-title
-    margin: 0
-    color: var(--white)
-    font-size: 1.85em
-
-    +minWidth768()
-      font-size: 2.85em
-
-  #site-subtitle
-    color: var(--light-grey)
-    font-size: 1.15em
-
-    +minWidth768()
-      font-size: 1.72em
-
-  #site_social_icons
-    display: none
-    margin: 0 auto
-    text-align: center
-
-    +maxWidth768()
-      display: block
-
-    .social-icon
-      margin: 0 10px
-      color: var(--light-grey)
-      text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
-      font-size: 1.43em
-
-  #scroll-down
-    position: absolute
-    bottom: 10px
-    width: 100%
-    cursor: pointer
-
-    .scroll-down-effects
-      position: relative
-      width: 100%
-      color: var(--light-grey)
-      font-size: 20px
-
-  // page
-  &.not-home-page
-    height: 400px
-
-    +maxWidth768()
-      height: 280px
-
-  #page-site-info
-    position: absolute
-    top: 200px
-    padding: 0 10px
-    width: 100%
-
-    +maxWidth768()
-      top: 140px
-
-  // post
-  &.post-bg
-    height: 400px
-
-    +maxWidth768()
-      height: 360px
-
-  #post-info
-    position: absolute
-    width: 100%
-
-    if hexo-config('post_meta.post.position') == 'center'
-      top: calc(50% + 30px)
-      padding: 0 8%
-      text-align: center
-      transform: translateY(-50%)
-
-      +maxWidth768()
-        padding: 0 15px
-    else
-      bottom: 30px
-
-      & > *
-        margin: 0 auto
-        padding: 0 15px
-        max-width: 1200px
-
-        @media screen and (min-width: 768px) and (max-width: 1300px)
-          padding: 0 30px
-
-        +minWidth2000()
-          max-width: 70%
-
-  &.not-top-img
-    margin-bottom: 10px
-    height: 60px
-    background: 0
-
-    .title-seo
-      display: none
-
-    #nav
-      background: rgba(255, 255, 255, .8)
-      box-shadow: 0 5px 6px -5px rgba(133, 133, 133, .6)
-
-      a,
-      span.site-page,
-      .site-name
-        color: var(--font-color)
-        text-shadow: none
-
-  &.nav-fixed
-    #nav
-      position: fixed
-      top: -60px
-      z-index: 91
-      background: rgba(255, 255, 255, .7)
-      box-shadow: 0 5px 6px -5px alpha($grey, .6)
-      transition: transform .2s ease-in-out, opacity .2s ease-in-out
-      will-change: transform
-      backdrop-filter: blur(7px)
-
-      #blog-info
-        color: var(--font-color)
-
-        &:hover
-          color: $light-blue
-
-        .site-name
-          text-shadow: none
-
-        & > a:first-child
-          display: none
-
-        & > a:last-child
-          display: inline
-
-      a,
-      span.site-page,
-      #toggle-menu
-        color: var(--font-color)
-        text-shadow: none
-
-        &:hover
-          color: $light-blue
-
-    &.fixed
-      #nav
-        top: 0
-        transition: all .5s
-
-  &.nav-visible:not(.fixed)
-    #nav
-      transition: all .5s
-      transform: translate3d(0, 100%, 0)
-
-    & + .layout
-      & > .aside-content > .sticky_layout
-        top: 70px
-        transition: top .5s
-
-  &.fixed
-    #nav
-      position: fixed
-
-    & + .layout
-      & > .aside-content > .sticky_layout
-        top: 70px
-        transition: top .5s
-
-      #card-toc
-        .toc-content
-          max-height: calc(100vh - 170px)
-
-#page
-  .page-title
-    margin: 0 0 10px
-    font-weight: bold
-    font-size: 2em
-
-// for not top_img
-#post
-  & > #post-info
-    margin-bottom: 30px
-
-    .post-title
-      padding-bottom: 4px
-      border-bottom: 1px solid var(--light-grey)
-      color: var(--text-highlight-color)
-
-      .post-edit-link
-        float: right
-
-    #post-meta,
-    #post-meta a
-      color: #78818a
-
-#post-info
-  .post-title
-    @extend .limit-more-line
-    margin-bottom: 8px
-    color: var(--white)
-    font-weight: normal
-    font-size: 2.5em
-    line-height: 1.5
-    -webkit-line-clamp: 3
-
-    +maxWidth768()
-      font-size: 2.1em
-
-    .post-edit-link
-      padding-left: 10px
-
-  #post-meta
-    color: var(--light-grey)
-    font-size: 95%
-
-    +minWidth768()
-      > .meta-secondline
-        > span:first-child
-          display: none
-
-    +maxWidth768()
-      font-size: 90%
-
-      > .meta-firstline,
-      > .meta-secondline
-        display: inline
-
-    .post-meta
-      &-separator
-        margin: 0 5px
-
-      &-icon
-        margin-right: 4px
-
-      &-label
-        if hexo-config('post_meta.post.label')
-          margin-right: 4px
-        else
-          display: none
-
-    a
-      color: var(--light-grey)
-      transition: all .3s ease-out
-
-      &:hover
-        color: $text-hover
-        text-decoration: underline
-
-    if hexo-config('post_meta.post.date_format') == 'relative'
-      time
-        display: none
-
-#nav
-  position: absolute
-  top: 0
-  z-index: 90
-  display: flex
-  align-items: center
-  padding: 0 36px
-  width: 100%
-  height: 60px
-  font-size: 1.3em
-  opacity: 0
-  transition: all .5s
-
-  +maxWidth768()
-    padding: 0 16px
-
-  &.show
-    opacity: 1
-
-  #blog-info
-    flex: 1
-    color: var(--light-grey)
-    @extend .limit-one-line
-
-    .site-icon
-      margin-right: 6px
-      height: 36px
-      vertical-align: middle
-
-    .nav-page-title
-      display: none
-
-  #toggle-menu
-    display: none
-    padding: 2px 0 0 6px
-    vertical-align: top
-
-    &:hover
-      color: var(--white)
-
-  a,
-  span.site-page
-    color: var(--light-grey)
-
-    &:hover
-      color: var(--white)
-
-  .site-name
-    text-shadow: 2px 2px 4px rgba($dark-black, .15)
-    font-weight: bold
-
-  .menus_items
-    display: inline
-
-    .menus_item
-      position: relative
-      display: inline-block
-      padding: 0 0 0 14px
-
-      &:hover
-        .menus_item_child
-          display: block
-
-        & > span > i:last-child
-          transform: rotate(180deg)
-
-      & > span > i:last-child
-        padding: 4px
-        transition: transform .3s
-
-      .menus_item_child
-        position: absolute
-        right: 0
-        display: none
-        margin-top: 8px
-        padding: 0
-        width: max-content
-        background-color: var(--sidebar-bg)
-        box-shadow: 0 5px 20px -4px rgba($dark-black, .5)
-        animation: sub_menus .3s .1s ease both
-        addBorderRadius(5)
-
-        &:before
-          position: absolute
-          top: -8px
-          left: 0
-          width: 100%
-          height: 20px
-          content: ''
-
-        li
-          list-style: none
-
-          &:hover
-            background: var(--text-bg-hover)
-
-          if hexo-config('rounded_corners_ui')
-            &:first-child
-              border-top-left-radius: 5px
-              border-top-right-radius: 5px
-
-            &:last-child
-              border-bottom-right-radius: 5px
-              border-bottom-left-radius: 5px
-
-          a
-            display: inline-block
-            padding: 8px 16px
-            width: 100%
-            color: var(--font-color) !important
-            text-shadow: none !important
-
-  &.hide-menu
-    #toggle-menu
-      display: inline-block !important
-
-      .site-page
-        font-size: inherit
-
-    .menus_items
-      display: none
-
-    #search-button span:not(.site-page)
-      display: none
-
-  #search-button
-    display: inline
-    padding: 0 0 0 14px
-
-  .site-page
-    position: relative
-    padding-bottom: 6px
-    text-shadow: 1px 1px 2px rgba($dark-black, .3)
-    font-size: .78em
-    cursor: pointer
-
-    &:not(.child)
-      &:after
-        position: absolute
-        bottom: 0
-        left: 0
-        z-index: -1
-        width: 0
-        height: 3px
-        background-color: lighten($theme-color, 30%)
-        content: ''
-        transition: all .3s ease-in-out
-        addBorderRadius()
-
-      &:hover
-        &:after
+#page-header
+  position: relative
+  width: 100%
+  background-color: $light-blue
+  background-position: center center
+  background-size: cover
+  background-repeat: no-repeat
+  transition: all .5s
+
+  if hexo-config('mask.header')
+    &:not(.not-top-img):before
+      position: absolute
+      width: 100%
+      height: 100%
+      background-color: var(--mark-bg)
+      content: ''
+
+  // index
+  &.full_page
+    height: $index_top_img_height
+    background-attachment: fixed
+
+    #site-info
+      position: absolute
+      top: $index_site_info_top
+      padding: 0 10px
+      width: 100%
+
+  #site-title,
+  #site-subtitle,
+  #scroll-down .scroll-down-effects
+    text-align: center
+    text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
+    line-height: 1.5
+
+  #site-title
+    margin: 0
+    color: var(--white)
+    font-size: 1.85em
+
+    +minWidth768()
+      font-size: 2.85em
+
+  #site-subtitle
+    color: var(--light-grey)
+    font-size: 1.15em
+
+    +minWidth768()
+      font-size: 1.72em
+
+  #site_social_icons
+    display: none
+    margin: 0 auto
+    text-align: center
+
+    +maxWidth768()
+      display: block
+
+    .social-icon
+      margin: 0 10px
+      color: var(--light-grey)
+      text-shadow: 2px 2px 4px rgba(0, 0, 0, .15)
+      font-size: 1.43em
+
+  #scroll-down
+    position: absolute
+    bottom: 10px
+    width: 100%
+    cursor: pointer
+
+    .scroll-down-effects
+      position: relative
+      width: 100%
+      color: var(--light-grey)
+      font-size: 20px
+
+  // page
+  &.not-home-page
+    height: 400px
+
+    +maxWidth768()
+      height: 280px
+
+  #page-site-info
+    position: absolute
+    top: 200px
+    padding: 0 10px
+    width: 100%
+
+    +maxWidth768()
+      top: 140px
+
+  // post
+  &.post-bg
+    height: 400px
+
+    +maxWidth768()
+      height: 360px
+
+  #post-info
+    position: absolute
+    width: 100%
+
+    if hexo-config('post_meta.post.position') == 'center'
+      top: calc(50% + 30px)
+      padding: 0 8%
+      text-align: center
+      transform: translateY(-50%)
+
+      +maxWidth768()
+        padding: 0 15px
+    else
+      bottom: 30px
+
+      & > *
+        margin: 0 auto
+        padding: 0 15px
+        max-width: 1200px
+
+        @media screen and (min-width: 768px) and (max-width: 1300px)
+          padding: 0 30px
+
+        +minWidth2000()
+          max-width: 70%
+
+  &.not-top-img
+    margin-bottom: 10px
+    height: 60px
+    background: 0
+
+    .title-seo
+      display: none
+
+    #nav
+      background: rgba(255, 255, 255, .8)
+      box-shadow: 0 5px 6px -5px rgba(133, 133, 133, .6)
+
+      a,
+      span.site-page,
+      .site-name
+        color: var(--font-color)
+        text-shadow: none
+
+  &.nav-fixed
+    #nav
+      position: fixed
+      top: -60px
+      z-index: 91
+      background: rgba(255, 255, 255, .7)
+      box-shadow: 0 5px 6px -5px alpha($grey, .6)
+      transition: transform .2s ease-in-out, opacity .2s ease-in-out
+      will-change: transform
+      backdrop-filter: blur(7px)
+
+      #blog-info
+        color: var(--font-color)
+
+        &:hover
+          color: $light-blue
+
+        .site-name
+          text-shadow: none
+
+        & > a:first-child
+          display: none
+
+        & > a:last-child
+          display: inline
+
+      a,
+      span.site-page,
+      #toggle-menu
+        color: var(--font-color)
+        text-shadow: none
+
+        &:hover
+          color: $light-blue
+
+    &.fixed
+      #nav
+        top: 0
+        transition: all .5s
+
+  &.nav-visible:not(.fixed)
+    #nav
+      transition: all .5s
+      transform: translate3d(0, 100%, 0)
+
+    & + .layout
+      & > .aside-content > .sticky_layout
+        top: 70px
+        transition: top .5s
+
+  &.fixed
+    #nav
+      position: fixed
+
+    & + .layout
+      & > .aside-content > .sticky_layout
+        top: 70px
+        transition: top .5s
+
+      #card-toc
+        .toc-content
+          max-height: calc(100vh - 170px)
+
+#page
+  .page-title
+    margin: 0 0 10px
+    font-weight: bold
+    font-size: 2em
+
+// for not top_img
+#post
+  & > #post-info
+    margin-bottom: 30px
+
+    .post-title
+      padding-bottom: 4px
+      border-bottom: 1px solid var(--light-grey)
+      color: var(--text-highlight-color)
+
+      .post-edit-link
+        float: right
+
+    #post-meta,
+    #post-meta a
+      color: #78818a
+
+#post-info
+  .post-title
+    @extend .limit-more-line
+    margin-bottom: 8px
+    color: var(--white)
+    font-weight: normal
+    font-size: 2.5em
+    line-height: 1.5
+    -webkit-line-clamp: 3
+
+    +maxWidth768()
+      font-size: 2.1em
+
+    .post-edit-link
+      padding-left: 10px
+
+  #post-meta
+    color: var(--light-grey)
+    font-size: 95%
+
+    +minWidth768()
+      > .meta-secondline
+        > span:first-child
+          display: none
+
+    +maxWidth768()
+      font-size: 90%
+
+      > .meta-firstline,
+      > .meta-secondline
+        display: inline
+
+    .post-meta
+      &-separator
+        margin: 0 5px
+
+      &-icon
+        margin-right: 4px
+
+      &-label
+        if hexo-config('post_meta.post.label')
+          margin-right: 4px
+        else
+          display: none
+
+    a
+      color: var(--light-grey)
+      transition: all .3s ease-out
+
+      &:hover
+        color: $text-hover
+        text-decoration: underline
+
+    if hexo-config('post_meta.post.date_format') == 'relative'
+      time
+        display: none
+
+#nav
+  position: absolute
+  top: 0
+  z-index: 90
+  display: flex
+  align-items: center
+  padding: 0 36px
+  width: 100%
+  height: 60px
+  font-size: 1.3em
+  opacity: 0
+  transition: all .5s
+
+  +maxWidth768()
+    padding: 0 16px
+
+  &.show
+    opacity: 1
+
+  #blog-info
+    flex: 1
+    color: var(--light-grey)
+    @extend .limit-one-line
+
+    .site-icon
+      margin-right: 6px
+      height: 36px
+      vertical-align: middle
+
+    .nav-page-title
+      display: none
+
+  #toggle-menu
+    display: none
+    padding: 2px 0 0 6px
+    vertical-align: top
+
+    &:hover
+      color: var(--white)
+
+  a,
+  span.site-page
+    color: var(--light-grey)
+
+    &:hover
+      color: var(--white)
+
+  .site-name
+    text-shadow: 2px 2px 4px rgba($dark-black, .15)
+    font-weight: bold
+
+  .menus_items
+    display: inline
+
+    .menus_item
+      position: relative
+      display: inline-block
+      padding: 0 0 0 14px
+
+      &:hover
+        .menus_item_child
+          display: block
+
+        & > span > i:last-child
+          transform: rotate(180deg)
+
+      & > span > i:last-child
+        padding: 4px
+        transition: transform .3s
+
+      .menus_item_child
+        position: absolute
+        right: 0
+        display: none
+        margin-top: 8px
+        padding: 0
+        width: max-content
+        background-color: var(--sidebar-bg)
+        box-shadow: 0 5px 20px -4px rgba($dark-black, .5)
+        animation: sub_menus .3s .1s ease both
+        addBorderRadius(5)
+
+        &:before
+          position: absolute
+          top: -8px
+          left: 0
+          width: 100%
+          height: 20px
+          content: ''
+
+        li
+          list-style: none
+
+          &:hover
+            background: var(--text-bg-hover)
+
+          if hexo-config('rounded_corners_ui')
+            &:first-child
+              border-top-left-radius: 5px
+              border-top-right-radius: 5px
+
+            &:last-child
+              border-bottom-right-radius: 5px
+              border-bottom-left-radius: 5px
+
+          a
+            display: inline-block
+            padding: 8px 16px
+            width: 100%
+            color: var(--font-color) !important
+            text-shadow: none !important
+
+  &.hide-menu
+    #toggle-menu
+      display: inline-block !important
+
+      .site-page
+        font-size: inherit
+
+    .menus_items
+      display: none
+
+    #search-button span:not(.site-page)
+      display: none
+
+  #search-button
+    display: inline
+    padding: 0 0 0 14px
+
+  .site-page
+    position: relative
+    padding-bottom: 6px
+    text-shadow: 1px 1px 2px rgba($dark-black, .3)
+    font-size: .78em
+    cursor: pointer
+
+    &:not(.child)
+      &:after
+        position: absolute
+        bottom: 0
+        left: 0
+        z-index: -1
+        width: 0
+        height: 3px
+        background-color: lighten($theme-color, 30%)
+        content: ''
+        transition: all .3s ease-in-out
+        addBorderRadius()
+
+      &:hover
+        &:after
           width: 100%
\ No newline at end of file
diff --git a/source/css/_layout/loading.styl b/source/css/_layout/loading.styl
index 9f63e15..fd442d7 100644
--- a/source/css/_layout/loading.styl
+++ b/source/css/_layout/loading.styl
@@ -1,95 +1,95 @@
-if hexo-config('preloader.enable') && hexo-config('preloader.source') == 1
-  .loading-bg
-    position: fixed
-    z-index: 1000
-    width: 50%
-    height: 100%
-    background-color: var(--preloader-bg)
-
-  #loading-box
-    .loading-left-bg
-      @extend .loading-bg
-
-    .loading-right-bg
-      @extend .loading-bg
-      right: 0
-
-    .spinner-box
-      position: fixed
-      z-index: 1001
-      display: flex
-      justify-content: center
-      align-items: center
-      width: 100%
-      height: 100vh
-
-      .configure-border-1
-        position: absolute
-        padding: 3px
-        width: 115px
-        height: 115px
-        background: #ffab91
-        animation: configure-clockwise 3s ease-in-out 0s infinite alternate
-
-      .configure-border-2
-        left: -115px
-        padding: 3px
-        width: 115px
-        height: 115px
-        background: rgb(63, 249, 220)
-        transform: rotate(45deg)
-        animation: configure-xclockwise 3s ease-in-out 0s infinite alternate
-
-      .loading-word
-        position: absolute
-        color: var(--preloader-color)
-        font-size: 16px
-
-      .configure-core
-        width: 100%
-        height: 100%
-        background-color: var(--preloader-bg)
-
-    &.loaded
-      .loading-left-bg
-        transition: all .5s
-        transform: translate(-100%, 0)
-
-      .loading-right-bg
-        transition: all .5s
-        transform: translate(100%, 0)
-
-      .spinner-box
-        display: none
-
-  @keyframes configure-clockwise
-    0%
-      transform: rotate(0)
-
-    25%
-      transform: rotate(90deg)
-
-    50%
-      transform: rotate(180deg)
-
-    75%
-      transform: rotate(270deg)
-
-    100%
-      transform: rotate(360deg)
-
-  @keyframes configure-xclockwise
-    0%
-      transform: rotate(45deg)
-
-    25%
-      transform: rotate(-45deg)
-
-    50%
-      transform: rotate(-135deg)
-
-    75%
-      transform: rotate(-225deg)
-
-    100%
-      transform: rotate(-315deg)
+if hexo-config('preloader.enable') && hexo-config('preloader.source') == 1
+  .loading-bg
+    position: fixed
+    z-index: 1000
+    width: 50%
+    height: 100%
+    background-color: var(--preloader-bg)
+
+  #loading-box
+    .loading-left-bg
+      @extend .loading-bg
+
+    .loading-right-bg
+      @extend .loading-bg
+      right: 0
+
+    .spinner-box
+      position: fixed
+      z-index: 1001
+      display: flex
+      justify-content: center
+      align-items: center
+      width: 100%
+      height: 100vh
+
+      .configure-border-1
+        position: absolute
+        padding: 3px
+        width: 115px
+        height: 115px
+        background: #ffab91
+        animation: configure-clockwise 3s ease-in-out 0s infinite alternate
+
+      .configure-border-2
+        left: -115px
+        padding: 3px
+        width: 115px
+        height: 115px
+        background: rgb(63, 249, 220)
+        transform: rotate(45deg)
+        animation: configure-xclockwise 3s ease-in-out 0s infinite alternate
+
+      .loading-word
+        position: absolute
+        color: var(--preloader-color)
+        font-size: 16px
+
+      .configure-core
+        width: 100%
+        height: 100%
+        background-color: var(--preloader-bg)
+
+    &.loaded
+      .loading-left-bg
+        transition: all .5s
+        transform: translate(-100%, 0)
+
+      .loading-right-bg
+        transition: all .5s
+        transform: translate(100%, 0)
+
+      .spinner-box
+        display: none
+
+  @keyframes configure-clockwise
+    0%
+      transform: rotate(0)
+
+    25%
+      transform: rotate(90deg)
+
+    50%
+      transform: rotate(180deg)
+
+    75%
+      transform: rotate(270deg)
+
+    100%
+      transform: rotate(360deg)
+
+  @keyframes configure-xclockwise
+    0%
+      transform: rotate(45deg)
+
+    25%
+      transform: rotate(-45deg)
+
+    50%
+      transform: rotate(-135deg)
+
+    75%
+      transform: rotate(-225deg)
+
+    100%
+      transform: rotate(-315deg)
diff --git a/source/css/_layout/pagination.styl b/source/css/_layout/pagination.styl
index 0a3be85..d05cb25 100644
--- a/source/css/_layout/pagination.styl
+++ b/source/css/_layout/pagination.styl
@@ -1,106 +1,106 @@
-#pagination
-  .pagination
-    margin-top: 20px
-    text-align: center
-
-  .page-number
-    &.current
-      background: $theme-paginator-color
-      color: var(--white)
-
-  .full-width
-    width: 100% !important
-
-  .pagination-related
-    height: 150px
-
-    +minWidth768()
-      flex: 1
-
-    .info-1
-      .info-item-2
-        -webkit-line-clamp: 1
-
-    .info-2
-      .info-item-1
-        -webkit-line-clamp: 2
-
-  &.pagination-post
-    overflow: hidden
-    margin-top: 40px
-    width: 100%
-    addBorderRadius()
-    display: flex
-
-    +maxWidth768()
-      flex-direction: column
-
-.layout
-  .pagination
-    & > *
-      display: inline-block
-      margin: 0 6px
-      width: w = 2.5em
-      height: w
-      line-height: w
-
-    & > *:not(.space)
-      @extend .cardHover
-
-      &:hover
-        background: var(--btn-hover-color)
-        color: var(--btn-color)
-
-#archive
-  .pagination
-    margin-top: 30px
-
-    & > *:not(.space)
-      box-shadow: none
-
-.pagination-related
-  position: relative
-  display: inline-block
-  overflow: hidden
-  background: $dark-black
-  vertical-align: bottom
-  @extend .postImgHover
-
-  &.next-post
-    .info
-      text-align: right
-
-  .info
-    .info-1,
-    .info-2
-      @extend .verticalCenter
-      padding: 20px 40px
-      color: var(--white)
-      transition: transform .3s, opacity .3s
-
-    .info-1
-      .info-item-1
-        color: var(--light-grey)
-        text-transform: uppercase
-        font-size: 90%
-
-      .info-item-2
-        @extend .limit-more-line
-        color: var(--white)
-        font-weight: 500
-
-    .info-2
-      opacity: 0
-      transform: translate(0, 0)
-
-      .info-item-1
-        @extend .limit-more-line
-
-  &:not(.no-desc):hover
-    .info-1
-      opacity: 0
-      transform: translate(0, -100%)
-
-    .info-2
-      opacity: 1
+#pagination
+  .pagination
+    margin-top: 20px
+    text-align: center
+
+  .page-number
+    &.current
+      background: $theme-paginator-color
+      color: var(--white)
+
+  .full-width
+    width: 100% !important
+
+  .pagination-related
+    height: 150px
+
+    +minWidth768()
+      flex: 1
+
+    .info-1
+      .info-item-2
+        -webkit-line-clamp: 1
+
+    .info-2
+      .info-item-1
+        -webkit-line-clamp: 2
+
+  &.pagination-post
+    overflow: hidden
+    margin-top: 40px
+    width: 100%
+    addBorderRadius()
+    display: flex
+
+    +maxWidth768()
+      flex-direction: column
+
+.layout
+  .pagination
+    & > *
+      display: inline-block
+      margin: 0 6px
+      width: w = 2.5em
+      height: w
+      line-height: w
+
+    & > *:not(.space)
+      @extend .cardHover
+
+      &:hover
+        background: var(--btn-hover-color)
+        color: var(--btn-color)
+
+#archive
+  .pagination
+    margin-top: 30px
+
+    & > *:not(.space)
+      box-shadow: none
+
+.pagination-related
+  position: relative
+  display: inline-block
+  overflow: hidden
+  background: $dark-black
+  vertical-align: bottom
+  @extend .postImgHover
+
+  &.next-post
+    .info
+      text-align: right
+
+  .info
+    .info-1,
+    .info-2
+      @extend .verticalCenter
+      padding: 20px 40px
+      color: var(--white)
+      transition: transform .3s, opacity .3s
+
+    .info-1
+      .info-item-1
+        color: var(--light-grey)
+        text-transform: uppercase
+        font-size: 90%
+
+      .info-item-2
+        @extend .limit-more-line
+        color: var(--white)
+        font-weight: 500
+
+    .info-2
+      opacity: 0
+      transform: translate(0, 0)
+
+      .info-item-1
+        @extend .limit-more-line
+
+  &:not(.no-desc):hover
+    .info-1
+      opacity: 0
+      transform: translate(0, -100%)
+
+    .info-2
+      opacity: 1
       transform: translate(0, -50%)
\ No newline at end of file
diff --git a/source/css/_layout/post.styl b/source/css/_layout/post.styl
index bd52eec..3d8a0b8 100644
--- a/source/css/_layout/post.styl
+++ b/source/css/_layout/post.styl
@@ -1,264 +1,264 @@
-beautify()
-  headStyle(fontsize)
-    padding-left: unit(fontsize + 8, 'px')
-
-    &:before
-      font-size: unit(fontsize - 2, 'px')
-
-    &:hover
-      padding-left: unit(fontsize + 12, 'px')
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6
-    transition: all .2s ease-out
-
-    &:before
-      position: absolute
-      top: calc(50% - 7px)
-      left: 0
-      color: $title-prefix-icon-color
-      content: $title-prefix-icon
-      line-height: 1
-      transition: all .2s ease-out
-      @extend .fontawesomeIcon
-
-    &:hover
-      &:before
-        color: $light-blue
-
-  h1
-    headStyle(20)
-
-  h2
-    headStyle(18)
-
-  h3
-    headStyle(16)
-
-  h4
-    headStyle(14)
-
-  h5
-    headStyle(12)
-
-  h6
-    headStyle(12)
-
-  ol,
-  ul
-    p
-      margin: 0 0 8px
-
-  li
-    &::marker
-      color: $light-blue
-      font-weight: 600
-      font-size: 1.05em
-
-    &:hover
-      &::marker
-        color: var(--pseudo-hover)
-
-  ul > li
-    list-style-type: circle
-
-  hr
-    @extend .custom-hr
-
-.container
-  word-wrap: break-word
-  overflow-wrap: break-word
-
-  if hexo-config('text_align_justify')
-    text-align: justify
-
-  a
-    color: $theme-link-color
-
-    &:hover
-      text-decoration: underline
-
-  img
-    display: block
-    margin: 0 auto 20px
-    max-width: 100%
-    transition: filter 375ms ease-in .2s
-    addBorderRadius()
-
-  p
-    margin: 0 0 16px
-
-  iframe
-    margin: 0 0 20px
-
-  kbd
-    margin: 0 3px
-    padding: 3px 5px
-    border: 1px solid #b4b4b4
-    background-color: #f8f8f8
-    box-shadow: 0 1px 3px rgba(0, 0, 0, .25), 0 2px 1px 0 rgba(255, 255, 255, .6) inset
-    color: #34495e
-    white-space: nowrap
-    font-weight: 600
-    font-size: .9em
-    font-family: Monaco, 'Ubuntu Mono', monospace
-    line-height: 1em
-    addBorderRadius(3)
-
-  if hexo-config('anchor.click_to_scroll')
-    h1,
-    h2,
-    h3,
-    h4,
-    h5,
-    h6
-      width: fit-content
-
-      a:not(.headerlink)
-        position: relative
-        z-index: 10
-
-      a.headerlink
-        position: absolute
-        top: 0
-        right: 0
-        bottom: 0
-        left: 0
-        width: 100%
-        height: 100%
-
-  ol,
-  ul
-    ol,
-    ul
-      padding-left: 20px
-
-    li
-      margin: 4px 0
-
-    p
-      margin: 0 0 8px
-
-  > :last-child
-    margin-bottom: 0 !important
-
-  hr
-    margin: 20px 0
-
-  if hexo-config('beautify.enable')
-    if hexo-config('beautify.field') == 'site'
-      beautify()
-    else if hexo-config('beautify.field') == 'post'
-      &.post-content
-        beautify()
-
-#post
-  .tag_share
-    &:after
-      display: block
-      clear: both
-      content: ''
-
-    .post-meta
-      &__tag-list
-        display: inline-block
-
-      &__tags
-        display: inline-block
-        margin: 8px 8px 8px 0
-        padding: 0 12px
-        width: fit-content
-        border: 1px solid $light-blue
-        border-radius: 12px
-        color: $light-blue
-        font-size: .85em
-        transition: all .2s ease-in-out
-
-        &:hover
-          background: $light-blue
-          color: var(--white)
-
-    .post-share
-      display: inline-block
-      float: right
-      margin: 8px 0 0
-      width: fit-content
-
-      .social-share
-        font-size: .85em
-
-        .social-share-icon
-          margin: 0 4px
-          width: w = 1.85em
-          height: w
-          font-size: 1.2em
-          line-height: w
-
-  .post-copyright
-    position: relative
-    margin: 40px 0 10px
-    padding: 10px 16px
-    border: 1px solid var(--light-grey)
-    transition: box-shadow .3s ease-in-out
-    addBorderRadius()
-
-    &:before
-      @extend .fontawesomeIcon
-      position: absolute
-      top: 2px
-      right: 12px
-      color: $theme-color
-      content: '\f1f9'
-      font-size: 1.3em
-
-    &:hover
-      box-shadow: 0 0 8px 0 rgba(232, 237, 250, .6), 0 2px 4px 0 rgba(232, 237, 250, .5)
-
-    .post-copyright
-      &-meta
-        color: $light-blue
-        font-weight: bold
-
-        i
-          margin-right: 3px
-
-      &-info
-        padding-left: 6px
-
-        a
-          text-decoration: underline
-          word-break: break-word
-
-          &:hover
-            text-decoration: none
-
-  #post-outdate-notice
-    position: relative
-    margin: 0 0 20px
-    padding: .5em 1.2em
-    background-color: $noticeOutdate-bg
-    color: $noticeOutdate-color
-    addBorderRadius(3)
-
-    .num
-      padding: 0 4px
-
-    if hexo-config('noticeOutdate.style') == 'flat'
-      padding: .5em 1em .5em 2.6em
-      border-left: 5px solid $noticeOutdate-border
-
-      &:before
-        @extend .fontawesomeIcon
-        position: absolute
-        top: 50%
-        left: .9em
-        color: $noticeOutdate-border
-        content: '\f071'
-        transform: translateY(-50%)
-
-  .ads-wrap
-    margin: 40px 0
+beautify()
+  headStyle(fontsize)
+    padding-left: unit(fontsize + 8, 'px')
+
+    &:before
+      font-size: unit(fontsize - 2, 'px')
+
+    &:hover
+      padding-left: unit(fontsize + 12, 'px')
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6
+    transition: all .2s ease-out
+
+    &:before
+      position: absolute
+      top: calc(50% - 7px)
+      left: 0
+      color: $title-prefix-icon-color
+      content: $title-prefix-icon
+      line-height: 1
+      transition: all .2s ease-out
+      @extend .fontawesomeIcon
+
+    &:hover
+      &:before
+        color: $light-blue
+
+  h1
+    headStyle(20)
+
+  h2
+    headStyle(18)
+
+  h3
+    headStyle(16)
+
+  h4
+    headStyle(14)
+
+  h5
+    headStyle(12)
+
+  h6
+    headStyle(12)
+
+  ol,
+  ul
+    p
+      margin: 0 0 8px
+
+  li
+    &::marker
+      color: $light-blue
+      font-weight: 600
+      font-size: 1.05em
+
+    &:hover
+      &::marker
+        color: var(--pseudo-hover)
+
+  ul > li
+    list-style-type: circle
+
+  hr
+    @extend .custom-hr
+
+.container
+  word-wrap: break-word
+  overflow-wrap: break-word
+
+  if hexo-config('text_align_justify')
+    text-align: justify
+
+  a
+    color: $theme-link-color
+
+    &:hover
+      text-decoration: underline
+
+  img
+    display: block
+    margin: 0 auto 20px
+    max-width: 100%
+    transition: filter 375ms ease-in .2s
+    addBorderRadius()
+
+  p
+    margin: 0 0 16px
+
+  iframe
+    margin: 0 0 20px
+
+  kbd
+    margin: 0 3px
+    padding: 3px 5px
+    border: 1px solid #b4b4b4
+    background-color: #f8f8f8
+    box-shadow: 0 1px 3px rgba(0, 0, 0, .25), 0 2px 1px 0 rgba(255, 255, 255, .6) inset
+    color: #34495e
+    white-space: nowrap
+    font-weight: 600
+    font-size: .9em
+    font-family: Monaco, 'Ubuntu Mono', monospace
+    line-height: 1em
+    addBorderRadius(3)
+
+  if hexo-config('anchor.click_to_scroll')
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6
+      width: fit-content
+
+      a:not(.headerlink)
+        position: relative
+        z-index: 10
+
+      a.headerlink
+        position: absolute
+        top: 0
+        right: 0
+        bottom: 0
+        left: 0
+        width: 100%
+        height: 100%
+
+  ol,
+  ul
+    ol,
+    ul
+      padding-left: 20px
+
+    li
+      margin: 4px 0
+
+    p
+      margin: 0 0 8px
+
+  > :last-child
+    margin-bottom: 0 !important
+
+  hr
+    margin: 20px 0
+
+  if hexo-config('beautify.enable')
+    if hexo-config('beautify.field') == 'site'
+      beautify()
+    else if hexo-config('beautify.field') == 'post'
+      &.post-content
+        beautify()
+
+#post
+  .tag_share
+    &:after
+      display: block
+      clear: both
+      content: ''
+
+    .post-meta
+      &__tag-list
+        display: inline-block
+
+      &__tags
+        display: inline-block
+        margin: 8px 8px 8px 0
+        padding: 0 12px
+        width: fit-content
+        border: 1px solid $light-blue
+        border-radius: 12px
+        color: $light-blue
+        font-size: .85em
+        transition: all .2s ease-in-out
+
+        &:hover
+          background: $light-blue
+          color: var(--white)
+
+    .post-share
+      display: inline-block
+      float: right
+      margin: 8px 0 0
+      width: fit-content
+
+      .social-share
+        font-size: .85em
+
+        .social-share-icon
+          margin: 0 4px
+          width: w = 1.85em
+          height: w
+          font-size: 1.2em
+          line-height: w
+
+  .post-copyright
+    position: relative
+    margin: 40px 0 10px
+    padding: 10px 16px
+    border: 1px solid var(--light-grey)
+    transition: box-shadow .3s ease-in-out
+    addBorderRadius()
+
+    &:before
+      @extend .fontawesomeIcon
+      position: absolute
+      top: 2px
+      right: 12px
+      color: $theme-color
+      content: '\f1f9'
+      font-size: 1.3em
+
+    &:hover
+      box-shadow: 0 0 8px 0 rgba(232, 237, 250, .6), 0 2px 4px 0 rgba(232, 237, 250, .5)
+
+    .post-copyright
+      &-meta
+        color: $light-blue
+        font-weight: bold
+
+        i
+          margin-right: 3px
+
+      &-info
+        padding-left: 6px
+
+        a
+          text-decoration: underline
+          word-break: break-word
+
+          &:hover
+            text-decoration: none
+
+  #post-outdate-notice
+    position: relative
+    margin: 0 0 20px
+    padding: .5em 1.2em
+    background-color: $noticeOutdate-bg
+    color: $noticeOutdate-color
+    addBorderRadius(3)
+
+    .num
+      padding: 0 4px
+
+    if hexo-config('noticeOutdate.style') == 'flat'
+      padding: .5em 1em .5em 2.6em
+      border-left: 5px solid $noticeOutdate-border
+
+      &:before
+        @extend .fontawesomeIcon
+        position: absolute
+        top: 50%
+        left: .9em
+        color: $noticeOutdate-border
+        content: '\f071'
+        transform: translateY(-50%)
+
+  .ads-wrap
+    margin: 40px 0
diff --git a/source/css/_layout/relatedposts.styl b/source/css/_layout/relatedposts.styl
index 38bacb2..ab8f2a0 100644
--- a/source/css/_layout/relatedposts.styl
+++ b/source/css/_layout/relatedposts.styl
@@ -1,31 +1,31 @@
-.relatedPosts
-  margin-top: 40px
-
-  & > .headline
-    margin-bottom: 5px
-    font-weight: 700
-    font-size: 1.43em
-
-  & > .relatedPosts-list
-    & > a
-      margin: 3px
-      width: calc(33.333% - 6px)
-      height: 200px
-      addBorderRadius()
-
-      +maxWidth768()
-        margin: 2px
-        width: calc(50% - 4px)
-        height: 150px
-
-      +maxWidth600()
-        width: calc(100% - 4px)
-
-    .info
-      .info-1
-        .info-item-2
-          -webkit-line-clamp: 2
-
-      .info-2
-        .info-item-1
+.relatedPosts
+  margin-top: 40px
+
+  & > .headline
+    margin-bottom: 5px
+    font-weight: 700
+    font-size: 1.43em
+
+  & > .relatedPosts-list
+    & > a
+      margin: 3px
+      width: calc(33.333% - 6px)
+      height: 200px
+      addBorderRadius()
+
+      +maxWidth768()
+        margin: 2px
+        width: calc(50% - 4px)
+        height: 150px
+
+      +maxWidth600()
+        width: calc(100% - 4px)
+
+    .info
+      .info-1
+        .info-item-2
+          -webkit-line-clamp: 2
+
+      .info-2
+        .info-item-1
           -webkit-line-clamp: 3
\ No newline at end of file
diff --git a/source/css/_layout/reward.styl b/source/css/_layout/reward.styl
index 5cf3a62..b50387a 100644
--- a/source/css/_layout/reward.styl
+++ b/source/css/_layout/reward.styl
@@ -1,78 +1,78 @@
-.post-reward
-  position: relative
-  margin-top: 80px
-  width: 100%
-  text-align: center
-  pointer-events: none
-
-  & > *
-    pointer-events: auto
-
-  .reward-button
-    display: inline-block
-    padding: 4px 24px
-    background: var(--btn-bg)
-    color: var(--btn-color)
-    cursor: pointer
-    addBorderRadius()
-
-    i
-      margin-right: 5px
-
-  &:hover
-    .reward-button
-      background: var(--btn-hover-color)
-
-    & > .reward-main
-      display: block
-
-  .reward-main
-    position: absolute
-    bottom: 40px
-    left: 0
-    z-index: 100
-    display: none
-    padding: 0 0 15px
-    width: 100%
-    addBorderRadius()
-
-    .reward-all
-      display: inline-block
-      margin: 0
-      padding: 20px 10px
-      background: var(--reward-pop)
-
-      &:before
-        position: absolute
-        bottom: -10px
-        left: 0
-        width: 100%
-        height: 20px
-        content: ''
-
-      &:after
-        position: absolute
-        right: 0
-        bottom: 2px
-        left: 0
-        margin: 0 auto
-        width: 0
-        height: 0
-        border-top: 13px solid var(--reward-pop)
-        border-right: 13px solid transparent
-        border-left: 13px solid transparent
-        content: ''
-
-      .reward-item
-        display: inline-block
-        padding: 0 8px
-        list-style-type: none
-        vertical-align: top
-
-        img
-          width: 130px
-          height: 130px
-
-        .post-qr-code-desc
-          width: 130px
-          color: $reward-pop-up-color
+.post-reward
+  position: relative
+  margin-top: 80px
+  width: 100%
+  text-align: center
+  pointer-events: none
+
+  & > *
+    pointer-events: auto
+
+  .reward-button
+    display: inline-block
+    padding: 4px 24px
+    background: var(--btn-bg)
+    color: var(--btn-color)
+    cursor: pointer
+    addBorderRadius()
+
+    i
+      margin-right: 5px
+
+  &:hover
+    .reward-button
+      background: var(--btn-hover-color)
+
+    & > .reward-main
+      display: block
+
+  .reward-main
+    position: absolute
+    bottom: 40px
+    left: 0
+    z-index: 100
+    display: none
+    padding: 0 0 15px
+    width: 100%
+    addBorderRadius()
+
+    .reward-all
+      display: inline-block
+      margin: 0
+      padding: 20px 10px
+      background: var(--reward-pop)
+
+      &:before
+        position: absolute
+        bottom: -10px
+        left: 0
+        width: 100%
+        height: 20px
+        content: ''
+
+      &:after
+        position: absolute
+        right: 0
+        bottom: 2px
+        left: 0
+        margin: 0 auto
+        width: 0
+        height: 0
+        border-top: 13px solid var(--reward-pop)
+        border-right: 13px solid transparent
+        border-left: 13px solid transparent
+        content: ''
+
+      .reward-item
+        display: inline-block
+        padding: 0 8px
+        list-style-type: none
+        vertical-align: top
+
+        img
+          width: 130px
+          height: 130px
+
+        .post-qr-code-desc
+          width: 130px
+          color: $reward-pop-up-color
diff --git a/source/css/_layout/rightside.styl b/source/css/_layout/rightside.styl
index 45c9726..a071630 100644
--- a/source/css/_layout/rightside.styl
+++ b/source/css/_layout/rightside.styl
@@ -1,72 +1,72 @@
-#rightside
-  position: fixed
-  right: -48px
-  bottom: $rightside-bottom
-  z-index: 100
-  opacity: 0
-  transition: all .5s
-
-  &.rightside-show
-    opacity: .8
-    transform: translate(-58px, 0)
-
-  #rightside-config-hide
-    height: 0
-    opacity: 0
-    transition: transform .4s
-    transform: translate(45px, 0)
-
-    &.show
-      height: auto
-      opacity: 1
-      transform: translate(0, 0)
-
-    &.status
-      height: auto
-      opacity: 1
-
-  & > div
-    & > button,
-    & > a
-      display: block
-      margin-bottom: 5px
-      width: w = 35px
-      height: w
-      background-color: var(--btn-bg)
-      color: var(--btn-color)
-      text-align: center
-      font-size: 16px
-      line-height: w
-      addBorderRadius(5)
-
-      &:hover
-        background-color: var(--btn-hover-color)
-
-  #mobile-toc-button
-    display: none
-
-    +maxWidth900()
-      display: block
-
-  +maxWidth900()
-    #hide-aside-btn
-      display: none
-
-  if hexo-config('rightside_scroll_percent')
-    #go-up
-      .scroll-percent
-        display: none
-
-      &.show-percent
-        .scroll-percent
-          display: block
-
-          & + i
-            display: none
-
-      &:hover
-        .scroll-percent
-          display: none
-
-          & + i
-            display: block
+#rightside
+  position: fixed
+  right: -48px
+  bottom: $rightside-bottom
+  z-index: 100
+  opacity: 0
+  transition: all .5s
+
+  &.rightside-show
+    opacity: .8
+    transform: translate(-58px, 0)
+
+  #rightside-config-hide
+    height: 0
+    opacity: 0
+    transition: transform .4s
+    transform: translate(45px, 0)
+
+    &.show
+      height: auto
+      opacity: 1
+      transform: translate(0, 0)
+
+    &.status
+      height: auto
+      opacity: 1
+
+  & > div
+    & > button,
+    & > a
+      display: block
+      margin-bottom: 5px
+      width: w = 35px
+      height: w
+      background-color: var(--btn-bg)
+      color: var(--btn-color)
+      text-align: center
+      font-size: 16px
+      line-height: w
+      addBorderRadius(5)
+
+      &:hover
+        background-color: var(--btn-hover-color)
+
+  #mobile-toc-button
+    display: none
+
+    +maxWidth900()
+      display: block
+
+  +maxWidth900()
+    #hide-aside-btn
+      display: none
+
+  if hexo-config('rightside_scroll_percent')
+    #go-up
+      .scroll-percent
+        display: none
+
+      &.show-percent
+        .scroll-percent
+          display: block
+
+          & + i
+            display: none
+
+      &:hover
+        .scroll-percent
+          display: none
+
+          & + i
+            display: block
diff --git a/source/css/_layout/sidebar.styl b/source/css/_layout/sidebar.styl
index 1f30593..e96faa0 100644
--- a/source/css/_layout/sidebar.styl
+++ b/source/css/_layout/sidebar.styl
@@ -1,78 +1,78 @@
-#sidebar
-  #menu-mask
-    position: fixed
-    z-index: 102
-    display: none
-    width: 100%
-    height: 100%
-    background: alpha($dark-black, .8)
-
-  #sidebar-menus
-    position: fixed
-    top: 0
-    right: -($sidebar-width)
-    z-index: 103
-    overflow-x: hidden
-    overflow-y: scroll
-    padding-left: 5px
-    width: $sidebar-width
-    height: 100%
-    background: var(--sidebar-bg)
-    transition: all .5s
-
-    &.open
-      transform: translate3d(-100%, 0, 0)
-
-    & > .avatar-img
-      margin: 20px auto
-
-    .site-data
-      padding: 0 10px
-
-    hr
-      margin: 20px auto
-
-    .menus_items
-      margin: 20px
-      padding: 15px
-      background: var(--sidebar-menu-bg)
-      box-shadow: 0 0 1px 1px rgba(7, 17, 27, .05)
-      addBorderRadius(10)
-
-      .site-page
-        @extend .limit-one-line
-        position: relative
-        display: block
-        margin: 4px 0
-        padding: 2px 23px 2px 15px
-        color: var(--font-color)
-        font-size: 1.15em
-        cursor: pointer
-        addBorderRadius(6)
-
-        &:hover
-          background: var(--text-bg-hover)
-          color: var(--white)
-
-        i:first-child
-          width: 15%
-          text-align: left
-
-        &.group
-          & > i:last-child
-            position: absolute
-            top: .6em
-            right: 10px
-            transition: transform .3s
-
-          &.hide
-            & > i:last-child
-              transform: rotate(90deg)
-
-            & + .menus_item_child
-              display: none
-
-      .menus_item_child
-        margin: 0
-        padding-left: 25px
+#sidebar
+  #menu-mask
+    position: fixed
+    z-index: 102
+    display: none
+    width: 100%
+    height: 100%
+    background: alpha($dark-black, .8)
+
+  #sidebar-menus
+    position: fixed
+    top: 0
+    right: -($sidebar-width)
+    z-index: 103
+    overflow-x: hidden
+    overflow-y: scroll
+    padding-left: 5px
+    width: $sidebar-width
+    height: 100%
+    background: var(--sidebar-bg)
+    transition: all .5s
+
+    &.open
+      transform: translate3d(-100%, 0, 0)
+
+    & > .avatar-img
+      margin: 20px auto
+
+    .site-data
+      padding: 0 10px
+
+    hr
+      margin: 20px auto
+
+    .menus_items
+      margin: 20px
+      padding: 15px
+      background: var(--sidebar-menu-bg)
+      box-shadow: 0 0 1px 1px rgba(7, 17, 27, .05)
+      addBorderRadius(10)
+
+      .site-page
+        @extend .limit-one-line
+        position: relative
+        display: block
+        margin: 4px 0
+        padding: 2px 23px 2px 15px
+        color: var(--font-color)
+        font-size: 1.15em
+        cursor: pointer
+        addBorderRadius(6)
+
+        &:hover
+          background: var(--text-bg-hover)
+          color: var(--white)
+
+        i:first-child
+          width: 15%
+          text-align: left
+
+        &.group
+          & > i:last-child
+            position: absolute
+            top: .6em
+            right: 10px
+            transition: transform .3s
+
+          &.hide
+            & > i:last-child
+              transform: rotate(90deg)
+
+            & + .menus_item_child
+              display: none
+
+      .menus_item_child
+        margin: 0
+        padding-left: 25px
         list-style: none
\ No newline at end of file
diff --git a/source/css/_layout/third-party.styl b/source/css/_layout/third-party.styl
index d1653f2..8d7ac55 100644
--- a/source/css/_layout/third-party.styl
+++ b/source/css/_layout/third-party.styl
@@ -1,187 +1,187 @@
-#vcomment
-  font-size: 1.1em
-
-  .vbtn
-    border: none
-    background: var(--btn-bg)
-    color: var(--btn-color)
-
-    &:hover
-      background: var(--btn-hover-color)
-
-  .vimg
-    transition: all .3s
-
-    &:hover
-      transform: rotate(360deg)
-
-  .vcards .vcard .vcontent.expand
-    &:before,
-    &:after
-      z-index: 22
-
-#waline-wrap
-  --waline-font-size: 1.1em
-  --waline-theme-color: $button-bg
-  --waline-active-color: $button-hover-color
-
-  .wl-comment-actions > button:not(last-child)
-    padding-right: 4px
-
-if hexo-config('valine.bg')
-  #vcomment
-    textarea
-      background: url(hexo-config('valine.bg')) 100% 100% no-repeat
-
-      &:focus
-        background-image: none
-
-if hexo-config('waline.bg')
-  #waline-wrap
-    textarea
-      background: url(hexo-config('waline.bg')) 100% 100% no-repeat
-
-      &:focus
-        background-image: none
-
-.twikoo
-  .tk-content
-    p
-      margin: 3px 0
-
-.fireworks
-  position: fixed
-  top: 0
-  left: 0
-  z-index: $fireworks-zIndex
-  pointer-events: none
-
-.medium-zoom-image--opened
-  z-index: 99999 !important
-  margin: 0 !important
-
-.medium-zoom-overlay
-  z-index: 99999 !important
-
-if hexo-config('mermaid.enable')
-  .mermaid-wrap
-    margin: 0 0 20px
-    text-align: center
-
-    & > svg
-      height: 100%
-
-  if hexo-config('mermaid.code_write')
-    pre > code.mermaid
-      display: none
-
-if hexo-config('chartjs.enable')
-  .chartjs-container
-    display: flex
-    flex-direction: column
-    justify-content: center
-    align-items: center
-    margin: 0 0 20px
-    text-align: center
-    gap: 20px
-
-    +maxWidth600()
-      .chartjs-wrap
-        width: 100% !important
-
-    &.chartjs-abreast
-      flex-direction: row
-
-      +maxWidth600()
-        flex-direction: column
-
-    .chartjs-wrap
-      width: -webkit-fill-available
-
-    canvas
-      display: inline-block !important
-
-.utterances,
-.fb-comments iframe
-  width: 100% !important
-
-#gitalk-container
-  .gt-meta
-    margin: 0 0 .8em
-    padding: 6px 0 16px
-
-if hexo-config('math.use')
-  .katex-display
-    overflow: auto hidden
-    padding: 5px
-
-    .katex-show
-      display: block
-
-  .katex
-    display: none
-
-    &.katex-show
-      display: inline
-
-  if hexo-config('math.hide_scrollbar')
-    .katex-display,
-    mjx-container
-      scrollbar-width: none
-
-      &::-webkit-scrollbar
-        display: none
-
-  // Mathjax
-  mjx-container
-    overflow-x: auto
-    overflow-y: hidden
-    padding-bottom: 4px
-    max-width: 100%
-
-    &[display]
-      display: block !important
-      min-width: auto !important
-
-    &:not([display])
-      display: inline-grid !important
-
-  mjx-assistive-mml
-    right: 0
-    bottom: 0
-
-.aplayer
-  color: $font-black
-
-.container
-  .aplayer
-    margin: 0 0 20px
-
-    if hexo-config('beautify.enable')
-      ol,
-      ul
-        margin: 0
-        padding: 0
-
-        li
-          margin: 0
-          padding: 0 15px
-
-          &:before
-            content: none
-
-.snackbar-container.snackbar-css
-  addBorderRadius(5)
-  opacity: .85 !important
-
-.abc-music-sheet
-  margin: 0 0 20px
-  opacity: 0
-  transition: opacity .3s
-
-  &.abcjs-container
-    opacity: 1
-
-+maxWidth768()
-  .fancybox__toolbar__column.is-middle
+#vcomment
+  font-size: 1.1em
+
+  .vbtn
+    border: none
+    background: var(--btn-bg)
+    color: var(--btn-color)
+
+    &:hover
+      background: var(--btn-hover-color)
+
+  .vimg
+    transition: all .3s
+
+    &:hover
+      transform: rotate(360deg)
+
+  .vcards .vcard .vcontent.expand
+    &:before,
+    &:after
+      z-index: 22
+
+#waline-wrap
+  --waline-font-size: 1.1em
+  --waline-theme-color: $button-bg
+  --waline-active-color: $button-hover-color
+
+  .wl-comment-actions > button:not(last-child)
+    padding-right: 4px
+
+if hexo-config('valine.bg')
+  #vcomment
+    textarea
+      background: url(hexo-config('valine.bg')) 100% 100% no-repeat
+
+      &:focus
+        background-image: none
+
+if hexo-config('waline.bg')
+  #waline-wrap
+    textarea
+      background: url(hexo-config('waline.bg')) 100% 100% no-repeat
+
+      &:focus
+        background-image: none
+
+.twikoo
+  .tk-content
+    p
+      margin: 3px 0
+
+.fireworks
+  position: fixed
+  top: 0
+  left: 0
+  z-index: $fireworks-zIndex
+  pointer-events: none
+
+.medium-zoom-image--opened
+  z-index: 99999 !important
+  margin: 0 !important
+
+.medium-zoom-overlay
+  z-index: 99999 !important
+
+if hexo-config('mermaid.enable')
+  .mermaid-wrap
+    margin: 0 0 20px
+    text-align: center
+
+    & > svg
+      height: 100%
+
+  if hexo-config('mermaid.code_write')
+    pre > code.mermaid
+      display: none
+
+if hexo-config('chartjs.enable')
+  .chartjs-container
+    display: flex
+    flex-direction: column
+    justify-content: center
+    align-items: center
+    margin: 0 0 20px
+    text-align: center
+    gap: 20px
+
+    +maxWidth600()
+      .chartjs-wrap
+        width: 100% !important
+
+    &.chartjs-abreast
+      flex-direction: row
+
+      +maxWidth600()
+        flex-direction: column
+
+    .chartjs-wrap
+      width: -webkit-fill-available
+
+    canvas
+      display: inline-block !important
+
+.utterances,
+.fb-comments iframe
+  width: 100% !important
+
+#gitalk-container
+  .gt-meta
+    margin: 0 0 .8em
+    padding: 6px 0 16px
+
+if hexo-config('math.use')
+  .katex-display
+    overflow: auto hidden
+    padding: 5px
+
+    .katex-show
+      display: block
+
+  .katex
+    display: none
+
+    &.katex-show
+      display: inline
+
+  if hexo-config('math.hide_scrollbar')
+    .katex-display,
+    mjx-container
+      scrollbar-width: none
+
+      &::-webkit-scrollbar
+        display: none
+
+  // Mathjax
+  mjx-container
+    overflow-x: auto
+    overflow-y: hidden
+    padding-bottom: 4px
+    max-width: 100%
+
+    &[display]
+      display: block !important
+      min-width: auto !important
+
+    &:not([display])
+      display: inline-grid !important
+
+  mjx-assistive-mml
+    right: 0
+    bottom: 0
+
+.aplayer
+  color: $font-black
+
+.container
+  .aplayer
+    margin: 0 0 20px
+
+    if hexo-config('beautify.enable')
+      ol,
+      ul
+        margin: 0
+        padding: 0
+
+        li
+          margin: 0
+          padding: 0 15px
+
+          &:before
+            content: none
+
+.snackbar-container.snackbar-css
+  addBorderRadius(5)
+  opacity: .85 !important
+
+.abc-music-sheet
+  margin: 0 0 20px
+  opacity: 0
+  transition: opacity .3s
+
+  &.abcjs-container
+    opacity: 1
+
++maxWidth768()
+  .fancybox__toolbar__column.is-middle
     display: none
\ No newline at end of file
diff --git a/source/css/_mode/darkmode.styl b/source/css/_mode/darkmode.styl
index d561ae5..ef397cc 100644
--- a/source/css/_mode/darkmode.styl
+++ b/source/css/_mode/darkmode.styl
@@ -1,160 +1,160 @@
-if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
-  [data-theme='dark']
-    --global-bg: darken(#121212, 2)
-    --font-color: alpha(#FFFFFF, .7)
-    --hr-border: alpha(#FFFFFF, .4)
-    --hr-before-color: alpha(#FFFFFF, .7)
-    --search-bg: #121212
-    --search-input-color: alpha(#FFFFFF, .7)
-    --search-a-color: alpha(#FFFFFF, .7)
-    --preloader-bg: darken(#121212, 2)
-    --preloader-color: alpha(#FFFFFF, .7)
-    --tab-border-color: #2c2c2c
-    --tab-botton-bg: #2c2c2c
-    --tab-botton-color: alpha(#FFFFFF, .7)
-    --tab-button-hover-bg: lighten(#121212, 15)
-    --tab-button-active-bg: #121212
-    --card-bg: #121212
-    --sidebar-bg: #121212
-    --sidebar-menu-bg: lighten(#121212, 5)
-    --btn-hover-color: lighten(#121212, 40)
-    --btn-color: alpha(#FFFFFF, .7)
-    --btn-bg: lighten(#121212, 5)
-    --text-bg-hover: lighten(#121212, 15)
-    --light-grey: alpha(#FFFFFF, .7)
-    --dark-grey: alpha(#FFFFFF, .2)
-    --white: alpha(#FFFFFF, .9)
-    --text-highlight-color: alpha(#FFFFFF, .9)
-    --blockquote-color: alpha(#FFFFFF, .7)
-    --blockquote-bg: lighten(#121212, 10)
-    --reward-pop: lighten(#121212, 10)
-    --toc-link-color: alpha(#FFFFFF, .6)
-    --scrollbar-color: lighten(#121212, 25)
-    --timeline-bg: lighten(#121212, 5)
-    --zoom-bg: #121212
-    --mark-bg: alpha($dark-black, .6)
-
-    #web_bg:before
-      position: absolute
-      width: 100%
-      height: 100%
-      background-color: alpha($dark-black, .7)
-      content: ''
-
-    .container
-      code
-        background: #2c2c2c
-
-      pre > code
-        background: lighten(#121212, 2)
-
-      figure.highlight
-        box-shadow: none
-
-      .note
-        code
-          background: $code-background
-
-      .aplayer
-        filter: brightness(.8)
-
-      kbd
-        border-color: #696969
-        background-color: #525252
-        color: #e2f1ff
-
-    // 頭部
-    #page-header
-      &.nav-fixed > #nav,
-      &.not-top-img > #nav
-        background: alpha(#121212, .8)
-        box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
-
-    #post-comment
-      .comment-switch
-        if hexo-config('comments.text')
-          background: #2c2c2c !important
-
-        #switch-btn
-          filter: brightness(.8)
-
-    // note
-    if hexo-config('note.style') == 'modern' || hexo-config('note.style') == 'flat'
-      .note
-        filter: brightness(.8)
-
-    // hide-tags
-    .hide-button,
-    .btn-beautify,
-    .hl-label,
-    #post-outdate-notice,
-    .error-img,
-    .container iframe,
-    .gist,
-    .ads-wrap
-      filter: brightness(.8)
-
-    img
-      if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
-        filter: blur(0) brightness(.8)
-      else
-        filter: brightness(.8)
-
-    #aside-content .aside-list > .aside-list-item:not(:last-child)
-      border-bottom: 1px dashed alpha(#FFFFFF, .1)
-
-    // Gitalk
-    #gitalk-container
-      filter: brightness(.8)
-
-      svg
-        fill: alpha(#FFFFFF, .9) !important
-
-    // Disqusjs 反代模式下的適配
-    #disqusjs
-      #dsqjs
-        &:hover,
-        &:focus,
-        .dsqjs-tab-active,
-        .dsqjs-no-comment
-          color: alpha(#FFFFFF, .7)
-
-        .dsqjs-order-label
-          background-color: lighten(#121212, 5)
-
-        .dsqjs-post-body
-          color: alpha(#FFFFFF, .7)
-
-          code,
-          pre
-            background: #2c2c2c
-
-          blockquote
-            color: alpha(#FFFFFF, .7)
-
-    #artitalk_main #lazy
-      background: #121212
-
-    #operare_artitalk .c2
-      background: #121212
-
-    #card-toc
-      +maxWidth900()
-        background: lighten(#121212, 5)
-
-    // artalk
-    .artalk.atk-dark-mode,
-    .atk-layer-wrap.atk-dark-mode
-      --at-color-font: alpha(#FFFFFF, .7)
-      --at-color-meta: alpha(#FFFFFF, .7)
-      --at-color-grey: alpha(#FFFFFF, .7)
-    
-    .atk-send-btn,
-    .atk-badge
-      color: alpha(#FFFFFF, .7) !important
-
-    // waline
-    #waline-wrap
-      --waline-color: alpha(#FFFFFF, .7)
-      --waline-dark-grey: alpha(#FFFFFF, .7)
+if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
+  [data-theme='dark']
+    --global-bg: darken(#121212, 2)
+    --font-color: alpha(#FFFFFF, .7)
+    --hr-border: alpha(#FFFFFF, .4)
+    --hr-before-color: alpha(#FFFFFF, .7)
+    --search-bg: #121212
+    --search-input-color: alpha(#FFFFFF, .7)
+    --search-a-color: alpha(#FFFFFF, .7)
+    --preloader-bg: darken(#121212, 2)
+    --preloader-color: alpha(#FFFFFF, .7)
+    --tab-border-color: #2c2c2c
+    --tab-botton-bg: #2c2c2c
+    --tab-botton-color: alpha(#FFFFFF, .7)
+    --tab-button-hover-bg: lighten(#121212, 15)
+    --tab-button-active-bg: #121212
+    --card-bg: #121212
+    --sidebar-bg: #121212
+    --sidebar-menu-bg: lighten(#121212, 5)
+    --btn-hover-color: lighten(#121212, 40)
+    --btn-color: alpha(#FFFFFF, .7)
+    --btn-bg: lighten(#121212, 5)
+    --text-bg-hover: lighten(#121212, 15)
+    --light-grey: alpha(#FFFFFF, .7)
+    --dark-grey: alpha(#FFFFFF, .2)
+    --white: alpha(#FFFFFF, .9)
+    --text-highlight-color: alpha(#FFFFFF, .9)
+    --blockquote-color: alpha(#FFFFFF, .7)
+    --blockquote-bg: lighten(#121212, 10)
+    --reward-pop: lighten(#121212, 10)
+    --toc-link-color: alpha(#FFFFFF, .6)
+    --scrollbar-color: lighten(#121212, 25)
+    --timeline-bg: lighten(#121212, 5)
+    --zoom-bg: #121212
+    --mark-bg: alpha($dark-black, .6)
+
+    #web_bg:before
+      position: absolute
+      width: 100%
+      height: 100%
+      background-color: alpha($dark-black, .7)
+      content: ''
+
+    .container
+      code
+        background: #2c2c2c
+
+      pre > code
+        background: lighten(#121212, 2)
+
+      figure.highlight
+        box-shadow: none
+
+      .note
+        code
+          background: $code-background
+
+      .aplayer
+        filter: brightness(.8)
+
+      kbd
+        border-color: #696969
+        background-color: #525252
+        color: #e2f1ff
+
+    // 頭部
+    #page-header
+      &.nav-fixed > #nav,
+      &.not-top-img > #nav
+        background: alpha(#121212, .8)
+        box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
+
+    #post-comment
+      .comment-switch
+        if hexo-config('comments.text')
+          background: #2c2c2c !important
+
+        #switch-btn
+          filter: brightness(.8)
+
+    // note
+    if hexo-config('note.style') == 'modern' || hexo-config('note.style') == 'flat'
+      .note
+        filter: brightness(.8)
+
+    // hide-tags
+    .hide-button,
+    .btn-beautify,
+    .hl-label,
+    #post-outdate-notice,
+    .error-img,
+    .container iframe,
+    .gist,
+    .ads-wrap
+      filter: brightness(.8)
+
+    img
+      if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
+        filter: blur(0) brightness(.8)
+      else
+        filter: brightness(.8)
+
+    #aside-content .aside-list > .aside-list-item:not(:last-child)
+      border-bottom: 1px dashed alpha(#FFFFFF, .1)
+
+    // Gitalk
+    #gitalk-container
+      filter: brightness(.8)
+
+      svg
+        fill: alpha(#FFFFFF, .9) !important
+
+    // Disqusjs 反代模式下的適配
+    #disqusjs
+      #dsqjs
+        &:hover,
+        &:focus,
+        .dsqjs-tab-active,
+        .dsqjs-no-comment
+          color: alpha(#FFFFFF, .7)
+
+        .dsqjs-order-label
+          background-color: lighten(#121212, 5)
+
+        .dsqjs-post-body
+          color: alpha(#FFFFFF, .7)
+
+          code,
+          pre
+            background: #2c2c2c
+
+          blockquote
+            color: alpha(#FFFFFF, .7)
+
+    #artitalk_main #lazy
+      background: #121212
+
+    #operare_artitalk .c2
+      background: #121212
+
+    #card-toc
+      +maxWidth900()
+        background: lighten(#121212, 5)
+
+    // artalk
+    .artalk.atk-dark-mode,
+    .atk-layer-wrap.atk-dark-mode
+      --at-color-font: alpha(#FFFFFF, .7)
+      --at-color-meta: alpha(#FFFFFF, .7)
+      --at-color-grey: alpha(#FFFFFF, .7)
+    
+    .atk-send-btn,
+    .atk-badge
+      color: alpha(#FFFFFF, .7) !important
+
+    // waline
+    #waline-wrap
+      --waline-color: alpha(#FFFFFF, .7)
+      --waline-dark-grey: alpha(#FFFFFF, .7)
       --waline-info-color: alpha(#FFFFFF, .5)
\ No newline at end of file
diff --git a/source/css/_mode/readmode.styl b/source/css/_mode/readmode.styl
index db4a6cf..378619a 100644
--- a/source/css/_mode/readmode.styl
+++ b/source/css/_mode/readmode.styl
@@ -1,185 +1,185 @@
-if hexo-config('readmode')
-  .read-mode
-    --font-color: #4c4948
-    --readmode-light-color: #fff
-    --white: #4c4948
-    --light-grey: #4c4948
-    --gray: #d6dbdf
-    --hr-border: #d6dbdf
-    --hr-before-color: darken(#d6dbdf, 10)
-    --highlight-bg: #f7f7f7
-    --exit-btn-bg: #C0C0C0
-    --exit-btn-color: #fff
-    --exit-btn-hover: darken(#C0C0C0, 20)
-    --pseudo-hover: none
-
-  [data-theme='dark']
-    .read-mode
-      --font-color: rgba(255, 255, 255, .7)
-      --readmode-light-color: #0d0d0d
-      --white: rgba(255, 255, 255, .9)
-      --light-grey: rgba(255, 255, 255, .7)
-      --gray: rgba(255, 255, 255, .7)
-      --hr-border: rgba(255, 255, 255, .5)
-      --hr-before-color: rgba(255, 255, 255, .7)
-      --highlight-bg: #171717
-      --exit-btn-bg: #1f1f1f
-      --exit-btn-color: rgba(255, 255, 255, .9)
-      --exit-btn-hover: lighten(#1f1f1f, 20)
-
-  .read-mode
-    background: var(--readmode-light-color)
-
-    .exit-readmode
-      position: fixed
-      top: 30px
-      right: 30px
-      z-index: 100
-      width: 40px
-      height: 40px
-      background: var(--exit-btn-bg)
-      color: var(--exit-btn-color)
-      font-size: 16px
-      transition: background .3s
-      addBorderRadius(8)
-
-      +maxWidth768()
-        top: initial
-        bottom: 30px
-
-      &:hover
-        background: var(--exit-btn-hover)
-
-    #aside-content
-      display: none
-
-    #page-header.post-bg
-      background: none !important
-
-      &:before
-        opacity: 0
-
-      & > #post-info
-        text-align: center
-
-    #post
-      margin: 0 auto
-      background: transparent
-      box-shadow: none
-
-      &:hover
-        box-shadow: none
-
-    & > canvas
-      display: none !important
-
-    .highlight-tools,
-    #footer,
-    #post > *:not(#post-info):not(.post-content),
-    #nav,
-    #post-outdate-notice,
-    #web_bg,
-    #rightside,
-    .not-top-img
-      display: none !important
-
-    .container
-      a
-        color: #99a9bf
-
-      pre,
-      .highlight:not(.js-file-line-container)
-        background: var(--highlight-bg) !important
-
-        *
-          color: var(--font-color) !important
-
-      figure.highlight
-        border-radius: 0 !important
-        box-shadow: none !important
-
-        & > :not(.highlight-tools)
-          display: block !important
-
-        .line:before
-          color: var(--font-color) !important
-
-        .hljs
-          background: var(--highlight-bg) !important
-
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6
-        padding: 0
-
-        &:before
-          content: ''
-
-        &:hover
-          padding: 0
-
-      ul,
-      li,
-      ol
-        &:hover:before
-          transform: none !important
-
-      ol,
-      li
-        &:before
-          background: transparent !important
-          color: var(--font-color) !important
-
-      ul
-        >li
-          &:before
-            border-color: var(--gray) !important
-
-      .tabs
-        border: 2px solid var(--tab-border-color)
-
-        > .nav-tabs
-          background: transparent
-
-          > .tab
-            border-top: none !important
-
-        > .tab-contents .tab-item-content.active
-          animation: none
-
-      code
-        color: var(--font-color)
-
-      blockquote
-        border-color: var(--gray)
-        background-color: var(--readmode-light-color)
-
-      kbd
-        border: 1px solid var(--gray)
-        background-color: transparent
-        box-shadow: none
-        color: var(--font-color)
-
-      .hide-toggle
-        border: 1px solid var(--gray) !important
-
-      .hide-button,
-      .btn-beautify,
-      .hl-label
-        border: 1px solid var(--gray) !important
-        background: var(--readmode-light-color) !important
-        color: var(--font-color) !important
-
-      .note
-        border: 2px solid var(--gray)
-        border-left-color: var(--gray) !important
-        filter: none
-        background-color: var(--readmode-light-color) !important
-        color: var(--font-color)
-
-        &:before,
-        .note-icon
-          color: var(--font-color)
+if hexo-config('readmode')
+  .read-mode
+    --font-color: #4c4948
+    --readmode-light-color: #fff
+    --white: #4c4948
+    --light-grey: #4c4948
+    --gray: #d6dbdf
+    --hr-border: #d6dbdf
+    --hr-before-color: darken(#d6dbdf, 10)
+    --highlight-bg: #f7f7f7
+    --exit-btn-bg: #C0C0C0
+    --exit-btn-color: #fff
+    --exit-btn-hover: darken(#C0C0C0, 20)
+    --pseudo-hover: none
+
+  [data-theme='dark']
+    .read-mode
+      --font-color: rgba(255, 255, 255, .7)
+      --readmode-light-color: #0d0d0d
+      --white: rgba(255, 255, 255, .9)
+      --light-grey: rgba(255, 255, 255, .7)
+      --gray: rgba(255, 255, 255, .7)
+      --hr-border: rgba(255, 255, 255, .5)
+      --hr-before-color: rgba(255, 255, 255, .7)
+      --highlight-bg: #171717
+      --exit-btn-bg: #1f1f1f
+      --exit-btn-color: rgba(255, 255, 255, .9)
+      --exit-btn-hover: lighten(#1f1f1f, 20)
+
+  .read-mode
+    background: var(--readmode-light-color)
+
+    .exit-readmode
+      position: fixed
+      top: 30px
+      right: 30px
+      z-index: 100
+      width: 40px
+      height: 40px
+      background: var(--exit-btn-bg)
+      color: var(--exit-btn-color)
+      font-size: 16px
+      transition: background .3s
+      addBorderRadius(8)
+
+      +maxWidth768()
+        top: initial
+        bottom: 30px
+
+      &:hover
+        background: var(--exit-btn-hover)
+
+    #aside-content
+      display: none
+
+    #page-header.post-bg
+      background: none !important
+
+      &:before
+        opacity: 0
+
+      & > #post-info
+        text-align: center
+
+    #post
+      margin: 0 auto
+      background: transparent
+      box-shadow: none
+
+      &:hover
+        box-shadow: none
+
+    & > canvas
+      display: none !important
+
+    .highlight-tools,
+    #footer,
+    #post > *:not(#post-info):not(.post-content),
+    #nav,
+    #post-outdate-notice,
+    #web_bg,
+    #rightside,
+    .not-top-img
+      display: none !important
+
+    .container
+      a
+        color: #99a9bf
+
+      pre,
+      .highlight:not(.js-file-line-container)
+        background: var(--highlight-bg) !important
+
+        *
+          color: var(--font-color) !important
+
+      figure.highlight
+        border-radius: 0 !important
+        box-shadow: none !important
+
+        & > :not(.highlight-tools)
+          display: block !important
+
+        .line:before
+          color: var(--font-color) !important
+
+        .hljs
+          background: var(--highlight-bg) !important
+
+      h1,
+      h2,
+      h3,
+      h4,
+      h5,
+      h6
+        padding: 0
+
+        &:before
+          content: ''
+
+        &:hover
+          padding: 0
+
+      ul,
+      li,
+      ol
+        &:hover:before
+          transform: none !important
+
+      ol,
+      li
+        &:before
+          background: transparent !important
+          color: var(--font-color) !important
+
+      ul
+        >li
+          &:before
+            border-color: var(--gray) !important
+
+      .tabs
+        border: 2px solid var(--tab-border-color)
+
+        > .nav-tabs
+          background: transparent
+
+          > .tab
+            border-top: none !important
+
+        > .tab-contents .tab-item-content.active
+          animation: none
+
+      code
+        color: var(--font-color)
+
+      blockquote
+        border-color: var(--gray)
+        background-color: var(--readmode-light-color)
+
+      kbd
+        border: 1px solid var(--gray)
+        background-color: transparent
+        box-shadow: none
+        color: var(--font-color)
+
+      .hide-toggle
+        border: 1px solid var(--gray) !important
+
+      .hide-button,
+      .btn-beautify,
+      .hl-label
+        border: 1px solid var(--gray) !important
+        background: var(--readmode-light-color) !important
+        color: var(--font-color) !important
+
+      .note
+        border: 2px solid var(--gray)
+        border-left-color: var(--gray) !important
+        filter: none
+        background-color: var(--readmode-light-color) !important
+        color: var(--font-color)
+
+        &:before,
+        .note-icon
+          color: var(--font-color)
diff --git a/source/css/_page/404.styl b/source/css/_page/404.styl
index 5bd23c4..51feec5 100644
--- a/source/css/_page/404.styl
+++ b/source/css/_page/404.styl
@@ -1,66 +1,66 @@
-if hexo-config('error_404.enable')
-  .type-404
-    .error-content
-      @extend .cardHover
-      overflow: hidden
-      margin: 0 20px
-      height: 360px
-
-      +maxWidth768()
-        margin: 0
-        height: 500px
-
-      .error-img
-        display: inline-block
-        overflow: hidden
-        width: 50%
-        height: 100%
-
-        +maxWidth768()
-          width: 100%
-          height: 45%
-
-        img
-          @extend .imgHover
-          background-color: $theme-color
-
-      .error-info
-        display: inline-flex
-        flex-direction: column
-        justify-content: center
-        align-content: center
-        width: 50%
-        height: 100%
-        vertical-align: top
-        text-align: center
-
-        if $site-name-font
-          font-family: $site-name-font
-
-        +maxWidth768()
-          width: 100%
-          height: 55%
-
-        .error_title
-          margin-top: -.6em
-          font-size: 9em
-
-          +maxWidth768()
-            font-size: 8em
-
-        .error_subtitle
-          @extend .limit-more-line
-          margin-top: -3em
-          word-break: break-word
-          font-size: 1.6em
-          -webkit-line-clamp: 2
-
-    .nc
-      margin-top: 5%
-      padding: 0 20px
-
-    #footer
-      display: none
-
-    & + #rightside
+if hexo-config('error_404.enable')
+  .type-404
+    .error-content
+      @extend .cardHover
+      overflow: hidden
+      margin: 0 20px
+      height: 360px
+
+      +maxWidth768()
+        margin: 0
+        height: 500px
+
+      .error-img
+        display: inline-block
+        overflow: hidden
+        width: 50%
+        height: 100%
+
+        +maxWidth768()
+          width: 100%
+          height: 45%
+
+        img
+          @extend .imgHover
+          background-color: $theme-color
+
+      .error-info
+        display: inline-flex
+        flex-direction: column
+        justify-content: center
+        align-content: center
+        width: 50%
+        height: 100%
+        vertical-align: top
+        text-align: center
+
+        if $site-name-font
+          font-family: $site-name-font
+
+        +maxWidth768()
+          width: 100%
+          height: 55%
+
+        .error_title
+          margin-top: -.6em
+          font-size: 9em
+
+          +maxWidth768()
+            font-size: 8em
+
+        .error_subtitle
+          @extend .limit-more-line
+          margin-top: -3em
+          word-break: break-word
+          font-size: 1.6em
+          -webkit-line-clamp: 2
+
+    .nc
+      margin-top: 5%
+      padding: 0 20px
+
+    #footer
+      display: none
+
+    & + #rightside
       display: none
\ No newline at end of file
diff --git a/source/css/_page/archives.styl b/source/css/_page/archives.styl
index 0adf37b..cae22c6 100644
--- a/source/css/_page/archives.styl
+++ b/source/css/_page/archives.styl
@@ -1,115 +1,115 @@
-.article-sort
-  margin-left: 10px
-  padding-left: 20px
-  border-left: 2px solid lighten($light-blue, 20)
-
-  &-title
-    position: relative
-    margin-left: 10px
-    padding-bottom: 20px
-    padding-left: 20px
-    font-size: 1.72em
-
-    &:hover
-      &:before
-        border-color: var(--pseudo-hover)
-
-    &:before
-      position: absolute
-      top: calc(((100% - 36px) / 2))
-      left: -9px
-      z-index: 1
-      width: w = 10px
-      height: h = w
-      border: .5 * w solid $light-blue
-      border-radius: w
-      background: var(--card-bg)
-      content: ''
-      line-height: h
-      transition: all .2s ease-in-out
-
-    &:after
-      position: absolute
-      bottom: 0
-      left: 0
-      z-index: 0
-      width: 2px
-      height: 1.5em
-      background: lighten($light-blue, 20)
-      content: ''
-
-  &-item
-    position: relative
-    display: flex
-    align-items: center
-    margin: 0 0 20px 10px
-    transition: all .2s ease-in-out
-
-    &:hover
-      &:before
-        border-color: var(--pseudo-hover)
-
-    &:before
-      $w = 6px
-      position: absolute
-      left: calc(-20px - 17px)
-      width: w = $w
-      height: h = w
-      border: .5 * w solid $light-blue
-      border-radius: w
-      background: var(--card-bg)
-      content: ''
-      transition: all .2s ease-in-out
-
-    &.no-article-cover
-      height: 80px
-
-      .article-sort-item-info
-        padding: 0
-
-    &.year
-      font-size: 1.43em
-      margin-bottom: 10px
-
-      &:hover
-        &:before
-          border-color: $light-blue
-
-      &:before
-        border-color: var(--pseudo-hover)
-
-    &-time
-      color: var(--card-meta)
-      font-size: .85em
-
-      time
-        padding-left: 6px
-        cursor: default
-
-    &-title
-      @extend .limit-more-line
-      color: var(--font-color)
-      font-size: 1.05em
-      transition: all .3s
-      -webkit-line-clamp: 2
-
-      &:hover
-        color: $text-hover
-        transform: translateX(10px)
-
-    &-img
-      overflow: hidden
-      width: 100px
-      height: 70px
-      addBorderRadius()
-
-      +maxWidth768()
-        width: 70px
-        height: 70px
-
-      :first-child
-        @extend .imgHover
-
-    &-info
-      flex: 1
-      padding: 0 16px
+.article-sort
+  margin-left: 10px
+  padding-left: 20px
+  border-left: 2px solid lighten($light-blue, 20)
+
+  &-title
+    position: relative
+    margin-left: 10px
+    padding-bottom: 20px
+    padding-left: 20px
+    font-size: 1.72em
+
+    &:hover
+      &:before
+        border-color: var(--pseudo-hover)
+
+    &:before
+      position: absolute
+      top: calc(((100% - 36px) / 2))
+      left: -9px
+      z-index: 1
+      width: w = 10px
+      height: h = w
+      border: .5 * w solid $light-blue
+      border-radius: w
+      background: var(--card-bg)
+      content: ''
+      line-height: h
+      transition: all .2s ease-in-out
+
+    &:after
+      position: absolute
+      bottom: 0
+      left: 0
+      z-index: 0
+      width: 2px
+      height: 1.5em
+      background: lighten($light-blue, 20)
+      content: ''
+
+  &-item
+    position: relative
+    display: flex
+    align-items: center
+    margin: 0 0 20px 10px
+    transition: all .2s ease-in-out
+
+    &:hover
+      &:before
+        border-color: var(--pseudo-hover)
+
+    &:before
+      $w = 6px
+      position: absolute
+      left: calc(-20px - 17px)
+      width: w = $w
+      height: h = w
+      border: .5 * w solid $light-blue
+      border-radius: w
+      background: var(--card-bg)
+      content: ''
+      transition: all .2s ease-in-out
+
+    &.no-article-cover
+      height: 80px
+
+      .article-sort-item-info
+        padding: 0
+
+    &.year
+      font-size: 1.43em
+      margin-bottom: 10px
+
+      &:hover
+        &:before
+          border-color: $light-blue
+
+      &:before
+        border-color: var(--pseudo-hover)
+
+    &-time
+      color: var(--card-meta)
+      font-size: .85em
+
+      time
+        padding-left: 6px
+        cursor: default
+
+    &-title
+      @extend .limit-more-line
+      color: var(--font-color)
+      font-size: 1.05em
+      transition: all .3s
+      -webkit-line-clamp: 2
+
+      &:hover
+        color: $text-hover
+        transform: translateX(10px)
+
+    &-img
+      overflow: hidden
+      width: 100px
+      height: 70px
+      addBorderRadius()
+
+      +maxWidth768()
+        width: 70px
+        height: 70px
+
+      :first-child
+        @extend .imgHover
+
+    &-info
+      flex: 1
+      padding: 0 16px
diff --git a/source/css/_page/categories.styl b/source/css/_page/categories.styl
index 9e65061..66e96be 100644
--- a/source/css/_page/categories.styl
+++ b/source/css/_page/categories.styl
@@ -1,37 +1,37 @@
-.category-lists
-  .category-title
-    font-size: 2.57em
-
-    +maxWidth768()
-      font-size: 2em
-
-  .category-list
-    margin-bottom: 0
-
-    a
-      color: var(--font-color)
-
-      &:hover
-        color: $text-hover
-
-    .category-list-count
-      margin-left: 8px
-      color: var(--card-meta)
-
-      &:before
-        content: '('
-
-      &:after
-        content: ')'
-
-  ul
-    padding: 0 0 0 20px
-    @extend .list-beauty
-
-    ul
-      padding-left: 4px
-
-    li
-      position: relative
-      margin: 6px 0
-      padding: .12em .4em .12em 1.4em
+.category-lists
+  .category-title
+    font-size: 2.57em
+
+    +maxWidth768()
+      font-size: 2em
+
+  .category-list
+    margin-bottom: 0
+
+    a
+      color: var(--font-color)
+
+      &:hover
+        color: $text-hover
+
+    .category-list-count
+      margin-left: 8px
+      color: var(--card-meta)
+
+      &:before
+        content: '('
+
+      &:after
+        content: ')'
+
+  ul
+    padding: 0 0 0 20px
+    @extend .list-beauty
+
+    ul
+      padding-left: 4px
+
+    li
+      position: relative
+      margin: 6px 0
+      padding: .12em .4em .12em 1.4em
diff --git a/source/css/_page/common.styl b/source/css/_page/common.styl
index 9e25c20..008270e 100644
--- a/source/css/_page/common.styl
+++ b/source/css/_page/common.styl
@@ -1,60 +1,60 @@
-#body-wrap
-  display: flex
-  flex-direction: column
-  min-height: 100vh
-
-.layout
-  display: flex
-  flex: 1 auto
-  margin: 0 auto
-  padding: 40px 15px
-  max-width: 1200px
-  width: 100%
-
-  +maxWidth900()
-    flex-direction: column
-
-  +maxWidth768()
-    padding: 20px 5px
-
-  +minWidth2000()
-    max-width: 70%
-
-  & > div:first-child:not(.nc)
-    @extend .cardHover
-    align-self: flex-start
-    padding: 50px 40px
-
-    +maxWidth768()
-      padding: 36px 14px
-
-  & > div:first-child
-    width: 74%
-    transition: all .3s
-
-    +maxWidth900()
-      width: 100% !important
-
-    if hexo-config('aside.position') == 'left'
-      +minWidth900()
-        order: 2
-
-  // 隱藏aside
-  &.hide-aside
-    max-width: 1000px
-
-    +minWidth2000()
-      max-width: 1300px
-
-    & > div
-      width: 100% !important
-
-// for apple device
-.apple
-  #page-header.full_page
-    background-attachment: scroll !important
-
-  .recent-post-item,
-  .avatar-img,
-  .flink-item-icon
-    transform: translateZ(0)
+#body-wrap
+  display: flex
+  flex-direction: column
+  min-height: 100vh
+
+.layout
+  display: flex
+  flex: 1 auto
+  margin: 0 auto
+  padding: 40px 15px
+  max-width: 1200px
+  width: 100%
+
+  +maxWidth900()
+    flex-direction: column
+
+  +maxWidth768()
+    padding: 20px 5px
+
+  +minWidth2000()
+    max-width: 70%
+
+  & > div:first-child:not(.nc)
+    @extend .cardHover
+    align-self: flex-start
+    padding: 50px 40px
+
+    +maxWidth768()
+      padding: 36px 14px
+
+  & > div:first-child
+    width: 74%
+    transition: all .3s
+
+    +maxWidth900()
+      width: 100% !important
+
+    if hexo-config('aside.position') == 'left'
+      +minWidth900()
+        order: 2
+
+  // 隱藏aside
+  &.hide-aside
+    max-width: 1000px
+
+    +minWidth2000()
+      max-width: 1300px
+
+    & > div
+      width: 100% !important
+
+// for apple device
+.apple
+  #page-header.full_page
+    background-attachment: scroll !important
+
+  .recent-post-item,
+  .avatar-img,
+  .flink-item-icon
+    transform: translateZ(0)
diff --git a/source/css/_page/flink.styl b/source/css/_page/flink.styl
index e288085..c95d870 100644
--- a/source/css/_page/flink.styl
+++ b/source/css/_page/flink.styl
@@ -1,87 +1,87 @@
-.container
-  .flink
-    margin-bottom: 20px
-
-    .flink-list
-      overflow: auto
-      padding: 10px 10px 0
-      text-align: center
-
-      & > .flink-list-item
-        position: relative
-        float: left
-        overflow: hidden
-        margin: 15px 7px
-        width: calc(100% / 3 - 15px)
-        height: 90px
-        line-height: 17px
-        -webkit-transform: translateZ(0)
-        addBorderRadius(8)
-
-        +maxWidth1024()
-          width: calc(50% - 15px) !important
-
-        +maxWidth600()
-          width: calc(100% - 15px) !important
-
-        &:hover
-          .flink-item-icon
-            margin-left: -10px
-            width: 0
-
-        &:before
-          position: absolute
-          top: 0
-          right: 0
-          bottom: 0
-          left: 0
-          z-index: -1
-          background: var(--text-bg-hover)
-          content: ''
-          transition: transform .3s ease-out
-          transform: scale(0)
-
-        &:hover:before,
-        &:focus:before,
-        &:active:before
-          transform: scale(1)
-
-        a
-          color: var(--font-color)
-          text-decoration: none
-
-          .flink-item-icon
-            float: left
-            overflow: hidden
-            margin: 15px 10px
-            width: 60px
-            height: 60px
-            border-radius: 7px
-            transition: width .3s ease-out
-
-            img
-              width: 100%
-              height: 100%
-              transition: filter 375ms ease-in .2s, transform .3s
-              object-fit: cover
-
-          .img-alt
-            display: none
-
-    .flink-item-name
-      @extend .limit-one-line
-      padding: 16px 10px 0 0
-      height: 40px
-      font-weight: bold
-      font-size: 1.43em
-
-    .flink-item-desc
-      @extend .limit-one-line
-      padding: 16px 10px 16px 0
-      height: 50px
-      font-size: .93em
-
-    .flink-name
-      margin-bottom: 5px
-      font-weight: bold
+.container
+  .flink
+    margin-bottom: 20px
+
+    .flink-list
+      overflow: auto
+      padding: 10px 10px 0
+      text-align: center
+
+      & > .flink-list-item
+        position: relative
+        float: left
+        overflow: hidden
+        margin: 15px 7px
+        width: calc(100% / 3 - 15px)
+        height: 90px
+        line-height: 17px
+        -webkit-transform: translateZ(0)
+        addBorderRadius(8)
+
+        +maxWidth1024()
+          width: calc(50% - 15px) !important
+
+        +maxWidth600()
+          width: calc(100% - 15px) !important
+
+        &:hover
+          .flink-item-icon
+            margin-left: -10px
+            width: 0
+
+        &:before
+          position: absolute
+          top: 0
+          right: 0
+          bottom: 0
+          left: 0
+          z-index: -1
+          background: var(--text-bg-hover)
+          content: ''
+          transition: transform .3s ease-out
+          transform: scale(0)
+
+        &:hover:before,
+        &:focus:before,
+        &:active:before
+          transform: scale(1)
+
+        a
+          color: var(--font-color)
+          text-decoration: none
+
+          .flink-item-icon
+            float: left
+            overflow: hidden
+            margin: 15px 10px
+            width: 60px
+            height: 60px
+            border-radius: 7px
+            transition: width .3s ease-out
+
+            img
+              width: 100%
+              height: 100%
+              transition: filter 375ms ease-in .2s, transform .3s
+              object-fit: cover
+
+          .img-alt
+            display: none
+
+    .flink-item-name
+      @extend .limit-one-line
+      padding: 16px 10px 0 0
+      height: 40px
+      font-weight: bold
+      font-size: 1.43em
+
+    .flink-item-desc
+      @extend .limit-one-line
+      padding: 16px 10px 16px 0
+      height: 50px
+      font-size: .93em
+
+    .flink-name
+      margin-bottom: 5px
+      font-weight: bold
       font-size: 1.5em
\ No newline at end of file
diff --git a/source/css/_page/homepage.styl b/source/css/_page/homepage.styl
index 84883f7..62bb2b2 100644
--- a/source/css/_page/homepage.styl
+++ b/source/css/_page/homepage.styl
@@ -1,174 +1,174 @@
-$indexLayout = hexo-config('index_layout') || 1
-$indexEnable = hexo-config('cover.index_enable')
-
-#recent-posts
-  .recent-post-item
-    @extend .cardHover
-    position: relative
-    overflow: hidden
-    margin-bottom: 20px
-
-    if $indexLayout == 6 || ($indexLayout == 7)
-      display: inline-block
-      width: calc(100% / 2 - 8px)
-      vertical-align: top
-
-      +maxWidth768()
-        width: 100%
-
-      +minWidth2000()
-        width: calc(100% / 3 - 8px)
-
-    if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
-      display: flex
-      flex-direction: row
-      align-items: center
-      height: 16.8em
-
-      +maxWidth768()
-        flex-direction: column
-        height: auto
-
-      +minWidth2000()
-        height: 18.8em
-
-    &:hover
-      .post-bg
-        transform: scale(1.1)
-
-    &.ads-wrap
-      display: block !important
-      height: auto !important
-
-    .post_cover
-      overflow: hidden
-
-      if ($indexLayout != 5 && ($indexLayout != 7))
-        +maxWidth768()
-          width: 100%
-          height: 230px
-
-      if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
-        width: 42%
-        height: 100%
-
-        &.right
-          order: 1
-
-          +maxWidth768()
-            order: 0
-
-      if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
-        width: 100%
-
-        if ($indexLayout == 5 || ($indexLayout == 7))
-          height: 17em
-        else
-          height: 230px
-
-      if ($indexLayout == 5 || ($indexLayout == 7)) && $indexEnable
-        &:before
-          position: absolute
-          z-index: 1
-          width: 100%
-          height: 100%
-          background-color: rgba(18, 18, 18, .4)
-          content: ''
-          backdrop-filter: blur(3px)
-
-      .post-bg
-        z-index: -4
-        @extend .imgHover
-
-    & >.recent-post-info
-      +maxWidth768()
-        padding: 20px 20px 30px
-        width: 100%
-
-      if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
-        padding: 0 40px
-        width: 58%
-
-      if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
-        padding: 30px 30px 25px
-
-      if ($indexLayout == 5 || ($indexLayout == 7)) && $indexEnable
-        &:not(.no-cover)
-          position: absolute
-          top: 50%
-          z-index: 2
-          width: 100%
-          color: var(--text-highlight-color)
-          transform: translateY(-50%)
-          --text-highlight-color: rgba(255, 255, 255, 1)
-          --card-meta: rgba(255, 255, 255, .7)
-
-      &.no-cover
-        +maxWidth768()
-          padding: 30px 20px
-
-        if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
-          width: 100%
-
-        if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
-          padding: 35px 30px
-
-      & > .article-title
-        @extend .limit-more-line
-        color: var(--text-highlight-color)
-        font-size: 1.55em
-        line-height: 1.4
-        transition: all .2s ease-in-out
-        -webkit-line-clamp: 2
-
-        .sticky
-          margin-right: 10px
-          color: $sticky-color
-          transform: rotate(45deg)
-
-        +maxWidth768()
-          font-size: 1.43em
-
-        &:hover
-          color: $text-hover
-
-      & > .article-meta-wrap
-        margin: 6px 0
-        color: var(--card-meta)
-        font-size: .9em
-
-        & > .post-meta-date
-          cursor: default
-
-        i
-          margin: 0 4px 0 0
-
-        .fa-spinner
-          margin: 0
-
-        .article-meta-label
-          if hexo-config('post_meta.page.label')
-            padding-right: 4px
-          else
-            display: none
-
-        .article-meta-separator
-          margin: 0 6px
-
-        .article-meta-link
-          margin: 0 4px
-
-        if hexo-config('post_meta.page.date_format') == 'relative'
-          time
-            display: none
-
-        a
-          color: var(--card-meta)
-
-          &:hover
-            color: $text-hover
-            text-decoration: underline
-
-      & > .content
-        @extend .limit-more-line
+$indexLayout = hexo-config('index_layout') || 1
+$indexEnable = hexo-config('cover.index_enable')
+
+#recent-posts
+  .recent-post-item
+    @extend .cardHover
+    position: relative
+    overflow: hidden
+    margin-bottom: 20px
+
+    if $indexLayout == 6 || ($indexLayout == 7)
+      display: inline-block
+      width: calc(100% / 2 - 8px)
+      vertical-align: top
+
+      +maxWidth768()
+        width: 100%
+
+      +minWidth2000()
+        width: calc(100% / 3 - 8px)
+
+    if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
+      display: flex
+      flex-direction: row
+      align-items: center
+      height: 16.8em
+
+      +maxWidth768()
+        flex-direction: column
+        height: auto
+
+      +minWidth2000()
+        height: 18.8em
+
+    &:hover
+      .post-bg
+        transform: scale(1.1)
+
+    &.ads-wrap
+      display: block !important
+      height: auto !important
+
+    .post_cover
+      overflow: hidden
+
+      if ($indexLayout != 5 && ($indexLayout != 7))
+        +maxWidth768()
+          width: 100%
+          height: 230px
+
+      if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
+        width: 42%
+        height: 100%
+
+        &.right
+          order: 1
+
+          +maxWidth768()
+            order: 0
+
+      if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
+        width: 100%
+
+        if ($indexLayout == 5 || ($indexLayout == 7))
+          height: 17em
+        else
+          height: 230px
+
+      if ($indexLayout == 5 || ($indexLayout == 7)) && $indexEnable
+        &:before
+          position: absolute
+          z-index: 1
+          width: 100%
+          height: 100%
+          background-color: rgba(18, 18, 18, .4)
+          content: ''
+          backdrop-filter: blur(3px)
+
+      .post-bg
+        z-index: -4
+        @extend .imgHover
+
+    & >.recent-post-info
+      +maxWidth768()
+        padding: 20px 20px 30px
+        width: 100%
+
+      if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
+        padding: 0 40px
+        width: 58%
+
+      if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
+        padding: 30px 30px 25px
+
+      if ($indexLayout == 5 || ($indexLayout == 7)) && $indexEnable
+        &:not(.no-cover)
+          position: absolute
+          top: 50%
+          z-index: 2
+          width: 100%
+          color: var(--text-highlight-color)
+          transform: translateY(-50%)
+          --text-highlight-color: rgba(255, 255, 255, 1)
+          --card-meta: rgba(255, 255, 255, .7)
+
+      &.no-cover
+        +maxWidth768()
+          padding: 30px 20px
+
+        if $indexLayout == 1 || ($indexLayout == 2 || ($indexLayout == 3))
+          width: 100%
+
+        if $indexLayout == 4 || ($indexLayout == 5 || ($indexLayout == 6 || ($indexLayout == 7)))
+          padding: 35px 30px
+
+      & > .article-title
+        @extend .limit-more-line
+        color: var(--text-highlight-color)
+        font-size: 1.55em
+        line-height: 1.4
+        transition: all .2s ease-in-out
+        -webkit-line-clamp: 2
+
+        .sticky
+          margin-right: 10px
+          color: $sticky-color
+          transform: rotate(45deg)
+
+        +maxWidth768()
+          font-size: 1.43em
+
+        &:hover
+          color: $text-hover
+
+      & > .article-meta-wrap
+        margin: 6px 0
+        color: var(--card-meta)
+        font-size: .9em
+
+        & > .post-meta-date
+          cursor: default
+
+        i
+          margin: 0 4px 0 0
+
+        .fa-spinner
+          margin: 0
+
+        .article-meta-label
+          if hexo-config('post_meta.page.label')
+            padding-right: 4px
+          else
+            display: none
+
+        .article-meta-separator
+          margin: 0 6px
+
+        .article-meta-link
+          margin: 0 4px
+
+        if hexo-config('post_meta.page.date_format') == 'relative'
+          time
+            display: none
+
+        a
+          color: var(--card-meta)
+
+          &:hover
+            color: $text-hover
+            text-decoration: underline
+
+      & > .content
+        @extend .limit-more-line
         -webkit-line-clamp: 2
\ No newline at end of file
diff --git a/source/css/_page/shuoshuo.styl b/source/css/_page/shuoshuo.styl
index 852da03..7370739 100644
--- a/source/css/_page/shuoshuo.styl
+++ b/source/css/_page/shuoshuo.styl
@@ -1,78 +1,78 @@
-#article-container
-  .shuoshuo-item
-    @extend .cardHover
-    margin-bottom: 20px
-    padding: 35px 30px 30px
-
-    +maxWidth768()
-      padding: 25px 20px 20px
-
-  .shuoshuo-item-header
-    display: flex
-    align-items: center
-    cursor: default
-
-  .shuoshuo-avatar
-    overflow: hidden
-    width: 40px
-    height: 40px
-    border-radius: 40px
-
-    img
-      margin: 0
-      width: 100%
-      height: 100%
-
-  .shuoshuo-info
-    margin-left: 10px
-    line-height: 1.5
-
-  .shuoshuo-date
-    color: #858585
-    font-size: .8em
-
-  .shuoshuo-content
-    padding: 15px 0 10px
-
-    & > *:last-child
-      margin-bottom: 0
-
-  .shuoshuo-footer
-    display: flex
-    align-items: center
-
-    &.flex-between
-      justify-content: space-between
-
-    &.flex-end
-      justify-content: flex-end
-
-    .shuoshuo-tag
-      display: inline-block
-      margin-right: 8px
-      padding: 0 8px
-      width: fit-content
-      border: 1px solid $light-blue
-      border-radius: 12px
-      color: $light-blue
-      font-size: .85em
-      cursor: default
-      transition: all .2s ease-in-out
-
-      &:hover
-        background: $light-blue
-        color: var(--white)
-
-    .shuoshuo-comment-btn
-      padding: 2px
-      color: #90a4ae
-      cursor: pointer
-
-      &:hover
-        color: $light-blue
-
-  .shuoshuo-comment
-    padding-top: 10px
-
-    &.no-comment
-      display: none
+#article-container
+  .shuoshuo-item
+    @extend .cardHover
+    margin-bottom: 20px
+    padding: 35px 30px 30px
+
+    +maxWidth768()
+      padding: 25px 20px 20px
+
+  .shuoshuo-item-header
+    display: flex
+    align-items: center
+    cursor: default
+
+  .shuoshuo-avatar
+    overflow: hidden
+    width: 40px
+    height: 40px
+    border-radius: 40px
+
+    img
+      margin: 0
+      width: 100%
+      height: 100%
+
+  .shuoshuo-info
+    margin-left: 10px
+    line-height: 1.5
+
+  .shuoshuo-date
+    color: #858585
+    font-size: .8em
+
+  .shuoshuo-content
+    padding: 15px 0 10px
+
+    & > *:last-child
+      margin-bottom: 0
+
+  .shuoshuo-footer
+    display: flex
+    align-items: center
+
+    &.flex-between
+      justify-content: space-between
+
+    &.flex-end
+      justify-content: flex-end
+
+    .shuoshuo-tag
+      display: inline-block
+      margin-right: 8px
+      padding: 0 8px
+      width: fit-content
+      border: 1px solid $light-blue
+      border-radius: 12px
+      color: $light-blue
+      font-size: .85em
+      cursor: default
+      transition: all .2s ease-in-out
+
+      &:hover
+        background: $light-blue
+        color: var(--white)
+
+    .shuoshuo-comment-btn
+      padding: 2px
+      color: #90a4ae
+      cursor: pointer
+
+      &:hover
+        color: $light-blue
+
+  .shuoshuo-comment
+    padding-top: 10px
+
+    &.no-comment
+      display: none
diff --git a/source/css/_page/tags.styl b/source/css/_page/tags.styl
index cfd2557..fb868d2 100644
--- a/source/css/_page/tags.styl
+++ b/source/css/_page/tags.styl
@@ -1,27 +1,27 @@
-.tag-cloud
-  &-list
-    a
-      display: inline-block
-      margin: 2px
-      padding: 2px 7px
-      line-height: 1.7
-      transition: all .3s
-      addBorderRadius(5)
-
-      &:hover
-        background: var(--btn-bg) !important
-        box-shadow: 2px 2px 6px rgba(0, 0, 0, .2)
-        color: var(--btn-color) !important
-
-      +maxWidth768()
-        zoom: .85
-
-  &-title
-    font-size: 2.57em
-
-    +maxWidth768()
-      font-size: 2em
-
-.page-title
-  & + .tag-cloud-list
-    text-align: left
+.tag-cloud
+  &-list
+    a
+      display: inline-block
+      margin: 2px
+      padding: 2px 7px
+      line-height: 1.7
+      transition: all .3s
+      addBorderRadius(5)
+
+      &:hover
+        background: var(--btn-bg) !important
+        box-shadow: 2px 2px 6px rgba(0, 0, 0, .2)
+        color: var(--btn-color) !important
+
+      +maxWidth768()
+        zoom: .85
+
+  &-title
+    font-size: 2.57em
+
+    +maxWidth768()
+      font-size: 2em
+
+.page-title
+  & + .tag-cloud-list
+    text-align: left
diff --git a/source/css/_search/algolia.styl b/source/css/_search/algolia.styl
index ae7553f..3c27f7f 100644
--- a/source/css/_search/algolia.styl
+++ b/source/css/_search/algolia.styl
@@ -1,93 +1,93 @@
-#algolia-search
-  .search-dialog
-    .ais-SearchBox
-      input
-        padding: 5px 14px
-        width: 100%
-        outline: none
-        border: 2px solid $search-color
-        border-radius: 40px
-        background: var(--search-bg)
-        color: var(--search-input-color)
-
-      .ais-SearchBox-loadingIndicator
-        position: absolute
-        top: 18px
-        left: 67px
-
-    .ais-Hits-list
-      margin: 0
-      padding: 0
-      @extend .list-beauty
-
-      a
-        color: var(--search-a-color)
-
-        &:hover
-          color: $search-color
-
-      mark
-        background: transparent
-        color: $search-keyword-highlight
-        font-weight: bold
-
-    .algolia-hits-item-title
-      font-weight: 600
-
-    .algolia-hit-item-content
-      margin: 0 0 8px
-      word-break: break-word
-
-    .ais-Pagination
-      margin: 15px 0 0
-      padding: 0
-      text-align: center
-
-      .ais-Pagination-list
-        margin: 0
-        padding: 0
-        list-style: none
-
-      .ais-Pagination-item
-        display: inline
-        margin: 0 4px
-        padding: 0
-
-        .ais-Pagination-link
-          display: inline-block
-          min-width: 24px
-          height: 24px
-          text-align: center
-          line-height: 24px
-          addBorderRadius()
-
-      .ais-Pagination-item--selected
-        a
-          background: $theme-paginator-color
-          color: #eee
-          cursor: default
-
-      .ais-Pagination-item--disabled
-        visibility: hidden
-
-    #algolia-hits
-      > div
-        overflow-y: overlay
-        margin: 0 -20px
-        padding: 0 22px
-        max-height: calc(80vh - 220px)
-
-        +maxWidth768()
-          max-height: none
-          height: calc(var(--search-height) - 235px)
-
-    #algolia-info
-      div
-        display: inline
-
-      .algolia-poweredBy
-        float: right
-        vertical-align: text-top
-
-        svg
+#algolia-search
+  .search-dialog
+    .ais-SearchBox
+      input
+        padding: 5px 14px
+        width: 100%
+        outline: none
+        border: 2px solid $search-color
+        border-radius: 40px
+        background: var(--search-bg)
+        color: var(--search-input-color)
+
+      .ais-SearchBox-loadingIndicator
+        position: absolute
+        top: 18px
+        left: 67px
+
+    .ais-Hits-list
+      margin: 0
+      padding: 0
+      @extend .list-beauty
+
+      a
+        color: var(--search-a-color)
+
+        &:hover
+          color: $search-color
+
+      mark
+        background: transparent
+        color: $search-keyword-highlight
+        font-weight: bold
+
+    .algolia-hits-item-title
+      font-weight: 600
+
+    .algolia-hit-item-content
+      margin: 0 0 8px
+      word-break: break-word
+
+    .ais-Pagination
+      margin: 15px 0 0
+      padding: 0
+      text-align: center
+
+      .ais-Pagination-list
+        margin: 0
+        padding: 0
+        list-style: none
+
+      .ais-Pagination-item
+        display: inline
+        margin: 0 4px
+        padding: 0
+
+        .ais-Pagination-link
+          display: inline-block
+          min-width: 24px
+          height: 24px
+          text-align: center
+          line-height: 24px
+          addBorderRadius()
+
+      .ais-Pagination-item--selected
+        a
+          background: $theme-paginator-color
+          color: #eee
+          cursor: default
+
+      .ais-Pagination-item--disabled
+        visibility: hidden
+
+    #algolia-hits
+      > div
+        overflow-y: overlay
+        margin: 0 -20px
+        padding: 0 22px
+        max-height: calc(80vh - 220px)
+
+        +maxWidth768()
+          max-height: none
+          height: calc(var(--search-height) - 235px)
+
+    #algolia-info
+      div
+        display: inline
+
+      .algolia-poweredBy
+        float: right
+        vertical-align: text-top
+
+        svg
           height: 1.1em
\ No newline at end of file
diff --git a/source/css/_search/index.styl b/source/css/_search/index.styl
index c889eb6..9dba10e 100644
--- a/source/css/_search/index.styl
+++ b/source/css/_search/index.styl
@@ -1,56 +1,56 @@
-.search-dialog
-  position: fixed
-  top: 10%
-  left: 50%
-  z-index: 1001
-  display: none
-  margin-left: -300px
-  padding: 20px
-  width: 600px
-  background: var(--search-bg)
-  --search-height: 100vh
-  addBorderRadius(8)
-
-  +maxWidth768()
-    top: 0
-    left: 0
-    margin: 0
-    width: 100%
-    height: 100%
-    border-radius: 0
-
-  .search-nav
-    margin: 0 0 14px
-    color: $search-color
-    font-size: 1.4em
-    line-height: 1
-
-    .search-dialog-title
-      margin-right: 10px
-
-    .search-close-button
-      float: right
-      color: $grey
-      transition: color .2s ease-in-out
-
-      &:hover
-        color: $search-color
-  
-  hr
-    margin: 15px auto
-    @extend .custom-hr
-
-#search-mask
-  position: fixed
-  top: 0
-  right: 0
-  bottom: 0
-  left: 0
-  z-index: 1000
-  display: none
-  background: rgba($dark-black, .6)
-
-if hexo-config('search.use') == 'algolia_search'
-  @require 'algolia'
-else if hexo-config('search.use') == 'local_search'
+.search-dialog
+  position: fixed
+  top: 10%
+  left: 50%
+  z-index: 1001
+  display: none
+  margin-left: -300px
+  padding: 20px
+  width: 600px
+  background: var(--search-bg)
+  --search-height: 100vh
+  addBorderRadius(8)
+
+  +maxWidth768()
+    top: 0
+    left: 0
+    margin: 0
+    width: 100%
+    height: 100%
+    border-radius: 0
+
+  .search-nav
+    margin: 0 0 14px
+    color: $search-color
+    font-size: 1.4em
+    line-height: 1
+
+    .search-dialog-title
+      margin-right: 10px
+
+    .search-close-button
+      float: right
+      color: $grey
+      transition: color .2s ease-in-out
+
+      &:hover
+        color: $search-color
+  
+  hr
+    margin: 15px auto
+    @extend .custom-hr
+
+#search-mask
+  position: fixed
+  top: 0
+  right: 0
+  bottom: 0
+  left: 0
+  z-index: 1000
+  display: none
+  background: rgba($dark-black, .6)
+
+if hexo-config('search.use') == 'algolia_search'
+  @require 'algolia'
+else if hexo-config('search.use') == 'local_search'
   @require 'local-search'
\ No newline at end of file
diff --git a/source/css/_search/local-search.styl b/source/css/_search/local-search.styl
index 98139b3..3e82c15 100644
--- a/source/css/_search/local-search.styl
+++ b/source/css/_search/local-search.styl
@@ -1,57 +1,57 @@
-#local-search
-  .search-dialog
-    .local-search-box
-      margin: 0 auto
-      max-width: 100%
-      width: 100%
-
-      input
-        padding: 5px 14px
-        width: 100%
-        outline: none
-        border: 2px solid $search-color
-        border-radius: 40px
-        background: var(--search-bg)
-        color: var(--search-input-color)
-        -webkit-appearance: none
-
-    .search-wrap
-      display: none
-
-    .local-search-hit-item
-      margin-left: 24px
-      padding-left: 3px
-      line-height: 1.8
-
-      &::marker
-        color: $search-color
-        font-weight: bold
-        font-style: italic
-
-      a
-        color: var(--search-a-color)
-
-        &:hover
-          color: $search-color
-
-      .search-result-title
-        font-weight: 600
-
-      .search-result
-        margin: 0 0 8px
-        word-break: break-all
-        font-size: .9em
-
-    .search-result-list
-      overflow-y: overlay
-      margin: 0 -20px
-      padding: 0 22px
-      max-height: calc(80vh - 180px)
-
-      +maxWidth768()
-        max-height: calc(var(--search-height) - 190px) !important
-
-.search-keyword
-  background: transparent
-  color: $search-keyword-highlight
+#local-search
+  .search-dialog
+    .local-search-box
+      margin: 0 auto
+      max-width: 100%
+      width: 100%
+
+      input
+        padding: 5px 14px
+        width: 100%
+        outline: none
+        border: 2px solid $search-color
+        border-radius: 40px
+        background: var(--search-bg)
+        color: var(--search-input-color)
+        -webkit-appearance: none
+
+    .search-wrap
+      display: none
+
+    .local-search-hit-item
+      margin-left: 24px
+      padding-left: 3px
+      line-height: 1.8
+
+      &::marker
+        color: $search-color
+        font-weight: bold
+        font-style: italic
+
+      a
+        color: var(--search-a-color)
+
+        &:hover
+          color: $search-color
+
+      .search-result-title
+        font-weight: 600
+
+      .search-result
+        margin: 0 0 8px
+        word-break: break-all
+        font-size: .9em
+
+    .search-result-list
+      overflow-y: overlay
+      margin: 0 -20px
+      padding: 0 22px
+      max-height: calc(80vh - 180px)
+
+      +maxWidth768()
+        max-height: calc(var(--search-height) - 190px) !important
+
+.search-keyword
+  background: transparent
+  color: $search-keyword-highlight
   font-weight: 600
\ No newline at end of file
diff --git a/source/css/_tags/button.styl b/source/css/_tags/button.styl
index ffad827..afb1b66 100644
--- a/source/css/_tags/button.styl
+++ b/source/css/_tags/button.styl
@@ -1,56 +1,56 @@
-.container
-  .btn-center
-    margin: 0 0 20px
-    text-align: center
-
-  .btn-beautify
-    display: inline-block
-    margin: 0 4px 6px
-    padding: 0 15px
-    background-color: var(--btn-beautify-color, $btn-default-color)
-    color: $btn-color
-    line-height: 2
-    addBorderRadius()
-
-    for $type in $color-types
-      &.{$type}
-        --btn-beautify-color: lookup('$tagsP-' + $type + '-color')
-
-    &:hover
-      background-color: var(--btn-hover-color)
-
-    i + span
-      margin-left: 6px
-
-    &:not(.block) + .btn-beautify:not(.block)
-      margin: 0 4px 20px
-
-    &.block
-      display: block
-      margin: 0 0 20px
-      width: fit-content
-      width: -moz-fit-content
-
-      &.center
-        margin: 0 auto 20px
-
-      &.right
-        margin: 0 0 20px auto
-
-    &.larger
-      padding: 6px 15px
-
-    &:hover
-      text-decoration: none
-
-    &.outline
-      border: 1px solid transparent
-      border-color: var(--btn-beautify-color, $btn-default-color)
-      background-color: transparent
-      color: var(--btn-beautify-color, $btn-default-color)
-
-      &:hover
-        background-color: var(--btn-beautify-color, $btn-default-color)
-
-      &:hover
-        color: white !important
+.container
+  .btn-center
+    margin: 0 0 20px
+    text-align: center
+
+  .btn-beautify
+    display: inline-block
+    margin: 0 4px 6px
+    padding: 0 15px
+    background-color: var(--btn-beautify-color, $btn-default-color)
+    color: $btn-color
+    line-height: 2
+    addBorderRadius()
+
+    for $type in $color-types
+      &.{$type}
+        --btn-beautify-color: lookup('$tagsP-' + $type + '-color')
+
+    &:hover
+      background-color: var(--btn-hover-color)
+
+    i + span
+      margin-left: 6px
+
+    &:not(.block) + .btn-beautify:not(.block)
+      margin: 0 4px 20px
+
+    &.block
+      display: block
+      margin: 0 0 20px
+      width: fit-content
+      width: -moz-fit-content
+
+      &.center
+        margin: 0 auto 20px
+
+      &.right
+        margin: 0 0 20px auto
+
+    &.larger
+      padding: 6px 15px
+
+    &:hover
+      text-decoration: none
+
+    &.outline
+      border: 1px solid transparent
+      border-color: var(--btn-beautify-color, $btn-default-color)
+      background-color: transparent
+      color: var(--btn-beautify-color, $btn-default-color)
+
+      &:hover
+        background-color: var(--btn-beautify-color, $btn-default-color)
+
+      &:hover
+        color: white !important
diff --git a/source/css/_tags/gallery.styl b/source/css/_tags/gallery.styl
index 7014547..719a4e5 100644
--- a/source/css/_tags/gallery.styl
+++ b/source/css/_tags/gallery.styl
@@ -1,218 +1,218 @@
-.container
-  figure.gallery-group
-    position: relative
-    float: left
-    overflow: hidden
-    margin: 6px 4px
-    width: calc(50% - 8px)
-    height: 250px
-    border-radius: 10px
-    background: $dark-black
-    -webkit-transform: translate3d(0, 0, 0)
-
-    +maxWidth600()
-      width: calc(100% - 8px)
-
-    +minWidth1024()
-      width: calc(100% / 3 - 8px)
-
-    &:hover
-      img
-        opacity: .4
-        transform: translate3d(0, 0, 0)
-
-      .gallery-group-name::after
-        transform: translate3d(0, 0, 0)
-
-      p
-        opacity: 1
-        transform: translate3d(0, 0, 0)
-
-    img
-      position: relative
-      margin: 0
-      max-width: none
-      width: calc(100% + 20px)
-      height: 250px
-      backface-visibility: hidden
-      opacity: .8
-      transition: all .3s, filter 375ms ease-in .2s
-      transform: translate3d(-10px, 0, 0)
-      object-fit: cover
-
-    figcaption
-      position: absolute
-      top: 0
-      left: 0
-      padding: 30px
-      width: 100%
-      height: 100%
-      color: $gallery-color
-      text-transform: uppercase
-      backface-visibility: hidden
-
-      & > a
-        position: absolute
-        top: 0
-        right: 0
-        bottom: 0
-        left: 0
-        z-index: 1000
-        opacity: 0
-
-    p
-      @extend .limit-more-line
-      margin: 0
-      padding: 8px 0 0
-      letter-spacing: 1px
-      font-size: 1.1em
-      line-height: 1.5
-      opacity: 0
-      transition: opacity .35s, transform .35s
-      transform: translate3d(100%, 0, 0)
-      -webkit-line-clamp: 4
-
-    .gallery-group-name
-      @extend .limit-more-line
-      position: relative
-      margin: 0
-      padding: 8px 0
-      font-weight: bold
-      font-size: 1.65em
-      line-height: 1.5
-      -webkit-line-clamp: 2
-
-      &:after
-        position: absolute
-        bottom: 0
-        left: 0
-        width: 100%
-        height: 2px
-        background: $gallery-color
-        content: ''
-        transition: transform .35s
-        transform: translate3d(-100%, 0, 0)
-
-  .gallery-group-main
-    overflow: auto
-    padding: 0 0 16px
-
-  .gallery-container
-    margin: 0 0 20px
-    text-align: center
-    opacity: 0
-
-    &.loaded
-      opacity: 1
-
-    img
-      display: initial
-      margin: 0
-      width: 100%
-      height: 100%
-
-    .gallery-data
-      display: none
-
-    button
-      margin-top: 25px
-      padding: 8px 14px
-      background: var(--btn-bg)
-      color: var(--btn-color)
-      font-weight: bold
-      font-size: 1.1em
-      transition: all .3s
-      addBorderRadius(5)
-
-      &:hover
-        background: var(--btn-hover-color)
-
-        i
-          margin-left: 8px
-
-      i
-        margin-left: 4px
-        transition: all .3s
-
-  .loading-container
-    display: inline-block
-    overflow: hidden
-    width: 154px
-    height: 154px
-
-    .loading-item
-      position: relative
-      width: 100%
-      height: 100%
-      backface-visibility: hidden
-      transform: translateZ(0) scale(1)
-      transform-origin: 0 0
-
-      div
-        position: absolute
-        width: 30.8px
-        height: 30.8px
-        border-radius: 50%
-        background: #e15b64
-        transform: translate(61.6px, 61.6px) scale(1)
-        animation: loading-ball 1.92s infinite cubic-bezier(0, .5, .5, 1)
-
-        &:nth-child(1)
-          background: #f47e60
-          transform: translate(113.96px, 61.6px) scale(1)
-          animation: loading-ball-r .48s infinite cubic-bezier(0, .5, .5, 1), loading-ball-c 1.92s infinite step-start
-
-        &:nth-child(2)
-          background: #e15b64
-          animation-delay: -.48s
-
-        &:nth-child(3)
-          background: #f47e60
-          animation-delay: -.96s
-
-        &:nth-child(4)
-          background: #f8b26a
-          animation-delay: -1.44s
-
-        &:nth-child(5)
-          background: #abbd81
-          animation-delay: -1.92s
-
-@keyframes loading-ball
-  0%
-    transform: translate(9.24px, 61.6px) scale(0)
-
-  25%
-    transform: translate(9.24px, 61.6px) scale(0)
-
-  50%
-    transform: translate(9.24px, 61.6px) scale(1)
-
-  75%
-    transform: translate(61.6px, 61.6px) scale(1)
-
-  100%
-    transform: translate(113.96px, 61.6px) scale(1)
-
-@keyframes loading-ball-r
-  0%
-    transform: translate(113.96px, 61.6px) scale(1)
-
-  100%
-    transform: translate(113.96px, 61.6px) scale(0)
-
-@keyframes loading-ball-c
-  0%
-    background: #e15b64
-
-  25%
-    background: #abbd81
-
-  50%
-    background: #f8b26a
-
-  75%
-    background: #f47e60
-
-  100%
-    background: #e15b64
+.container
+  figure.gallery-group
+    position: relative
+    float: left
+    overflow: hidden
+    margin: 6px 4px
+    width: calc(50% - 8px)
+    height: 250px
+    border-radius: 10px
+    background: $dark-black
+    -webkit-transform: translate3d(0, 0, 0)
+
+    +maxWidth600()
+      width: calc(100% - 8px)
+
+    +minWidth1024()
+      width: calc(100% / 3 - 8px)
+
+    &:hover
+      img
+        opacity: .4
+        transform: translate3d(0, 0, 0)
+
+      .gallery-group-name::after
+        transform: translate3d(0, 0, 0)
+
+      p
+        opacity: 1
+        transform: translate3d(0, 0, 0)
+
+    img
+      position: relative
+      margin: 0
+      max-width: none
+      width: calc(100% + 20px)
+      height: 250px
+      backface-visibility: hidden
+      opacity: .8
+      transition: all .3s, filter 375ms ease-in .2s
+      transform: translate3d(-10px, 0, 0)
+      object-fit: cover
+
+    figcaption
+      position: absolute
+      top: 0
+      left: 0
+      padding: 30px
+      width: 100%
+      height: 100%
+      color: $gallery-color
+      text-transform: uppercase
+      backface-visibility: hidden
+
+      & > a
+        position: absolute
+        top: 0
+        right: 0
+        bottom: 0
+        left: 0
+        z-index: 1000
+        opacity: 0
+
+    p
+      @extend .limit-more-line
+      margin: 0
+      padding: 8px 0 0
+      letter-spacing: 1px
+      font-size: 1.1em
+      line-height: 1.5
+      opacity: 0
+      transition: opacity .35s, transform .35s
+      transform: translate3d(100%, 0, 0)
+      -webkit-line-clamp: 4
+
+    .gallery-group-name
+      @extend .limit-more-line
+      position: relative
+      margin: 0
+      padding: 8px 0
+      font-weight: bold
+      font-size: 1.65em
+      line-height: 1.5
+      -webkit-line-clamp: 2
+
+      &:after
+        position: absolute
+        bottom: 0
+        left: 0
+        width: 100%
+        height: 2px
+        background: $gallery-color
+        content: ''
+        transition: transform .35s
+        transform: translate3d(-100%, 0, 0)
+
+  .gallery-group-main
+    overflow: auto
+    padding: 0 0 16px
+
+  .gallery-container
+    margin: 0 0 20px
+    text-align: center
+    opacity: 0
+
+    &.loaded
+      opacity: 1
+
+    img
+      display: initial
+      margin: 0
+      width: 100%
+      height: 100%
+
+    .gallery-data
+      display: none
+
+    button
+      margin-top: 25px
+      padding: 8px 14px
+      background: var(--btn-bg)
+      color: var(--btn-color)
+      font-weight: bold
+      font-size: 1.1em
+      transition: all .3s
+      addBorderRadius(5)
+
+      &:hover
+        background: var(--btn-hover-color)
+
+        i
+          margin-left: 8px
+
+      i
+        margin-left: 4px
+        transition: all .3s
+
+  .loading-container
+    display: inline-block
+    overflow: hidden
+    width: 154px
+    height: 154px
+
+    .loading-item
+      position: relative
+      width: 100%
+      height: 100%
+      backface-visibility: hidden
+      transform: translateZ(0) scale(1)
+      transform-origin: 0 0
+
+      div
+        position: absolute
+        width: 30.8px
+        height: 30.8px
+        border-radius: 50%
+        background: #e15b64
+        transform: translate(61.6px, 61.6px) scale(1)
+        animation: loading-ball 1.92s infinite cubic-bezier(0, .5, .5, 1)
+
+        &:nth-child(1)
+          background: #f47e60
+          transform: translate(113.96px, 61.6px) scale(1)
+          animation: loading-ball-r .48s infinite cubic-bezier(0, .5, .5, 1), loading-ball-c 1.92s infinite step-start
+
+        &:nth-child(2)
+          background: #e15b64
+          animation-delay: -.48s
+
+        &:nth-child(3)
+          background: #f47e60
+          animation-delay: -.96s
+
+        &:nth-child(4)
+          background: #f8b26a
+          animation-delay: -1.44s
+
+        &:nth-child(5)
+          background: #abbd81
+          animation-delay: -1.92s
+
+@keyframes loading-ball
+  0%
+    transform: translate(9.24px, 61.6px) scale(0)
+
+  25%
+    transform: translate(9.24px, 61.6px) scale(0)
+
+  50%
+    transform: translate(9.24px, 61.6px) scale(1)
+
+  75%
+    transform: translate(61.6px, 61.6px) scale(1)
+
+  100%
+    transform: translate(113.96px, 61.6px) scale(1)
+
+@keyframes loading-ball-r
+  0%
+    transform: translate(113.96px, 61.6px) scale(1)
+
+  100%
+    transform: translate(113.96px, 61.6px) scale(0)
+
+@keyframes loading-ball-c
+  0%
+    background: #e15b64
+
+  25%
+    background: #abbd81
+
+  50%
+    background: #f8b26a
+
+  75%
+    background: #f47e60
+
+  100%
+    background: #e15b64
diff --git a/source/css/_tags/hexo.styl b/source/css/_tags/hexo.styl
index 08cdee7..44e4ad8 100644
--- a/source/css/_tags/hexo.styl
+++ b/source/css/_tags/hexo.styl
@@ -1,30 +1,30 @@
-// pullquote
-blockquote
-  &.pullquote
-    position: relative
-    max-width: 45%
-    font-size: 110%
-
-    &.left
-      float: left
-      margin: 1em .5em 0 0
-
-    &.right
-      float: right
-      margin: 1em 0 0 .5em
-
-// hexo tag video
-.video-container
-  position: relative
-  overflow: hidden
-  margin-bottom: 16px
-  padding-top: 56.25%
-  height: 0
-
-  iframe
-    position: absolute
-    top: 0
-    left: 0
-    margin-top: 0
-    width: 100%
-    height: 100%
+// pullquote
+blockquote
+  &.pullquote
+    position: relative
+    max-width: 45%
+    font-size: 110%
+
+    &.left
+      float: left
+      margin: 1em .5em 0 0
+
+    &.right
+      float: right
+      margin: 1em 0 0 .5em
+
+// hexo tag video
+.video-container
+  position: relative
+  overflow: hidden
+  margin-bottom: 16px
+  padding-top: 56.25%
+  height: 0
+
+  iframe
+    position: absolute
+    top: 0
+    left: 0
+    margin-top: 0
+    width: 100%
+    height: 100%
diff --git a/source/css/_tags/hide.styl b/source/css/_tags/hide.styl
index 35cf3a0..dbc9bd3 100644
--- a/source/css/_tags/hide.styl
+++ b/source/css/_tags/hide.styl
@@ -1,48 +1,48 @@
-// tag-hide
-.hide-inline,
-.hide-block
-  & > .hide-button
-    display: inline-block
-    padding: 5px 18px
-    background: $tag-hide-bg
-    color: var(--white)
-    addBorderRadius()
-
-    &:hover
-      background-color: var(--btn-hover-color)
-
-    &.open
-      display: none
-
-      & + div
-        display: block
-
-      & + span
-        display: inline
-
-  & > .hide-content
-    display: none
-
-.hide-inline
-  & > .hide-button
-    margin: 0 6px
-
-  & > .hide-content
-    margin: 0 6px
-
-.hide-block
-  margin: 0 0 16px
-
-.toggle
-  margin-bottom: 20px
-  border: 1px solid $tag-hide-toggle-bg
-  addBorderRadius(5, true)
-
-  & > .toggle-button
-    padding: 6px 15px
-    background: $tag-hide-toggle-bg
-    color: #1F2D3D
-    cursor: pointer
-
-  & > .toggle-content
-    margin: 30px 24px
+// tag-hide
+.hide-inline,
+.hide-block
+  & > .hide-button
+    display: inline-block
+    padding: 5px 18px
+    background: $tag-hide-bg
+    color: var(--white)
+    addBorderRadius()
+
+    &:hover
+      background-color: var(--btn-hover-color)
+
+    &.open
+      display: none
+
+      & + div
+        display: block
+
+      & + span
+        display: inline
+
+  & > .hide-content
+    display: none
+
+.hide-inline
+  & > .hide-button
+    margin: 0 6px
+
+  & > .hide-content
+    margin: 0 6px
+
+.hide-block
+  margin: 0 0 16px
+
+.toggle
+  margin-bottom: 20px
+  border: 1px solid $tag-hide-toggle-bg
+  addBorderRadius(5, true)
+
+  & > .toggle-button
+    padding: 6px 15px
+    background: $tag-hide-toggle-bg
+    color: #1F2D3D
+    cursor: pointer
+
+  & > .toggle-content
+    margin: 30px 24px
diff --git a/source/css/_tags/inlineImg.styl b/source/css/_tags/inlineImg.styl
index 6585f4a..a13ade0 100644
--- a/source/css/_tags/inlineImg.styl
+++ b/source/css/_tags/inlineImg.styl
@@ -1,6 +1,6 @@
-.container
-  .inline-img
-    display: inline
-    margin: 0 3px
-    height: 1.1em
+.container
+  .inline-img
+    display: inline
+    margin: 0 3px
+    height: 1.1em
     vertical-align: text-bottom
\ No newline at end of file
diff --git a/source/css/_tags/label.styl b/source/css/_tags/label.styl
index 5b08c50..e7ca01c 100644
--- a/source/css/_tags/label.styl
+++ b/source/css/_tags/label.styl
@@ -1,11 +1,11 @@
-.hl-label
-  padding: 2px 4px
-  color: $btn-color
-  addBorderRadius(3)
-
-  &.default
-    background-color: $btn-default-color
-
-  for $type in $color-types
-    &.{$type}
-      background-color: lookup('$tagsP-' + $type + '-color')
+.hl-label
+  padding: 2px 4px
+  color: $btn-color
+  addBorderRadius(3)
+
+  &.default
+    background-color: $btn-default-color
+
+  for $type in $color-types
+    &.{$type}
+      background-color: lookup('$tagsP-' + $type + '-color')
diff --git a/source/css/_tags/note.styl b/source/css/_tags/note.styl
index 041603f..4cc6f2b 100644
--- a/source/css/_tags/note.styl
+++ b/source/css/_tags/note.styl
@@ -1,124 +1,124 @@
-.note
-  $note-icons = hexo-config('note.icons')
-  position: relative
-  margin: 0 0 20px
-  padding: 15px
-
-  if hexo-config('note.border_radius') is a 'unit'
-    border-radius: unit(hexo-config('note.border_radius'), px)
-
-  &.icon-padding
-    padding-left: 3em
-
-  & > .note-icon
-    position: absolute
-    top: calc(50% - .5em)
-    left: .8em
-    font-size: larger
-
-  for $type in $color-types
-    &.{$type}
-      &:not(.disabled)
-        border-left-color: lookup('$tagsP-' + $type + '-color') !important
-
-        &.modern
-          border-left-color: transparent !important
-          color: lookup('$tagsP-' + $type + '-color')
-
-        &:not(.simple)
-          background: lighten(lookup('$tagsP-' + $type + '-color'), 85%) !important
-
-      & > .note-icon
-        color: lookup('$tagsP-' + $type + '-color')
-
-  &.simple
-    border: 1px solid #EEEEEE
-    border-left-width: 5px
-
-  &.modern
-    border: 1px solid transparent !important
-    background-color: #f5f5f5
-    color: $font-black
-
-  &.flat
-    border: initial
-    border-left: 5px solid #EEEEEE
-    background-color: lighten(#EEEEEE, 65%)
-    color: $font-black
-
-  h2,
-  h3,
-  h4,
-  h5,
-  h6
-    if $note-icons
-      margin-top: 3px
-    else
-      margin-top: 0
-
-    margin-bottom: 0
-    padding-top: 0 !important
-    border-bottom: initial
-
-  p,
-  ul,
-  ol,
-  table,
-  pre,
-  blockquote,
-  img
-    &:first-child
-      margin-top: 0 !important
-
-    &:last-child
-      margin-bottom: 0 !important
-
-  .img-alt
-    margin: 5px 0 10px
-
-  if $note-icons
-    &:not(.no-icon)
-      padding-left: 3em
-
-      &::before
-        position: absolute
-        top: calc(50% - .95em)
-        left: .8em
-        font-size: larger
-        @extend .fontawesomeIcon
-
-  for $type in $note-types
-    &.{$type}
-      &.flat
-        background: lookup('$note-' + $type + '-bg')
-
-      &.modern
-        border-color: lookup('$note-modern-' + $type + '-border')
-        background: lookup('$note-modern-' + $type + '-bg')
-        color: lookup('$note-modern-' + $type + '-text')
-
-        a
-          &:not(.btn)
-            color: lookup('$note-modern-' + $type + '-text')
-
-            &:hover
-              color: lookup('$note-modern-' + $type + '-hover')
-
-      &:not(.modern)
-        border-left-color: lookup('$note-' + $type + '-border')
-
-        h2,
-        h3,
-        h4,
-        h5,
-        h6
-          color: lookup('$note-' + $type + '-text')
-
-      if $note-icons
-        &:not(.no-icon)
-          &::before
-            content: lookup('$note-' + $type + '-icon')
-
-          &:not(.modern)
-            &::before
-              color: lookup('$note-' + $type + '-text')
+.note
+  $note-icons = hexo-config('note.icons')
+  position: relative
+  margin: 0 0 20px
+  padding: 15px
+
+  if hexo-config('note.border_radius') is a 'unit'
+    border-radius: unit(hexo-config('note.border_radius'), px)
+
+  &.icon-padding
+    padding-left: 3em
+
+  & > .note-icon
+    position: absolute
+    top: calc(50% - .5em)
+    left: .8em
+    font-size: larger
+
+  for $type in $color-types
+    &.{$type}
+      &:not(.disabled)
+        border-left-color: lookup('$tagsP-' + $type + '-color') !important
+
+        &.modern
+          border-left-color: transparent !important
+          color: lookup('$tagsP-' + $type + '-color')
+
+        &:not(.simple)
+          background: lighten(lookup('$tagsP-' + $type + '-color'), 85%) !important
+
+      & > .note-icon
+        color: lookup('$tagsP-' + $type + '-color')
+
+  &.simple
+    border: 1px solid #EEEEEE
+    border-left-width: 5px
+
+  &.modern
+    border: 1px solid transparent !important
+    background-color: #f5f5f5
+    color: $font-black
+
+  &.flat
+    border: initial
+    border-left: 5px solid #EEEEEE
+    background-color: lighten(#EEEEEE, 65%)
+    color: $font-black
+
+  h2,
+  h3,
+  h4,
+  h5,
+  h6
+    if $note-icons
+      margin-top: 3px
+    else
+      margin-top: 0
+
+    margin-bottom: 0
+    padding-top: 0 !important
+    border-bottom: initial
+
+  p,
+  ul,
+  ol,
+  table,
+  pre,
+  blockquote,
+  img
+    &:first-child
+      margin-top: 0 !important
+
+    &:last-child
+      margin-bottom: 0 !important
+
+  .img-alt
+    margin: 5px 0 10px
+
+  if $note-icons
+    &:not(.no-icon)
+      padding-left: 3em
+
+      &::before
+        position: absolute
+        top: calc(50% - .95em)
+        left: .8em
+        font-size: larger
+        @extend .fontawesomeIcon
+
+  for $type in $note-types
+    &.{$type}
+      &.flat
+        background: lookup('$note-' + $type + '-bg')
+
+      &.modern
+        border-color: lookup('$note-modern-' + $type + '-border')
+        background: lookup('$note-modern-' + $type + '-bg')
+        color: lookup('$note-modern-' + $type + '-text')
+
+        a
+          &:not(.btn)
+            color: lookup('$note-modern-' + $type + '-text')
+
+            &:hover
+              color: lookup('$note-modern-' + $type + '-hover')
+
+      &:not(.modern)
+        border-left-color: lookup('$note-' + $type + '-border')
+
+        h2,
+        h3,
+        h4,
+        h5,
+        h6
+          color: lookup('$note-' + $type + '-text')
+
+      if $note-icons
+        &:not(.no-icon)
+          &::before
+            content: lookup('$note-' + $type + '-icon')
+
+          &:not(.modern)
+            &::before
+              color: lookup('$note-' + $type + '-text')
diff --git a/source/css/_tags/series.styl b/source/css/_tags/series.styl
index 22b3074..75f35ba 100644
--- a/source/css/_tags/series.styl
+++ b/source/css/_tags/series.styl
@@ -1,5 +1,5 @@
-.container
-  .series-items
-    a
-      &:hover
+.container
+  .series-items
+    a
+      &:hover
         color: var(--pseudo-hover)
\ No newline at end of file
diff --git a/source/css/_tags/tabs.styl b/source/css/_tags/tabs.styl
index 689106b..d57ba59 100644
--- a/source/css/_tags/tabs.styl
+++ b/source/css/_tags/tabs.styl
@@ -1,77 +1,77 @@
-
-.container
-  .tabs
-    position: relative
-    margin: 0 0 20px
-    border-right: 1px solid var(--tab-border-color)
-    border-bottom: 1px solid var(--tab-border-color)
-    border-left: 1px solid var(--tab-border-color)
-    addBorderRadius()
-    overflow: hidden
-
-    > .nav-tabs
-      display: flex
-      flex-wrap: wrap
-      margin: 0
-      padding: 0
-      background: var(--tab-botton-bg)
-
-      > .tab
-        flex-grow: 1
-        padding: 8px 18px
-        border-top: 2px solid var(--tab-border-color)
-        background: var(--tab-botton-bg)
-        color: var(--tab-botton-color)
-        line-height: 2
-        transition: all .4s
-
-        i
-          width: 1.5em
-
-        &.active
-          border-top: 2px solid $tab-active-border-color
-          background: var(--tab-button-active-bg)
-          cursor: default
-
-        &:not(.active)
-          &:hover
-            border-top: 2px solid var(--tab-button-hover-bg)
-            background: var(--tab-button-hover-bg)
-
-      &.no-default
-        & ~ .tab-to-top
-          display: none
-
-    > .tab-contents
-      .tab-item-content
-        position: relative
-        display: none
-        padding: 36px 24px 10px
-
-        +maxWidth768()
-          padding: 24px 14px
-
-        &.active
-          display: block
-          animation: tabshow .5s
-
-        > :last-child
-          margin-bottom: 0
-
-    > .tab-to-top
-      padding: 0 16px 10px 0
-      width: 100%
-      text-align: right
-
-      button
-        color: $tab-to-top-color
-
-        &:hover
-          color: $tab-to-top-hover-color
-
-@keyframes tabshow
-  0%
-    transform: translateY(15px)
-
-  100%
-    transform: translateY(0)
+
+.container
+  .tabs
+    position: relative
+    margin: 0 0 20px
+    border-right: 1px solid var(--tab-border-color)
+    border-bottom: 1px solid var(--tab-border-color)
+    border-left: 1px solid var(--tab-border-color)
+    addBorderRadius()
+    overflow: hidden
+
+    > .nav-tabs
+      display: flex
+      flex-wrap: wrap
+      margin: 0
+      padding: 0
+      background: var(--tab-botton-bg)
+
+      > .tab
+        flex-grow: 1
+        padding: 8px 18px
+        border-top: 2px solid var(--tab-border-color)
+        background: var(--tab-botton-bg)
+        color: var(--tab-botton-color)
+        line-height: 2
+        transition: all .4s
+
+        i
+          width: 1.5em
+
+        &.active
+          border-top: 2px solid $tab-active-border-color
+          background: var(--tab-button-active-bg)
+          cursor: default
+
+        &:not(.active)
+          &:hover
+            border-top: 2px solid var(--tab-button-hover-bg)
+            background: var(--tab-button-hover-bg)
+
+      &.no-default
+        & ~ .tab-to-top
+          display: none
+
+    > .tab-contents
+      .tab-item-content
+        position: relative
+        display: none
+        padding: 36px 24px 10px
+
+        +maxWidth768()
+          padding: 24px 14px
+
+        &.active
+          display: block
+          animation: tabshow .5s
+
+        > :last-child
+          margin-bottom: 0
+
+    > .tab-to-top
+      padding: 0 16px 10px 0
+      width: 100%
+      text-align: right
+
+      button
+        color: $tab-to-top-color
+
+        &:hover
+          color: $tab-to-top-hover-color
+
+@keyframes tabshow
+  0%
+    transform: translateY(15px)
+
+  100%
+    transform: translateY(0)
diff --git a/source/css/_tags/timeline.styl b/source/css/_tags/timeline.styl
index 36ce543..a192799 100644
--- a/source/css/_tags/timeline.styl
+++ b/source/css/_tags/timeline.styl
@@ -1,68 +1,68 @@
-.container
-  .timeline
-    margin: 0 10px 20px
-    padding: 14px 0 5px 20px
-    border-left: 2px solid var(--timeline-color, $theme-color)
-
-    for $type in $color-types
-      &.{$type}
-        --timeline-color: lookup('$tagsP-' + $type + '-color')
-        --timeline-bg: s('rgba(%s,%s,%s, 0.2)', red(lookup('$tagsP-' + $type + '-color')), green(lookup('$tagsP-' + $type + '-color')), blue(lookup('$tagsP-' + $type + '-color')))
-
-    .timeline-item
-      margin: 0 0 15px
-
-      &:hover
-        .item-circle
-          &:before
-            border-color: var(--timeline-color, $theme-color)
-
-      &.headline
-        .timeline-item-title
-          .item-circle
-            > p
-              font-weight: 600
-              font-size: 1.2em
-
-            &:before
-              left: -28px
-              border: 4px solid var(--timeline-color, $theme-color)
-
-        &:hover
-          .item-circle
-            &:before
-              border-color: var(--pseudo-hover)
-
-      .timeline-item-title
-        position: relative
-
-      .item-circle
-        &:before
-          position: absolute
-          top: 50%
-          left: -27px
-          width: 6px
-          height: 6px
-          border: 3px solid var(--pseudo-hover)
-          border-radius: 50%
-          background: var(--card-bg)
-          content: ''
-          transition: all .3s
-          transform: translate(0, -50%)
-
-        > p
-          margin: 0 0 8px
-          font-weight: 500
-
-      .timeline-item-content
-        position: relative
-        padding: 12px 15px
-        border-radius: 8px
-        background: var(--timeline-bg, lighten($theme-color, 85%))
-        font-size: .93em
-
-        & > :last-child
-          margin-bottom: 0
-
-    & + .timeline
+.container
+  .timeline
+    margin: 0 10px 20px
+    padding: 14px 0 5px 20px
+    border-left: 2px solid var(--timeline-color, $theme-color)
+
+    for $type in $color-types
+      &.{$type}
+        --timeline-color: lookup('$tagsP-' + $type + '-color')
+        --timeline-bg: s('rgba(%s,%s,%s, 0.2)', red(lookup('$tagsP-' + $type + '-color')), green(lookup('$tagsP-' + $type + '-color')), blue(lookup('$tagsP-' + $type + '-color')))
+
+    .timeline-item
+      margin: 0 0 15px
+
+      &:hover
+        .item-circle
+          &:before
+            border-color: var(--timeline-color, $theme-color)
+
+      &.headline
+        .timeline-item-title
+          .item-circle
+            > p
+              font-weight: 600
+              font-size: 1.2em
+
+            &:before
+              left: -28px
+              border: 4px solid var(--timeline-color, $theme-color)
+
+        &:hover
+          .item-circle
+            &:before
+              border-color: var(--pseudo-hover)
+
+      .timeline-item-title
+        position: relative
+
+      .item-circle
+        &:before
+          position: absolute
+          top: 50%
+          left: -27px
+          width: 6px
+          height: 6px
+          border: 3px solid var(--pseudo-hover)
+          border-radius: 50%
+          background: var(--card-bg)
+          content: ''
+          transition: all .3s
+          transform: translate(0, -50%)
+
+        > p
+          margin: 0 0 8px
+          font-weight: 500
+
+      .timeline-item-content
+        position: relative
+        padding: 12px 15px
+        border-radius: 8px
+        background: var(--timeline-bg, lighten($theme-color, 85%))
+        font-size: .93em
+
+        & > :last-child
+          margin-bottom: 0
+
+    & + .timeline
       margin-top: -20px
\ No newline at end of file
diff --git a/source/css/_third-party/normalize.min.css b/source/css/_third-party/normalize.min.css
index ecc522f..725fe45 100644
--- a/source/css/_third-party/normalize.min.css
+++ b/source/css/_third-party/normalize.min.css
@@ -1,180 +1,180 @@
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
-html {
-  line-height: 1.15;
-  -webkit-text-size-adjust: 100%
-}
-
-body {
-  margin: 0
-}
-
-main {
-  display: block
-}
-
-h1 {
-  font-size: 2em;
-  margin: .67em 0
-}
-
-hr {
-  box-sizing: content-box;
-  height: 0;
-  overflow: visible
-}
-
-pre {
-  font-family: monospace, monospace;
-  font-size: 1em
-}
-
-a {
-  background-color: transparent
-}
-
-abbr[title] {
-  border-bottom: none;
-  text-decoration: underline;
-  text-decoration: underline dotted
-}
-
-b,
-strong {
-  font-weight: bolder
-}
-
-code,
-kbd,
-samp {
-  font-family: monospace, monospace;
-  font-size: 1em
-}
-
-small {
-  font-size: 80%
-}
-
-sub,
-sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline
-}
-
-sub {
-  bottom: -.25em
-}
-
-sup {
-  top: -.5em
-}
-
-img {
-  border-style: none
-}
-
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: inherit;
-  font-size: 100%;
-  line-height: 1.15;
-  margin: 0
-}
-
-button,
-input {
-  overflow: visible
-}
-
-button,
-select {
-  text-transform: none
-}
-
-[type=button],
-[type=reset],
-[type=submit],
-button {
-  -webkit-appearance: button
-}
-
-[type=button]::-moz-focus-inner,
-[type=reset]::-moz-focus-inner,
-[type=submit]::-moz-focus-inner,
-button::-moz-focus-inner {
-  border-style: none;
-  padding: 0
-}
-
-[type=button]:-moz-focusring,
-[type=reset]:-moz-focusring,
-[type=submit]:-moz-focusring,
-button:-moz-focusring {
-  outline: 1px dotted ButtonText
-}
-
-fieldset {
-  padding: .35em .75em .625em
-}
-
-legend {
-  box-sizing: border-box;
-  color: inherit;
-  display: table;
-  max-width: 100%;
-  padding: 0;
-  white-space: normal
-}
-
-progress {
-  vertical-align: baseline
-}
-
-textarea {
-  overflow: auto
-}
-
-[type=checkbox],
-[type=radio] {
-  box-sizing: border-box;
-  padding: 0
-}
-
-[type=number]::-webkit-inner-spin-button,
-[type=number]::-webkit-outer-spin-button {
-  height: auto
-}
-
-[type=search] {
-  -webkit-appearance: textfield;
-  outline-offset: -2px
-}
-
-[type=search]::-webkit-search-decoration {
-  -webkit-appearance: none
-}
-
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  font: inherit
-}
-
-details {
-  display: block
-}
-
-summary {
-  display: list-item
-}
-
-template {
-  display: none
-}
-
-[hidden] {
-  display: none
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+html {
+  line-height: 1.15;
+  -webkit-text-size-adjust: 100%
+}
+
+body {
+  margin: 0
+}
+
+main {
+  display: block
+}
+
+h1 {
+  font-size: 2em;
+  margin: .67em 0
+}
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible
+}
+
+pre {
+  font-family: monospace, monospace;
+  font-size: 1em
+}
+
+a {
+  background-color: transparent
+}
+
+abbr[title] {
+  border-bottom: none;
+  text-decoration: underline;
+  text-decoration: underline dotted
+}
+
+b,
+strong {
+  font-weight: bolder
+}
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace;
+  font-size: 1em
+}
+
+small {
+  font-size: 80%
+}
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline
+}
+
+sub {
+  bottom: -.25em
+}
+
+sup {
+  top: -.5em
+}
+
+img {
+  border-style: none
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0
+}
+
+button,
+input {
+  overflow: visible
+}
+
+button,
+select {
+  text-transform: none
+}
+
+[type=button],
+[type=reset],
+[type=submit],
+button {
+  -webkit-appearance: button
+}
+
+[type=button]::-moz-focus-inner,
+[type=reset]::-moz-focus-inner,
+[type=submit]::-moz-focus-inner,
+button::-moz-focus-inner {
+  border-style: none;
+  padding: 0
+}
+
+[type=button]:-moz-focusring,
+[type=reset]:-moz-focusring,
+[type=submit]:-moz-focusring,
+button:-moz-focusring {
+  outline: 1px dotted ButtonText
+}
+
+fieldset {
+  padding: .35em .75em .625em
+}
+
+legend {
+  box-sizing: border-box;
+  color: inherit;
+  display: table;
+  max-width: 100%;
+  padding: 0;
+  white-space: normal
+}
+
+progress {
+  vertical-align: baseline
+}
+
+textarea {
+  overflow: auto
+}
+
+[type=checkbox],
+[type=radio] {
+  box-sizing: border-box;
+  padding: 0
+}
+
+[type=number]::-webkit-inner-spin-button,
+[type=number]::-webkit-outer-spin-button {
+  height: auto
+}
+
+[type=search] {
+  -webkit-appearance: textfield;
+  outline-offset: -2px
+}
+
+[type=search]::-webkit-search-decoration {
+  -webkit-appearance: none
+}
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  font: inherit
+}
+
+details {
+  display: block
+}
+
+summary {
+  display: list-item
+}
+
+template {
+  display: none
+}
+
+[hidden] {
+  display: none
 }
\ No newline at end of file
diff --git a/source/css/index.styl b/source/css/index.styl
index 0cfec1f..3cca6b6 100644
--- a/source/css/index.styl
+++ b/source/css/index.styl
@@ -1,15 +1,15 @@
-if hexo-config('css_prefix')
-  @import 'nib'
-
-@import '_third-party/normalize.min.css'
-// project
-@import 'var'
-@import '_global/*'
-@import '_highlight/highlight'
-@import '_page/*'
-@import '_layout/*'
-@import '_tags/*'
-@import '_mode/*'
-
-// search
+if hexo-config('css_prefix')
+  @import 'nib'
+
+@import '_third-party/normalize.min.css'
+// project
+@import 'var'
+@import '_global/*'
+@import '_highlight/highlight'
+@import '_page/*'
+@import '_layout/*'
+@import '_tags/*'
+@import '_mode/*'
+
+// search
 @import '_search/index'
\ No newline at end of file
diff --git a/source/css/var.styl b/source/css/var.styl
index 68796fb..479c3b7 100644
--- a/source/css/var.styl
+++ b/source/css/var.styl
@@ -1,186 +1,186 @@
-// color
-$bright-blue = #49B1F5
-$strong-cyan = #00c4b6
-$light-orange = #FF7242
-$light-red = #F47466
-$themeColorEnable = hexo-config('theme_color') && hexo-config('theme_color.enable')
-$theme-color = $themeColorEnable && hexo-config('theme_color.main') ? convert(hexo-config('theme_color.main')) : $bright-blue
-$theme-paginator-color = $themeColorEnable && hexo-config('theme_color.paginator') ? convert(hexo-config('theme_color.paginator')) : $strong-cyan
-$theme-text-selection-color = $themeColorEnable && hexo-config('theme_color.text_selection') ? convert(hexo-config('theme_color.text_selection')) : $strong-cyan
-$theme-link-color = $themeColorEnable && hexo-config('theme_color.link_color') ? convert(hexo-config('theme_color.link_color')) : $bright-blue
-$theme-hr-color = $themeColorEnable && hexo-config('theme_color.hr_color') ? convert(hexo-config('theme_color.hr_color')) : $bright-blue
-$code-foreground = $themeColorEnable && hexo-config('theme_color.code_foreground') ? convert(hexo-config('theme_color.code_foreground')) : $light-red
-$code-background = $themeColorEnable && hexo-config('theme_color.code_background') ? convert(hexo-config('theme_color.code_background')) : rgba(27, 31, 35, .05)
-$theme-toc-color = $themeColorEnable && hexo-config('theme_color.toc_color') ? convert(hexo-config('theme_color.toc_color')) : $strong-cyan
-// font
-
-$chinseFont = $language == 'zh-CN' ? 'Microsoft YaHei' : 'Microsoft JhengHei'
-$dafault-font-family = -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Lato, Roboto, 'PingFang SC', $chinseFont, sans-serif
-$dafault-code-font = consolas, Menlo, monospace, 'PingFang SC', $chinseFont, sans-serif
-
-$font-family = hexo-config('font.font_family') ? unquote(hexo-config('font.font_family')) : $dafault-font-family
-$code-font-family = hexo-config('font.code_font_family') ? unquote(hexo-config('font.code_font_family')) : $dafault-code-font
-$site-name-font = hexo-config('blog_title_font.font_family') && unquote(hexo-config('blog_title_font.font_family'))
-// hr
-$hrEnable = hexo-config('hr_icon') && hexo-config('hr_icon.enable')
-$hr-icon = $hrEnable && hexo-config('hr_icon.icon') ? hexo-config('hr_icon.icon') : '\f0c4'
-$hr-icon-top = $hrEnable && hexo-config('hr_icon.icon_top') ? convert(hexo-config('hr_icon.icon_top')) : -10px
-// page beatutify
-$beautifyEnable = hexo-config('beautify.enable')
-$title-prefix-icon = $beautifyEnable && hexo-config('beautify.title_prefix_icon') ? hexo-config('beautify.title_prefix_icon') : '\f0c1'
-$title-prefix-icon-color = $beautifyEnable && hexo-config('beautify.title_prefix_icon_color') ? convert(hexo-config('beautify.title_prefix_icon_color')) : $light-red
-// Global Variables
-$font-size = hexo-config('font.global_font_size') ? convert(hexo-config('font.global_font_size')) : 14px
-$code-font-size = hexo-config('font.code_font_size') ? convert(hexo-config('font.code_font_size')) : var(--global-font-size)
-$font-color = #1F2D3D
-$text-line-height = 2
-$index_top_img_height = hexo-config('index_top_img_height') ? convert(hexo-config('index_top_img_height')) : 100vh
-$index_site_info_top = hexo-config('index_site_info_top') ? convert(hexo-config('index_site_info_top')) : 43%
-// Global color & SVG
-$light-blue = $theme-color
-$dark-black = #000000
-$light-grey = #EEEEEE
-$grey = #858585
-$dark-grey = #cacaca
-$white = #FFFFFF
-$whitesmoke = #f5f5f5
-$font-black = #4C4948
-$card-bg = $white
-$text-highlight-color = $font-color
-$text-hover = $theme-color
-$text-bg-hover = $theme-color
-// code
-$line-height-code-block = 1.6
-$blockquote-color = #6a737d
-$blockquote-padding-color = $themeColorEnable && hexo-config('theme_color.blockquote_padding_color') ? convert(hexo-config('theme_color.blockquote_padding_color')) : #49B1F5
-$blockquote-background-color = $themeColorEnable && hexo-config('theme_color.blockquote_background_color') ? alpha(convert(hexo-config('theme_color.blockquote_background_color')), .1) : alpha($blockquote-padding-color, .1)
-// page
-$body-bg = #fff
-$a-link-color = #99a9bf
-$sticky-color = $light-orange
-$theme-meta-color = $themeColorEnable && hexo-config('theme_color.meta_color') ? convert(hexo-config('theme_color.meta_color')) : #858585
-// sidebar
-$sidebar-background = #f6f8fa
-$sidebar-width = 330px
-// aside
-$toc-link-color = #666261
-$toc-mobile-width = calc(100% - 80px)
-$toc-mobile-maxWidth = 380px
-$toc-active-color = #fff
-// Button
-$button-color = #fff
-$button-hover-color = $themeColorEnable && hexo-config('theme_color.button_hover') ? convert(hexo-config('theme_color.button_hover')) : $light-orange
-$button-bg = $theme-color
-$pseudo-hover = $button-hover-color
-// scrollbar
-$scrollbar-color = $themeColorEnable && hexo-config('theme_color.scrollbar_color') ? convert(hexo-config('theme_color.scrollbar_color')) : $theme-color
-// table
-$table-thead-bg = #99a9bf
-// reward
-$reward-pop-up-bg = #f5f5f5
-$reward-pop-up-color = #858585
-// search
-$search-bg = #f6f8fa
-$search-input-color = $font-black
-$search-color = $theme-color
-$search-keyword-highlight = #F47466
-$search-a-color = $font-black
-// comments
-$comments-switch-first-text = $bright-blue
-$comments-switch-second-text = $light-orange
-$comments-switch-round = #fff
-$comments-switch-bg = #f6f8fa
-// noticeOutdate
-$noticeOutdate-bg = #ffe6e6
-$noticeOutdate-color = #ff6666
-$noticeOutdate-border = #ff8080
-// gallery
-$gallery-color = #fff
-// tag-hide
-$tag-hide-bg = $theme-color
-$tag-hide-toggle-bg = #f0f0f0
-// preloader
-$preloader-bg = #37474f
-$preloader-word-color = #fff
-// rightside
-$rightside-bottom = hexo-config('rightside_bottom') ? convert(hexo-config('rightside_bottom')) : 40px
-// fireworks
-$fireworks-zIndex = hexo-config('fireworks.zIndex') ? hexo-config('fireworks.zIndex') : 99999
-// Tag Plugins - Note
-hexo-config('note.light_bg_offset') is a 'unit' ? ($lbg = unit(hexo-config('note.light_bg_offset'), '%')) : ($lbg = 0)
-$note-types = 'default' 'primary' 'info' 'success' 'warning' 'danger'
-// Default
-$note-default-border = #777
-$note-default-bg = lighten(spin($note-default-border, 0), 94% + $lbg)
-$note-default-text = $note-default-border
-$note-default-icon = '\f0a9'
-$note-modern-default-border = #e1e1e1
-$note-modern-default-bg = lighten(spin($note-modern-default-border, 10), 60% + ($lbg * 4))
-$note-modern-default-text = #666
-$note-modern-default-hover = darken(spin($note-modern-default-text, -10), 32%)
-// Primary
-$note-primary-border = #6f42c1
-$note-primary-bg = lighten(spin($note-primary-border, 10), 92% + $lbg)
-$note-primary-text = $note-primary-border
-$note-primary-icon = '\f055'
-$note-modern-primary-border = #e1c2ff
-$note-modern-primary-bg = lighten(spin($note-modern-primary-border, 10), 40% + ($lbg * 4))
-$note-modern-primary-text = #6f42c1
-$note-modern-primary-hover = darken(spin($note-modern-primary-text, -10), 22%)
-// Info
-$note-info-border = #428bca
-$note-info-bg = lighten(spin($note-info-border, -10), 91% + $lbg)
-$note-info-text = $note-info-border
-$note-info-icon = '\f05a'
-$note-modern-info-border = #b3e5ef
-$note-modern-info-bg = lighten(spin($note-modern-info-border, 10), 50% + ($lbg * 4))
-$note-modern-info-text = #31708f
-$note-modern-info-hover = darken(spin($note-modern-info-text, -10), 32%)
-// Success
-$note-success-border = #5cb85c
-$note-success-bg = lighten(spin($note-success-border, 10), 90% + $lbg)
-$note-success-text = $note-success-border
-$note-success-icon = '\f058'
-$note-modern-success-border = #d0e6be
-$note-modern-success-bg = lighten(spin($note-modern-success-border, 10), 40% + ($lbg * 4))
-$note-modern-success-text = #3c763d
-$note-modern-success-hover = darken(spin($note-modern-success-text, -10), 27%)
-// Warning
-$note-warning-border = #f0ad4e
-$note-warning-bg = lighten(spin($note-warning-border, 10), 88% + $lbg)
-$note-warning-text = $note-warning-border
-$note-warning-icon = '\f06a'
-$note-modern-warning-border = #fae4cd
-$note-modern-warning-bg = lighten(spin($note-modern-warning-border, 10), 43% + ($lbg * 4))
-$note-modern-warning-text = #8a6d3b
-$note-modern-warning-hover = darken(spin($note-modern-warning-text, -10), 18%)
-// Danger
-$note-danger-border = #d9534f
-$note-danger-bg = lighten(spin($note-danger-border, -10), 92% + $lbg)
-$note-danger-text = $note-danger-border
-$note-danger-icon = '\f056'
-$note-modern-danger-border = #ebcdd2
-$note-modern-danger-bg = lighten(spin($note-modern-danger-border, 10), 35% + ($lbg * 4))
-$note-modern-danger-text = #a94442
-$note-modern-danger-hover = darken(spin($note-modern-danger-text, -10), 22%)
-// Tag Plugins - Button/note
-$color-types = 'blue' 'pink' 'red' 'purple' 'orange' 'green'
-$btn-color = #fff
-$btn-default-color = #777
-$tagsP-blue-color = #428bca
-$tagsP-pink-color = #FF69B4
-$tagsP-red-color = #FF0000
-$tagsP-orange-color = #FF8C00
-$tagsP-purple-color = #6f42c1
-$tagsP-green-color = #5cb85c
-// Tag Plugins - Tab
-$tab-border-color = #f0f0f0
-$tab-botton-bg = #f0f0f0
-$tab-botton-color = $font-color
-$tab-button-hover-bg = darken($tab-border-color, 8)
-$tab-active-border-color = $theme-color
-$tab-button-active-bg = $card-bg
-$tab-to-top-color = #99a9bf
-$tab-to-top-hover-color = $theme-color
-// Tag Plugins - timeline
-$timeline-default-color = $theme-color
+// color
+$bright-blue = #49B1F5
+$strong-cyan = #00c4b6
+$light-orange = #FF7242
+$light-red = #F47466
+$themeColorEnable = hexo-config('theme_color') && hexo-config('theme_color.enable')
+$theme-color = $themeColorEnable && hexo-config('theme_color.main') ? convert(hexo-config('theme_color.main')) : $bright-blue
+$theme-paginator-color = $themeColorEnable && hexo-config('theme_color.paginator') ? convert(hexo-config('theme_color.paginator')) : $strong-cyan
+$theme-text-selection-color = $themeColorEnable && hexo-config('theme_color.text_selection') ? convert(hexo-config('theme_color.text_selection')) : $strong-cyan
+$theme-link-color = $themeColorEnable && hexo-config('theme_color.link_color') ? convert(hexo-config('theme_color.link_color')) : $bright-blue
+$theme-hr-color = $themeColorEnable && hexo-config('theme_color.hr_color') ? convert(hexo-config('theme_color.hr_color')) : $bright-blue
+$code-foreground = $themeColorEnable && hexo-config('theme_color.code_foreground') ? convert(hexo-config('theme_color.code_foreground')) : $light-red
+$code-background = $themeColorEnable && hexo-config('theme_color.code_background') ? convert(hexo-config('theme_color.code_background')) : rgba(27, 31, 35, .05)
+$theme-toc-color = $themeColorEnable && hexo-config('theme_color.toc_color') ? convert(hexo-config('theme_color.toc_color')) : $strong-cyan
+// font
+
+$chinseFont = $language == 'zh-CN' ? 'Microsoft YaHei' : 'Microsoft JhengHei'
+$dafault-font-family = -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Lato, Roboto, 'PingFang SC', $chinseFont, sans-serif
+$dafault-code-font = consolas, Menlo, monospace, 'PingFang SC', $chinseFont, sans-serif
+
+$font-family = hexo-config('font.font_family') ? unquote(hexo-config('font.font_family')) : $dafault-font-family
+$code-font-family = hexo-config('font.code_font_family') ? unquote(hexo-config('font.code_font_family')) : $dafault-code-font
+$site-name-font = hexo-config('blog_title_font.font_family') && unquote(hexo-config('blog_title_font.font_family'))
+// hr
+$hrEnable = hexo-config('hr_icon') && hexo-config('hr_icon.enable')
+$hr-icon = $hrEnable && hexo-config('hr_icon.icon') ? hexo-config('hr_icon.icon') : '\f0c4'
+$hr-icon-top = $hrEnable && hexo-config('hr_icon.icon_top') ? convert(hexo-config('hr_icon.icon_top')) : -10px
+// page beatutify
+$beautifyEnable = hexo-config('beautify.enable')
+$title-prefix-icon = $beautifyEnable && hexo-config('beautify.title_prefix_icon') ? hexo-config('beautify.title_prefix_icon') : '\f0c1'
+$title-prefix-icon-color = $beautifyEnable && hexo-config('beautify.title_prefix_icon_color') ? convert(hexo-config('beautify.title_prefix_icon_color')) : $light-red
+// Global Variables
+$font-size = hexo-config('font.global_font_size') ? convert(hexo-config('font.global_font_size')) : 14px
+$code-font-size = hexo-config('font.code_font_size') ? convert(hexo-config('font.code_font_size')) : var(--global-font-size)
+$font-color = #1F2D3D
+$text-line-height = 2
+$index_top_img_height = hexo-config('index_top_img_height') ? convert(hexo-config('index_top_img_height')) : 100vh
+$index_site_info_top = hexo-config('index_site_info_top') ? convert(hexo-config('index_site_info_top')) : 43%
+// Global color & SVG
+$light-blue = $theme-color
+$dark-black = #000000
+$light-grey = #EEEEEE
+$grey = #858585
+$dark-grey = #cacaca
+$white = #FFFFFF
+$whitesmoke = #f5f5f5
+$font-black = #4C4948
+$card-bg = $white
+$text-highlight-color = $font-color
+$text-hover = $theme-color
+$text-bg-hover = $theme-color
+// code
+$line-height-code-block = 1.6
+$blockquote-color = #6a737d
+$blockquote-padding-color = $themeColorEnable && hexo-config('theme_color.blockquote_padding_color') ? convert(hexo-config('theme_color.blockquote_padding_color')) : #49B1F5
+$blockquote-background-color = $themeColorEnable && hexo-config('theme_color.blockquote_background_color') ? alpha(convert(hexo-config('theme_color.blockquote_background_color')), .1) : alpha($blockquote-padding-color, .1)
+// page
+$body-bg = #fff
+$a-link-color = #99a9bf
+$sticky-color = $light-orange
+$theme-meta-color = $themeColorEnable && hexo-config('theme_color.meta_color') ? convert(hexo-config('theme_color.meta_color')) : #858585
+// sidebar
+$sidebar-background = #f6f8fa
+$sidebar-width = 330px
+// aside
+$toc-link-color = #666261
+$toc-mobile-width = calc(100% - 80px)
+$toc-mobile-maxWidth = 380px
+$toc-active-color = #fff
+// Button
+$button-color = #fff
+$button-hover-color = $themeColorEnable && hexo-config('theme_color.button_hover') ? convert(hexo-config('theme_color.button_hover')) : $light-orange
+$button-bg = $theme-color
+$pseudo-hover = $button-hover-color
+// scrollbar
+$scrollbar-color = $themeColorEnable && hexo-config('theme_color.scrollbar_color') ? convert(hexo-config('theme_color.scrollbar_color')) : $theme-color
+// table
+$table-thead-bg = #99a9bf
+// reward
+$reward-pop-up-bg = #f5f5f5
+$reward-pop-up-color = #858585
+// search
+$search-bg = #f6f8fa
+$search-input-color = $font-black
+$search-color = $theme-color
+$search-keyword-highlight = #F47466
+$search-a-color = $font-black
+// comments
+$comments-switch-first-text = $bright-blue
+$comments-switch-second-text = $light-orange
+$comments-switch-round = #fff
+$comments-switch-bg = #f6f8fa
+// noticeOutdate
+$noticeOutdate-bg = #ffe6e6
+$noticeOutdate-color = #ff6666
+$noticeOutdate-border = #ff8080
+// gallery
+$gallery-color = #fff
+// tag-hide
+$tag-hide-bg = $theme-color
+$tag-hide-toggle-bg = #f0f0f0
+// preloader
+$preloader-bg = #37474f
+$preloader-word-color = #fff
+// rightside
+$rightside-bottom = hexo-config('rightside_bottom') ? convert(hexo-config('rightside_bottom')) : 40px
+// fireworks
+$fireworks-zIndex = hexo-config('fireworks.zIndex') ? hexo-config('fireworks.zIndex') : 99999
+// Tag Plugins - Note
+hexo-config('note.light_bg_offset') is a 'unit' ? ($lbg = unit(hexo-config('note.light_bg_offset'), '%')) : ($lbg = 0)
+$note-types = 'default' 'primary' 'info' 'success' 'warning' 'danger'
+// Default
+$note-default-border = #777
+$note-default-bg = lighten(spin($note-default-border, 0), 94% + $lbg)
+$note-default-text = $note-default-border
+$note-default-icon = '\f0a9'
+$note-modern-default-border = #e1e1e1
+$note-modern-default-bg = lighten(spin($note-modern-default-border, 10), 60% + ($lbg * 4))
+$note-modern-default-text = #666
+$note-modern-default-hover = darken(spin($note-modern-default-text, -10), 32%)
+// Primary
+$note-primary-border = #6f42c1
+$note-primary-bg = lighten(spin($note-primary-border, 10), 92% + $lbg)
+$note-primary-text = $note-primary-border
+$note-primary-icon = '\f055'
+$note-modern-primary-border = #e1c2ff
+$note-modern-primary-bg = lighten(spin($note-modern-primary-border, 10), 40% + ($lbg * 4))
+$note-modern-primary-text = #6f42c1
+$note-modern-primary-hover = darken(spin($note-modern-primary-text, -10), 22%)
+// Info
+$note-info-border = #428bca
+$note-info-bg = lighten(spin($note-info-border, -10), 91% + $lbg)
+$note-info-text = $note-info-border
+$note-info-icon = '\f05a'
+$note-modern-info-border = #b3e5ef
+$note-modern-info-bg = lighten(spin($note-modern-info-border, 10), 50% + ($lbg * 4))
+$note-modern-info-text = #31708f
+$note-modern-info-hover = darken(spin($note-modern-info-text, -10), 32%)
+// Success
+$note-success-border = #5cb85c
+$note-success-bg = lighten(spin($note-success-border, 10), 90% + $lbg)
+$note-success-text = $note-success-border
+$note-success-icon = '\f058'
+$note-modern-success-border = #d0e6be
+$note-modern-success-bg = lighten(spin($note-modern-success-border, 10), 40% + ($lbg * 4))
+$note-modern-success-text = #3c763d
+$note-modern-success-hover = darken(spin($note-modern-success-text, -10), 27%)
+// Warning
+$note-warning-border = #f0ad4e
+$note-warning-bg = lighten(spin($note-warning-border, 10), 88% + $lbg)
+$note-warning-text = $note-warning-border
+$note-warning-icon = '\f06a'
+$note-modern-warning-border = #fae4cd
+$note-modern-warning-bg = lighten(spin($note-modern-warning-border, 10), 43% + ($lbg * 4))
+$note-modern-warning-text = #8a6d3b
+$note-modern-warning-hover = darken(spin($note-modern-warning-text, -10), 18%)
+// Danger
+$note-danger-border = #d9534f
+$note-danger-bg = lighten(spin($note-danger-border, -10), 92% + $lbg)
+$note-danger-text = $note-danger-border
+$note-danger-icon = '\f056'
+$note-modern-danger-border = #ebcdd2
+$note-modern-danger-bg = lighten(spin($note-modern-danger-border, 10), 35% + ($lbg * 4))
+$note-modern-danger-text = #a94442
+$note-modern-danger-hover = darken(spin($note-modern-danger-text, -10), 22%)
+// Tag Plugins - Button/note
+$color-types = 'blue' 'pink' 'red' 'purple' 'orange' 'green'
+$btn-color = #fff
+$btn-default-color = #777
+$tagsP-blue-color = #428bca
+$tagsP-pink-color = #FF69B4
+$tagsP-red-color = #FF0000
+$tagsP-orange-color = #FF8C00
+$tagsP-purple-color = #6f42c1
+$tagsP-green-color = #5cb85c
+// Tag Plugins - Tab
+$tab-border-color = #f0f0f0
+$tab-botton-bg = #f0f0f0
+$tab-botton-color = $font-color
+$tab-button-hover-bg = darken($tab-border-color, 8)
+$tab-active-border-color = $theme-color
+$tab-button-active-bg = $card-bg
+$tab-to-top-color = #99a9bf
+$tab-to-top-hover-color = $theme-color
+// Tag Plugins - timeline
+$timeline-default-color = $theme-color
diff --git a/source/js/main.js b/source/js/main.js
index 20f509a..66482d0 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -1,930 +1,930 @@
-document.addEventListener('DOMContentLoaded', () => {
-  let headerContentWidth, $nav
-  let mobileSidebarOpen = false
-
-  const adjustMenu = init => {
-    const getAllWidth = ele => Array.from(ele).reduce((width, i) => width + i.offsetWidth, 0)
-
-    if (init) {
-      const blogInfoWidth = getAllWidth(document.querySelector('#blog-info > a').children)
-      const menusWidth = getAllWidth(document.getElementById('menus').children)
-      headerContentWidth = blogInfoWidth + menusWidth
-      $nav = document.getElementById('nav')
-    }
-
-    const hideMenuIndex = window.innerWidth <= 768 || headerContentWidth > $nav.offsetWidth - 120
-    $nav.classList.toggle('hide-menu', hideMenuIndex)
-  }
-
-  // 初始化header
-  const initAdjust = () => {
-    adjustMenu(true)
-    $nav.classList.add('show')
-  }
-
-  // sidebar menus
-  const sidebarFn = {
-    open: () => {
-      btf.overflowPaddingR.add()
-      btf.animateIn(document.getElementById('menu-mask'), 'to_show 0.5s')
-      document.getElementById('sidebar-menus').classList.add('open')
-      mobileSidebarOpen = true
-    },
-    close: () => {
-      btf.overflowPaddingR.remove()
-      btf.animateOut(document.getElementById('menu-mask'), 'to_hide 0.5s')
-      document.getElementById('sidebar-menus').classList.remove('open')
-      mobileSidebarOpen = false
-    }
-  }
-
-  /**
-   * 首頁top_img底下的箭頭
-   */
-  const scrollDownInIndex = () => {
-    const handleScrollToDest = () => {
-      btf.scrollToDest(document.getElementById('content-inner').offsetTop, 300)
-    }
-
-    const $scrollDownEle = document.getElementById('scroll-down')
-    $scrollDownEle && btf.addEventListenerPjax($scrollDownEle, 'click', handleScrollToDest)
-  }
-
-  /**
-   * 代碼
-   * 只適用於Hexo默認的代碼渲染
-   */
-  const addHighlightTool = () => {
-    const highLight = GLOBAL_CONFIG.highlight
-    if (!highLight) return
-
-    const { highlightCopy, highlightLang, highlightHeightLimit, highlightFullpage, highlightMacStyle, plugin } = highLight
-    const isHighlightShrink = GLOBAL_CONFIG_SITE.isHighlightShrink
-    const isShowTool = highlightCopy || highlightLang || isHighlightShrink !== undefined || highlightFullpage || highlightMacStyle
-    const $figureHighlight = plugin === 'highlight.js' ? document.querySelectorAll('figure.highlight') : document.querySelectorAll('pre[class*="language-"]')
-
-    if (!((isShowTool || highlightHeightLimit) && $figureHighlight.length)) return
-
-    const isPrismjs = plugin === 'prismjs'
-    const highlightShrinkClass = isHighlightShrink === true ? 'closed' : ''
-    const highlightShrinkEle = isHighlightShrink !== undefined ? '' : ''
-    const highlightCopyEle = highlightCopy ? '
    ' : ''
-    const highlightMacStyleEle = '
    '
-    const highlightFullpageEle = highlightFullpage ? '' : ''
-
-    const alertInfo = (ele, text) => {
-      if (GLOBAL_CONFIG.Snackbar !== undefined) {
-        btf.snackbarShow(text)
-      } else {
-        ele.textContent = text
-        ele.style.opacity = 1
-        setTimeout(() => { ele.style.opacity = 0 }, 800)
-      }
-    }
-
-    const copy = async (text, ctx) => {
-      try {
-        await navigator.clipboard.writeText(text)
-        alertInfo(ctx, GLOBAL_CONFIG.copy.success)
-      } catch (err) {
-        console.error('Failed to copy: ', err)
-        alertInfo(ctx, GLOBAL_CONFIG.copy.noSupport)
-      }
-    }
-
-    // click events
-    const highlightCopyFn = (ele, clickEle) => {
-      const $buttonParent = ele.parentNode
-      $buttonParent.classList.add('copy-true')
-      const preCodeSelector = isPrismjs ? 'pre code' : 'table .code pre'
-      const codeElement = $buttonParent.querySelector(preCodeSelector)
-      if (!codeElement) return
-      copy(codeElement.innerText, clickEle.previousElementSibling)
-      $buttonParent.classList.remove('copy-true')
-    }
-
-    const highlightShrinkFn = ele => ele.classList.toggle('closed')
-
-    const codeFullpage = (item, clickEle) => {
-      const wrapEle = item.closest('figure.highlight')
-      const isFullpage = wrapEle.classList.toggle('code-fullpage')
-
-      document.body.style.overflow = isFullpage ? 'hidden' : ''
-      clickEle.classList.toggle('fa-down-left-and-up-right-to-center', isFullpage)
-      clickEle.classList.toggle('fa-up-right-and-down-left-from-center', !isFullpage)
-    }
-
-    const highlightToolsFn = e => {
-      const $target = e.target.classList
-      const currentElement = e.currentTarget
-      if ($target.contains('expand')) highlightShrinkFn(currentElement)
-      else if ($target.contains('copy-button')) highlightCopyFn(currentElement, e.target)
-      else if ($target.contains('fullpage-button')) codeFullpage(currentElement, e.target)
-    }
-
-    const expandCode = e => e.currentTarget.classList.toggle('expand-done')
-
-    // 獲取隱藏狀態下元素的真實高度
-    const getActualHeight = item => {
-      const hiddenElements = new Map()
-
-      const fix = () => {
-        let current = item
-        while (current !== document.body && current != null) {
-          if (window.getComputedStyle(current).display === 'none') {
-            hiddenElements.set(current, current.getAttribute('style') || '')
-          }
-          current = current.parentNode
-        }
-
-        const style = 'visibility: hidden !important; display: block !important;'
-        hiddenElements.forEach((originalStyle, elem) => {
-          elem.setAttribute('style', originalStyle ? originalStyle + ';' + style : style)
-        })
-      }
-
-      const restore = () => {
-        hiddenElements.forEach((originalStyle, elem) => {
-          if (originalStyle === '') elem.removeAttribute('style')
-          else elem.setAttribute('style', originalStyle)
-        })
-      }
-
-      fix()
-      const height = item.offsetHeight
-      restore()
-      return height
-    }
-
-    const createEle = (lang, item) => {
-      const fragment = document.createDocumentFragment()
-
-      if (isShowTool) {
-        const hlTools = document.createElement('div')
-        hlTools.className = `highlight-tools ${highlightShrinkClass}`
-        hlTools.innerHTML = highlightMacStyleEle + highlightShrinkEle + lang + highlightCopyEle + highlightFullpageEle
-        btf.addEventListenerPjax(hlTools, 'click', highlightToolsFn)
-        fragment.appendChild(hlTools)
-      }
-
-      if (highlightHeightLimit && getActualHeight(item) > highlightHeightLimit + 30) {
-        const ele = document.createElement('div')
-        ele.className = 'code-expand-btn'
-        ele.innerHTML = ''
-        btf.addEventListenerPjax(ele, 'click', expandCode)
-        fragment.appendChild(ele)
-      }
-
-      isPrismjs ? item.parentNode.insertBefore(fragment, item) : item.insertBefore(fragment, item.firstChild)
-    }
-
-    $figureHighlight.forEach(item => {
-      let langName = ''
-      if (isPrismjs) btf.wrap(item, 'figure', { class: 'highlight' })
-
-      if (!highlightLang) {
-        createEle('', item)
-        return
-      }
-
-      if (isPrismjs) {
-        langName = item.getAttribute('data-language') || 'Code'
-      } else {
-        langName = item.getAttribute('class').split(' ')[1]
-        if (langName === 'plain' || langName === undefined) langName = 'Code'
-      }
-      createEle(`
    ${langName}
    `, item)
-    })
-  }
-
-  /**
-   * PhotoFigcaption
-   */
-  const addPhotoFigcaption = () => {
-    if (!GLOBAL_CONFIG.isPhotoFigcaption) return
-    document.querySelectorAll('#article-container img').forEach(item => {
-      const altValue = item.title || item.alt
-      if (!altValue) return
-      const ele = document.createElement('div')
-      ele.className = 'img-alt text-center'
-      ele.textContent = altValue
-      item.insertAdjacentElement('afterend', ele)
-    })
-  }
-
-  /**
-   * Lightbox
-   */
-  const runLightbox = () => {
-    btf.loadLightbox(document.querySelectorAll('#article-container img:not(.no-lightbox)'))
-  }
-
-  /**
-   * justified-gallery 圖庫排版
-   */
-
-  const fetchUrl = async url => {
-    try {
-      const response = await fetch(url)
-      return await response.json()
-    } catch (error) {
-      console.error('Failed to fetch URL:', error)
-      return []
-    }
-  }
-
-  const runJustifiedGallery = (container, data, config) => {
-    const { isButton, limit, firstLimit, tabs } = config
-
-    const dataLength = data.length
-    const maxGroupKey = Math.ceil((dataLength - firstLimit) / limit + 1)
-
-    // Gallery configuration
-    const igConfig = {
-      gap: 5,
-      isConstantSize: true,
-      sizeRange: [150, 600],
-      // useResizeObserver: true,
-      // observeChildren: true,
-      useTransform: true
-      // useRecycle: false
-    }
-
-    const ig = new InfiniteGrid.JustifiedInfiniteGrid(container, igConfig)
-    let isLayoutHidden = false
-
-    // Utility functions
-    const sanitizeString = str => (str && str.replace(/"/g, '"')) || ''
-
-    const createImageItem = item => {
-      const alt = item.alt ? `alt="${sanitizeString(item.alt)}"` : ''
-      const title = item.title ? `title="${sanitizeString(item.title)}"` : ''
-      return `
    
-        
-      
    `
-    }
-
-    const getItems = (nextGroupKey, count, isFirst = false) => {
-      const startIndex = isFirst ? (nextGroupKey - 1) * count : (nextGroupKey - 2) * count + firstLimit
-      return data.slice(startIndex, startIndex + count).map(createImageItem)
-    }
-
-    // Load more button
-    const addLoadMoreButton = container => {
-      const button = document.createElement('button')
-      button.innerHTML = `${GLOBAL_CONFIG.infinitegrid.buttonText}`
-
-      button.addEventListener('click', () => {
-        button.remove()
-        btf.setLoading.add(container)
-        appendItems(ig.getGroups().length + 1, limit)
-      }, { once: true })
-
-      container.insertAdjacentElement('afterend', button)
-    }
-
-    const appendItems = (nextGroupKey, count, isFirst) => {
-      ig.append(getItems(nextGroupKey, count, isFirst), nextGroupKey)
-    }
-
-    // Event handlers
-    const handleRenderComplete = e => {
-      if (tabs) {
-        const parentNode = container.parentNode
-        if (isLayoutHidden) {
-          parentNode.style.visibility = 'visible'
-        }
-        if (container.offsetHeight === 0) {
-          parentNode.style.visibility = 'hidden'
-          isLayoutHidden = true
-        }
-      }
-
-      const { updated, isResize, mounted } = e
-      if (!updated.length || !mounted.length || isResize) return
-
-      btf.loadLightbox(container.querySelectorAll('img:not(.medium-zoom-image)'))
-
-      if (ig.getGroups().length === maxGroupKey) {
-        btf.setLoading.remove(container)
-        !tabs && ig.off('renderComplete', handleRenderComplete)
-        return
-      }
-
-      if (isButton) {
-        btf.setLoading.remove(container)
-        addLoadMoreButton(container)
-      }
-    }
-
-    const handleRequestAppend = btf.debounce(e => {
-      const nextGroupKey = (+e.groupKey || 0) + 1
-
-      if (nextGroupKey === 1) appendItems(nextGroupKey, firstLimit, true)
-      else appendItems(nextGroupKey, limit)
-
-      if (nextGroupKey === maxGroupKey) ig.off('requestAppend', handleRequestAppend)
-    }, 300)
-
-    btf.setLoading.add(container)
-    ig.on('renderComplete', handleRenderComplete)
-
-    if (isButton) {
-      appendItems(1, firstLimit, true)
-    } else {
-      ig.on('requestAppend', handleRequestAppend)
-      ig.renderItems()
-    }
-
-    btf.addGlobalFn('pjaxSendOnce', () => ig.destroy())
-  }
-
-  const addJustifiedGallery = async (elements, tabs = false) => {
-    if (!elements.length) return
-
-    const initGallery = async () => {
-      for (const element of elements) {
-        if (btf.isHidden(element) || element.classList.contains('loaded')) continue
-
-        const config = {
-          isButton: element.getAttribute('data-button') === 'true',
-          limit: parseInt(element.getAttribute('data-limit'), 10),
-          firstLimit: parseInt(element.getAttribute('data-first'), 10),
-          tabs
-        }
-
-        const container = element.firstElementChild
-        const content = container.textContent
-        container.textContent = ''
-        element.classList.add('loaded')
-
-        try {
-          const data = element.getAttribute('data-type') === 'url' ? await fetchUrl(content) : JSON.parse(content)
-          runJustifiedGallery(container, data, config)
-        } catch (error) {
-          console.error('Gallery data parsing failed:', error)
-        }
-      }
-    }
-
-    if (typeof InfiniteGrid === 'function') {
-      await initGallery()
-    } else {
-      await btf.getScript(GLOBAL_CONFIG.infinitegrid.js)
-      await initGallery()
-    }
-  }
-
-  /**
-   * rightside scroll percent
-   */
-  const rightsideScrollPercent = currentTop => {
-    const scrollPercent = btf.getScrollPercent(currentTop, document.body)
-    const goUpElement = document.getElementById('go-up')
-
-    if (scrollPercent < 95) {
-      goUpElement.classList.add('show-percent')
-      goUpElement.querySelector('.scroll-percent').textContent = scrollPercent
-    } else {
-      goUpElement.classList.remove('show-percent')
-    }
-  }
-
-  /**
-   * 滾動處理
-   */
-  const scrollFn = () => {
-    const $rightside = document.getElementById('rightside')
-    const innerHeight = window.innerHeight + 56
-    let initTop = 0
-    const $header = document.getElementById('page-header')
-    const isChatBtn = typeof chatBtn !== 'undefined'
-    const isShowPercent = GLOBAL_CONFIG.percent.rightside
-
-    // 檢查文檔高度是否小於視窗高度
-    const checkDocumentHeight = () => {
-      if (document.body.scrollHeight <= innerHeight) {
-        $rightside.classList.add('rightside-show')
-        return true
-      }
-      return false
-    }
-
-    // 如果文檔高度小於視窗高度,直接返回
-    if (checkDocumentHeight()) return
-
-    // find the scroll direction
-    const scrollDirection = currentTop => {
-      const result = currentTop > initTop // true is down & false is up
-      initTop = currentTop
-      return result
-    }
-
-    let flag = ''
-    const scrollTask = btf.throttle(() => {
-      const currentTop = window.scrollY || document.documentElement.scrollTop
-      const isDown = scrollDirection(currentTop)
-      if (currentTop > 56) {
-        if (flag === '') {
-          $header.classList.add('nav-fixed')
-          $rightside.classList.add('rightside-show')
-        }
-
-        if (isDown) {
-          if (flag !== 'down') {
-            $header.classList.remove('nav-visible')
-            isChatBtn && window.chatBtn.hide()
-            flag = 'down'
-          }
-        } else {
-          if (flag !== 'up') {
-            $header.classList.add('nav-visible')
-            isChatBtn && window.chatBtn.show()
-            flag = 'up'
-          }
-        }
-      } else {
-        flag = ''
-        if (currentTop === 0) {
-          $header.classList.remove('nav-fixed', 'nav-visible')
-        }
-        $rightside.classList.remove('rightside-show')
-      }
-
-      isShowPercent && rightsideScrollPercent(currentTop)
-      checkDocumentHeight()
-    }, 300)
-
-    btf.addEventListenerPjax(window, 'scroll', scrollTask, { passive: true })
-  }
-
-  /**
-  * toc,anchor
-  */
-  const scrollFnToDo = () => {
-    const isToc = GLOBAL_CONFIG_SITE.isToc
-    const isAnchor = GLOBAL_CONFIG.isAnchor
-    const $article = document.getElementById('article-container')
-
-    if (!($article && (isToc || isAnchor))) return
-
-    let $tocLink, $cardToc, autoScrollToc, $tocPercentage, isExpand
-
-    if (isToc) {
-      const $cardTocLayout = document.getElementById('card-toc')
-      $cardToc = $cardTocLayout.querySelector('.toc-content')
-      $tocLink = $cardToc.querySelectorAll('.toc-link')
-      $tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
-      isExpand = $cardToc.classList.contains('is-expand')
-
-      // toc元素點擊
-      const tocItemClickFn = e => {
-        const target = e.target.closest('.toc-link')
-        if (!target) return
-
-        e.preventDefault()
-        btf.scrollToDest(btf.getEleTop(document.getElementById(decodeURI(target.getAttribute('href')).replace('#', ''))), 300)
-        if (window.innerWidth < 900) {
-          $cardTocLayout.classList.remove('open')
-        }
-      }
-
-      btf.addEventListenerPjax($cardToc, 'click', tocItemClickFn)
-
-      autoScrollToc = item => {
-        const sidebarHeight = $cardToc.clientHeight
-        const itemOffsetTop = item.offsetTop
-        const itemHeight = item.clientHeight
-        const scrollTop = $cardToc.scrollTop
-        const offset = itemOffsetTop - scrollTop
-        const middlePosition = (sidebarHeight - itemHeight) / 2
-
-        if (offset !== middlePosition) {
-          $cardToc.scrollTop = scrollTop + (offset - middlePosition)
-        }
-      }
-
-      // 處理 hexo-blog-encrypt 事件
-      $cardToc.style.display = 'block'
-    }
-
-    // find head position & add active class
-    const $articleList = $article.querySelectorAll('h1,h2,h3,h4,h5,h6')
-    let detectItem = ''
-
-    const findHeadPosition = top => {
-      if (top === 0) return false
-
-      let currentId = ''
-      let currentIndex = ''
-
-      for (let i = 0; i < $articleList.length; i++) {
-        const ele = $articleList[i]
-        if (top > btf.getEleTop(ele) - 80) {
-          const id = ele.id
-          currentId = id ? '#' + encodeURI(id) : ''
-          currentIndex = i
-        } else {
-          break
-        }
-      }
-
-      if (detectItem === currentIndex) return
-
-      if (isAnchor) btf.updateAnchor(currentId)
-
-      detectItem = currentIndex
-
-      if (isToc) {
-        $cardToc.querySelectorAll('.active').forEach(i => i.classList.remove('active'))
-
-        if (currentId) {
-          const currentActive = $tocLink[currentIndex]
-          currentActive.classList.add('active')
-
-          setTimeout(() => autoScrollToc(currentActive), 0)
-
-          if (!isExpand) {
-            let parent = currentActive.parentNode
-            while (!parent.matches('.toc')) {
-              if (parent.matches('li')) parent.classList.add('active')
-              parent = parent.parentNode
-            }
-          }
-        }
-      }
-    }
-
-    // main of scroll
-    const tocScrollFn = btf.throttle(() => {
-      const currentTop = window.scrollY || document.documentElement.scrollTop
-      if (isToc && GLOBAL_CONFIG.percent.toc) {
-        $tocPercentage.textContent = btf.getScrollPercent(currentTop, $article)
-      }
-      findHeadPosition(currentTop)
-    }, 100)
-
-    btf.addEventListenerPjax(window, 'scroll', tocScrollFn, { passive: true })
-  }
-
-  const handleThemeChange = mode => {
-    const globalFn = window.globalFn || {}
-    const themeChange = globalFn.themeChange || {}
-    if (!themeChange) {
-      return
-    }
-
-    Object.keys(themeChange).forEach(key => {
-      const themeChangeFn = themeChange[key]
-      if (['disqus', 'disqusjs'].includes(key)) {
-        setTimeout(() => themeChangeFn(mode), 300)
-      } else {
-        themeChangeFn(mode)
-      }
-    })
-  }
-
-  /**
-   * Rightside
-   */
-  const rightSideFn = {
-    readmode: () => { // read mode
-      const $body = document.body
-      const newEle = document.createElement('button')
-
-      const exitReadMode = () => {
-        $body.classList.remove('read-mode')
-        newEle.remove()
-        newEle.removeEventListener('click', exitReadMode)
-      }
-
-      $body.classList.add('read-mode')
-      newEle.type = 'button'
-      newEle.className = 'fas fa-sign-out-alt exit-readmode'
-      newEle.addEventListener('click', exitReadMode)
-      $body.appendChild(newEle)
-    },
-    darkmode: () => { // switch between light and dark mode
-      const willChangeMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
-      if (willChangeMode === 'dark') {
-        btf.activateDarkMode()
-        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
-      } else {
-        btf.activateLightMode()
-        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
-      }
-      btf.saveToLocal.set('theme', willChangeMode, 2)
-      handleThemeChange(willChangeMode)
-    },
-    'rightside-config': item => { // Show or hide rightside-hide-btn
-      const hideLayout = item.firstElementChild
-      if (hideLayout.classList.contains('show')) {
-        hideLayout.classList.add('status')
-        setTimeout(() => {
-          hideLayout.classList.remove('status')
-        }, 300)
-      }
-
-      hideLayout.classList.toggle('show')
-    },
-    'go-up': () => { // Back to top
-      btf.scrollToDest(0, 500)
-    },
-    'hide-aside-btn': () => { // Hide aside
-      const $htmlDom = document.documentElement.classList
-      const saveStatus = $htmlDom.contains('hide-aside') ? 'show' : 'hide'
-      btf.saveToLocal.set('aside-status', saveStatus, 2)
-      $htmlDom.toggle('hide-aside')
-    },
-    'mobile-toc-button': (p, item) => { // Show mobile toc
-      const tocEle = document.getElementById('card-toc')
-      tocEle.style.transition = 'transform 0.3s ease-in-out'
-
-      const tocEleHeight = tocEle.clientHeight
-      const btData = item.getBoundingClientRect()
-
-      const tocEleBottom = window.innerHeight - btData.bottom - 30
-      if (tocEleHeight > tocEleBottom) {
-        tocEle.style.transformOrigin = `right ${tocEleHeight - tocEleBottom - btData.height / 2}px`
-      }
-
-      tocEle.classList.toggle('open')
-      tocEle.addEventListener('transitionend', () => {
-        tocEle.style.cssText = ''
-      }, { once: true })
-    },
-    'chat-btn': () => { // Show chat
-      window.chatBtnFn()
-    },
-    translateLink: () => { // switch between traditional and simplified chinese
-      window.translateFn.translatePage()
-    }
-  }
-
-  document.getElementById('rightside').addEventListener('click', e => {
-    const $target = e.target.closest('[id]')
-    if ($target && rightSideFn[$target.id]) {
-      rightSideFn[$target.id](e.currentTarget, $target)
-    }
-  })
-
-  /**
-   * menu
-   * 側邊欄sub-menu 展開/收縮
-   */
-  const clickFnOfSubMenu = () => {
-    const handleClickOfSubMenu = e => {
-      const target = e.target.closest('.site-page.group')
-      if (!target) return
-      target.classList.toggle('hide')
-    }
-
-    const menusItems = document.querySelector('#sidebar-menus .menus_items')
-    menusItems && menusItems.addEventListener('click', handleClickOfSubMenu)
-  }
-
-  /**
-   * 手机端目录点击
-   */
-  const openMobileMenu = () => {
-    const toggleMenu = document.getElementById('toggle-menu')
-    if (!toggleMenu) return
-    btf.addEventListenerPjax(toggleMenu, 'click', () => { sidebarFn.open() })
-  }
-
-  /**
- * 複製時加上版權信息
- */
-  const addCopyright = () => {
-    const { limitCount, languages } = GLOBAL_CONFIG.copyright
-
-    const handleCopy = (e) => {
-      e.preventDefault()
-      const copyFont = window.getSelection(0).toString()
-      let textFont = copyFont
-      if (copyFont.length > limitCount) {
-        textFont = `${copyFont}\n\n\n${languages.author}\n${languages.link}${window.location.href}\n${languages.source}\n${languages.info}`
-      }
-      if (e.clipboardData) {
-        return e.clipboardData.setData('text', textFont)
-      } else {
-        return window.clipboardData.setData('text', textFont)
-      }
-    }
-
-    document.body.addEventListener('copy', handleCopy)
-  }
-
-  /**
-   * 網頁運行時間
-   */
-  const addRuntime = () => {
-    const $runtimeCount = document.getElementById('runtimeshow')
-    if ($runtimeCount) {
-      const publishDate = $runtimeCount.getAttribute('data-publishDate')
-      $runtimeCount.textContent = `${btf.diffDate(publishDate)} ${GLOBAL_CONFIG.runtime}`
-    }
-  }
-
-  /**
-   * 最後一次更新時間
-   */
-  const addLastPushDate = () => {
-    const $lastPushDateItem = document.getElementById('last-push-date')
-    if ($lastPushDateItem) {
-      const lastPushDate = $lastPushDateItem.getAttribute('data-lastPushDate')
-      $lastPushDateItem.textContent = btf.diffDate(lastPushDate, true)
-    }
-  }
-
-  /**
-   * table overflow
-   */
-  const addTableWrap = () => {
-    const $table = document.querySelectorAll('#article-container table')
-    if (!$table.length) return
-
-    $table.forEach(item => {
-      if (!item.closest('.highlight')) {
-        btf.wrap(item, 'div', { class: 'table-wrap' })
-      }
-    })
-  }
-
-  /**
-   * tag-hide
-   */
-  const clickFnOfTagHide = () => {
-    const hideButtons = document.querySelectorAll('#article-container .hide-button')
-    if (!hideButtons.length) return
-    hideButtons.forEach(item => item.addEventListener('click', e => {
-      const currentTarget = e.currentTarget
-      currentTarget.classList.add('open')
-      addJustifiedGallery(currentTarget.nextElementSibling.querySelectorAll('.gallery-container'))
-    }, { once: true }))
-  }
-
-  const tabsFn = () => {
-    const navTabsElements = document.querySelectorAll('#article-container .tabs')
-    if (!navTabsElements.length) return
-
-    const setActiveClass = (elements, activeIndex) => {
-      elements.forEach((el, index) => {
-        el.classList.toggle('active', index === activeIndex)
-      })
-    }
-
-    const handleNavClick = e => {
-      const target = e.target.closest('button')
-      if (!target || target.classList.contains('active')) return
-
-      const navItems = [...e.currentTarget.children]
-      const tabContents = [...e.currentTarget.nextElementSibling.children]
-      const indexOfButton = navItems.indexOf(target)
-      setActiveClass(navItems, indexOfButton)
-      e.currentTarget.classList.remove('no-default')
-      setActiveClass(tabContents, indexOfButton)
-      addJustifiedGallery(tabContents[indexOfButton].querySelectorAll('.gallery-container'), true)
-    }
-
-    const handleToTopClick = tabElement => e => {
-      if (e.target.closest('button')) {
-        btf.scrollToDest(btf.getEleTop(tabElement), 300)
-      }
-    }
-
-    navTabsElements.forEach(tabElement => {
-      btf.addEventListenerPjax(tabElement.firstElementChild, 'click', handleNavClick)
-      btf.addEventListenerPjax(tabElement.lastElementChild, 'click', handleToTopClick(tabElement))
-    })
-  }
-
-  const toggleCardCategory = () => {
-    const cardCategory = document.querySelector('#aside-cat-list.expandBtn')
-    if (!cardCategory) return
-
-    const handleToggleBtn = e => {
-      const target = e.target
-      if (target.nodeName === 'I') {
-        e.preventDefault()
-        target.parentNode.classList.toggle('expand')
-      }
-    }
-    btf.addEventListenerPjax(cardCategory, 'click', handleToggleBtn, true)
-  }
-
-  const addPostOutdateNotice = () => {
-    const ele = document.getElementById('post-outdate-notice')
-    if (!ele) return
-
-    const { limitDay, messagePrev, messageNext, postUpdate } = JSON.parse(ele.getAttribute('data'))
-    const diffDay = btf.diffDate(postUpdate)
-    if (diffDay >= limitDay) {
-      ele.textContent = `${messagePrev} ${diffDay} ${messageNext}`
-      ele.hidden = false
-    }
-  }
-
-  const lazyloadImg = () => {
-    window.lazyLoadInstance = new LazyLoad({
-      elements_selector: 'img',
-      threshold: 0,
-      data_src: 'lazy-src'
-    })
-
-    btf.addGlobalFn('pjaxComplete', () => {
-      window.lazyLoadInstance.update()
-    }, 'lazyload')
-  }
-
-  const relativeDate = selector => {
-    selector.forEach(item => {
-      item.textContent = btf.diffDate(item.getAttribute('datetime'), true)
-      item.style.display = 'inline'
-    })
-  }
-
-  const justifiedIndexPostUI = () => {
-    const recentPostsElement = document.getElementById('recent-posts')
-    if (!(recentPostsElement && recentPostsElement.classList.contains('masonry'))) return
-
-    const init = () => {
-      const masonryItem = new InfiniteGrid.MasonryInfiniteGrid('.recent-post-items', {
-        gap: { horizontal: 10, vertical: 20 },
-        useTransform: true,
-        useResizeObserver: true
-      })
-      masonryItem.renderItems()
-      btf.addGlobalFn('pjaxCompleteOnce', () => { masonryItem.destroy() }, 'removeJustifiedIndexPostUI')
-    }
-
-    typeof InfiniteGrid === 'function' ? init() : btf.getScript(`${GLOBAL_CONFIG.infinitegrid.js}`).then(init)
-  }
-
-  const unRefreshFn = () => {
-    window.addEventListener('resize', () => {
-      adjustMenu(false)
-      mobileSidebarOpen && btf.isHidden(document.getElementById('toggle-menu')) && sidebarFn.close()
-    })
-
-    const menuMask = document.getElementById('menu-mask')
-    menuMask && menuMask.addEventListener('click', () => { sidebarFn.close() })
-
-    clickFnOfSubMenu()
-    GLOBAL_CONFIG.islazyloadPlugin && lazyloadImg()
-    GLOBAL_CONFIG.copyright !== undefined && addCopyright()
-
-    if (GLOBAL_CONFIG.autoDarkmode) {
-      window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
-        if (btf.saveToLocal.get('theme') !== undefined) return
-        e.matches ? handleThemeChange('dark') : handleThemeChange('light')
-      })
-    }
-  }
-
-  const forPostFn = () => {
-    addHighlightTool()
-    addPhotoFigcaption()
-    addJustifiedGallery(document.querySelectorAll('#article-container .gallery-container'))
-    runLightbox()
-    scrollFnToDo()
-    addTableWrap()
-    clickFnOfTagHide()
-    tabsFn()
-  }
-
-  const refreshFn = () => {
-    initAdjust()
-    justifiedIndexPostUI()
-
-    if (GLOBAL_CONFIG_SITE.pageType === 'post') {
-      addPostOutdateNotice()
-      GLOBAL_CONFIG.relativeDate.post && relativeDate(document.querySelectorAll('#post-meta time'))
-    } else {
-      GLOBAL_CONFIG.relativeDate.homepage && relativeDate(document.querySelectorAll('#recent-posts time'))
-      GLOBAL_CONFIG.runtime && addRuntime()
-      addLastPushDate()
-      toggleCardCategory()
-    }
-
-    GLOBAL_CONFIG_SITE.pageType === 'home' && scrollDownInIndex()
-    scrollFn()
-
-    forPostFn()
-    GLOBAL_CONFIG_SITE.pageType !== 'shuoshuo' && btf.switchComments(document)
-    openMobileMenu()
-  }
-
-  btf.addGlobalFn('pjaxComplete', refreshFn, 'refreshFn')
-  refreshFn()
-  unRefreshFn()
-
-  // 處理 hexo-blog-encrypt 事件
-  window.addEventListener('hexo-blog-decrypt', e => {
-    forPostFn()
-    window.translateFn.translateInitialization()
-    Object.values(window.globalFn.encrypt).forEach(fn => {
-      fn()
-    })
-  })
-})
+document.addEventListener('DOMContentLoaded', () => {
+  let headerContentWidth, $nav
+  let mobileSidebarOpen = false
+
+  const adjustMenu = init => {
+    const getAllWidth = ele => Array.from(ele).reduce((width, i) => width + i.offsetWidth, 0)
+
+    if (init) {
+      const blogInfoWidth = getAllWidth(document.querySelector('#blog-info > a').children)
+      const menusWidth = getAllWidth(document.getElementById('menus').children)
+      headerContentWidth = blogInfoWidth + menusWidth
+      $nav = document.getElementById('nav')
+    }
+
+    const hideMenuIndex = window.innerWidth <= 768 || headerContentWidth > $nav.offsetWidth - 120
+    $nav.classList.toggle('hide-menu', hideMenuIndex)
+  }
+
+  // 初始化header
+  const initAdjust = () => {
+    adjustMenu(true)
+    $nav.classList.add('show')
+  }
+
+  // sidebar menus
+  const sidebarFn = {
+    open: () => {
+      btf.overflowPaddingR.add()
+      btf.animateIn(document.getElementById('menu-mask'), 'to_show 0.5s')
+      document.getElementById('sidebar-menus').classList.add('open')
+      mobileSidebarOpen = true
+    },
+    close: () => {
+      btf.overflowPaddingR.remove()
+      btf.animateOut(document.getElementById('menu-mask'), 'to_hide 0.5s')
+      document.getElementById('sidebar-menus').classList.remove('open')
+      mobileSidebarOpen = false
+    }
+  }
+
+  /**
+   * 首頁top_img底下的箭頭
+   */
+  const scrollDownInIndex = () => {
+    const handleScrollToDest = () => {
+      btf.scrollToDest(document.getElementById('content-inner').offsetTop, 300)
+    }
+
+    const $scrollDownEle = document.getElementById('scroll-down')
+    $scrollDownEle && btf.addEventListenerPjax($scrollDownEle, 'click', handleScrollToDest)
+  }
+
+  /**
+   * 代碼
+   * 只適用於Hexo默認的代碼渲染
+   */
+  const addHighlightTool = () => {
+    const highLight = GLOBAL_CONFIG.highlight
+    if (!highLight) return
+
+    const { highlightCopy, highlightLang, highlightHeightLimit, highlightFullpage, highlightMacStyle, plugin } = highLight
+    const isHighlightShrink = GLOBAL_CONFIG_SITE.isHighlightShrink
+    const isShowTool = highlightCopy || highlightLang || isHighlightShrink !== undefined || highlightFullpage || highlightMacStyle
+    const $figureHighlight = plugin === 'highlight.js' ? document.querySelectorAll('figure.highlight') : document.querySelectorAll('pre[class*="language-"]')
+
+    if (!((isShowTool || highlightHeightLimit) && $figureHighlight.length)) return
+
+    const isPrismjs = plugin === 'prismjs'
+    const highlightShrinkClass = isHighlightShrink === true ? 'closed' : ''
+    const highlightShrinkEle = isHighlightShrink !== undefined ? '' : ''
+    const highlightCopyEle = highlightCopy ? '
    ' : ''
+    const highlightMacStyleEle = '
    '
+    const highlightFullpageEle = highlightFullpage ? '' : ''
+
+    const alertInfo = (ele, text) => {
+      if (GLOBAL_CONFIG.Snackbar !== undefined) {
+        btf.snackbarShow(text)
+      } else {
+        ele.textContent = text
+        ele.style.opacity = 1
+        setTimeout(() => { ele.style.opacity = 0 }, 800)
+      }
+    }
+
+    const copy = async (text, ctx) => {
+      try {
+        await navigator.clipboard.writeText(text)
+        alertInfo(ctx, GLOBAL_CONFIG.copy.success)
+      } catch (err) {
+        console.error('Failed to copy: ', err)
+        alertInfo(ctx, GLOBAL_CONFIG.copy.noSupport)
+      }
+    }
+
+    // click events
+    const highlightCopyFn = (ele, clickEle) => {
+      const $buttonParent = ele.parentNode
+      $buttonParent.classList.add('copy-true')
+      const preCodeSelector = isPrismjs ? 'pre code' : 'table .code pre'
+      const codeElement = $buttonParent.querySelector(preCodeSelector)
+      if (!codeElement) return
+      copy(codeElement.innerText, clickEle.previousElementSibling)
+      $buttonParent.classList.remove('copy-true')
+    }
+
+    const highlightShrinkFn = ele => ele.classList.toggle('closed')
+
+    const codeFullpage = (item, clickEle) => {
+      const wrapEle = item.closest('figure.highlight')
+      const isFullpage = wrapEle.classList.toggle('code-fullpage')
+
+      document.body.style.overflow = isFullpage ? 'hidden' : ''
+      clickEle.classList.toggle('fa-down-left-and-up-right-to-center', isFullpage)
+      clickEle.classList.toggle('fa-up-right-and-down-left-from-center', !isFullpage)
+    }
+
+    const highlightToolsFn = e => {
+      const $target = e.target.classList
+      const currentElement = e.currentTarget
+      if ($target.contains('expand')) highlightShrinkFn(currentElement)
+      else if ($target.contains('copy-button')) highlightCopyFn(currentElement, e.target)
+      else if ($target.contains('fullpage-button')) codeFullpage(currentElement, e.target)
+    }
+
+    const expandCode = e => e.currentTarget.classList.toggle('expand-done')
+
+    // 獲取隱藏狀態下元素的真實高度
+    const getActualHeight = item => {
+      const hiddenElements = new Map()
+
+      const fix = () => {
+        let current = item
+        while (current !== document.body && current != null) {
+          if (window.getComputedStyle(current).display === 'none') {
+            hiddenElements.set(current, current.getAttribute('style') || '')
+          }
+          current = current.parentNode
+        }
+
+        const style = 'visibility: hidden !important; display: block !important;'
+        hiddenElements.forEach((originalStyle, elem) => {
+          elem.setAttribute('style', originalStyle ? originalStyle + ';' + style : style)
+        })
+      }
+
+      const restore = () => {
+        hiddenElements.forEach((originalStyle, elem) => {
+          if (originalStyle === '') elem.removeAttribute('style')
+          else elem.setAttribute('style', originalStyle)
+        })
+      }
+
+      fix()
+      const height = item.offsetHeight
+      restore()
+      return height
+    }
+
+    const createEle = (lang, item) => {
+      const fragment = document.createDocumentFragment()
+
+      if (isShowTool) {
+        const hlTools = document.createElement('div')
+        hlTools.className = `highlight-tools ${highlightShrinkClass}`
+        hlTools.innerHTML = highlightMacStyleEle + highlightShrinkEle + lang + highlightCopyEle + highlightFullpageEle
+        btf.addEventListenerPjax(hlTools, 'click', highlightToolsFn)
+        fragment.appendChild(hlTools)
+      }
+
+      if (highlightHeightLimit && getActualHeight(item) > highlightHeightLimit + 30) {
+        const ele = document.createElement('div')
+        ele.className = 'code-expand-btn'
+        ele.innerHTML = ''
+        btf.addEventListenerPjax(ele, 'click', expandCode)
+        fragment.appendChild(ele)
+      }
+
+      isPrismjs ? item.parentNode.insertBefore(fragment, item) : item.insertBefore(fragment, item.firstChild)
+    }
+
+    $figureHighlight.forEach(item => {
+      let langName = ''
+      if (isPrismjs) btf.wrap(item, 'figure', { class: 'highlight' })
+
+      if (!highlightLang) {
+        createEle('', item)
+        return
+      }
+
+      if (isPrismjs) {
+        langName = item.getAttribute('data-language') || 'Code'
+      } else {
+        langName = item.getAttribute('class').split(' ')[1]
+        if (langName === 'plain' || langName === undefined) langName = 'Code'
+      }
+      createEle(`
    ${langName}
    `, item)
+    })
+  }
+
+  /**
+   * PhotoFigcaption
+   */
+  const addPhotoFigcaption = () => {
+    if (!GLOBAL_CONFIG.isPhotoFigcaption) return
+    document.querySelectorAll('#article-container img').forEach(item => {
+      const altValue = item.title || item.alt
+      if (!altValue) return
+      const ele = document.createElement('div')
+      ele.className = 'img-alt text-center'
+      ele.textContent = altValue
+      item.insertAdjacentElement('afterend', ele)
+    })
+  }
+
+  /**
+   * Lightbox
+   */
+  const runLightbox = () => {
+    btf.loadLightbox(document.querySelectorAll('#article-container img:not(.no-lightbox)'))
+  }
+
+  /**
+   * justified-gallery 圖庫排版
+   */
+
+  const fetchUrl = async url => {
+    try {
+      const response = await fetch(url)
+      return await response.json()
+    } catch (error) {
+      console.error('Failed to fetch URL:', error)
+      return []
+    }
+  }
+
+  const runJustifiedGallery = (container, data, config) => {
+    const { isButton, limit, firstLimit, tabs } = config
+
+    const dataLength = data.length
+    const maxGroupKey = Math.ceil((dataLength - firstLimit) / limit + 1)
+
+    // Gallery configuration
+    const igConfig = {
+      gap: 5,
+      isConstantSize: true,
+      sizeRange: [150, 600],
+      // useResizeObserver: true,
+      // observeChildren: true,
+      useTransform: true
+      // useRecycle: false
+    }
+
+    const ig = new InfiniteGrid.JustifiedInfiniteGrid(container, igConfig)
+    let isLayoutHidden = false
+
+    // Utility functions
+    const sanitizeString = str => (str && str.replace(/"/g, '"')) || ''
+
+    const createImageItem = item => {
+      const alt = item.alt ? `alt="${sanitizeString(item.alt)}"` : ''
+      const title = item.title ? `title="${sanitizeString(item.title)}"` : ''
+      return `
    
+        
+      
    `
+    }
+
+    const getItems = (nextGroupKey, count, isFirst = false) => {
+      const startIndex = isFirst ? (nextGroupKey - 1) * count : (nextGroupKey - 2) * count + firstLimit
+      return data.slice(startIndex, startIndex + count).map(createImageItem)
+    }
+
+    // Load more button
+    const addLoadMoreButton = container => {
+      const button = document.createElement('button')
+      button.innerHTML = `${GLOBAL_CONFIG.infinitegrid.buttonText}`
+
+      button.addEventListener('click', () => {
+        button.remove()
+        btf.setLoading.add(container)
+        appendItems(ig.getGroups().length + 1, limit)
+      }, { once: true })
+
+      container.insertAdjacentElement('afterend', button)
+    }
+
+    const appendItems = (nextGroupKey, count, isFirst) => {
+      ig.append(getItems(nextGroupKey, count, isFirst), nextGroupKey)
+    }
+
+    // Event handlers
+    const handleRenderComplete = e => {
+      if (tabs) {
+        const parentNode = container.parentNode
+        if (isLayoutHidden) {
+          parentNode.style.visibility = 'visible'
+        }
+        if (container.offsetHeight === 0) {
+          parentNode.style.visibility = 'hidden'
+          isLayoutHidden = true
+        }
+      }
+
+      const { updated, isResize, mounted } = e
+      if (!updated.length || !mounted.length || isResize) return
+
+      btf.loadLightbox(container.querySelectorAll('img:not(.medium-zoom-image)'))
+
+      if (ig.getGroups().length === maxGroupKey) {
+        btf.setLoading.remove(container)
+        !tabs && ig.off('renderComplete', handleRenderComplete)
+        return
+      }
+
+      if (isButton) {
+        btf.setLoading.remove(container)
+        addLoadMoreButton(container)
+      }
+    }
+
+    const handleRequestAppend = btf.debounce(e => {
+      const nextGroupKey = (+e.groupKey || 0) + 1
+
+      if (nextGroupKey === 1) appendItems(nextGroupKey, firstLimit, true)
+      else appendItems(nextGroupKey, limit)
+
+      if (nextGroupKey === maxGroupKey) ig.off('requestAppend', handleRequestAppend)
+    }, 300)
+
+    btf.setLoading.add(container)
+    ig.on('renderComplete', handleRenderComplete)
+
+    if (isButton) {
+      appendItems(1, firstLimit, true)
+    } else {
+      ig.on('requestAppend', handleRequestAppend)
+      ig.renderItems()
+    }
+
+    btf.addGlobalFn('pjaxSendOnce', () => ig.destroy())
+  }
+
+  const addJustifiedGallery = async (elements, tabs = false) => {
+    if (!elements.length) return
+
+    const initGallery = async () => {
+      for (const element of elements) {
+        if (btf.isHidden(element) || element.classList.contains('loaded')) continue
+
+        const config = {
+          isButton: element.getAttribute('data-button') === 'true',
+          limit: parseInt(element.getAttribute('data-limit'), 10),
+          firstLimit: parseInt(element.getAttribute('data-first'), 10),
+          tabs
+        }
+
+        const container = element.firstElementChild
+        const content = container.textContent
+        container.textContent = ''
+        element.classList.add('loaded')
+
+        try {
+          const data = element.getAttribute('data-type') === 'url' ? await fetchUrl(content) : JSON.parse(content)
+          runJustifiedGallery(container, data, config)
+        } catch (error) {
+          console.error('Gallery data parsing failed:', error)
+        }
+      }
+    }
+
+    if (typeof InfiniteGrid === 'function') {
+      await initGallery()
+    } else {
+      await btf.getScript(GLOBAL_CONFIG.infinitegrid.js)
+      await initGallery()
+    }
+  }
+
+  /**
+   * rightside scroll percent
+   */
+  const rightsideScrollPercent = currentTop => {
+    const scrollPercent = btf.getScrollPercent(currentTop, document.body)
+    const goUpElement = document.getElementById('go-up')
+
+    if (scrollPercent < 95) {
+      goUpElement.classList.add('show-percent')
+      goUpElement.querySelector('.scroll-percent').textContent = scrollPercent
+    } else {
+      goUpElement.classList.remove('show-percent')
+    }
+  }
+
+  /**
+   * 滾動處理
+   */
+  const scrollFn = () => {
+    const $rightside = document.getElementById('rightside')
+    const innerHeight = window.innerHeight + 56
+    let initTop = 0
+    const $header = document.getElementById('page-header')
+    const isChatBtn = typeof chatBtn !== 'undefined'
+    const isShowPercent = GLOBAL_CONFIG.percent.rightside
+
+    // 檢查文檔高度是否小於視窗高度
+    const checkDocumentHeight = () => {
+      if (document.body.scrollHeight <= innerHeight) {
+        $rightside.classList.add('rightside-show')
+        return true
+      }
+      return false
+    }
+
+    // 如果文檔高度小於視窗高度,直接返回
+    if (checkDocumentHeight()) return
+
+    // find the scroll direction
+    const scrollDirection = currentTop => {
+      const result = currentTop > initTop // true is down & false is up
+      initTop = currentTop
+      return result
+    }
+
+    let flag = ''
+    const scrollTask = btf.throttle(() => {
+      const currentTop = window.scrollY || document.documentElement.scrollTop
+      const isDown = scrollDirection(currentTop)
+      if (currentTop > 56) {
+        if (flag === '') {
+          $header.classList.add('nav-fixed')
+          $rightside.classList.add('rightside-show')
+        }
+
+        if (isDown) {
+          if (flag !== 'down') {
+            $header.classList.remove('nav-visible')
+            isChatBtn && window.chatBtn.hide()
+            flag = 'down'
+          }
+        } else {
+          if (flag !== 'up') {
+            $header.classList.add('nav-visible')
+            isChatBtn && window.chatBtn.show()
+            flag = 'up'
+          }
+        }
+      } else {
+        flag = ''
+        if (currentTop === 0) {
+          $header.classList.remove('nav-fixed', 'nav-visible')
+        }
+        $rightside.classList.remove('rightside-show')
+      }
+
+      isShowPercent && rightsideScrollPercent(currentTop)
+      checkDocumentHeight()
+    }, 300)
+
+    btf.addEventListenerPjax(window, 'scroll', scrollTask, { passive: true })
+  }
+
+  /**
+  * toc,anchor
+  */
+  const scrollFnToDo = () => {
+    const isToc = GLOBAL_CONFIG_SITE.isToc
+    const isAnchor = GLOBAL_CONFIG.isAnchor
+    const $article = document.getElementById('article-container')
+
+    if (!($article && (isToc || isAnchor))) return
+
+    let $tocLink, $cardToc, autoScrollToc, $tocPercentage, isExpand
+
+    if (isToc) {
+      const $cardTocLayout = document.getElementById('card-toc')
+      $cardToc = $cardTocLayout.querySelector('.toc-content')
+      $tocLink = $cardToc.querySelectorAll('.toc-link')
+      $tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
+      isExpand = $cardToc.classList.contains('is-expand')
+
+      // toc元素點擊
+      const tocItemClickFn = e => {
+        const target = e.target.closest('.toc-link')
+        if (!target) return
+
+        e.preventDefault()
+        btf.scrollToDest(btf.getEleTop(document.getElementById(decodeURI(target.getAttribute('href')).replace('#', ''))), 300)
+        if (window.innerWidth < 900) {
+          $cardTocLayout.classList.remove('open')
+        }
+      }
+
+      btf.addEventListenerPjax($cardToc, 'click', tocItemClickFn)
+
+      autoScrollToc = item => {
+        const sidebarHeight = $cardToc.clientHeight
+        const itemOffsetTop = item.offsetTop
+        const itemHeight = item.clientHeight
+        const scrollTop = $cardToc.scrollTop
+        const offset = itemOffsetTop - scrollTop
+        const middlePosition = (sidebarHeight - itemHeight) / 2
+
+        if (offset !== middlePosition) {
+          $cardToc.scrollTop = scrollTop + (offset - middlePosition)
+        }
+      }
+
+      // 處理 hexo-blog-encrypt 事件
+      $cardToc.style.display = 'block'
+    }
+
+    // find head position & add active class
+    const $articleList = $article.querySelectorAll('h1,h2,h3,h4,h5,h6')
+    let detectItem = ''
+
+    const findHeadPosition = top => {
+      if (top === 0) return false
+
+      let currentId = ''
+      let currentIndex = ''
+
+      for (let i = 0; i < $articleList.length; i++) {
+        const ele = $articleList[i]
+        if (top > btf.getEleTop(ele) - 80) {
+          const id = ele.id
+          currentId = id ? '#' + encodeURI(id) : ''
+          currentIndex = i
+        } else {
+          break
+        }
+      }
+
+      if (detectItem === currentIndex) return
+
+      if (isAnchor) btf.updateAnchor(currentId)
+
+      detectItem = currentIndex
+
+      if (isToc) {
+        $cardToc.querySelectorAll('.active').forEach(i => i.classList.remove('active'))
+
+        if (currentId) {
+          const currentActive = $tocLink[currentIndex]
+          currentActive.classList.add('active')
+
+          setTimeout(() => autoScrollToc(currentActive), 0)
+
+          if (!isExpand) {
+            let parent = currentActive.parentNode
+            while (!parent.matches('.toc')) {
+              if (parent.matches('li')) parent.classList.add('active')
+              parent = parent.parentNode
+            }
+          }
+        }
+      }
+    }
+
+    // main of scroll
+    const tocScrollFn = btf.throttle(() => {
+      const currentTop = window.scrollY || document.documentElement.scrollTop
+      if (isToc && GLOBAL_CONFIG.percent.toc) {
+        $tocPercentage.textContent = btf.getScrollPercent(currentTop, $article)
+      }
+      findHeadPosition(currentTop)
+    }, 100)
+
+    btf.addEventListenerPjax(window, 'scroll', tocScrollFn, { passive: true })
+  }
+
+  const handleThemeChange = mode => {
+    const globalFn = window.globalFn || {}
+    const themeChange = globalFn.themeChange || {}
+    if (!themeChange) {
+      return
+    }
+
+    Object.keys(themeChange).forEach(key => {
+      const themeChangeFn = themeChange[key]
+      if (['disqus', 'disqusjs'].includes(key)) {
+        setTimeout(() => themeChangeFn(mode), 300)
+      } else {
+        themeChangeFn(mode)
+      }
+    })
+  }
+
+  /**
+   * Rightside
+   */
+  const rightSideFn = {
+    readmode: () => { // read mode
+      const $body = document.body
+      const newEle = document.createElement('button')
+
+      const exitReadMode = () => {
+        $body.classList.remove('read-mode')
+        newEle.remove()
+        newEle.removeEventListener('click', exitReadMode)
+      }
+
+      $body.classList.add('read-mode')
+      newEle.type = 'button'
+      newEle.className = 'fas fa-sign-out-alt exit-readmode'
+      newEle.addEventListener('click', exitReadMode)
+      $body.appendChild(newEle)
+    },
+    darkmode: () => { // switch between light and dark mode
+      const willChangeMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark'
+      if (willChangeMode === 'dark') {
+        btf.activateDarkMode()
+        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night)
+      } else {
+        btf.activateLightMode()
+        GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day)
+      }
+      btf.saveToLocal.set('theme', willChangeMode, 2)
+      handleThemeChange(willChangeMode)
+    },
+    'rightside-config': item => { // Show or hide rightside-hide-btn
+      const hideLayout = item.firstElementChild
+      if (hideLayout.classList.contains('show')) {
+        hideLayout.classList.add('status')
+        setTimeout(() => {
+          hideLayout.classList.remove('status')
+        }, 300)
+      }
+
+      hideLayout.classList.toggle('show')
+    },
+    'go-up': () => { // Back to top
+      btf.scrollToDest(0, 500)
+    },
+    'hide-aside-btn': () => { // Hide aside
+      const $htmlDom = document.documentElement.classList
+      const saveStatus = $htmlDom.contains('hide-aside') ? 'show' : 'hide'
+      btf.saveToLocal.set('aside-status', saveStatus, 2)
+      $htmlDom.toggle('hide-aside')
+    },
+    'mobile-toc-button': (p, item) => { // Show mobile toc
+      const tocEle = document.getElementById('card-toc')
+      tocEle.style.transition = 'transform 0.3s ease-in-out'
+
+      const tocEleHeight = tocEle.clientHeight
+      const btData = item.getBoundingClientRect()
+
+      const tocEleBottom = window.innerHeight - btData.bottom - 30
+      if (tocEleHeight > tocEleBottom) {
+        tocEle.style.transformOrigin = `right ${tocEleHeight - tocEleBottom - btData.height / 2}px`
+      }
+
+      tocEle.classList.toggle('open')
+      tocEle.addEventListener('transitionend', () => {
+        tocEle.style.cssText = ''
+      }, { once: true })
+    },
+    'chat-btn': () => { // Show chat
+      window.chatBtnFn()
+    },
+    translateLink: () => { // switch between traditional and simplified chinese
+      window.translateFn.translatePage()
+    }
+  }
+
+  document.getElementById('rightside').addEventListener('click', e => {
+    const $target = e.target.closest('[id]')
+    if ($target && rightSideFn[$target.id]) {
+      rightSideFn[$target.id](e.currentTarget, $target)
+    }
+  })
+
+  /**
+   * menu
+   * 側邊欄sub-menu 展開/收縮
+   */
+  const clickFnOfSubMenu = () => {
+    const handleClickOfSubMenu = e => {
+      const target = e.target.closest('.site-page.group')
+      if (!target) return
+      target.classList.toggle('hide')
+    }
+
+    const menusItems = document.querySelector('#sidebar-menus .menus_items')
+    menusItems && menusItems.addEventListener('click', handleClickOfSubMenu)
+  }
+
+  /**
+   * 手机端目录点击
+   */
+  const openMobileMenu = () => {
+    const toggleMenu = document.getElementById('toggle-menu')
+    if (!toggleMenu) return
+    btf.addEventListenerPjax(toggleMenu, 'click', () => { sidebarFn.open() })
+  }
+
+  /**
+ * 複製時加上版權信息
+ */
+  const addCopyright = () => {
+    const { limitCount, languages } = GLOBAL_CONFIG.copyright
+
+    const handleCopy = (e) => {
+      e.preventDefault()
+      const copyFont = window.getSelection(0).toString()
+      let textFont = copyFont
+      if (copyFont.length > limitCount) {
+        textFont = `${copyFont}\n\n\n${languages.author}\n${languages.link}${window.location.href}\n${languages.source}\n${languages.info}`
+      }
+      if (e.clipboardData) {
+        return e.clipboardData.setData('text', textFont)
+      } else {
+        return window.clipboardData.setData('text', textFont)
+      }
+    }
+
+    document.body.addEventListener('copy', handleCopy)
+  }
+
+  /**
+   * 網頁運行時間
+   */
+  const addRuntime = () => {
+    const $runtimeCount = document.getElementById('runtimeshow')
+    if ($runtimeCount) {
+      const publishDate = $runtimeCount.getAttribute('data-publishDate')
+      $runtimeCount.textContent = `${btf.diffDate(publishDate)} ${GLOBAL_CONFIG.runtime}`
+    }
+  }
+
+  /**
+   * 最後一次更新時間
+   */
+  const addLastPushDate = () => {
+    const $lastPushDateItem = document.getElementById('last-push-date')
+    if ($lastPushDateItem) {
+      const lastPushDate = $lastPushDateItem.getAttribute('data-lastPushDate')
+      $lastPushDateItem.textContent = btf.diffDate(lastPushDate, true)
+    }
+  }
+
+  /**
+   * table overflow
+   */
+  const addTableWrap = () => {
+    const $table = document.querySelectorAll('#article-container table')
+    if (!$table.length) return
+
+    $table.forEach(item => {
+      if (!item.closest('.highlight')) {
+        btf.wrap(item, 'div', { class: 'table-wrap' })
+      }
+    })
+  }
+
+  /**
+   * tag-hide
+   */
+  const clickFnOfTagHide = () => {
+    const hideButtons = document.querySelectorAll('#article-container .hide-button')
+    if (!hideButtons.length) return
+    hideButtons.forEach(item => item.addEventListener('click', e => {
+      const currentTarget = e.currentTarget
+      currentTarget.classList.add('open')
+      addJustifiedGallery(currentTarget.nextElementSibling.querySelectorAll('.gallery-container'))
+    }, { once: true }))
+  }
+
+  const tabsFn = () => {
+    const navTabsElements = document.querySelectorAll('#article-container .tabs')
+    if (!navTabsElements.length) return
+
+    const setActiveClass = (elements, activeIndex) => {
+      elements.forEach((el, index) => {
+        el.classList.toggle('active', index === activeIndex)
+      })
+    }
+
+    const handleNavClick = e => {
+      const target = e.target.closest('button')
+      if (!target || target.classList.contains('active')) return
+
+      const navItems = [...e.currentTarget.children]
+      const tabContents = [...e.currentTarget.nextElementSibling.children]
+      const indexOfButton = navItems.indexOf(target)
+      setActiveClass(navItems, indexOfButton)
+      e.currentTarget.classList.remove('no-default')
+      setActiveClass(tabContents, indexOfButton)
+      addJustifiedGallery(tabContents[indexOfButton].querySelectorAll('.gallery-container'), true)
+    }
+
+    const handleToTopClick = tabElement => e => {
+      if (e.target.closest('button')) {
+        btf.scrollToDest(btf.getEleTop(tabElement), 300)
+      }
+    }
+
+    navTabsElements.forEach(tabElement => {
+      btf.addEventListenerPjax(tabElement.firstElementChild, 'click', handleNavClick)
+      btf.addEventListenerPjax(tabElement.lastElementChild, 'click', handleToTopClick(tabElement))
+    })
+  }
+
+  const toggleCardCategory = () => {
+    const cardCategory = document.querySelector('#aside-cat-list.expandBtn')
+    if (!cardCategory) return
+
+    const handleToggleBtn = e => {
+      const target = e.target
+      if (target.nodeName === 'I') {
+        e.preventDefault()
+        target.parentNode.classList.toggle('expand')
+      }
+    }
+    btf.addEventListenerPjax(cardCategory, 'click', handleToggleBtn, true)
+  }
+
+  const addPostOutdateNotice = () => {
+    const ele = document.getElementById('post-outdate-notice')
+    if (!ele) return
+
+    const { limitDay, messagePrev, messageNext, postUpdate } = JSON.parse(ele.getAttribute('data'))
+    const diffDay = btf.diffDate(postUpdate)
+    if (diffDay >= limitDay) {
+      ele.textContent = `${messagePrev} ${diffDay} ${messageNext}`
+      ele.hidden = false
+    }
+  }
+
+  const lazyloadImg = () => {
+    window.lazyLoadInstance = new LazyLoad({
+      elements_selector: 'img',
+      threshold: 0,
+      data_src: 'lazy-src'
+    })
+
+    btf.addGlobalFn('pjaxComplete', () => {
+      window.lazyLoadInstance.update()
+    }, 'lazyload')
+  }
+
+  const relativeDate = selector => {
+    selector.forEach(item => {
+      item.textContent = btf.diffDate(item.getAttribute('datetime'), true)
+      item.style.display = 'inline'
+    })
+  }
+
+  const justifiedIndexPostUI = () => {
+    const recentPostsElement = document.getElementById('recent-posts')
+    if (!(recentPostsElement && recentPostsElement.classList.contains('masonry'))) return
+
+    const init = () => {
+      const masonryItem = new InfiniteGrid.MasonryInfiniteGrid('.recent-post-items', {
+        gap: { horizontal: 10, vertical: 20 },
+        useTransform: true,
+        useResizeObserver: true
+      })
+      masonryItem.renderItems()
+      btf.addGlobalFn('pjaxCompleteOnce', () => { masonryItem.destroy() }, 'removeJustifiedIndexPostUI')
+    }
+
+    typeof InfiniteGrid === 'function' ? init() : btf.getScript(`${GLOBAL_CONFIG.infinitegrid.js}`).then(init)
+  }
+
+  const unRefreshFn = () => {
+    window.addEventListener('resize', () => {
+      adjustMenu(false)
+      mobileSidebarOpen && btf.isHidden(document.getElementById('toggle-menu')) && sidebarFn.close()
+    })
+
+    const menuMask = document.getElementById('menu-mask')
+    menuMask && menuMask.addEventListener('click', () => { sidebarFn.close() })
+
+    clickFnOfSubMenu()
+    GLOBAL_CONFIG.islazyloadPlugin && lazyloadImg()
+    GLOBAL_CONFIG.copyright !== undefined && addCopyright()
+
+    if (GLOBAL_CONFIG.autoDarkmode) {
+      window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
+        if (btf.saveToLocal.get('theme') !== undefined) return
+        e.matches ? handleThemeChange('dark') : handleThemeChange('light')
+      })
+    }
+  }
+
+  const forPostFn = () => {
+    addHighlightTool()
+    addPhotoFigcaption()
+    addJustifiedGallery(document.querySelectorAll('#article-container .gallery-container'))
+    runLightbox()
+    scrollFnToDo()
+    addTableWrap()
+    clickFnOfTagHide()
+    tabsFn()
+  }
+
+  const refreshFn = () => {
+    initAdjust()
+    justifiedIndexPostUI()
+
+    if (GLOBAL_CONFIG_SITE.pageType === 'post') {
+      addPostOutdateNotice()
+      GLOBAL_CONFIG.relativeDate.post && relativeDate(document.querySelectorAll('#post-meta time'))
+    } else {
+      GLOBAL_CONFIG.relativeDate.homepage && relativeDate(document.querySelectorAll('#recent-posts time'))
+      GLOBAL_CONFIG.runtime && addRuntime()
+      addLastPushDate()
+      toggleCardCategory()
+    }
+
+    GLOBAL_CONFIG_SITE.pageType === 'home' && scrollDownInIndex()
+    scrollFn()
+
+    forPostFn()
+    GLOBAL_CONFIG_SITE.pageType !== 'shuoshuo' && btf.switchComments(document)
+    openMobileMenu()
+  }
+
+  btf.addGlobalFn('pjaxComplete', refreshFn, 'refreshFn')
+  refreshFn()
+  unRefreshFn()
+
+  // 處理 hexo-blog-encrypt 事件
+  window.addEventListener('hexo-blog-decrypt', e => {
+    forPostFn()
+    window.translateFn.translateInitialization()
+    Object.values(window.globalFn.encrypt).forEach(fn => {
+      fn()
+    })
+  })
+})
diff --git a/source/js/search/algolia.js b/source/js/search/algolia.js
index 8624f52..af4e0df 100644
--- a/source/js/search/algolia.js
+++ b/source/js/search/algolia.js
@@ -1,174 +1,174 @@
-window.addEventListener('load', () => {
-  const { algolia } = GLOBAL_CONFIG
-  const { appId, apiKey, indexName, hitsPerPage = 5, languages } = algolia
-
-  if (!appId || !apiKey || !indexName) {
-    return console.error('Algolia setting is invalid!')
-  }
-
-  const $searchMask = document.getElementById('search-mask')
-  const $searchDialog = document.querySelector('#algolia-search .search-dialog')
-
-  const animateElements = show => {
-    const action = show ? 'animateIn' : 'animateOut'
-    const maskAnimation = show ? 'to_show 0.5s' : 'to_hide 0.5s'
-    const dialogAnimation = show ? 'titleScale 0.5s' : 'search_close .5s'
-    btf[action]($searchMask, maskAnimation)
-    btf[action]($searchDialog, dialogAnimation)
-  }
-
-  const fixSafariHeight = () => {
-    if (window.innerWidth < 768) {
-      $searchDialog.style.setProperty('--search-height', `${window.innerHeight}px`)
-    }
-  }
-
-  const openSearch = () => {
-    btf.overflowPaddingR.add()
-    animateElements(true)
-    setTimeout(() => { document.querySelector('#algolia-search .ais-SearchBox-input').focus() }, 100)
-
-    const handleEscape = event => {
-      if (event.code === 'Escape') {
-        closeSearch()
-        document.removeEventListener('keydown', handleEscape)
-      }
-    }
-
-    document.addEventListener('keydown', handleEscape)
-    fixSafariHeight()
-    window.addEventListener('resize', fixSafariHeight)
-  }
-
-  const closeSearch = () => {
-    btf.overflowPaddingR.remove()
-    animateElements(false)
-    window.removeEventListener('resize', fixSafariHeight)
-  }
-
-  const searchClickFn = () => {
-    btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', openSearch)
-  }
-
-  const searchFnOnce = () => {
-    $searchMask.addEventListener('click', closeSearch)
-    document.querySelector('#algolia-search .search-close-button').addEventListener('click', closeSearch)
-  }
-
-  const cutContent = (content) => {
-    if (!content) return ''
-    const firstOccur = content.indexOf('')
-    let start = firstOccur - 30
-    let end = firstOccur + 120
-    let pre = ''
-    let post = ''
-
-    if (start <= 0) {
-      start = 0
-      end = 140
-    } else {
-      pre = '...'
-    }
-
-    if (end > content.length) {
-      end = content.length
-    } else {
-      post = '...'
-    }
-
-    return `${pre}${content.substring(start, end)}${post}`
-  }
-
-  const disableDiv = [
-    document.getElementById('algolia-hits'),
-    document.getElementById('algolia-pagination'),
-    document.querySelector('#algolia-info .algolia-stats')
-  ]
-
-  const searchClient = typeof algoliasearch === 'function' ? algoliasearch : window['algoliasearch/lite'].liteClient
-  const search = instantsearch({
-    indexName,
-    searchClient: searchClient(appId, apiKey),
-    searchFunction (helper) {
-      disableDiv.forEach(item => {
-        item.style.display = helper.state.query ? '' : 'none'
-      })
-      if (helper.state.query) helper.search()
-    }
-  })
-
-  const widgets = [
-    instantsearch.widgets.configure({ hitsPerPage }),
-    instantsearch.widgets.searchBox({
-      container: '#algolia-search-input',
-      showReset: false,
-      showSubmit: false,
-      placeholder: languages.input_placeholder,
-      showLoadingIndicator: true
-    }),
-    instantsearch.widgets.hits({
-      container: '#algolia-hits',
-      templates: {
-        item (data) {
-          const link = data.permalink || (GLOBAL_CONFIG.root + data.path)
-          const result = data._highlightResult
-          const content = result.contentStripTruncate
-            ? cutContent(result.contentStripTruncate.value)
-            : result.contentStrip
-              ? cutContent(result.contentStrip.value)
-              : result.content
-                ? cutContent(result.content.value)
-                : ''
-          return `
-            
-              ${result.title.value || 'no-title'}
-              ${content ? `
    ${content}
    ` : ''}
-                `
-        },
-        empty (data) {
-          return `
    ${languages.hits_empty.replace(/\$\{query}/, data.query)}
    `
-        }
-      }
-    }),
-    instantsearch.widgets.stats({
-      container: '#algolia-info > .algolia-stats',
-      templates: {
-        text (data) {
-          const stats = languages.hits_stats
-            .replace(/\$\{hits}/, data.nbHits)
-            .replace(/\$\{time}/, data.processingTimeMS)
-          return `
    ${stats}`
-        }
-      }
-    }),
-    instantsearch.widgets.poweredBy({
-      container: '#algolia-info > .algolia-poweredBy'
-    }),
-    instantsearch.widgets.pagination({
-      container: '#algolia-pagination',
-      totalPages: 5,
-      templates: {
-        first: '',
-        last: '',
-        previous: '',
-        next: ''
-      }
-    })
-  ]
-
-  search.addWidgets(widgets)
-  search.start()
-  searchClickFn()
-  searchFnOnce()
-
-  window.addEventListener('pjax:complete', () => {
-    if (!btf.isHidden($searchMask)) closeSearch()
-    searchClickFn()
-  })
-
-  if (window.pjax) {
-    search.on('render', () => {
-      window.pjax.refresh(document.getElementById('algolia-hits'))
-    })
-  }
-})
+window.addEventListener('load', () => {
+  const { algolia } = GLOBAL_CONFIG
+  const { appId, apiKey, indexName, hitsPerPage = 5, languages } = algolia
+
+  if (!appId || !apiKey || !indexName) {
+    return console.error('Algolia setting is invalid!')
+  }
+
+  const $searchMask = document.getElementById('search-mask')
+  const $searchDialog = document.querySelector('#algolia-search .search-dialog')
+
+  const animateElements = show => {
+    const action = show ? 'animateIn' : 'animateOut'
+    const maskAnimation = show ? 'to_show 0.5s' : 'to_hide 0.5s'
+    const dialogAnimation = show ? 'titleScale 0.5s' : 'search_close .5s'
+    btf[action]($searchMask, maskAnimation)
+    btf[action]($searchDialog, dialogAnimation)
+  }
+
+  const fixSafariHeight = () => {
+    if (window.innerWidth < 768) {
+      $searchDialog.style.setProperty('--search-height', `${window.innerHeight}px`)
+    }
+  }
+
+  const openSearch = () => {
+    btf.overflowPaddingR.add()
+    animateElements(true)
+    setTimeout(() => { document.querySelector('#algolia-search .ais-SearchBox-input').focus() }, 100)
+
+    const handleEscape = event => {
+      if (event.code === 'Escape') {
+        closeSearch()
+        document.removeEventListener('keydown', handleEscape)
+      }
+    }
+
+    document.addEventListener('keydown', handleEscape)
+    fixSafariHeight()
+    window.addEventListener('resize', fixSafariHeight)
+  }
+
+  const closeSearch = () => {
+    btf.overflowPaddingR.remove()
+    animateElements(false)
+    window.removeEventListener('resize', fixSafariHeight)
+  }
+
+  const searchClickFn = () => {
+    btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', openSearch)
+  }
+
+  const searchFnOnce = () => {
+    $searchMask.addEventListener('click', closeSearch)
+    document.querySelector('#algolia-search .search-close-button').addEventListener('click', closeSearch)
+  }
+
+  const cutContent = (content) => {
+    if (!content) return ''
+    const firstOccur = content.indexOf('')
+    let start = firstOccur - 30
+    let end = firstOccur + 120
+    let pre = ''
+    let post = ''
+
+    if (start <= 0) {
+      start = 0
+      end = 140
+    } else {
+      pre = '...'
+    }
+
+    if (end > content.length) {
+      end = content.length
+    } else {
+      post = '...'
+    }
+
+    return `${pre}${content.substring(start, end)}${post}`
+  }
+
+  const disableDiv = [
+    document.getElementById('algolia-hits'),
+    document.getElementById('algolia-pagination'),
+    document.querySelector('#algolia-info .algolia-stats')
+  ]
+
+  const searchClient = typeof algoliasearch === 'function' ? algoliasearch : window['algoliasearch/lite'].liteClient
+  const search = instantsearch({
+    indexName,
+    searchClient: searchClient(appId, apiKey),
+    searchFunction (helper) {
+      disableDiv.forEach(item => {
+        item.style.display = helper.state.query ? '' : 'none'
+      })
+      if (helper.state.query) helper.search()
+    }
+  })
+
+  const widgets = [
+    instantsearch.widgets.configure({ hitsPerPage }),
+    instantsearch.widgets.searchBox({
+      container: '#algolia-search-input',
+      showReset: false,
+      showSubmit: false,
+      placeholder: languages.input_placeholder,
+      showLoadingIndicator: true
+    }),
+    instantsearch.widgets.hits({
+      container: '#algolia-hits',
+      templates: {
+        item (data) {
+          const link = data.permalink || (GLOBAL_CONFIG.root + data.path)
+          const result = data._highlightResult
+          const content = result.contentStripTruncate
+            ? cutContent(result.contentStripTruncate.value)
+            : result.contentStrip
+              ? cutContent(result.contentStrip.value)
+              : result.content
+                ? cutContent(result.content.value)
+                : ''
+          return `
+            
+              ${result.title.value || 'no-title'}
+              ${content ? `
    ${content}
    ` : ''}
+                `
+        },
+        empty (data) {
+          return `
    ${languages.hits_empty.replace(/\$\{query}/, data.query)}
    `
+        }
+      }
+    }),
+    instantsearch.widgets.stats({
+      container: '#algolia-info > .algolia-stats',
+      templates: {
+        text (data) {
+          const stats = languages.hits_stats
+            .replace(/\$\{hits}/, data.nbHits)
+            .replace(/\$\{time}/, data.processingTimeMS)
+          return `
    ${stats}`
+        }
+      }
+    }),
+    instantsearch.widgets.poweredBy({
+      container: '#algolia-info > .algolia-poweredBy'
+    }),
+    instantsearch.widgets.pagination({
+      container: '#algolia-pagination',
+      totalPages: 5,
+      templates: {
+        first: '',
+        last: '',
+        previous: '',
+        next: ''
+      }
+    })
+  ]
+
+  search.addWidgets(widgets)
+  search.start()
+  searchClickFn()
+  searchFnOnce()
+
+  window.addEventListener('pjax:complete', () => {
+    if (!btf.isHidden($searchMask)) closeSearch()
+    searchClickFn()
+  })
+
+  if (window.pjax) {
+    search.on('render', () => {
+      window.pjax.refresh(document.getElementById('algolia-hits'))
+    })
+  }
+})
diff --git a/source/js/search/local-search.js b/source/js/search/local-search.js
index 1d3f268..08575e6 100644
--- a/source/js/search/local-search.js
+++ b/source/js/search/local-search.js
@@ -1,360 +1,360 @@
-/**
- * Refer to hexo-generator-searchdb
- * https://github.com/next-theme/hexo-generator-searchdb/blob/main/dist/search.js
- * Modified by hexo-theme-butterfly
- */
-
-class LocalSearch {
-  constructor ({
-    path = '',
-    unescape = false,
-    top_n_per_article = 1
-  }) {
-    this.path = path
-    this.unescape = unescape
-    this.top_n_per_article = top_n_per_article
-    this.isfetched = false
-    this.datas = null
-  }
-
-  getIndexByWord (words, text, caseSensitive = false) {
-    const index = []
-    const included = new Set()
-
-    if (!caseSensitive) {
-      text = text.toLowerCase()
-    }
-    words.forEach(word => {
-      if (this.unescape) {
-        const div = document.createElement('div')
-        div.innerText = word
-        word = div.innerHTML
-      }
-      const wordLen = word.length
-      if (wordLen === 0) return
-      let startPosition = 0
-      let position = -1
-      if (!caseSensitive) {
-        word = word.toLowerCase()
-      }
-      while ((position = text.indexOf(word, startPosition)) > -1) {
-        index.push({ position, word })
-        included.add(word)
-        startPosition = position + wordLen
-      }
-    })
-    // Sort index by position of keyword
-    index.sort((left, right) => {
-      if (left.position !== right.position) {
-        return left.position - right.position
-      }
-      return right.word.length - left.word.length
-    })
-    return [index, included]
-  }
-
-  // Merge hits into slices
-  mergeIntoSlice (start, end, index) {
-    let item = index[0]
-    let { position, word } = item
-    const hits = []
-    const count = new Set()
-    while (position + word.length <= end && index.length !== 0) {
-      count.add(word)
-      hits.push({
-        position,
-        length: word.length
-      })
-      const wordEnd = position + word.length
-
-      // Move to next position of hit
-      index.shift()
-      while (index.length !== 0) {
-        item = index[0]
-        position = item.position
-        word = item.word
-        if (wordEnd > position) {
-          index.shift()
-        } else {
-          break
-        }
-      }
-    }
-    return {
-      hits,
-      start,
-      end,
-      count: count.size
-    }
-  }
-
-  // Highlight title and content
-  highlightKeyword (val, slice) {
-    let result = ''
-    let index = slice.start
-    for (const { position, length } of slice.hits) {
-      result += val.substring(index, position)
-      index = position + length
-      result += `${val.substr(position, length)}`
-    }
-    result += val.substring(index, slice.end)
-    return result
-  }
-
-  getResultItems (keywords) {
-    const resultItems = []
-    this.datas.forEach(({ title, content, url }) => {
-      // The number of different keywords included in the article.
-      const [indexOfTitle, keysOfTitle] = this.getIndexByWord(keywords, title)
-      const [indexOfContent, keysOfContent] = this.getIndexByWord(keywords, content)
-      const includedCount = new Set([...keysOfTitle, ...keysOfContent]).size
-
-      // Show search results
-      const hitCount = indexOfTitle.length + indexOfContent.length
-      if (hitCount === 0) return
-
-      const slicesOfTitle = []
-      if (indexOfTitle.length !== 0) {
-        slicesOfTitle.push(this.mergeIntoSlice(0, title.length, indexOfTitle))
-      }
-
-      let slicesOfContent = []
-      while (indexOfContent.length !== 0) {
-        const item = indexOfContent[0]
-        const { position } = item
-        // Cut out 120 characters. The maxlength of .search-input is 80.
-        const start = Math.max(0, position - 20)
-        const end = Math.min(content.length, position + 100)
-        slicesOfContent.push(this.mergeIntoSlice(start, end, indexOfContent))
-      }
-
-      // Sort slices in content by included keywords' count and hits' count
-      slicesOfContent.sort((left, right) => {
-        if (left.count !== right.count) {
-          return right.count - left.count
-        } else if (left.hits.length !== right.hits.length) {
-          return right.hits.length - left.hits.length
-        }
-        return left.start - right.start
-      })
-
-      // Select top N slices in content
-      const upperBound = parseInt(this.top_n_per_article, 10)
-      if (upperBound >= 0) {
-        slicesOfContent = slicesOfContent.slice(0, upperBound)
-      }
-
-      let resultItem = ''
-
-      url = new URL(url, location.origin)
-      url.searchParams.append('highlight', keywords.join(' '))
-
-      if (slicesOfTitle.length !== 0) {
-        resultItem += `
  • ${this.highlightKeyword(title, slicesOfTitle[0])}`
-      } else {
-        resultItem += `
  • ${title}`
-      }
-
-      slicesOfContent.forEach(slice => {
-        resultItem += `
    ${this.highlightKeyword(content, slice)}...
    `
-      })
-
-      resultItem += '
    • '
-      resultItems.push({
-        item: resultItem,
-        id: resultItems.length,
-        hitCount,
-        includedCount
-      })
-    })
-    return resultItems
-  }
-
-  fetchData () {
-    const isXml = !this.path.endsWith('json')
-    fetch(this.path)
-      .then(response => response.text())
-      .then(res => {
-        // Get the contents from search data
-        this.isfetched = true
-        this.datas = isXml
-          ? [...new DOMParser().parseFromString(res, 'text/xml').querySelectorAll('entry')].map(element => ({
-              title: element.querySelector('title').textContent,
-              content: element.querySelector('content').textContent,
-              url: element.querySelector('url').textContent
-            }))
-          : JSON.parse(res)
-        // Only match articles with non-empty titles
-        this.datas = this.datas.filter(data => data.title).map(data => {
-          data.title = data.title.trim()
-          data.content = data.content ? data.content.trim().replace(/<[^>]+>/g, '') : ''
-          data.url = decodeURIComponent(data.url).replace(/\/{2,}/g, '/')
-          return data
-        })
-        // Remove loading animation
-        window.dispatchEvent(new Event('search:loaded'))
-      })
-  }
-
-  // Highlight by wrapping node in mark elements with the given class name
-  highlightText (node, slice, className) {
-    const val = node.nodeValue
-    let index = slice.start
-    const children = []
-    for (const { position, length } of slice.hits) {
-      const text = document.createTextNode(val.substring(index, position))
-      index = position + length
-      const mark = document.createElement('mark')
-      mark.className = className
-      mark.appendChild(document.createTextNode(val.substr(position, length)))
-      children.push(text, mark)
-    }
-    node.nodeValue = val.substring(index, slice.end)
-    children.forEach(element => {
-      node.parentNode.insertBefore(element, node)
-    })
-  }
-
-  // Highlight the search words provided in the url in the text
-  highlightSearchWords (body) {
-    const params = new URL(location.href).searchParams.get('highlight')
-    const keywords = params ? params.split(' ') : []
-    if (!keywords.length || !body) return
-    const walk = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, null)
-    const allNodes = []
-    while (walk.nextNode()) {
-      if (!walk.currentNode.parentNode.matches('button, select, textarea, .mermaid')) allNodes.push(walk.currentNode)
-    }
-    allNodes.forEach(node => {
-      const [indexOfNode] = this.getIndexByWord(keywords, node.nodeValue)
-      if (!indexOfNode.length) return
-      const slice = this.mergeIntoSlice(0, node.nodeValue.length, indexOfNode)
-      this.highlightText(node, slice, 'search-keyword')
-    })
-  }
-}
-
-window.addEventListener('load', () => {
-// Search
-  const { path, top_n_per_article, unescape, languages } = GLOBAL_CONFIG.localSearch
-  const localSearch = new LocalSearch({
-    path,
-    top_n_per_article,
-    unescape
-  })
-
-  const input = document.querySelector('#local-search-input input')
-  const statsItem = document.getElementById('local-search-stats-wrap')
-  const $loadingStatus = document.getElementById('loading-status')
-  const isXml = !path.endsWith('json')
-
-  const inputEventFunction = () => {
-    if (!localSearch.isfetched) return
-    let searchText = input.value.trim().toLowerCase()
-    isXml && (searchText = searchText.replace(//g, '>'))
-    if (searchText !== '') $loadingStatus.innerHTML = ''
-    const keywords = searchText.split(/[-\s]+/)
-    const container = document.getElementById('local-search-results')
-    let resultItems = []
-    if (searchText.length > 0) {
-    // Perform local searching
-      resultItems = localSearch.getResultItems(keywords)
-    }
-    if (keywords.length === 1 && keywords[0] === '') {
-      container.textContent = ''
-      statsItem.textContent = ''
-    } else if (resultItems.length === 0) {
-      container.textContent = ''
-      const statsDiv = document.createElement('div')
-      statsDiv.className = 'search-result-stats'
-      statsDiv.textContent = languages.hits_empty.replace(/\$\{query}/, searchText)
-      statsItem.innerHTML = statsDiv.outerHTML
-    } else {
-      resultItems.sort((left, right) => {
-        if (left.includedCount !== right.includedCount) {
-          return right.includedCount - left.includedCount
-        } else if (left.hitCount !== right.hitCount) {
-          return right.hitCount - left.hitCount
-        }
-        return right.id - left.id
-      })
-
-      const stats = languages.hits_stats.replace(/\$\{hits}/, resultItems.length)
-
-      container.innerHTML = `
      ${resultItems.map(result => result.item).join('')}
    `
-      statsItem.innerHTML = `
    ${stats}
    `
-      window.pjax && window.pjax.refresh(container)
-    }
-
-    $loadingStatus.textContent = ''
-  }
-
-  let loadFlag = false
-  const $searchMask = document.getElementById('search-mask')
-  const $searchDialog = document.querySelector('#local-search .search-dialog')
-
-  // fix safari
-  const fixSafariHeight = () => {
-    if (window.innerWidth < 768) {
-      $searchDialog.style.setProperty('--search-height', window.innerHeight + 'px')
-    }
-  }
-
-  const openSearch = () => {
-    btf.overflowPaddingR.add()
-    btf.animateIn($searchMask, 'to_show 0.5s')
-    btf.animateIn($searchDialog, 'titleScale 0.5s')
-    setTimeout(() => { input.focus() }, 300)
-    if (!loadFlag) {
-      !localSearch.isfetched && localSearch.fetchData()
-      input.addEventListener('input', inputEventFunction)
-      loadFlag = true
-    }
-    // shortcut: ESC
-    document.addEventListener('keydown', function f (event) {
-      if (event.code === 'Escape') {
-        closeSearch()
-        document.removeEventListener('keydown', f)
-      }
-    })
-
-    fixSafariHeight()
-    window.addEventListener('resize', fixSafariHeight)
-  }
-
-  const closeSearch = () => {
-    btf.overflowPaddingR.remove()
-    btf.animateOut($searchDialog, 'search_close .5s')
-    btf.animateOut($searchMask, 'to_hide 0.5s')
-    window.removeEventListener('resize', fixSafariHeight)
-  }
-
-  const searchClickFn = () => {
-    btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', openSearch)
-  }
-
-  const searchFnOnce = () => {
-    document.querySelector('#local-search .search-close-button').addEventListener('click', closeSearch)
-    $searchMask.addEventListener('click', closeSearch)
-    if (GLOBAL_CONFIG.localSearch.preload) {
-      localSearch.fetchData()
-    }
-    localSearch.highlightSearchWords(document.getElementById('article-container'))
-  }
-
-  window.addEventListener('search:loaded', () => {
-    const $loadDataItem = document.getElementById('loading-database')
-    $loadDataItem.nextElementSibling.style.display = 'block'
-    $loadDataItem.remove()
-  })
-
-  searchClickFn()
-  searchFnOnce()
-
-  // pjax
-  window.addEventListener('pjax:complete', () => {
-    !btf.isHidden($searchMask) && closeSearch()
-    localSearch.highlightSearchWords(document.getElementById('article-container'))
-    searchClickFn()
-  })
-})
+/**
+ * Refer to hexo-generator-searchdb
+ * https://github.com/next-theme/hexo-generator-searchdb/blob/main/dist/search.js
+ * Modified by hexo-theme-butterfly
+ */
+
+class LocalSearch {
+  constructor ({
+    path = '',
+    unescape = false,
+    top_n_per_article = 1
+  }) {
+    this.path = path
+    this.unescape = unescape
+    this.top_n_per_article = top_n_per_article
+    this.isfetched = false
+    this.datas = null
+  }
+
+  getIndexByWord (words, text, caseSensitive = false) {
+    const index = []
+    const included = new Set()
+
+    if (!caseSensitive) {
+      text = text.toLowerCase()
+    }
+    words.forEach(word => {
+      if (this.unescape) {
+        const div = document.createElement('div')
+        div.innerText = word
+        word = div.innerHTML
+      }
+      const wordLen = word.length
+      if (wordLen === 0) return
+      let startPosition = 0
+      let position = -1
+      if (!caseSensitive) {
+        word = word.toLowerCase()
+      }
+      while ((position = text.indexOf(word, startPosition)) > -1) {
+        index.push({ position, word })
+        included.add(word)
+        startPosition = position + wordLen
+      }
+    })
+    // Sort index by position of keyword
+    index.sort((left, right) => {
+      if (left.position !== right.position) {
+        return left.position - right.position
+      }
+      return right.word.length - left.word.length
+    })
+    return [index, included]
+  }
+
+  // Merge hits into slices
+  mergeIntoSlice (start, end, index) {
+    let item = index[0]
+    let { position, word } = item
+    const hits = []
+    const count = new Set()
+    while (position + word.length <= end && index.length !== 0) {
+      count.add(word)
+      hits.push({
+        position,
+        length: word.length
+      })
+      const wordEnd = position + word.length
+
+      // Move to next position of hit
+      index.shift()
+      while (index.length !== 0) {
+        item = index[0]
+        position = item.position
+        word = item.word
+        if (wordEnd > position) {
+          index.shift()
+        } else {
+          break
+        }
+      }
+    }
+    return {
+      hits,
+      start,
+      end,
+      count: count.size
+    }
+  }
+
+  // Highlight title and content
+  highlightKeyword (val, slice) {
+    let result = ''
+    let index = slice.start
+    for (const { position, length } of slice.hits) {
+      result += val.substring(index, position)
+      index = position + length
+      result += `${val.substr(position, length)}`
+    }
+    result += val.substring(index, slice.end)
+    return result
+  }
+
+  getResultItems (keywords) {
+    const resultItems = []
+    this.datas.forEach(({ title, content, url }) => {
+      // The number of different keywords included in the article.
+      const [indexOfTitle, keysOfTitle] = this.getIndexByWord(keywords, title)
+      const [indexOfContent, keysOfContent] = this.getIndexByWord(keywords, content)
+      const includedCount = new Set([...keysOfTitle, ...keysOfContent]).size
+
+      // Show search results
+      const hitCount = indexOfTitle.length + indexOfContent.length
+      if (hitCount === 0) return
+
+      const slicesOfTitle = []
+      if (indexOfTitle.length !== 0) {
+        slicesOfTitle.push(this.mergeIntoSlice(0, title.length, indexOfTitle))
+      }
+
+      let slicesOfContent = []
+      while (indexOfContent.length !== 0) {
+        const item = indexOfContent[0]
+        const { position } = item
+        // Cut out 120 characters. The maxlength of .search-input is 80.
+        const start = Math.max(0, position - 20)
+        const end = Math.min(content.length, position + 100)
+        slicesOfContent.push(this.mergeIntoSlice(start, end, indexOfContent))
+      }
+
+      // Sort slices in content by included keywords' count and hits' count
+      slicesOfContent.sort((left, right) => {
+        if (left.count !== right.count) {
+          return right.count - left.count
+        } else if (left.hits.length !== right.hits.length) {
+          return right.hits.length - left.hits.length
+        }
+        return left.start - right.start
+      })
+
+      // Select top N slices in content
+      const upperBound = parseInt(this.top_n_per_article, 10)
+      if (upperBound >= 0) {
+        slicesOfContent = slicesOfContent.slice(0, upperBound)
+      }
+
+      let resultItem = ''
+
+      url = new URL(url, location.origin)
+      url.searchParams.append('highlight', keywords.join(' '))
+
+      if (slicesOfTitle.length !== 0) {
+        resultItem += `
  • ${this.highlightKeyword(title, slicesOfTitle[0])}`
+      } else {
+        resultItem += `
  • ${title}`
+      }
+
+      slicesOfContent.forEach(slice => {
+        resultItem += `
    ${this.highlightKeyword(content, slice)}...
    `
+      })
+
+      resultItem += '
    • '
+      resultItems.push({
+        item: resultItem,
+        id: resultItems.length,
+        hitCount,
+        includedCount
+      })
+    })
+    return resultItems
+  }
+
+  fetchData () {
+    const isXml = !this.path.endsWith('json')
+    fetch(this.path)
+      .then(response => response.text())
+      .then(res => {
+        // Get the contents from search data
+        this.isfetched = true
+        this.datas = isXml
+          ? [...new DOMParser().parseFromString(res, 'text/xml').querySelectorAll('entry')].map(element => ({
+              title: element.querySelector('title').textContent,
+              content: element.querySelector('content').textContent,
+              url: element.querySelector('url').textContent
+            }))
+          : JSON.parse(res)
+        // Only match articles with non-empty titles
+        this.datas = this.datas.filter(data => data.title).map(data => {
+          data.title = data.title.trim()
+          data.content = data.content ? data.content.trim().replace(/<[^>]+>/g, '') : ''
+          data.url = decodeURIComponent(data.url).replace(/\/{2,}/g, '/')
+          return data
+        })
+        // Remove loading animation
+        window.dispatchEvent(new Event('search:loaded'))
+      })
+  }
+
+  // Highlight by wrapping node in mark elements with the given class name
+  highlightText (node, slice, className) {
+    const val = node.nodeValue
+    let index = slice.start
+    const children = []
+    for (const { position, length } of slice.hits) {
+      const text = document.createTextNode(val.substring(index, position))
+      index = position + length
+      const mark = document.createElement('mark')
+      mark.className = className
+      mark.appendChild(document.createTextNode(val.substr(position, length)))
+      children.push(text, mark)
+    }
+    node.nodeValue = val.substring(index, slice.end)
+    children.forEach(element => {
+      node.parentNode.insertBefore(element, node)
+    })
+  }
+
+  // Highlight the search words provided in the url in the text
+  highlightSearchWords (body) {
+    const params = new URL(location.href).searchParams.get('highlight')
+    const keywords = params ? params.split(' ') : []
+    if (!keywords.length || !body) return
+    const walk = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, null)
+    const allNodes = []
+    while (walk.nextNode()) {
+      if (!walk.currentNode.parentNode.matches('button, select, textarea, .mermaid')) allNodes.push(walk.currentNode)
+    }
+    allNodes.forEach(node => {
+      const [indexOfNode] = this.getIndexByWord(keywords, node.nodeValue)
+      if (!indexOfNode.length) return
+      const slice = this.mergeIntoSlice(0, node.nodeValue.length, indexOfNode)
+      this.highlightText(node, slice, 'search-keyword')
+    })
+  }
+}
+
+window.addEventListener('load', () => {
+// Search
+  const { path, top_n_per_article, unescape, languages } = GLOBAL_CONFIG.localSearch
+  const localSearch = new LocalSearch({
+    path,
+    top_n_per_article,
+    unescape
+  })
+
+  const input = document.querySelector('#local-search-input input')
+  const statsItem = document.getElementById('local-search-stats-wrap')
+  const $loadingStatus = document.getElementById('loading-status')
+  const isXml = !path.endsWith('json')
+
+  const inputEventFunction = () => {
+    if (!localSearch.isfetched) return
+    let searchText = input.value.trim().toLowerCase()
+    isXml && (searchText = searchText.replace(//g, '>'))
+    if (searchText !== '') $loadingStatus.innerHTML = ''
+    const keywords = searchText.split(/[-\s]+/)
+    const container = document.getElementById('local-search-results')
+    let resultItems = []
+    if (searchText.length > 0) {
+    // Perform local searching
+      resultItems = localSearch.getResultItems(keywords)
+    }
+    if (keywords.length === 1 && keywords[0] === '') {
+      container.textContent = ''
+      statsItem.textContent = ''
+    } else if (resultItems.length === 0) {
+      container.textContent = ''
+      const statsDiv = document.createElement('div')
+      statsDiv.className = 'search-result-stats'
+      statsDiv.textContent = languages.hits_empty.replace(/\$\{query}/, searchText)
+      statsItem.innerHTML = statsDiv.outerHTML
+    } else {
+      resultItems.sort((left, right) => {
+        if (left.includedCount !== right.includedCount) {
+          return right.includedCount - left.includedCount
+        } else if (left.hitCount !== right.hitCount) {
+          return right.hitCount - left.hitCount
+        }
+        return right.id - left.id
+      })
+
+      const stats = languages.hits_stats.replace(/\$\{hits}/, resultItems.length)
+
+      container.innerHTML = `
      ${resultItems.map(result => result.item).join('')}
    `
+      statsItem.innerHTML = `
    ${stats}
    `
+      window.pjax && window.pjax.refresh(container)
+    }
+
+    $loadingStatus.textContent = ''
+  }
+
+  let loadFlag = false
+  const $searchMask = document.getElementById('search-mask')
+  const $searchDialog = document.querySelector('#local-search .search-dialog')
+
+  // fix safari
+  const fixSafariHeight = () => {
+    if (window.innerWidth < 768) {
+      $searchDialog.style.setProperty('--search-height', window.innerHeight + 'px')
+    }
+  }
+
+  const openSearch = () => {
+    btf.overflowPaddingR.add()
+    btf.animateIn($searchMask, 'to_show 0.5s')
+    btf.animateIn($searchDialog, 'titleScale 0.5s')
+    setTimeout(() => { input.focus() }, 300)
+    if (!loadFlag) {
+      !localSearch.isfetched && localSearch.fetchData()
+      input.addEventListener('input', inputEventFunction)
+      loadFlag = true
+    }
+    // shortcut: ESC
+    document.addEventListener('keydown', function f (event) {
+      if (event.code === 'Escape') {
+        closeSearch()
+        document.removeEventListener('keydown', f)
+      }
+    })
+
+    fixSafariHeight()
+    window.addEventListener('resize', fixSafariHeight)
+  }
+
+  const closeSearch = () => {
+    btf.overflowPaddingR.remove()
+    btf.animateOut($searchDialog, 'search_close .5s')
+    btf.animateOut($searchMask, 'to_hide 0.5s')
+    window.removeEventListener('resize', fixSafariHeight)
+  }
+
+  const searchClickFn = () => {
+    btf.addEventListenerPjax(document.querySelector('#search-button > .search'), 'click', openSearch)
+  }
+
+  const searchFnOnce = () => {
+    document.querySelector('#local-search .search-close-button').addEventListener('click', closeSearch)
+    $searchMask.addEventListener('click', closeSearch)
+    if (GLOBAL_CONFIG.localSearch.preload) {
+      localSearch.fetchData()
+    }
+    localSearch.highlightSearchWords(document.getElementById('article-container'))
+  }
+
+  window.addEventListener('search:loaded', () => {
+    const $loadDataItem = document.getElementById('loading-database')
+    $loadDataItem.nextElementSibling.style.display = 'block'
+    $loadDataItem.remove()
+  })
+
+  searchClickFn()
+  searchFnOnce()
+
+  // pjax
+  window.addEventListener('pjax:complete', () => {
+    !btf.isHidden($searchMask) && closeSearch()
+    localSearch.highlightSearchWords(document.getElementById('article-container'))
+    searchClickFn()
+  })
+})
diff --git a/source/js/tw_cn.js b/source/js/tw_cn.js
index c19d69c..223015c 100644
--- a/source/js/tw_cn.js
+++ b/source/js/tw_cn.js
@@ -1,117 +1,117 @@
-document.addEventListener('DOMContentLoaded', () => {
-  const { defaultEncoding, translateDelay, msgToTraditionalChinese, msgToSimplifiedChinese } = GLOBAL_CONFIG.translate
-  const snackbarData = GLOBAL_CONFIG.Snackbar
-  const targetEncodingCookie = 'translate-chn-cht'
-
-  let currentEncoding = defaultEncoding
-  let targetEncoding = Number(btf.saveToLocal.get(targetEncodingCookie)) || defaultEncoding
-  const translateButtonObject = document.getElementById('translateLink')
-  const isSnackbar = snackbarData !== undefined
-
-  const setLang = () => {
-    document.documentElement.lang = targetEncoding === 1 ? 'zh-TW' : 'zh-CN'
-  }
-
-  const translateText = (txt) => {
-    if (!txt) return ''
-    if (currentEncoding === 1 && targetEncoding === 2) return Simplized(txt)
-    if (currentEncoding === 2 && targetEncoding === 1) return Traditionalized(txt)
-    return txt
-  }
-
-  const translateBody = (fobj) => {
-    const nodes = typeof fobj === 'object' ? fobj.childNodes : document.body.childNodes
-
-    for (const node of nodes) {
-      // Skip BR, HR tags, or the translate button object
-      if (['BR', 'HR'].includes(node.tagName) || node === translateButtonObject) continue
-
-      if (node.nodeType === Node.ELEMENT_NODE) {
-        const { tagName, title, alt, placeholder, value, type } = node
-
-        // Translate title, alt, placeholder
-        if (title) node.title = translateText(title)
-        if (alt) node.alt = translateText(alt)
-        if (placeholder) node.placeholder = translateText(placeholder)
-
-        // Translate input value except text and hidden types
-        if (tagName === 'INPUT' && value && type !== 'text' && type !== 'hidden') {
-          node.value = translateText(value)
-        }
-
-        // Recursively translate child nodes
-        translateBody(node)
-      } else if (node.nodeType === Node.TEXT_NODE) {
-        // Translate text node data
-        node.data = translateText(node.data)
-      }
-    }
-  }
-
-  const translatePage = () => {
-    if (targetEncoding === 1) {
-      currentEncoding = 1
-      targetEncoding = 2
-      translateButtonObject.textContent = msgToTraditionalChinese
-      isSnackbar && btf.snackbarShow(snackbarData.cht_to_chs)
-    } else if (targetEncoding === 2) {
-      currentEncoding = 2
-      targetEncoding = 1
-      translateButtonObject.textContent = msgToSimplifiedChinese
-      isSnackbar && btf.snackbarShow(snackbarData.chs_to_cht)
-    }
-    btf.saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
-    setLang()
-    translateBody()
-  }
-
-  const JTPYStr = () => '万与丑专业丛东丝丢两严丧个丬丰临为丽举么义乌乐乔习乡书买乱争于亏云亘亚产亩亲亵亸亿仅从仑仓仪们价众优伙会伛伞伟传伤伥伦伧伪伫体余佣佥侠侣侥侦侧侨侩侪侬俣俦俨俩俪俭债倾偬偻偾偿傥傧储傩儿兑兖党兰关兴兹养兽冁内冈册写军农冢冯冲决况冻净凄凉凌减凑凛几凤凫凭凯击凼凿刍划刘则刚创删别刬刭刽刿剀剂剐剑剥剧劝办务劢动励劲劳势勋勐勚匀匦匮区医华协单卖卢卤卧卫却卺厂厅历厉压厌厍厕厢厣厦厨厩厮县参叆叇双发变叙叠叶号叹叽吁后吓吕吗吣吨听启吴呒呓呕呖呗员呙呛呜咏咔咙咛咝咤咴咸哌响哑哒哓哔哕哗哙哜哝哟唛唝唠唡唢唣唤唿啧啬啭啮啰啴啸喷喽喾嗫呵嗳嘘嘤嘱噜噼嚣嚯团园囱围囵国图圆圣圹场坂坏块坚坛坜坝坞坟坠垄垅垆垒垦垧垩垫垭垯垱垲垴埘埙埚埝埯堑堕塆墙壮声壳壶壸处备复够头夸夹夺奁奂奋奖奥妆妇妈妩妪妫姗姜娄娅娆娇娈娱娲娴婳婴婵婶媪嫒嫔嫱嬷孙学孪宁宝实宠审宪宫宽宾寝对寻导寿将尔尘尧尴尸尽层屃屉届属屡屦屿岁岂岖岗岘岙岚岛岭岳岽岿峃峄峡峣峤峥峦崂崃崄崭嵘嵚嵛嵝嵴巅巩巯币帅师帏帐帘帜带帧帮帱帻帼幂幞干并广庄庆庐庑库应庙庞废庼廪开异弃张弥弪弯弹强归当录彟彦彻径徕御忆忏忧忾怀态怂怃怄怅怆怜总怼怿恋恳恶恸恹恺恻恼恽悦悫悬悭悯惊惧惨惩惫惬惭惮惯愍愠愤愦愿慑慭憷懑懒懔戆戋戏戗战戬户扎扑扦执扩扪扫扬扰抚抛抟抠抡抢护报担拟拢拣拥拦拧拨择挂挚挛挜挝挞挟挠挡挢挣挤挥挦捞损捡换捣据捻掳掴掷掸掺掼揸揽揿搀搁搂搅携摄摅摆摇摈摊撄撑撵撷撸撺擞攒敌敛数斋斓斗斩断无旧时旷旸昙昼昽显晋晒晓晔晕晖暂暧札术朴机杀杂权条来杨杩杰极构枞枢枣枥枧枨枪枫枭柜柠柽栀栅标栈栉栊栋栌栎栏树栖样栾桊桠桡桢档桤桥桦桧桨桩梦梼梾检棂椁椟椠椤椭楼榄榇榈榉槚槛槟槠横樯樱橥橱橹橼檐檩欢欤欧歼殁殇残殒殓殚殡殴毁毂毕毙毡毵氇气氢氩氲汇汉污汤汹沓沟没沣沤沥沦沧沨沩沪沵泞泪泶泷泸泺泻泼泽泾洁洒洼浃浅浆浇浈浉浊测浍济浏浐浑浒浓浔浕涂涌涛涝涞涟涠涡涢涣涤润涧涨涩淀渊渌渍渎渐渑渔渖渗温游湾湿溃溅溆溇滗滚滞滟滠满滢滤滥滦滨滩滪漤潆潇潋潍潜潴澜濑濒灏灭灯灵灾灿炀炉炖炜炝点炼炽烁烂烃烛烟烦烧烨烩烫烬热焕焖焘煅煳熘爱爷牍牦牵牺犊犟状犷犸犹狈狍狝狞独狭狮狯狰狱狲猃猎猕猡猪猫猬献獭玑玙玚玛玮环现玱玺珉珏珐珑珰珲琎琏琐琼瑶瑷璇璎瓒瓮瓯电画畅畲畴疖疗疟疠疡疬疮疯疱疴痈痉痒痖痨痪痫痴瘅瘆瘗瘘瘪瘫瘾瘿癞癣癫癯皑皱皲盏盐监盖盗盘眍眦眬着睁睐睑瞒瞩矫矶矾矿砀码砖砗砚砜砺砻砾础硁硅硕硖硗硙硚确硷碍碛碜碱碹磙礼祎祢祯祷祸禀禄禅离秃秆种积称秽秾稆税稣稳穑穷窃窍窑窜窝窥窦窭竖竞笃笋笔笕笺笼笾筑筚筛筜筝筹签简箓箦箧箨箩箪箫篑篓篮篱簖籁籴类籼粜粝粤粪粮糁糇紧絷纟纠纡红纣纤纥约级纨纩纪纫纬纭纮纯纰纱纲纳纴纵纶纷纸纹纺纻纼纽纾线绀绁绂练组绅细织终绉绊绋绌绍绎经绐绑绒结绔绕绖绗绘给绚绛络绝绞统绠绡绢绣绤绥绦继绨绩绪绫绬续绮绯绰绱绲绳维绵绶绷绸绹绺绻综绽绾绿缀缁缂缃缄缅缆缇缈缉缊缋缌缍缎缏缐缑缒缓缔缕编缗缘缙缚缛缜缝缞缟缠缡缢缣缤缥缦缧缨缩缪缫缬缭缮缯缰缱缲缳缴缵罂网罗罚罢罴羁羟羡翘翙翚耢耧耸耻聂聋职聍联聩聪肃肠肤肷肾肿胀胁胆胜胧胨胪胫胶脉脍脏脐脑脓脔脚脱脶脸腊腌腘腭腻腼腽腾膑臜舆舣舰舱舻艰艳艹艺节芈芗芜芦苁苇苈苋苌苍苎苏苘苹茎茏茑茔茕茧荆荐荙荚荛荜荞荟荠荡荣荤荥荦荧荨荩荪荫荬荭荮药莅莜莱莲莳莴莶获莸莹莺莼萚萝萤营萦萧萨葱蒇蒉蒋蒌蓝蓟蓠蓣蓥蓦蔷蔹蔺蔼蕲蕴薮藁藓虏虑虚虫虬虮虽虾虿蚀蚁蚂蚕蚝蚬蛊蛎蛏蛮蛰蛱蛲蛳蛴蜕蜗蜡蝇蝈蝉蝎蝼蝾螀螨蟏衅衔补衬衮袄袅袆袜袭袯装裆裈裢裣裤裥褛褴襁襕见观觃规觅视觇览觉觊觋觌觍觎觏觐觑觞触觯詟誉誊讠计订讣认讥讦讧讨让讪讫训议讯记讱讲讳讴讵讶讷许讹论讻讼讽设访诀证诂诃评诅识诇诈诉诊诋诌词诎诏诐译诒诓诔试诖诗诘诙诚诛诜话诞诟诠诡询诣诤该详诧诨诩诪诫诬语诮误诰诱诲诳说诵诶请诸诹诺读诼诽课诿谀谁谂调谄谅谆谇谈谊谋谌谍谎谏谐谑谒谓谔谕谖谗谘谙谚谛谜谝谞谟谠谡谢谣谤谥谦谧谨谩谪谫谬谭谮谯谰谱谲谳谴谵谶谷豮贝贞负贠贡财责贤败账货质贩贪贫贬购贮贯贰贱贲贳贴贵贶贷贸费贺贻贼贽贾贿赀赁赂赃资赅赆赇赈赉赊赋赌赍赎赏赐赑赒赓赔赕赖赗赘赙赚赛赜赝赞赟赠赡赢赣赪赵赶趋趱趸跃跄跖跞践跶跷跸跹跻踊踌踪踬踯蹑蹒蹰蹿躏躜躯车轧轨轩轪轫转轭轮软轰轱轲轳轴轵轶轷轸轹轺轻轼载轾轿辀辁辂较辄辅辆辇辈辉辊辋辌辍辎辏辐辑辒输辔辕辖辗辘辙辚辞辩辫边辽达迁过迈运还这进远违连迟迩迳迹适选逊递逦逻遗遥邓邝邬邮邹邺邻郁郄郏郐郑郓郦郧郸酝酦酱酽酾酿释里鉅鉴銮錾钆钇针钉钊钋钌钍钎钏钐钑钒钓钔钕钖钗钘钙钚钛钝钞钟钠钡钢钣钤钥钦钧钨钩钪钫钬钭钮钯钰钱钲钳钴钵钶钷钸钹钺钻钼钽钾钿铀铁铂铃铄铅铆铈铉铊铋铍铎铏铐铑铒铕铗铘铙铚铛铜铝铞铟铠铡铢铣铤铥铦铧铨铪铫铬铭铮铯铰铱铲铳铴铵银铷铸铹铺铻铼铽链铿销锁锂锃锄锅锆锇锈锉锊锋锌锍锎锏锐锑锒锓锔锕锖锗错锚锜锞锟锠锡锢锣锤锥锦锨锩锫锬锭键锯锰锱锲锳锴锵锶锷锸锹锺锻锼锽锾锿镀镁镂镃镆镇镈镉镊镌镍镎镏镐镑镒镕镖镗镙镚镛镜镝镞镟镠镡镢镣镤镥镦镧镨镩镪镫镬镭镮镯镰镱镲镳镴镶长门闩闪闫闬闭问闯闰闱闲闳间闵闶闷闸闹闺闻闼闽闾闿阀阁阂阃阄阅阆阇阈阉阊阋阌阍阎阏阐阑阒阓阔阕阖阗阘阙阚阛队阳阴阵阶际陆陇陈陉陕陧陨险随隐隶隽难雏雠雳雾霁霉霭靓静靥鞑鞒鞯鞴韦韧韨韩韪韫韬韵页顶顷顸项顺须顼顽顾顿颀颁颂颃预颅领颇颈颉颊颋颌颍颎颏颐频颒颓颔颕颖颗题颙颚颛颜额颞颟颠颡颢颣颤颥颦颧风飏飐飑飒飓飔飕飖飗飘飙飚飞飨餍饤饥饦饧饨饩饪饫饬饭饮饯饰饱饲饳饴饵饶饷饸饹饺饻饼饽饾饿馀馁馂馃馄馅馆馇馈馉馊馋馌馍馎馏馐馑馒馓馔馕马驭驮驯驰驱驲驳驴驵驶驷驸驹驺驻驼驽驾驿骀骁骂骃骄骅骆骇骈骉骊骋验骍骎骏骐骑骒骓骔骕骖骗骘骙骚骛骜骝骞骟骠骡骢骣骤骥骦骧髅髋髌鬓魇魉鱼鱽鱾鱿鲀鲁鲂鲄鲅鲆鲇鲈鲉鲊鲋鲌鲍鲎鲏鲐鲑鲒鲓鲔鲕鲖鲗鲘鲙鲚鲛鲜鲝鲞鲟鲠鲡鲢鲣鲤鲥鲦鲧鲨鲩鲪鲫鲬鲭鲮鲯鲰鲱鲲鲳鲴鲵鲶鲷鲸鲹鲺鲻鲼鲽鲾鲿鳀鳁鳂鳃鳄鳅鳆鳇鳈鳉鳊鳋鳌鳍鳎鳏鳐鳑鳒鳓鳔鳕鳖鳗鳘鳙鳛鳜鳝鳞鳟鳠鳡鳢鳣鸟鸠鸡鸢鸣鸤鸥鸦鸧鸨鸩鸪鸫鸬鸭鸮鸯鸰鸱鸲鸳鸴鸵鸶鸷鸸鸹鸺鸻鸼鸽鸾鸿鹀鹁鹂鹃鹄鹅鹆鹇鹈鹉鹊鹋鹌鹍鹎鹏鹐鹑鹒鹓鹔鹕鹖鹗鹘鹚鹛鹜鹝鹞鹟鹠鹡鹢鹣鹤鹥鹦鹧鹨鹩鹪鹫鹬鹭鹯鹰鹱鹲鹳鹴鹾麦麸黄黉黡黩黪黾龙历志制一台皋准复猛钟注范签'
-  const FTPYStr = () => '萬與醜專業叢東絲丟兩嚴喪個爿豐臨為麗舉麼義烏樂喬習鄉書買亂爭於虧雲亙亞產畝親褻嚲億僅從侖倉儀們價眾優夥會傴傘偉傳傷倀倫傖偽佇體餘傭僉俠侶僥偵側僑儈儕儂俁儔儼倆儷儉債傾傯僂僨償儻儐儲儺兒兌兗黨蘭關興茲養獸囅內岡冊寫軍農塚馮衝決況凍淨淒涼淩減湊凜幾鳳鳧憑凱擊氹鑿芻劃劉則剛創刪別剗剄劊劌剴劑剮劍剝劇勸辦務勱動勵勁勞勢勳猛勩勻匭匱區醫華協單賣盧鹵臥衛卻巹廠廳曆厲壓厭厙廁廂厴廈廚廄廝縣參靉靆雙發變敘疊葉號歎嘰籲後嚇呂嗎唚噸聽啟吳嘸囈嘔嚦唄員咼嗆嗚詠哢嚨嚀噝吒噅鹹呱響啞噠嘵嗶噦嘩噲嚌噥喲嘜嗊嘮啢嗩唕喚呼嘖嗇囀齧囉嘽嘯噴嘍嚳囁嗬噯噓嚶囑嚕劈囂謔團園囪圍圇國圖圓聖壙場阪壞塊堅壇壢壩塢墳墜壟壟壚壘墾坰堊墊埡墶壋塏堖塒塤堝墊垵塹墮壪牆壯聲殼壺壼處備複夠頭誇夾奪奩奐奮獎奧妝婦媽嫵嫗媯姍薑婁婭嬈嬌孌娛媧嫻嫿嬰嬋嬸媼嬡嬪嬙嬤孫學孿寧寶實寵審憲宮寬賓寢對尋導壽將爾塵堯尷屍盡層屭屜屆屬屢屨嶼歲豈嶇崗峴嶴嵐島嶺嶽崠巋嶨嶧峽嶢嶠崢巒嶗崍嶮嶄嶸嶔崳嶁脊巔鞏巰幣帥師幃帳簾幟帶幀幫幬幘幗冪襆幹並廣莊慶廬廡庫應廟龐廢廎廩開異棄張彌弳彎彈強歸當錄彠彥徹徑徠禦憶懺憂愾懷態慫憮慪悵愴憐總懟懌戀懇惡慟懨愷惻惱惲悅愨懸慳憫驚懼慘懲憊愜慚憚慣湣慍憤憒願懾憖怵懣懶懍戇戔戲戧戰戩戶紮撲扡執擴捫掃揚擾撫拋摶摳掄搶護報擔擬攏揀擁攔擰撥擇掛摯攣掗撾撻挾撓擋撟掙擠揮撏撈損撿換搗據撚擄摑擲撣摻摜摣攬撳攙擱摟攪攜攝攄擺搖擯攤攖撐攆擷擼攛擻攢敵斂數齋斕鬥斬斷無舊時曠暘曇晝曨顯晉曬曉曄暈暉暫曖劄術樸機殺雜權條來楊榪傑極構樅樞棗櫪梘棖槍楓梟櫃檸檉梔柵標棧櫛櫳棟櫨櫟欄樹棲樣欒棬椏橈楨檔榿橋樺檜槳樁夢檮棶檢欞槨櫝槧欏橢樓欖櫬櫚櫸檟檻檳櫧橫檣櫻櫫櫥櫓櫞簷檁歡歟歐殲歿殤殘殞殮殫殯毆毀轂畢斃氈毿氌氣氫氬氳彙漢汙湯洶遝溝沒灃漚瀝淪滄渢溈滬濔濘淚澩瀧瀘濼瀉潑澤涇潔灑窪浹淺漿澆湞溮濁測澮濟瀏滻渾滸濃潯濜塗湧濤澇淶漣潿渦溳渙滌潤澗漲澀澱淵淥漬瀆漸澠漁瀋滲溫遊灣濕潰濺漵漊潷滾滯灩灄滿瀅濾濫灤濱灘澦濫瀠瀟瀲濰潛瀦瀾瀨瀕灝滅燈靈災燦煬爐燉煒熗點煉熾爍爛烴燭煙煩燒燁燴燙燼熱煥燜燾煆糊溜愛爺牘犛牽犧犢強狀獷獁猶狽麅獮獰獨狹獅獪猙獄猻獫獵獼玀豬貓蝟獻獺璣璵瑒瑪瑋環現瑲璽瑉玨琺瓏璫琿璡璉瑣瓊瑤璦璿瓔瓚甕甌電畫暢佘疇癤療瘧癘瘍鬁瘡瘋皰屙癰痙癢瘂癆瘓癇癡癉瘮瘞瘺癟癱癮癭癩癬癲臒皚皺皸盞鹽監蓋盜盤瞘眥矓著睜睞瞼瞞矚矯磯礬礦碭碼磚硨硯碸礪礱礫礎硜矽碩硤磽磑礄確鹼礙磧磣堿镟滾禮禕禰禎禱禍稟祿禪離禿稈種積稱穢穠穭稅穌穩穡窮竊竅窯竄窩窺竇窶豎競篤筍筆筧箋籠籩築篳篩簹箏籌簽簡籙簀篋籜籮簞簫簣簍籃籬籪籟糴類秈糶糲粵糞糧糝餱緊縶糸糾紆紅紂纖紇約級紈纊紀紉緯紜紘純紕紗綱納紝縱綸紛紙紋紡紵紖紐紓線紺絏紱練組紳細織終縐絆紼絀紹繹經紿綁絨結絝繞絰絎繪給絢絳絡絕絞統綆綃絹繡綌綏絛繼綈績緒綾緓續綺緋綽緔緄繩維綿綬繃綢綯綹綣綜綻綰綠綴緇緙緗緘緬纜緹緲緝縕繢緦綞緞緶線緱縋緩締縷編緡緣縉縛縟縝縫縗縞纏縭縊縑繽縹縵縲纓縮繆繅纈繚繕繒韁繾繰繯繳纘罌網羅罰罷羆羈羥羨翹翽翬耮耬聳恥聶聾職聹聯聵聰肅腸膚膁腎腫脹脅膽勝朧腖臚脛膠脈膾髒臍腦膿臠腳脫腡臉臘醃膕齶膩靦膃騰臏臢輿艤艦艙艫艱豔艸藝節羋薌蕪蘆蓯葦藶莧萇蒼苧蘇檾蘋莖蘢蔦塋煢繭荊薦薘莢蕘蓽蕎薈薺蕩榮葷滎犖熒蕁藎蓀蔭蕒葒葤藥蒞蓧萊蓮蒔萵薟獲蕕瑩鶯蓴蘀蘿螢營縈蕭薩蔥蕆蕢蔣蔞藍薊蘺蕷鎣驀薔蘞藺藹蘄蘊藪槁蘚虜慮虛蟲虯蟣雖蝦蠆蝕蟻螞蠶蠔蜆蠱蠣蟶蠻蟄蛺蟯螄蠐蛻蝸蠟蠅蟈蟬蠍螻蠑螿蟎蠨釁銜補襯袞襖嫋褘襪襲襏裝襠褌褳襝褲襇褸襤繈襴見觀覎規覓視覘覽覺覬覡覿覥覦覯覲覷觴觸觶讋譽謄訁計訂訃認譏訐訌討讓訕訖訓議訊記訒講諱謳詎訝訥許訛論訩訟諷設訪訣證詁訶評詛識詗詐訴診詆謅詞詘詔詖譯詒誆誄試詿詩詰詼誠誅詵話誕詬詮詭詢詣諍該詳詫諢詡譸誡誣語誚誤誥誘誨誑說誦誒請諸諏諾讀諑誹課諉諛誰諗調諂諒諄誶談誼謀諶諜謊諫諧謔謁謂諤諭諼讒諮諳諺諦謎諞諝謨讜謖謝謠謗諡謙謐謹謾謫譾謬譚譖譙讕譜譎讞譴譫讖穀豶貝貞負貟貢財責賢敗賬貨質販貪貧貶購貯貫貳賤賁貰貼貴貺貸貿費賀貽賊贄賈賄貲賃賂贓資賅贐賕賑賚賒賦賭齎贖賞賜贔賙賡賠賧賴賵贅賻賺賽賾贗讚贇贈贍贏贛赬趙趕趨趲躉躍蹌蹠躒踐躂蹺蹕躚躋踴躊蹤躓躑躡蹣躕躥躪躦軀車軋軌軒軑軔轉軛輪軟轟軲軻轤軸軹軼軤軫轢軺輕軾載輊轎輈輇輅較輒輔輛輦輩輝輥輞輬輟輜輳輻輯轀輸轡轅轄輾轆轍轔辭辯辮邊遼達遷過邁運還這進遠違連遲邇逕跡適選遜遞邐邏遺遙鄧鄺鄔郵鄒鄴鄰鬱郤郟鄶鄭鄆酈鄖鄲醞醱醬釅釃釀釋裏钜鑒鑾鏨釓釔針釘釗釙釕釷釺釧釤鈒釩釣鍆釹鍚釵鈃鈣鈈鈦鈍鈔鍾鈉鋇鋼鈑鈐鑰欽鈞鎢鉤鈧鈁鈥鈄鈕鈀鈺錢鉦鉗鈷缽鈳鉕鈽鈸鉞鑽鉬鉭鉀鈿鈾鐵鉑鈴鑠鉛鉚鈰鉉鉈鉍鈹鐸鉶銬銠鉺銪鋏鋣鐃銍鐺銅鋁銱銦鎧鍘銖銑鋌銩銛鏵銓鉿銚鉻銘錚銫鉸銥鏟銃鐋銨銀銣鑄鐒鋪鋙錸鋱鏈鏗銷鎖鋰鋥鋤鍋鋯鋨鏽銼鋝鋒鋅鋶鐦鐧銳銻鋃鋟鋦錒錆鍺錯錨錡錁錕錩錫錮鑼錘錐錦鍁錈錇錟錠鍵鋸錳錙鍥鍈鍇鏘鍶鍔鍤鍬鍾鍛鎪鍠鍰鎄鍍鎂鏤鎡鏌鎮鎛鎘鑷鐫鎳鎿鎦鎬鎊鎰鎔鏢鏜鏍鏰鏞鏡鏑鏃鏇鏐鐔钁鐐鏷鑥鐓鑭鐠鑹鏹鐙鑊鐳鐶鐲鐮鐿鑔鑣鑞鑲長門閂閃閆閈閉問闖閏闈閑閎間閔閌悶閘鬧閨聞闥閩閭闓閥閣閡閫鬮閱閬闍閾閹閶鬩閿閽閻閼闡闌闃闠闊闋闔闐闒闕闞闤隊陽陰陣階際陸隴陳陘陝隉隕險隨隱隸雋難雛讎靂霧霽黴靄靚靜靨韃鞽韉韝韋韌韍韓韙韞韜韻頁頂頃頇項順須頊頑顧頓頎頒頌頏預顱領頗頸頡頰頲頜潁熲頦頤頻頮頹頷頴穎顆題顒顎顓顏額顳顢顛顙顥纇顫顬顰顴風颺颭颮颯颶颸颼颻飀飄飆飆飛饗饜飣饑飥餳飩餼飪飫飭飯飲餞飾飽飼飿飴餌饒餉餄餎餃餏餅餑餖餓餘餒餕餜餛餡館餷饋餶餿饞饁饃餺餾饈饉饅饊饌饢馬馭馱馴馳驅馹駁驢駔駛駟駙駒騶駐駝駑駕驛駘驍罵駰驕驊駱駭駢驫驪騁驗騂駸駿騏騎騍騅騌驌驂騙騭騤騷騖驁騮騫騸驃騾驄驏驟驥驦驤髏髖髕鬢魘魎魚魛魢魷魨魯魴魺鮁鮃鯰鱸鮋鮓鮒鮊鮑鱟鮍鮐鮭鮚鮳鮪鮞鮦鰂鮜鱠鱭鮫鮮鮺鯗鱘鯁鱺鰱鰹鯉鰣鰷鯀鯊鯇鮶鯽鯒鯖鯪鯕鯫鯡鯤鯧鯝鯢鯰鯛鯨鯵鯴鯔鱝鰈鰏鱨鯷鰮鰃鰓鱷鰍鰒鰉鰁鱂鯿鰠鼇鰭鰨鰥鰩鰟鰜鰳鰾鱈鱉鰻鰵鱅鰼鱖鱔鱗鱒鱯鱤鱧鱣鳥鳩雞鳶鳴鳲鷗鴉鶬鴇鴆鴣鶇鸕鴨鴞鴦鴒鴟鴝鴛鴬鴕鷥鷙鴯鴰鵂鴴鵃鴿鸞鴻鵐鵓鸝鵑鵠鵝鵒鷳鵜鵡鵲鶓鵪鶤鵯鵬鵮鶉鶊鵷鷫鶘鶡鶚鶻鶿鶥鶩鷊鷂鶲鶹鶺鷁鶼鶴鷖鸚鷓鷚鷯鷦鷲鷸鷺鸇鷹鸌鸏鸛鸘鹺麥麩黃黌黶黷黲黽龍歷誌製壹臺臯準復勐鐘註範籤'
-
-  const Traditionalized = (cc) => {
-    let str = ''
-    const ss = JTPYStr()
-    const tt = FTPYStr()
-    for (let i = 0; i < cc.length; i++) {
-      if (cc.charCodeAt(i) > 10000 && ss.indexOf(cc.charAt(i)) !== -1) {
-        str += tt.charAt(ss.indexOf(cc.charAt(i)))
-      } else str += cc.charAt(i)
-    }
-    return str
-  }
-
-  const Simplized = (cc) => {
-    let str = ''
-    const ss = JTPYStr()
-    const tt = FTPYStr()
-    for (let i = 0; i < cc.length; i++) {
-      if (cc.charCodeAt(i) > 10000 && tt.indexOf(cc.charAt(i)) !== -1) {
-        str += ss.charAt(tt.indexOf(cc.charAt(i)))
-      } else str += cc.charAt(i)
-    }
-    return str
-  }
-
-  const translateInitialization = () => {
-    if (translateButtonObject) {
-      if (currentEncoding !== targetEncoding) {
-        translateButtonObject.textContent =
-          targetEncoding === 1
-            ? msgToSimplifiedChinese
-            : msgToTraditionalChinese
-        setLang()
-        setTimeout(translateBody, translateDelay)
-      }
-    }
-  }
-
-  window.translateFn = {
-    translatePage,
-    Traditionalized,
-    Simplized,
-    translateInitialization
-  }
-
-  translateInitialization()
-  btf.addGlobalFn('pjaxComplete', translateInitialization, 'translateInitialization')
-})
+document.addEventListener('DOMContentLoaded', () => {
+  const { defaultEncoding, translateDelay, msgToTraditionalChinese, msgToSimplifiedChinese } = GLOBAL_CONFIG.translate
+  const snackbarData = GLOBAL_CONFIG.Snackbar
+  const targetEncodingCookie = 'translate-chn-cht'
+
+  let currentEncoding = defaultEncoding
+  let targetEncoding = Number(btf.saveToLocal.get(targetEncodingCookie)) || defaultEncoding
+  const translateButtonObject = document.getElementById('translateLink')
+  const isSnackbar = snackbarData !== undefined
+
+  const setLang = () => {
+    document.documentElement.lang = targetEncoding === 1 ? 'zh-TW' : 'zh-CN'
+  }
+
+  const translateText = (txt) => {
+    if (!txt) return ''
+    if (currentEncoding === 1 && targetEncoding === 2) return Simplized(txt)
+    if (currentEncoding === 2 && targetEncoding === 1) return Traditionalized(txt)
+    return txt
+  }
+
+  const translateBody = (fobj) => {
+    const nodes = typeof fobj === 'object' ? fobj.childNodes : document.body.childNodes
+
+    for (const node of nodes) {
+      // Skip BR, HR tags, or the translate button object
+      if (['BR', 'HR'].includes(node.tagName) || node === translateButtonObject) continue
+
+      if (node.nodeType === Node.ELEMENT_NODE) {
+        const { tagName, title, alt, placeholder, value, type } = node
+
+        // Translate title, alt, placeholder
+        if (title) node.title = translateText(title)
+        if (alt) node.alt = translateText(alt)
+        if (placeholder) node.placeholder = translateText(placeholder)
+
+        // Translate input value except text and hidden types
+        if (tagName === 'INPUT' && value && type !== 'text' && type !== 'hidden') {
+          node.value = translateText(value)
+        }
+
+        // Recursively translate child nodes
+        translateBody(node)
+      } else if (node.nodeType === Node.TEXT_NODE) {
+        // Translate text node data
+        node.data = translateText(node.data)
+      }
+    }
+  }
+
+  const translatePage = () => {
+    if (targetEncoding === 1) {
+      currentEncoding = 1
+      targetEncoding = 2
+      translateButtonObject.textContent = msgToTraditionalChinese
+      isSnackbar && btf.snackbarShow(snackbarData.cht_to_chs)
+    } else if (targetEncoding === 2) {
+      currentEncoding = 2
+      targetEncoding = 1
+      translateButtonObject.textContent = msgToSimplifiedChinese
+      isSnackbar && btf.snackbarShow(snackbarData.chs_to_cht)
+    }
+    btf.saveToLocal.set(targetEncodingCookie, targetEncoding, 2)
+    setLang()
+    translateBody()
+  }
+
+  const JTPYStr = () => '万与丑专业丛东丝丢两严丧个丬丰临为丽举么义乌乐乔习乡书买乱争于亏云亘亚产亩亲亵亸亿仅从仑仓仪们价众优伙会伛伞伟传伤伥伦伧伪伫体余佣佥侠侣侥侦侧侨侩侪侬俣俦俨俩俪俭债倾偬偻偾偿傥傧储傩儿兑兖党兰关兴兹养兽冁内冈册写军农冢冯冲决况冻净凄凉凌减凑凛几凤凫凭凯击凼凿刍划刘则刚创删别刬刭刽刿剀剂剐剑剥剧劝办务劢动励劲劳势勋勐勚匀匦匮区医华协单卖卢卤卧卫却卺厂厅历厉压厌厍厕厢厣厦厨厩厮县参叆叇双发变叙叠叶号叹叽吁后吓吕吗吣吨听启吴呒呓呕呖呗员呙呛呜咏咔咙咛咝咤咴咸哌响哑哒哓哔哕哗哙哜哝哟唛唝唠唡唢唣唤唿啧啬啭啮啰啴啸喷喽喾嗫呵嗳嘘嘤嘱噜噼嚣嚯团园囱围囵国图圆圣圹场坂坏块坚坛坜坝坞坟坠垄垅垆垒垦垧垩垫垭垯垱垲垴埘埙埚埝埯堑堕塆墙壮声壳壶壸处备复够头夸夹夺奁奂奋奖奥妆妇妈妩妪妫姗姜娄娅娆娇娈娱娲娴婳婴婵婶媪嫒嫔嫱嬷孙学孪宁宝实宠审宪宫宽宾寝对寻导寿将尔尘尧尴尸尽层屃屉届属屡屦屿岁岂岖岗岘岙岚岛岭岳岽岿峃峄峡峣峤峥峦崂崃崄崭嵘嵚嵛嵝嵴巅巩巯币帅师帏帐帘帜带帧帮帱帻帼幂幞干并广庄庆庐庑库应庙庞废庼廪开异弃张弥弪弯弹强归当录彟彦彻径徕御忆忏忧忾怀态怂怃怄怅怆怜总怼怿恋恳恶恸恹恺恻恼恽悦悫悬悭悯惊惧惨惩惫惬惭惮惯愍愠愤愦愿慑慭憷懑懒懔戆戋戏戗战戬户扎扑扦执扩扪扫扬扰抚抛抟抠抡抢护报担拟拢拣拥拦拧拨择挂挚挛挜挝挞挟挠挡挢挣挤挥挦捞损捡换捣据捻掳掴掷掸掺掼揸揽揿搀搁搂搅携摄摅摆摇摈摊撄撑撵撷撸撺擞攒敌敛数斋斓斗斩断无旧时旷旸昙昼昽显晋晒晓晔晕晖暂暧札术朴机杀杂权条来杨杩杰极构枞枢枣枥枧枨枪枫枭柜柠柽栀栅标栈栉栊栋栌栎栏树栖样栾桊桠桡桢档桤桥桦桧桨桩梦梼梾检棂椁椟椠椤椭楼榄榇榈榉槚槛槟槠横樯樱橥橱橹橼檐檩欢欤欧歼殁殇残殒殓殚殡殴毁毂毕毙毡毵氇气氢氩氲汇汉污汤汹沓沟没沣沤沥沦沧沨沩沪沵泞泪泶泷泸泺泻泼泽泾洁洒洼浃浅浆浇浈浉浊测浍济浏浐浑浒浓浔浕涂涌涛涝涞涟涠涡涢涣涤润涧涨涩淀渊渌渍渎渐渑渔渖渗温游湾湿溃溅溆溇滗滚滞滟滠满滢滤滥滦滨滩滪漤潆潇潋潍潜潴澜濑濒灏灭灯灵灾灿炀炉炖炜炝点炼炽烁烂烃烛烟烦烧烨烩烫烬热焕焖焘煅煳熘爱爷牍牦牵牺犊犟状犷犸犹狈狍狝狞独狭狮狯狰狱狲猃猎猕猡猪猫猬献獭玑玙玚玛玮环现玱玺珉珏珐珑珰珲琎琏琐琼瑶瑷璇璎瓒瓮瓯电画畅畲畴疖疗疟疠疡疬疮疯疱疴痈痉痒痖痨痪痫痴瘅瘆瘗瘘瘪瘫瘾瘿癞癣癫癯皑皱皲盏盐监盖盗盘眍眦眬着睁睐睑瞒瞩矫矶矾矿砀码砖砗砚砜砺砻砾础硁硅硕硖硗硙硚确硷碍碛碜碱碹磙礼祎祢祯祷祸禀禄禅离秃秆种积称秽秾稆税稣稳穑穷窃窍窑窜窝窥窦窭竖竞笃笋笔笕笺笼笾筑筚筛筜筝筹签简箓箦箧箨箩箪箫篑篓篮篱簖籁籴类籼粜粝粤粪粮糁糇紧絷纟纠纡红纣纤纥约级纨纩纪纫纬纭纮纯纰纱纲纳纴纵纶纷纸纹纺纻纼纽纾线绀绁绂练组绅细织终绉绊绋绌绍绎经绐绑绒结绔绕绖绗绘给绚绛络绝绞统绠绡绢绣绤绥绦继绨绩绪绫绬续绮绯绰绱绲绳维绵绶绷绸绹绺绻综绽绾绿缀缁缂缃缄缅缆缇缈缉缊缋缌缍缎缏缐缑缒缓缔缕编缗缘缙缚缛缜缝缞缟缠缡缢缣缤缥缦缧缨缩缪缫缬缭缮缯缰缱缲缳缴缵罂网罗罚罢罴羁羟羡翘翙翚耢耧耸耻聂聋职聍联聩聪肃肠肤肷肾肿胀胁胆胜胧胨胪胫胶脉脍脏脐脑脓脔脚脱脶脸腊腌腘腭腻腼腽腾膑臜舆舣舰舱舻艰艳艹艺节芈芗芜芦苁苇苈苋苌苍苎苏苘苹茎茏茑茔茕茧荆荐荙荚荛荜荞荟荠荡荣荤荥荦荧荨荩荪荫荬荭荮药莅莜莱莲莳莴莶获莸莹莺莼萚萝萤营萦萧萨葱蒇蒉蒋蒌蓝蓟蓠蓣蓥蓦蔷蔹蔺蔼蕲蕴薮藁藓虏虑虚虫虬虮虽虾虿蚀蚁蚂蚕蚝蚬蛊蛎蛏蛮蛰蛱蛲蛳蛴蜕蜗蜡蝇蝈蝉蝎蝼蝾螀螨蟏衅衔补衬衮袄袅袆袜袭袯装裆裈裢裣裤裥褛褴襁襕见观觃规觅视觇览觉觊觋觌觍觎觏觐觑觞触觯詟誉誊讠计订讣认讥讦讧讨让讪讫训议讯记讱讲讳讴讵讶讷许讹论讻讼讽设访诀证诂诃评诅识诇诈诉诊诋诌词诎诏诐译诒诓诔试诖诗诘诙诚诛诜话诞诟诠诡询诣诤该详诧诨诩诪诫诬语诮误诰诱诲诳说诵诶请诸诹诺读诼诽课诿谀谁谂调谄谅谆谇谈谊谋谌谍谎谏谐谑谒谓谔谕谖谗谘谙谚谛谜谝谞谟谠谡谢谣谤谥谦谧谨谩谪谫谬谭谮谯谰谱谲谳谴谵谶谷豮贝贞负贠贡财责贤败账货质贩贪贫贬购贮贯贰贱贲贳贴贵贶贷贸费贺贻贼贽贾贿赀赁赂赃资赅赆赇赈赉赊赋赌赍赎赏赐赑赒赓赔赕赖赗赘赙赚赛赜赝赞赟赠赡赢赣赪赵赶趋趱趸跃跄跖跞践跶跷跸跹跻踊踌踪踬踯蹑蹒蹰蹿躏躜躯车轧轨轩轪轫转轭轮软轰轱轲轳轴轵轶轷轸轹轺轻轼载轾轿辀辁辂较辄辅辆辇辈辉辊辋辌辍辎辏辐辑辒输辔辕辖辗辘辙辚辞辩辫边辽达迁过迈运还这进远违连迟迩迳迹适选逊递逦逻遗遥邓邝邬邮邹邺邻郁郄郏郐郑郓郦郧郸酝酦酱酽酾酿释里鉅鉴銮錾钆钇针钉钊钋钌钍钎钏钐钑钒钓钔钕钖钗钘钙钚钛钝钞钟钠钡钢钣钤钥钦钧钨钩钪钫钬钭钮钯钰钱钲钳钴钵钶钷钸钹钺钻钼钽钾钿铀铁铂铃铄铅铆铈铉铊铋铍铎铏铐铑铒铕铗铘铙铚铛铜铝铞铟铠铡铢铣铤铥铦铧铨铪铫铬铭铮铯铰铱铲铳铴铵银铷铸铹铺铻铼铽链铿销锁锂锃锄锅锆锇锈锉锊锋锌锍锎锏锐锑锒锓锔锕锖锗错锚锜锞锟锠锡锢锣锤锥锦锨锩锫锬锭键锯锰锱锲锳锴锵锶锷锸锹锺锻锼锽锾锿镀镁镂镃镆镇镈镉镊镌镍镎镏镐镑镒镕镖镗镙镚镛镜镝镞镟镠镡镢镣镤镥镦镧镨镩镪镫镬镭镮镯镰镱镲镳镴镶长门闩闪闫闬闭问闯闰闱闲闳间闵闶闷闸闹闺闻闼闽闾闿阀阁阂阃阄阅阆阇阈阉阊阋阌阍阎阏阐阑阒阓阔阕阖阗阘阙阚阛队阳阴阵阶际陆陇陈陉陕陧陨险随隐隶隽难雏雠雳雾霁霉霭靓静靥鞑鞒鞯鞴韦韧韨韩韪韫韬韵页顶顷顸项顺须顼顽顾顿颀颁颂颃预颅领颇颈颉颊颋颌颍颎颏颐频颒颓颔颕颖颗题颙颚颛颜额颞颟颠颡颢颣颤颥颦颧风飏飐飑飒飓飔飕飖飗飘飙飚飞飨餍饤饥饦饧饨饩饪饫饬饭饮饯饰饱饲饳饴饵饶饷饸饹饺饻饼饽饾饿馀馁馂馃馄馅馆馇馈馉馊馋馌馍馎馏馐馑馒馓馔馕马驭驮驯驰驱驲驳驴驵驶驷驸驹驺驻驼驽驾驿骀骁骂骃骄骅骆骇骈骉骊骋验骍骎骏骐骑骒骓骔骕骖骗骘骙骚骛骜骝骞骟骠骡骢骣骤骥骦骧髅髋髌鬓魇魉鱼鱽鱾鱿鲀鲁鲂鲄鲅鲆鲇鲈鲉鲊鲋鲌鲍鲎鲏鲐鲑鲒鲓鲔鲕鲖鲗鲘鲙鲚鲛鲜鲝鲞鲟鲠鲡鲢鲣鲤鲥鲦鲧鲨鲩鲪鲫鲬鲭鲮鲯鲰鲱鲲鲳鲴鲵鲶鲷鲸鲹鲺鲻鲼鲽鲾鲿鳀鳁鳂鳃鳄鳅鳆鳇鳈鳉鳊鳋鳌鳍鳎鳏鳐鳑鳒鳓鳔鳕鳖鳗鳘鳙鳛鳜鳝鳞鳟鳠鳡鳢鳣鸟鸠鸡鸢鸣鸤鸥鸦鸧鸨鸩鸪鸫鸬鸭鸮鸯鸰鸱鸲鸳鸴鸵鸶鸷鸸鸹鸺鸻鸼鸽鸾鸿鹀鹁鹂鹃鹄鹅鹆鹇鹈鹉鹊鹋鹌鹍鹎鹏鹐鹑鹒鹓鹔鹕鹖鹗鹘鹚鹛鹜鹝鹞鹟鹠鹡鹢鹣鹤鹥鹦鹧鹨鹩鹪鹫鹬鹭鹯鹰鹱鹲鹳鹴鹾麦麸黄黉黡黩黪黾龙历志制一台皋准复猛钟注范签'
+  const FTPYStr = () => '萬與醜專業叢東絲丟兩嚴喪個爿豐臨為麗舉麼義烏樂喬習鄉書買亂爭於虧雲亙亞產畝親褻嚲億僅從侖倉儀們價眾優夥會傴傘偉傳傷倀倫傖偽佇體餘傭僉俠侶僥偵側僑儈儕儂俁儔儼倆儷儉債傾傯僂僨償儻儐儲儺兒兌兗黨蘭關興茲養獸囅內岡冊寫軍農塚馮衝決況凍淨淒涼淩減湊凜幾鳳鳧憑凱擊氹鑿芻劃劉則剛創刪別剗剄劊劌剴劑剮劍剝劇勸辦務勱動勵勁勞勢勳猛勩勻匭匱區醫華協單賣盧鹵臥衛卻巹廠廳曆厲壓厭厙廁廂厴廈廚廄廝縣參靉靆雙發變敘疊葉號歎嘰籲後嚇呂嗎唚噸聽啟吳嘸囈嘔嚦唄員咼嗆嗚詠哢嚨嚀噝吒噅鹹呱響啞噠嘵嗶噦嘩噲嚌噥喲嘜嗊嘮啢嗩唕喚呼嘖嗇囀齧囉嘽嘯噴嘍嚳囁嗬噯噓嚶囑嚕劈囂謔團園囪圍圇國圖圓聖壙場阪壞塊堅壇壢壩塢墳墜壟壟壚壘墾坰堊墊埡墶壋塏堖塒塤堝墊垵塹墮壪牆壯聲殼壺壼處備複夠頭誇夾奪奩奐奮獎奧妝婦媽嫵嫗媯姍薑婁婭嬈嬌孌娛媧嫻嫿嬰嬋嬸媼嬡嬪嬙嬤孫學孿寧寶實寵審憲宮寬賓寢對尋導壽將爾塵堯尷屍盡層屭屜屆屬屢屨嶼歲豈嶇崗峴嶴嵐島嶺嶽崠巋嶨嶧峽嶢嶠崢巒嶗崍嶮嶄嶸嶔崳嶁脊巔鞏巰幣帥師幃帳簾幟帶幀幫幬幘幗冪襆幹並廣莊慶廬廡庫應廟龐廢廎廩開異棄張彌弳彎彈強歸當錄彠彥徹徑徠禦憶懺憂愾懷態慫憮慪悵愴憐總懟懌戀懇惡慟懨愷惻惱惲悅愨懸慳憫驚懼慘懲憊愜慚憚慣湣慍憤憒願懾憖怵懣懶懍戇戔戲戧戰戩戶紮撲扡執擴捫掃揚擾撫拋摶摳掄搶護報擔擬攏揀擁攔擰撥擇掛摯攣掗撾撻挾撓擋撟掙擠揮撏撈損撿換搗據撚擄摑擲撣摻摜摣攬撳攙擱摟攪攜攝攄擺搖擯攤攖撐攆擷擼攛擻攢敵斂數齋斕鬥斬斷無舊時曠暘曇晝曨顯晉曬曉曄暈暉暫曖劄術樸機殺雜權條來楊榪傑極構樅樞棗櫪梘棖槍楓梟櫃檸檉梔柵標棧櫛櫳棟櫨櫟欄樹棲樣欒棬椏橈楨檔榿橋樺檜槳樁夢檮棶檢欞槨櫝槧欏橢樓欖櫬櫚櫸檟檻檳櫧橫檣櫻櫫櫥櫓櫞簷檁歡歟歐殲歿殤殘殞殮殫殯毆毀轂畢斃氈毿氌氣氫氬氳彙漢汙湯洶遝溝沒灃漚瀝淪滄渢溈滬濔濘淚澩瀧瀘濼瀉潑澤涇潔灑窪浹淺漿澆湞溮濁測澮濟瀏滻渾滸濃潯濜塗湧濤澇淶漣潿渦溳渙滌潤澗漲澀澱淵淥漬瀆漸澠漁瀋滲溫遊灣濕潰濺漵漊潷滾滯灩灄滿瀅濾濫灤濱灘澦濫瀠瀟瀲濰潛瀦瀾瀨瀕灝滅燈靈災燦煬爐燉煒熗點煉熾爍爛烴燭煙煩燒燁燴燙燼熱煥燜燾煆糊溜愛爺牘犛牽犧犢強狀獷獁猶狽麅獮獰獨狹獅獪猙獄猻獫獵獼玀豬貓蝟獻獺璣璵瑒瑪瑋環現瑲璽瑉玨琺瓏璫琿璡璉瑣瓊瑤璦璿瓔瓚甕甌電畫暢佘疇癤療瘧癘瘍鬁瘡瘋皰屙癰痙癢瘂癆瘓癇癡癉瘮瘞瘺癟癱癮癭癩癬癲臒皚皺皸盞鹽監蓋盜盤瞘眥矓著睜睞瞼瞞矚矯磯礬礦碭碼磚硨硯碸礪礱礫礎硜矽碩硤磽磑礄確鹼礙磧磣堿镟滾禮禕禰禎禱禍稟祿禪離禿稈種積稱穢穠穭稅穌穩穡窮竊竅窯竄窩窺竇窶豎競篤筍筆筧箋籠籩築篳篩簹箏籌簽簡籙簀篋籜籮簞簫簣簍籃籬籪籟糴類秈糶糲粵糞糧糝餱緊縶糸糾紆紅紂纖紇約級紈纊紀紉緯紜紘純紕紗綱納紝縱綸紛紙紋紡紵紖紐紓線紺絏紱練組紳細織終縐絆紼絀紹繹經紿綁絨結絝繞絰絎繪給絢絳絡絕絞統綆綃絹繡綌綏絛繼綈績緒綾緓續綺緋綽緔緄繩維綿綬繃綢綯綹綣綜綻綰綠綴緇緙緗緘緬纜緹緲緝縕繢緦綞緞緶線緱縋緩締縷編緡緣縉縛縟縝縫縗縞纏縭縊縑繽縹縵縲纓縮繆繅纈繚繕繒韁繾繰繯繳纘罌網羅罰罷羆羈羥羨翹翽翬耮耬聳恥聶聾職聹聯聵聰肅腸膚膁腎腫脹脅膽勝朧腖臚脛膠脈膾髒臍腦膿臠腳脫腡臉臘醃膕齶膩靦膃騰臏臢輿艤艦艙艫艱豔艸藝節羋薌蕪蘆蓯葦藶莧萇蒼苧蘇檾蘋莖蘢蔦塋煢繭荊薦薘莢蕘蓽蕎薈薺蕩榮葷滎犖熒蕁藎蓀蔭蕒葒葤藥蒞蓧萊蓮蒔萵薟獲蕕瑩鶯蓴蘀蘿螢營縈蕭薩蔥蕆蕢蔣蔞藍薊蘺蕷鎣驀薔蘞藺藹蘄蘊藪槁蘚虜慮虛蟲虯蟣雖蝦蠆蝕蟻螞蠶蠔蜆蠱蠣蟶蠻蟄蛺蟯螄蠐蛻蝸蠟蠅蟈蟬蠍螻蠑螿蟎蠨釁銜補襯袞襖嫋褘襪襲襏裝襠褌褳襝褲襇褸襤繈襴見觀覎規覓視覘覽覺覬覡覿覥覦覯覲覷觴觸觶讋譽謄訁計訂訃認譏訐訌討讓訕訖訓議訊記訒講諱謳詎訝訥許訛論訩訟諷設訪訣證詁訶評詛識詗詐訴診詆謅詞詘詔詖譯詒誆誄試詿詩詰詼誠誅詵話誕詬詮詭詢詣諍該詳詫諢詡譸誡誣語誚誤誥誘誨誑說誦誒請諸諏諾讀諑誹課諉諛誰諗調諂諒諄誶談誼謀諶諜謊諫諧謔謁謂諤諭諼讒諮諳諺諦謎諞諝謨讜謖謝謠謗諡謙謐謹謾謫譾謬譚譖譙讕譜譎讞譴譫讖穀豶貝貞負貟貢財責賢敗賬貨質販貪貧貶購貯貫貳賤賁貰貼貴貺貸貿費賀貽賊贄賈賄貲賃賂贓資賅贐賕賑賚賒賦賭齎贖賞賜贔賙賡賠賧賴賵贅賻賺賽賾贗讚贇贈贍贏贛赬趙趕趨趲躉躍蹌蹠躒踐躂蹺蹕躚躋踴躊蹤躓躑躡蹣躕躥躪躦軀車軋軌軒軑軔轉軛輪軟轟軲軻轤軸軹軼軤軫轢軺輕軾載輊轎輈輇輅較輒輔輛輦輩輝輥輞輬輟輜輳輻輯轀輸轡轅轄輾轆轍轔辭辯辮邊遼達遷過邁運還這進遠違連遲邇逕跡適選遜遞邐邏遺遙鄧鄺鄔郵鄒鄴鄰鬱郤郟鄶鄭鄆酈鄖鄲醞醱醬釅釃釀釋裏钜鑒鑾鏨釓釔針釘釗釙釕釷釺釧釤鈒釩釣鍆釹鍚釵鈃鈣鈈鈦鈍鈔鍾鈉鋇鋼鈑鈐鑰欽鈞鎢鉤鈧鈁鈥鈄鈕鈀鈺錢鉦鉗鈷缽鈳鉕鈽鈸鉞鑽鉬鉭鉀鈿鈾鐵鉑鈴鑠鉛鉚鈰鉉鉈鉍鈹鐸鉶銬銠鉺銪鋏鋣鐃銍鐺銅鋁銱銦鎧鍘銖銑鋌銩銛鏵銓鉿銚鉻銘錚銫鉸銥鏟銃鐋銨銀銣鑄鐒鋪鋙錸鋱鏈鏗銷鎖鋰鋥鋤鍋鋯鋨鏽銼鋝鋒鋅鋶鐦鐧銳銻鋃鋟鋦錒錆鍺錯錨錡錁錕錩錫錮鑼錘錐錦鍁錈錇錟錠鍵鋸錳錙鍥鍈鍇鏘鍶鍔鍤鍬鍾鍛鎪鍠鍰鎄鍍鎂鏤鎡鏌鎮鎛鎘鑷鐫鎳鎿鎦鎬鎊鎰鎔鏢鏜鏍鏰鏞鏡鏑鏃鏇鏐鐔钁鐐鏷鑥鐓鑭鐠鑹鏹鐙鑊鐳鐶鐲鐮鐿鑔鑣鑞鑲長門閂閃閆閈閉問闖閏闈閑閎間閔閌悶閘鬧閨聞闥閩閭闓閥閣閡閫鬮閱閬闍閾閹閶鬩閿閽閻閼闡闌闃闠闊闋闔闐闒闕闞闤隊陽陰陣階際陸隴陳陘陝隉隕險隨隱隸雋難雛讎靂霧霽黴靄靚靜靨韃鞽韉韝韋韌韍韓韙韞韜韻頁頂頃頇項順須頊頑顧頓頎頒頌頏預顱領頗頸頡頰頲頜潁熲頦頤頻頮頹頷頴穎顆題顒顎顓顏額顳顢顛顙顥纇顫顬顰顴風颺颭颮颯颶颸颼颻飀飄飆飆飛饗饜飣饑飥餳飩餼飪飫飭飯飲餞飾飽飼飿飴餌饒餉餄餎餃餏餅餑餖餓餘餒餕餜餛餡館餷饋餶餿饞饁饃餺餾饈饉饅饊饌饢馬馭馱馴馳驅馹駁驢駔駛駟駙駒騶駐駝駑駕驛駘驍罵駰驕驊駱駭駢驫驪騁驗騂駸駿騏騎騍騅騌驌驂騙騭騤騷騖驁騮騫騸驃騾驄驏驟驥驦驤髏髖髕鬢魘魎魚魛魢魷魨魯魴魺鮁鮃鯰鱸鮋鮓鮒鮊鮑鱟鮍鮐鮭鮚鮳鮪鮞鮦鰂鮜鱠鱭鮫鮮鮺鯗鱘鯁鱺鰱鰹鯉鰣鰷鯀鯊鯇鮶鯽鯒鯖鯪鯕鯫鯡鯤鯧鯝鯢鯰鯛鯨鯵鯴鯔鱝鰈鰏鱨鯷鰮鰃鰓鱷鰍鰒鰉鰁鱂鯿鰠鼇鰭鰨鰥鰩鰟鰜鰳鰾鱈鱉鰻鰵鱅鰼鱖鱔鱗鱒鱯鱤鱧鱣鳥鳩雞鳶鳴鳲鷗鴉鶬鴇鴆鴣鶇鸕鴨鴞鴦鴒鴟鴝鴛鴬鴕鷥鷙鴯鴰鵂鴴鵃鴿鸞鴻鵐鵓鸝鵑鵠鵝鵒鷳鵜鵡鵲鶓鵪鶤鵯鵬鵮鶉鶊鵷鷫鶘鶡鶚鶻鶿鶥鶩鷊鷂鶲鶹鶺鷁鶼鶴鷖鸚鷓鷚鷯鷦鷲鷸鷺鸇鷹鸌鸏鸛鸘鹺麥麩黃黌黶黷黲黽龍歷誌製壹臺臯準復勐鐘註範籤'
+
+  const Traditionalized = (cc) => {
+    let str = ''
+    const ss = JTPYStr()
+    const tt = FTPYStr()
+    for (let i = 0; i < cc.length; i++) {
+      if (cc.charCodeAt(i) > 10000 && ss.indexOf(cc.charAt(i)) !== -1) {
+        str += tt.charAt(ss.indexOf(cc.charAt(i)))
+      } else str += cc.charAt(i)
+    }
+    return str
+  }
+
+  const Simplized = (cc) => {
+    let str = ''
+    const ss = JTPYStr()
+    const tt = FTPYStr()
+    for (let i = 0; i < cc.length; i++) {
+      if (cc.charCodeAt(i) > 10000 && tt.indexOf(cc.charAt(i)) !== -1) {
+        str += ss.charAt(tt.indexOf(cc.charAt(i)))
+      } else str += cc.charAt(i)
+    }
+    return str
+  }
+
+  const translateInitialization = () => {
+    if (translateButtonObject) {
+      if (currentEncoding !== targetEncoding) {
+        translateButtonObject.textContent =
+          targetEncoding === 1
+            ? msgToSimplifiedChinese
+            : msgToTraditionalChinese
+        setLang()
+        setTimeout(translateBody, translateDelay)
+      }
+    }
+  }
+
+  window.translateFn = {
+    translatePage,
+    Traditionalized,
+    Simplized,
+    translateInitialization
+  }
+
+  translateInitialization()
+  btf.addGlobalFn('pjaxComplete', translateInitialization, 'translateInitialization')
+})
diff --git a/source/js/utils.js b/source/js/utils.js
index 48d8306..1148e87 100644
--- a/source/js/utils.js
+++ b/source/js/utils.js
@@ -1,313 +1,313 @@
-(() => {
-  const btfFn = {
-    debounce: (func, wait = 0, immediate = false) => {
-      let timeout
-      return (...args) => {
-        const later = () => {
-          timeout = null
-          if (!immediate) func(...args)
-        }
-        const callNow = immediate && !timeout
-        clearTimeout(timeout)
-        timeout = setTimeout(later, wait)
-        if (callNow) func(...args)
-      }
-    },
-
-    throttle: function (func, wait, options = {}) {
-      let timeout, context, args
-      let previous = 0
-
-      const later = () => {
-        previous = options.leading === false ? 0 : new Date().getTime()
-        timeout = null
-        func.apply(context, args)
-        if (!timeout) context = args = null
-      }
-
-      const throttled = (...params) => {
-        const now = new Date().getTime()
-        if (!previous && options.leading === false) previous = now
-        const remaining = wait - (now - previous)
-        context = this
-        args = params
-        if (remaining <= 0 || remaining > wait) {
-          if (timeout) {
-            clearTimeout(timeout)
-            timeout = null
-          }
-          previous = now
-          func.apply(context, args)
-          if (!timeout) context = args = null
-        } else if (!timeout && options.trailing !== false) {
-          timeout = setTimeout(later, remaining)
-        }
-      }
-
-      return throttled
-    },
-
-    overflowPaddingR: {
-      add: () => {
-        const paddingRight = window.innerWidth - document.body.clientWidth
-
-        if (paddingRight > 0) {
-          document.body.style.paddingRight = `${paddingRight}px`
-          document.body.style.overflow = 'hidden'
-          const menuElement = document.querySelector('#page-header.nav-fixed #menus')
-          if (menuElement) {
-            menuElement.style.paddingRight = `${paddingRight}px`
-          }
-        }
-      },
-      remove: () => {
-        document.body.style.paddingRight = ''
-        document.body.style.overflow = ''
-        const menuElement = document.querySelector('#page-header.nav-fixed #menus')
-        if (menuElement) {
-          menuElement.style.paddingRight = ''
-        }
-      }
-    },
-
-    snackbarShow: (text, showAction = false, duration = 2000) => {
-      const { position, bgLight, bgDark } = GLOBAL_CONFIG.Snackbar
-      const bg = document.documentElement.getAttribute('data-theme') === 'light' ? bgLight : bgDark
-      Snackbar.show({
-        text,
-        backgroundColor: bg,
-        showAction,
-        duration,
-        pos: position,
-        customClass: 'snackbar-css'
-      })
-    },
-
-    diffDate: (inputDate, more = false) => {
-      const dateNow = new Date()
-      const datePost = new Date(inputDate)
-      const diffMs = dateNow - datePost
-      const diffSec = diffMs / 1000
-      const diffMin = diffSec / 60
-      const diffHour = diffMin / 60
-      const diffDay = diffHour / 24
-      const diffMonth = diffDay / 30
-      const { dateSuffix } = GLOBAL_CONFIG
-
-      if (!more) return Math.floor(diffDay)
-
-      if (diffMonth > 12) return datePost.toISOString().slice(0, 10)
-      if (diffMonth >= 1) return `${Math.floor(diffMonth)} ${dateSuffix.month}`
-      if (diffDay >= 1) return `${Math.floor(diffDay)} ${dateSuffix.day}`
-      if (diffHour >= 1) return `${Math.floor(diffHour)} ${dateSuffix.hour}`
-      if (diffMin >= 1) return `${Math.floor(diffMin)} ${dateSuffix.min}`
-      return dateSuffix.just
-    },
-
-    loadComment: (dom, callback) => {
-      if ('IntersectionObserver' in window) {
-        const observerItem = new IntersectionObserver((entries) => {
-          if (entries[0].isIntersecting) {
-            callback()
-            observerItem.disconnect()
-          }
-        }, { threshold: [0] })
-        observerItem.observe(dom)
-      } else {
-        callback()
-      }
-    },
-
-    scrollToDest: (pos, time = 500) => {
-      const currentPos = window.scrollY
-      const isNavFixed = document.getElementById('page-header').classList.contains('fixed')
-      if (currentPos > pos || isNavFixed) pos = pos - 70
-
-      if ('scrollBehavior' in document.documentElement.style) {
-        window.scrollTo({
-          top: pos,
-          behavior: 'smooth'
-        })
-        return
-      }
-
-      const startTime = performance.now()
-      const animate = currentTime => {
-        const timeElapsed = currentTime - startTime
-        const progress = Math.min(timeElapsed / time, 1)
-        window.scrollTo(0, currentPos + (pos - currentPos) * progress)
-        if (progress < 1) {
-          requestAnimationFrame(animate)
-        }
-      }
-      requestAnimationFrame(animate)
-    },
-
-    animateIn: (ele, animation) => {
-      ele.style.display = 'block'
-      ele.style.animation = animation
-    },
-
-    animateOut: (ele, animation) => {
-      const handleAnimationEnd = () => {
-        ele.style.display = ''
-        ele.style.animation = ''
-        ele.removeEventListener('animationend', handleAnimationEnd)
-      }
-      ele.addEventListener('animationend', handleAnimationEnd)
-      ele.style.animation = animation
-    },
-
-    wrap: (selector, eleType, options) => {
-      const createEle = document.createElement(eleType)
-      for (const [key, value] of Object.entries(options)) {
-        createEle.setAttribute(key, value)
-      }
-      selector.parentNode.insertBefore(createEle, selector)
-      createEle.appendChild(selector)
-    },
-
-    isHidden: ele => ele.offsetHeight === 0 && ele.offsetWidth === 0,
-
-    getEleTop: ele => {
-      let actualTop = ele.offsetTop
-      let current = ele.offsetParent
-
-      while (current !== null) {
-        actualTop += current.offsetTop
-        current = current.offsetParent
-      }
-
-      return actualTop
-    },
-
-    loadLightbox: ele => {
-      const service = GLOBAL_CONFIG.lightbox
-
-      if (service === 'medium_zoom') {
-        mediumZoom(ele, { background: 'var(--zoom-bg)' })
-      }
-
-      if (service === 'fancybox') {
-        Array.from(ele).forEach(i => {
-          if (i.parentNode.tagName !== 'A') {
-            const dataSrc = i.dataset.lazySrc || i.src
-            const dataCaption = i.title || i.alt || ''
-            btf.wrap(i, 'a', { href: dataSrc, 'data-fancybox': 'gallery', 'data-caption': dataCaption, 'data-thumb': dataSrc })
-          }
-        })
-
-        if (!window.fancyboxRun) {
-          Fancybox.bind('[data-fancybox]', {
-            Hash: false,
-            Thumbs: {
-              showOnStart: false
-            },
-            Images: {
-              Panzoom: {
-                maxScale: 4
-              }
-            },
-            Carousel: {
-              transition: 'slide'
-            },
-            Toolbar: {
-              display: {
-                left: ['infobar'],
-                middle: [
-                  'zoomIn',
-                  'zoomOut',
-                  'toggle1to1',
-                  'rotateCCW',
-                  'rotateCW',
-                  'flipX',
-                  'flipY'
-                ],
-                right: ['slideshow', 'thumbs', 'close']
-              }
-            }
-          })
-          window.fancyboxRun = true
-        }
-      }
-    },
-
-    setLoading: {
-      add: ele => {
-        const html = `
-        
    
-          
    
-            
    
-          
    
-        
    
-      `
-        ele.insertAdjacentHTML('afterend', html)
-      },
-      remove: ele => {
-        ele.nextElementSibling.remove()
-      }
-    },
-
-    updateAnchor: anchor => {
-      if (anchor !== window.location.hash) {
-        if (!anchor) anchor = location.pathname
-        const title = GLOBAL_CONFIG_SITE.title
-        window.history.replaceState({
-          url: location.href,
-          title
-        }, title, anchor)
-      }
-    },
-
-    getScrollPercent: (() => {
-      let docHeight, winHeight, headerHeight, contentMath
-
-      return (currentTop, ele) => {
-        if (!docHeight || ele.clientHeight !== docHeight) {
-          docHeight = ele.clientHeight
-          winHeight = window.innerHeight
-          headerHeight = ele.offsetTop
-          contentMath = Math.max(docHeight - winHeight, document.documentElement.scrollHeight - winHeight)
-        }
-
-        const scrollPercent = (currentTop - headerHeight) / contentMath
-        return Math.max(0, Math.min(100, Math.round(scrollPercent * 100)))
-      }
-    })(),
-
-    addEventListenerPjax: (ele, event, fn, option = false) => {
-      ele.addEventListener(event, fn, option)
-      btf.addGlobalFn('pjaxSendOnce', () => {
-        ele.removeEventListener(event, fn, option)
-      })
-    },
-
-    removeGlobalFnEvent: (key, parent = window) => {
-      const globalFn = parent.globalFn || {}
-      const keyObj = globalFn[key]
-      if (!keyObj) return
-
-      Object.keys(keyObj).forEach(i => keyObj[i]())
-
-      delete globalFn[key]
-    },
-
-    switchComments: (el = document, path) => {
-      const switchBtn = el.querySelector('#switch-btn')
-      if (!switchBtn) return
-
-      let switchDone = false
-      const postComment = el.querySelector('#post-comment')
-      const handleSwitchBtn = () => {
-        postComment.classList.toggle('move')
-        if (!switchDone && typeof loadOtherComment === 'function') {
-          switchDone = true
-          loadOtherComment(el, path)
-        }
-      }
-      btf.addEventListenerPjax(switchBtn, 'click', handleSwitchBtn)
-    }
-  }
-
-  window.btf = { ...window.btf, ...btfFn }
-})()
+(() => {
+  const btfFn = {
+    debounce: (func, wait = 0, immediate = false) => {
+      let timeout
+      return (...args) => {
+        const later = () => {
+          timeout = null
+          if (!immediate) func(...args)
+        }
+        const callNow = immediate && !timeout
+        clearTimeout(timeout)
+        timeout = setTimeout(later, wait)
+        if (callNow) func(...args)
+      }
+    },
+
+    throttle: function (func, wait, options = {}) {
+      let timeout, context, args
+      let previous = 0
+
+      const later = () => {
+        previous = options.leading === false ? 0 : new Date().getTime()
+        timeout = null
+        func.apply(context, args)
+        if (!timeout) context = args = null
+      }
+
+      const throttled = (...params) => {
+        const now = new Date().getTime()
+        if (!previous && options.leading === false) previous = now
+        const remaining = wait - (now - previous)
+        context = this
+        args = params
+        if (remaining <= 0 || remaining > wait) {
+          if (timeout) {
+            clearTimeout(timeout)
+            timeout = null
+          }
+          previous = now
+          func.apply(context, args)
+          if (!timeout) context = args = null
+        } else if (!timeout && options.trailing !== false) {
+          timeout = setTimeout(later, remaining)
+        }
+      }
+
+      return throttled
+    },
+
+    overflowPaddingR: {
+      add: () => {
+        const paddingRight = window.innerWidth - document.body.clientWidth
+
+        if (paddingRight > 0) {
+          document.body.style.paddingRight = `${paddingRight}px`
+          document.body.style.overflow = 'hidden'
+          const menuElement = document.querySelector('#page-header.nav-fixed #menus')
+          if (menuElement) {
+            menuElement.style.paddingRight = `${paddingRight}px`
+          }
+        }
+      },
+      remove: () => {
+        document.body.style.paddingRight = ''
+        document.body.style.overflow = ''
+        const menuElement = document.querySelector('#page-header.nav-fixed #menus')
+        if (menuElement) {
+          menuElement.style.paddingRight = ''
+        }
+      }
+    },
+
+    snackbarShow: (text, showAction = false, duration = 2000) => {
+      const { position, bgLight, bgDark } = GLOBAL_CONFIG.Snackbar
+      const bg = document.documentElement.getAttribute('data-theme') === 'light' ? bgLight : bgDark
+      Snackbar.show({
+        text,
+        backgroundColor: bg,
+        showAction,
+        duration,
+        pos: position,
+        customClass: 'snackbar-css'
+      })
+    },
+
+    diffDate: (inputDate, more = false) => {
+      const dateNow = new Date()
+      const datePost = new Date(inputDate)
+      const diffMs = dateNow - datePost
+      const diffSec = diffMs / 1000
+      const diffMin = diffSec / 60
+      const diffHour = diffMin / 60
+      const diffDay = diffHour / 24
+      const diffMonth = diffDay / 30
+      const { dateSuffix } = GLOBAL_CONFIG
+
+      if (!more) return Math.floor(diffDay)
+
+      if (diffMonth > 12) return datePost.toISOString().slice(0, 10)
+      if (diffMonth >= 1) return `${Math.floor(diffMonth)} ${dateSuffix.month}`
+      if (diffDay >= 1) return `${Math.floor(diffDay)} ${dateSuffix.day}`
+      if (diffHour >= 1) return `${Math.floor(diffHour)} ${dateSuffix.hour}`
+      if (diffMin >= 1) return `${Math.floor(diffMin)} ${dateSuffix.min}`
+      return dateSuffix.just
+    },
+
+    loadComment: (dom, callback) => {
+      if ('IntersectionObserver' in window) {
+        const observerItem = new IntersectionObserver((entries) => {
+          if (entries[0].isIntersecting) {
+            callback()
+            observerItem.disconnect()
+          }
+        }, { threshold: [0] })
+        observerItem.observe(dom)
+      } else {
+        callback()
+      }
+    },
+
+    scrollToDest: (pos, time = 500) => {
+      const currentPos = window.scrollY
+      const isNavFixed = document.getElementById('page-header').classList.contains('fixed')
+      if (currentPos > pos || isNavFixed) pos = pos - 70
+
+      if ('scrollBehavior' in document.documentElement.style) {
+        window.scrollTo({
+          top: pos,
+          behavior: 'smooth'
+        })
+        return
+      }
+
+      const startTime = performance.now()
+      const animate = currentTime => {
+        const timeElapsed = currentTime - startTime
+        const progress = Math.min(timeElapsed / time, 1)
+        window.scrollTo(0, currentPos + (pos - currentPos) * progress)
+        if (progress < 1) {
+          requestAnimationFrame(animate)
+        }
+      }
+      requestAnimationFrame(animate)
+    },
+
+    animateIn: (ele, animation) => {
+      ele.style.display = 'block'
+      ele.style.animation = animation
+    },
+
+    animateOut: (ele, animation) => {
+      const handleAnimationEnd = () => {
+        ele.style.display = ''
+        ele.style.animation = ''
+        ele.removeEventListener('animationend', handleAnimationEnd)
+      }
+      ele.addEventListener('animationend', handleAnimationEnd)
+      ele.style.animation = animation
+    },
+
+    wrap: (selector, eleType, options) => {
+      const createEle = document.createElement(eleType)
+      for (const [key, value] of Object.entries(options)) {
+        createEle.setAttribute(key, value)
+      }
+      selector.parentNode.insertBefore(createEle, selector)
+      createEle.appendChild(selector)
+    },
+
+    isHidden: ele => ele.offsetHeight === 0 && ele.offsetWidth === 0,
+
+    getEleTop: ele => {
+      let actualTop = ele.offsetTop
+      let current = ele.offsetParent
+
+      while (current !== null) {
+        actualTop += current.offsetTop
+        current = current.offsetParent
+      }
+
+      return actualTop
+    },
+
+    loadLightbox: ele => {
+      const service = GLOBAL_CONFIG.lightbox
+
+      if (service === 'medium_zoom') {
+        mediumZoom(ele, { background: 'var(--zoom-bg)' })
+      }
+
+      if (service === 'fancybox') {
+        Array.from(ele).forEach(i => {
+          if (i.parentNode.tagName !== 'A') {
+            const dataSrc = i.dataset.lazySrc || i.src
+            const dataCaption = i.title || i.alt || ''
+            btf.wrap(i, 'a', { href: dataSrc, 'data-fancybox': 'gallery', 'data-caption': dataCaption, 'data-thumb': dataSrc })
+          }
+        })
+
+        if (!window.fancyboxRun) {
+          Fancybox.bind('[data-fancybox]', {
+            Hash: false,
+            Thumbs: {
+              showOnStart: false
+            },
+            Images: {
+              Panzoom: {
+                maxScale: 4
+              }
+            },
+            Carousel: {
+              transition: 'slide'
+            },
+            Toolbar: {
+              display: {
+                left: ['infobar'],
+                middle: [
+                  'zoomIn',
+                  'zoomOut',
+                  'toggle1to1',
+                  'rotateCCW',
+                  'rotateCW',
+                  'flipX',
+                  'flipY'
+                ],
+                right: ['slideshow', 'thumbs', 'close']
+              }
+            }
+          })
+          window.fancyboxRun = true
+        }
+      }
+    },
+
+    setLoading: {
+      add: ele => {
+        const html = `
+        
    
+          
    
+            
    
+          
    
+        
    
+      `
+        ele.insertAdjacentHTML('afterend', html)
+      },
+      remove: ele => {
+        ele.nextElementSibling.remove()
+      }
+    },
+
+    updateAnchor: anchor => {
+      if (anchor !== window.location.hash) {
+        if (!anchor) anchor = location.pathname
+        const title = GLOBAL_CONFIG_SITE.title
+        window.history.replaceState({
+          url: location.href,
+          title
+        }, title, anchor)
+      }
+    },
+
+    getScrollPercent: (() => {
+      let docHeight, winHeight, headerHeight, contentMath
+
+      return (currentTop, ele) => {
+        if (!docHeight || ele.clientHeight !== docHeight) {
+          docHeight = ele.clientHeight
+          winHeight = window.innerHeight
+          headerHeight = ele.offsetTop
+          contentMath = Math.max(docHeight - winHeight, document.documentElement.scrollHeight - winHeight)
+        }
+
+        const scrollPercent = (currentTop - headerHeight) / contentMath
+        return Math.max(0, Math.min(100, Math.round(scrollPercent * 100)))
+      }
+    })(),
+
+    addEventListenerPjax: (ele, event, fn, option = false) => {
+      ele.addEventListener(event, fn, option)
+      btf.addGlobalFn('pjaxSendOnce', () => {
+        ele.removeEventListener(event, fn, option)
+      })
+    },
+
+    removeGlobalFnEvent: (key, parent = window) => {
+      const globalFn = parent.globalFn || {}
+      const keyObj = globalFn[key]
+      if (!keyObj) return
+
+      Object.keys(keyObj).forEach(i => keyObj[i]())
+
+      delete globalFn[key]
+    },
+
+    switchComments: (el = document, path) => {
+      const switchBtn = el.querySelector('#switch-btn')
+      if (!switchBtn) return
+
+      let switchDone = false
+      const postComment = el.querySelector('#post-comment')
+      const handleSwitchBtn = () => {
+        postComment.classList.toggle('move')
+        if (!switchDone && typeof loadOtherComment === 'function') {
+          switchDone = true
+          loadOtherComment(el, path)
+        }
+      }
+      btf.addEventListenerPjax(switchBtn, 'click', handleSwitchBtn)
+    }
+  }
+
+  window.btf = { ...window.btf, ...btfFn }
+})()