🔖 Chore(release): 0.3.2

fixed #419

.babelrc

@@ -1,11 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/preset-env",
-      {
-        "targets": "> 0.25%, not dead"
-      }
-    ],
-    "minify"
-  ]
-}

.gitattributes

@@ -0,0 +1 @@
+assets/lib/**/* linguist-vendored

.github/FUNDING.yml

@@ -0,0 +1,3 @@
+custom: [
+  "https://paypal.me/Lruihao"
+]

.github/ISSUE_TEMPLATE/bug-report.md

@@ -1,41 +0,0 @@
----
-name: Bug Report 错误报告
-about: Create a bug report 创建一个错误报告
-title: "[BUG] Some problem..."
-labels: bug
-
----
-
-### Describe the bug 描述你遇到的错误
-
-A clear and concise description of what the bug is.
-一段简短的对于你遇到的错误的描述.
-
-### Expected behavior 期待的行为
-
-A clear and concise description of what you expected to happen.
-一段简短的对于你期待的行为的描述.
-
-### Screenshots 屏幕截图
-
-If applicable, add screenshots to help explain your problem.
-如果可以的话, 提供屏幕截图对解决问题很有帮助.
-
-### Build Environment 构建环境
-
-- OS: [e.g. Windows 10, macOS, Ubuntu]
-- Theme version/commit [e.g. 0.2.0, 2ccba79]
-- Hugo version [e.g. 0.69.0]
-
-Please try to use Hugo **extended** version before opening the issue.
-请在创建 issue 之前尝试使用 Hugo **extended** 版本.
-
-### Preview Environment 预览环境
-
-- OS: [e.g. Windows 10, macOS, Ubuntu, iOS, Android]
-- Browser [e.g. Chrome, Safari, Firefox]
-
-### Additional Information 补充信息
-
-Configuration files or front matter code...
-配置文件或者前置参数的代码...

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -0,0 +1,51 @@
+name: "Bug Report 错误报告"
+description: "Create a bug report 创建一个错误报告"
+title: "[BUG] Some problem ..."
+labels: ["bug"]
+body:
+  - type: textarea
+    id: describe
+    attributes:
+      label: Describe the bug 描述你遇到的错误
+      description: |
+        A clear and concise description of what the bug is.
+        一段简短的对于你遇到的错误的描述。
+  - type: textarea
+    id: expected
+    attributes:
+      label: Expected behavior 期待的行为
+      description: |
+        A clear and concise description of what you expected to happen.
+        一段简短的对于你期待的行为的描述。
+  - type: textarea
+    id: screenshots
+    attributes:
+      label: Screenshots 屏幕截图
+      description: |
+       If applicable, add screenshots to help explain your problem.
+       如果可以的话，提供屏幕截图对解决问题很有帮助。
+  - type: textarea
+    id: environment
+    attributes:
+      label: Build Environment 构建环境
+      description: |
+        Please try to use Hugo **extended** version before opening the issue.
+        请在创建 issue 之前尝试使用 Hugo **extended** 版本。
+      placeholder: |
+        - OS: [e.g. Windows 10, macOS, Ubuntu]
+        - Theme version/commit [e.g. 0.2.0, 2ccba79]
+        - Hugo version [e.g. 0.69.0]
+  - type: textarea
+    id: preview
+    attributes:
+      label: Preview Environment 预览环境
+      placeholder: |
+        - OS: [e.g. Windows 10, macOS, Ubuntu, iOS, Android]
+        - Browser [e.g. Chrome, Safari, Firefox]
+  - type: textarea
+    id: additional
+    attributes:
+      label: Additional Information 补充信息
+      description: |
+        Configuration files or front matter code ...
+        配置文件或者前置参数的代码……

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,13 @@
 blank_issues_enabled: false
 contact_links:
+  - name: Questions 问题讨论
+    url: https://github.com/hugo-fixit/FixIt/discussions/new
+    about: Please ask questions in Discussion. 请在讨论中提问。
+
+  - name: 官方 QQ 群
+    url: https://qm.qq.com/cgi-bin/qm/qr?k=awbwdTtSQ_-H5QGzeJxdWgv6JMbNehNM&jump_from=webapi
+    about: '加入 FixIt 主题交流群: 814031017'
+
   - name: Theme Documentation 主题文档
     url: https://fixit.lruihao.cn/categories/documentation/
-    about: Please read the documentation carefully. 请先仔细阅读主题文档.
+    about: Please read the documentation carefully. 请先仔细阅读主题文档。

.github/ISSUE_TEMPLATE/feature-request.md

@@ -1,22 +0,0 @@
----
-name: Feature request 功能请求
-about: Suggest an idea for this project 为这个项目提供一个建议
-title: "[FEATURE] Some feature"
-labels: enhancement
-
----
-
-### Describe the feature you want 描述你的功能需求
-
-- Feature 1 功能需求 1
-  I want this feature to solve ...
-  我希望这个功能解决 ...
-- Feature 2 功能需求 2
-  I want this feature to solve ...
-  我希望这个功能解决 ...
-- ...
-
-### Useful reference 有价值的参考
-
-If available, provide useful links to fulfill the feature.
-如果可以的话, 提供实现这个功能的相关参考链接.

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -0,0 +1,22 @@
+name: "Feature request 功能请求"
+description: "Suggest an idea for this project 为这个项目提供一个建议"
+title: "[FEATURE] Some feature"
+labels: ["enhancement"]
+body:
+    - type: textarea
+      id: describe
+      attributes:
+        label: Describe the feature you want 描述你的功能需求
+        description: |
+            Please submit new issues for different features.
+            请针对不同的功能建议提交新的 issue。
+        placeholder: |
+          I recommend adding this feature ...
+          我希望添加这样的一个功能……
+    - type: textarea
+      id: reference
+      attributes:
+        label: Useful reference 有价值的参考
+        description: |
+          If available, provide useful links to fulfill the feature. 
+          如果可以的话，提供实现这个功能的相关参考链接。

.github/configs/auto-assign.yml

@@ -0,0 +1,27 @@
+# Set to true to add reviewers to PRs
+addReviewers: true
+
+# Set to 'author' to add PR's author as a assignee
+addAssignees: author
+
+# A list of reviewers to be added to PRs (GitHub user name)
+reviewers:
+  - Lruihao
+  
+# A number of reviewers added to the PR
+# Set 0 to add all the reviewers (default: 0)
+numberOfReviewers: 1
+
+# A list of assignees, overrides reviewers if set
+assignees:
+  - Lruihao
+  
+# A number of assignees to add to the PRs
+# Set to 0 to add all of the assignees.
+# Uses numberOfReviewers if unset.
+numberOfAssignees: 0
+
+# A list of keywords to be skipped the process if PR's title include it
+skipKeywords:
+  - wip
+  - deps-dev

.github/configs/codeql.yml

@@ -0,0 +1,5 @@
+name: "CodeQL config"
+
+paths-ignore:
+  - assets/lib/**
+  - docs/**

.github/dependabot.yml

@@ -10,3 +10,25 @@ updates:
     schedule:
       interval: "monthly"
     open-pull-requests-limit: 1000
+    assignees:
+      - "Lruihao"
+    labels:
+      - "dependencies"
+  - package-ecosystem: "github-actions"
+    directory: "/"
+    schedule:
+      interval: "monthly"
+    open-pull-requests-limit: 1000
+    assignees:
+      - "Lruihao"
+    labels:
+      - "dependencies"
+  - package-ecosystem: "gitsubmodule"
+    directory: "/"
+    schedule:
+      interval: "weekly"
+    open-pull-requests-limit: 1000
+    assignees:
+      - "Lruihao"
+    labels:
+      - "dependencies"

.github/workflows/algolia-atomic.yml

@@ -1,45 +0,0 @@
-name: Update Algolia Search Index
-
-on:
-  push:
-    branches:
-      - master
-  workflow_dispatch:
-
-jobs:
-  algolia-atomic:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v2
-        with:
-          submodules: true  # Fetch Hugo themes (true OR recursive)
-          fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod
-
-      - name: Setup Hugo
-        uses: peaceiris/actions-hugo@v2
-        with:
-          hugo-version: 'latest'
-          extended: true
-
-      - name: Build
-        run: |
-            npm install
-            npm run build
-
-      - name: Update Algolia Index (en)
-        env:
-          ALGOLIA_APP_ID: YKOM6PKLUY
-          ALGOLIA_ADMIN_KEY: ${{ secrets.ALGOLIA_ADMIN_KEY }}
-          ALGOLIA_INDEX_NAME: 'index.en'
-          ALGOLIA_INDEX_FILE: './exampleSite/public/index.json'
-        run: |
-          npm run algolia
-
-      - name: Update Algolia Index (zh-cn)
-        env:
-          ALGOLIA_APP_ID: YKOM6PKLUY
-          ALGOLIA_ADMIN_KEY: ${{ secrets.ALGOLIA_ADMIN_KEY }}
-          ALGOLIA_INDEX_NAME: 'index.zh-cn'
-          ALGOLIA_INDEX_FILE: './exampleSite/public/zh-cn/index.json'
-        run: |
-          npm run algolia

.github/workflows/auto-assign.yml

@@ -0,0 +1,14 @@
+name: Auto Assign
+on:
+  issues:
+    types: [opened]
+  pull_request_target:
+    types: [opened]
+jobs:
+  run:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: wow-actions/auto-assign@v3
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          CONFIG_FILE: .github/configs/auto-assign.yml

.github/workflows/build.yml

@@ -8,7 +8,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Check out repository code
-        uses: actions/checkout@v2
+        uses: actions/checkout@v4
         with:
           submodules: recursive  # Fetch Hugo themes (true OR recursive)
           fetch-depth: 0         # Fetch all history for .GitInfo and .Lastmod
@@ -18,4 +18,4 @@ jobs:
           hugo-version: latest
           extended: true
       - name: Build Hugo static files
-        run: hugo -v --source=exampleSite --themesDir ../.. --gc
+        run: hugo -v --source=docs --gc --minify

.github/workflows/codeql-analysis.yml

@@ -12,11 +12,14 @@
 name: "CodeQL"
 
 on:
+  push:
+    branches:
+      - master
   pull_request:
-    # The branches below must be a subset of the branches above
-    branches: [ master ]
+    branches:
+      - master
   schedule:
-    - cron: '45 0 * * 1'
+    - cron: "30 18 * * 5"
 
 jobs:
   analyze:
@@ -26,20 +29,24 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: [ 'javascript' ]
-        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
+        language: [ "javascript" ]
+        # CodeQL supports [ "cpp", "csharp", "go", "java", "javascript", "python" ]
         # Learn more:
         # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
 
     steps:
-    - name: Checkout repository
-      uses: actions/checkout@v2
+    - name: Check out repository code
+      uses: actions/checkout@v4
+      with:
+        submodules: true  # Fetch Hugo themes (true OR recursive)
+        fetch-depth: 0         # Fetch all history for .GitInfo and .Lastmod
 
     # Initializes the CodeQL tools for scanning.
     - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
+      uses: github/codeql-action/init@v3
       with:
         languages: ${{ matrix.language }}
+        config-file: ./.github/configs/codeql.yml
         # If you wish to specify custom queries, you can do so here or in a config file.
         # By default, queries listed here will override any specified in a config file.
         # Prefix the list here with "+" to use these queries and those in the config file.
@@ -48,7 +55,7 @@ jobs:
     # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
     # If this step fails, then you should remove it and run the build manually (see below)
     - name: Autobuild
-      uses: github/codeql-action/autobuild@v1
+      uses: github/codeql-action/autobuild@v3
 
     # ℹ️ Command-line programs to run using the OS shell.
     # 📚 https://git.io/JvXDl
@@ -62,4 +69,4 @@ jobs:
     #   make release
 
     - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1
+      uses: github/codeql-action/analyze@v3

.github/workflows/contributors.yml

@@ -0,0 +1,27 @@
+name: Generate Contribute List
+on:
+  push:
+    branches:
+      - master
+    workflow_dispatch:
+jobs:
+  contrib-readme-job:
+    runs-on: ubuntu-latest
+    name: A job to automate contribute list in contributors.md file
+    steps:
+      - name: First Contribution Check
+        id: first-check
+        uses: sukki37/first-contribution-check-action@v1.0.0
+        env:
+          GITHUB_TOKEN: ${{ secrets.CONTRIBUTORS_TOKEN }}
+      - name: Contribute List
+        uses: akhilmhdh/contributors-readme-action@master
+        if: ${{ steps.first-check.outputs.isNewContributor == 'true' }}
+        with:
+          readme_path: "contributors.md"
+          image_size: 100
+          commit_message: ":busts_in_silhouette: Chore(contributor): contrib-readme-action has updated contributors.md"
+          committer_username: "github-actions[bot]"
+          committer_email: "github-actions[bot]@users.noreply.github.com"
+        env:
+          GITHUB_TOKEN: ${{ secrets.CONTRIBUTORS_TOKEN }}

.gitignore

@@ -1,24 +1,28 @@
 # Hugo default output directory
 public/
-/exampleSite/resources/
-
-node_modules/
-build/
 resources/
 
-## OS Files
-# Windows
+# Hugo
+.hugo_build.lock
+jsconfig.json
+
+# NPM
+node_modules/
+
+# VSCode
+.vscode
+
+# OS Files
+## Windows
 Thumbs.db
 ehthumbs.db
 Desktop.ini
 $RECYCLE.BIN/
 
-# OSX
+## OSX
 .DS_Store
 
-# Linux
+## Linux
 .directory
 
-# Hugo
-.hugo_build.lock
-jsconfig.json
+

.npmrc

@@ -0,0 +1,2 @@
+tag-version-prefix="v"
+message=":bookmark: Chore(release): %s"

CHANGELOG.md

@@ -1,76 +0,0 @@
-# Changelog
-All notable changes to this project will be documented in this file.
-<!-- Releases see https://github.com/Lruihao/FixIt/releases -->
-
-## v0.2.13 [2022.3.14]
-
-- :recycle: Refactor: page layout ([#65](https://github.com/Lruihao/FixIt/issues/65))
-- :tada: Feat: add Artalk comment support ([#54](https://github.com/Lruihao/FixIt/issues/54), @hiifong[#57](https://github.com/Lruihao/FixIt/pull/57))
-- :tada: Feat: add Waline comment support ([#36](https://github.com/Lruihao/FixIt/issues/36))
-- :tada: Feat: add Twikoo comment support ([#64](https://github.com/Lruihao/FixIt/issues/64))
-- :sparkles: Feat: add recently updated section ([#50](https://github.com/Lruihao/FixIt/issues/50))
-- :sparkles: Feat: add article expiration reminder support ([#51](https://github.com/Lruihao/FixIt/issues/51))
-- :sparkles: Feat: add pageStyle option ([#62](https://github.com/Lruihao/FixIt/issues/62))
-- :sparkles: Style: add media style for print view ([#61](https://github.com/Lruihao/FixIt/issues/61))
-- :sparkles: Feat: add Gravatar mirror site support (@ctj12461[#66](https://github.com/Lruihao/FixIt/pull/66))
-- :sparkles: Feat: add archive count display ([#33](https://github.com/Lruihao/FixIt/issues/33))
-- :sparkles: Feat: add `details` shortcode ([#68](https://github.com/Lruihao/FixIt/issues/68))
-- :sparkles: Feat: add `center-quote` shortcode ([#69](https://github.com/Lruihao/FixIt/issues/69))
-- :sparkles: Feat: add markdown support for **title** parameter of the admonition shortcode
-- :sparkles: Feat: add 9 newly supported social links ([#17](https://github.com/Lruihao/FixIt/issues/17))
-- :zap: Perf: enhance highlight feature (GitHub syntax supported) and fix some css bugs ([#43](https://github.com/Lruihao/FixIt/issues/43))
-  - Inline Code
-  - Indented Code
-  - Block Fenced Code
-  - gist shortcode
-- :sparkles: Feat: add `params.page.code.edit` option support ([#76](https://github.com/Lruihao/FixIt/issues/76))
-- :mag: Feat: add 360 and sougou seo support
-- :bug: Fix: remove source map of local libraries to avoid 404 error ([#67](https://github.com/Lruihao/FixIt/issues/67))
-- :fire: Feat: remove shortcode cardlink ([#42](https://github.com/Lruihao/FixIt/issues/42))
-- :lipstick: Style: more refined theme style ([#40](https://github.com/Lruihao/FixIt/issues/40))
-- :pencil2: Style: fix typo *discription* should be **description** ([#60](https://github.com/Lruihao/FixIt/issues/60))
-- :wrench: Chore(update-libs):
-  - Update cell-watermark 1.0.3 and CDN support (fontFamily supported)
-  - Update animate.css 3.7.2 -> 4.1.1 ([#74](https://github.com/Lruihao/FixIt/issues/74))
-- :wrench: Chore: add atomic-algolia for exampleSite ([#70](https://github.com/Lruihao/FixIt/issues/70))
-- **Full Changelog:** [`v0.2.12...v0.2.13`](https://github.com/Lruihao/FixIt/compare/v0.2.12...v0.2.13)
-
-## v0.2.12 [2022-1-27]
-
-- :tada: Feat: add PWA support
-- :tada: Feat: add Watermark support ([#16](https://github.com/Lruihao/FixIt/issues/16))
-- :tada: Feat: add "不蒜子" count and site run time ([#18](https://github.com/Lruihao/FixIt/issues/18))
-- :sparkles: Feat: add pangu.js support ([#20](https://github.com/Lruihao/FixIt/issues/20))
-- :sparkles: Feat: add public network security config (only in China) ([#15](https://github.com/Lruihao/FixIt/issues/15))
-- :sparkles: Feat: add CustomJS option ([#24](https://github.com/Lruihao/FixIt/issues/24))
-- :sparkles: Feat: add theme embedded archeTypes
-- :mag: Feat(SEO): optimize SEO meta ([#30](https://github.com/Lruihao/FixIt/issues/30))
-- :zap: Feat: remove lib smooth-scroll ([#1](https://github.com/Lruihao/FixIt/issues/1)) replaced by CSS native properties scroll-margin, scroll-behavior ([#39](https://github.com/Lruihao/FixIt/issues/39))
-- :zap: Perf: merge shortcode cardlink (deprecated v0.2.13) into shortcode link and add 'download' param ([#42](https://github.com/Lruihao/FixIt/issues/42))
-- :zap: Perf: optimize JS loading ([#25](https://github.com/Lruihao/FixIt/issues/25))
-- :recycle: Refactor: header title DOM and add subtitle option ([#26](https://github.com/Lruihao/FixIt/issues/26))
-- :bug: Fix: set mermaid theme as 'default' when initialization ([#38](https://github.com/Lruihao/FixIt/issues/38))
-- :bug: Fix: typeit print code error ([#19](https://github.com/Lruihao/FixIt/issues/19))
-- :bug: Fix: pre element overflow error ([#29](https://github.com/Lruihao/FixIt/issues/29))
-- :bug: Fix: toc display error without content header ([#21](https://github.com/Lruihao/FixIt/issues/21))
-- :lipstick: Style: style detail adjustments, change scroll-behavior to smooth, taxonomy, header, footer, shortcode style etc.
-- :pencil: Docs: improve demo site documentation ([#37](https://github.com/Lruihao/FixIt/issues/37))
-- :wrench: Chore: add commands `fixit_checker.sh`
-- :wrench: Chore(i18n): change some translations
-- :arrow_up: Chore: update all third-party libraries
-- **Full Changelog:** [`v0.2.11...v0.2.12`](https://github.com/Lruihao/FixIt/compare/v0.2.11...v0.2.12)
-## v0.2.11 [2021-12-19]
-
-> :tada: The beginning of FixIt to fix the theme LoveIt.
-
-- :sparkles: Feat: add cardlink shortcode ([Lruihao/hugo-blog@`df9eca2`](https://github.com/Lruihao/hugo-blog/commit/df9eca26af43287748fd8d4654014357a8269b0b)) 
-- :tada: Feat: add friends layout template
-- :wrench: Chore(i18n): add translations for Traditional Chinese ([Lruihao/hugo-blog@`df9eca2`](https://github.com/Lruihao/hugo-blog/commit/b86157d8b84830bda415ab2488580afd843acac2))
-- :bug: Fix: mobile style ([Lruihao/hugo-blog#19](https://github.com/Lruihao/hugo-blog/issues/19))
-- :bug: Style: fix content h1 style ([Lruihao/hugo-blog#8](https://github.com/Lruihao/hugo-blog/issues/8))
-- :bug: Fix: `.params.author` should be `$params.author`  ([Lruihao/hugo-blog#1](https://github.com/Lruihao/hugo-blog/issues/1))
-- **Full Changelog:** [`v0.2.10...v0.2.11`](https://github.com/Lruihao/FixIt/compare/v0.2.10...v0.2.11)
-
-## v0.2.10 :arrow_down: [2020-5-29 before]
-
-Thanks [dillonzq/LoveIt](https://github.com/dillonzq/LoveIt/releases)

CONTRIBUTING.md

@@ -1,17 +1,18 @@
+# CONTRIBUTING
+
 ## How to contribute to this project
 
 First, fork this repository by clicking the fork button.
 
 Next, clone your forked repo.
 
-```
-git clone https://github.com/example/FixIt.git
-cd FixIt
+```bash
+git clone https://github.com/hugo-fixit/FixIt.git && cd FixIt
 ```
 
 Then, install the dev dependencies.
 
-```
+```bash
 npm install
 ```
 
@@ -19,16 +20,20 @@ And now you are ready to go!
 
 Here are some useful commands.
 
-```
-npm run babel #build theme.js with babel
-npm run build #build theme.js and then build the static site
-npm run start #build theme.js and then run a local debugging server
-npm run start:production #build theme.js and then run a local debugging server in production environment
-npm run serve #run a local debugging server without building a new theme.js
-npm run serve:production #run a local debugging server in production environment without building a new theme.js
+```bash
+# run a local debugging server with watch
+npm run server
+# run a local debugging server with watch in production environment
+npm run server:production
 ```
 
-Finally, create a new pull request at https://github.com/Lruihao/FixIt/pulls to submit your contribution 🎉
+If you want to do docs-related theme changes, the simplest way is to have both `FixIt` and `fixit-docs` cloned as sibling directories, and then run:
+
+```bash
+npm run server:docs
+```
+
+Finally, create a new pull request at <https://github.com/hugo-fixit/FixIt/pulls> to submit your contribution 🎉
 
 ## Git standard for developers
 
@@ -37,7 +42,8 @@ Finally, create a new pull request at https://github.com/Lruihao/FixIt/pulls to
 | Branch | Description |
 | :-- | :-- |
 | master | _The branch open to the public and release versions_ |
-| RC branch | _The development branch of the next version, e.g. v0.2.12-RC_ |
+| dev | _The development branch of the next version_ |
+| RC branch | _The release candidate branch of the next version, e.g. v0.2.12-RC_ |
 | single feature | _The branch to enhancements or fixes_ |
 
 ### Merge events
@@ -51,10 +57,17 @@ Finally, create a new pull request at https://github.com/Lruihao/FixIt/pulls to
 ### Commit message
 
 #### Format
-> {emoji} {type}: {subject within 50 words} (#{issue/pull request})
+
+`[{emoji} ]{type}[({module})]: {subject within 50 words}[ (#{issue/pull request})]`
+
+example:
+
+- :tada: Feat: add shortcode fixit-encryptor shortcode (#123)
+- :arrow_up: Chore(libs): update Artalk from 2.2.12 to 2.3.4 (#150)
 
 #### Emoji
-- https://gitmoji.dev
+
+- <https://gitmoji.dev>
 - [vscode plugin](https://github.com/maixiaojie/git-emoji-zh.git)
 - utools plugin `GitEmoji`
 
@@ -63,7 +76,7 @@ Finally, create a new pull request at https://github.com/Lruihao/FixIt/pulls to
 | Emoji                                         | Type     | Example                                                      | Description (No Ambiguous)                                   |
 | :-------------------------------------------- | :------- | :----------------------------------------------------------- | :----------------------------------------------------------- |
 | :tada:  <br>:sparkles:                        | Feat     | Feat: add {feature}                                          | new feature                                                  |
-| :truck:                                       |          | Feat: adjust/migrate {feature name}，{change details}        | For the adjustment feature, it is necessary to describe the current situation (before) and after adjustment (after) |
+| :truck:                                       |          | Feat: adjust/migrate {feature name}, {change details}        | For the adjustment feature, it is necessary to describe the current situation (before) and after adjustment (after) |
 | :fire:                                        |          | Feat: delete {feature name}, {deletion reason}               | If the feature is deleted, the reason for deletion must be explained |
 | :bug: <br>:construction: <br>:rotating_light: | Fix      | Fix: fix {bug description}                                   | Fix known bugs                                               |
 | :art: <br>:lipstick: <br>:pencil2:            | Style    | Style: Typesetting/CSS style {optimizing content}            | Changes that do not affect code operation, such as code layout and style change |

LICENSE

@@ -2,7 +2,7 @@ The MIT License (MIT)
 
 Copyright (c) 2018 LIUZHICHAO.COM
 Copyright (c) 2019-2020 DILLONZQ.COM
-Copyright (c) 2021-2022 LRUIHAO.CN
+Copyright (c) 2021-2023 LRUIHAO.CN
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of
 this software and associated documentation files (the "Software"), to deal in

README.md

@@ -1,45 +1,42 @@
 # FixIt Theme | Hugo
 
-[![GitHub release (latest by date)](https://img.shields.io/github/v/release/Lruihao/FixIt?style=flat-square)](https://github.com/Lruihao/FixIt/releases)
-[![GitHub commits since tagged version](https://img.shields.io/github/commits-since/Lruihao/FixIt/v0.2.10?style=flat-square)](https://github.com/Lruihao/FixIt/compare/v0.2.10...master)
-[![Hugo](https://img.shields.io/badge/Hugo-%5E0.62.0-ff4088?style=flat-square&logo=hugo)](https://gohugo.io/)
-[![License](https://img.shields.io/github/license/Lruihao/FixIt?style=flat-square)](https://github.com/Lruihao/FixIt/blob/master/LICENSE)
+[![GitHub release (latest by date)](https://img.shields.io/github/v/release/hugo-fixit/FixIt?style=flat)](https://github.com/hugo-fixit/FixIt/releases)
+[![Hugo](https://img.shields.io/badge/Hugo-%5E0.112.0-ff4088?style=flat&logo=hugo)](https://gohugo.io/)
+[![License](https://img.shields.io/github/license/hugo-fixit/FixIt?style=flat)](/LICENSE)
 
-English README | [简体中文说明](https://github.com/Lruihao/FixIt/blob/master/README.zh-cn.md)
+👉 English README | [简体中文说明](README.zh-cn.md)
 
-> **FixIt** is a **clean**, **elegant** but **advanced** blog theme for [Hugo](https://gohugo.io/).
+> [FixIt](https://github.com/hugo-fixit/FixIt) is a **clean**, **elegant** but **advanced** blog theme for [Hugo](https://gohugo.io/).
 
-It is based on the original [LoveIt Theme](https://github.com/dillonzq/LoveIt), [LeaveIt Theme](https://github.com/liuzc/LeaveIt) and [KeepIt Theme](https://github.com/Fastbyte01/KeepIt).
+It is based on the original [LoveIt Theme](https://github.com/dillonzq/LoveIt), [KeepIt Theme](https://github.com/Fastbyte01/KeepIt) and [LeaveIt Theme](https://github.com/liuzc/LeaveIt).
 
-[LoveIt Theme](https://github.com/dillonzq/LoveIt) is a awesome hugo theme for us, I'm sorry that it's repository has been out of maintenance for a long time, so I rebuilt a new fork named FixIt so that I can better **Fix It** and make it more user-friendly.
+The FixIt theme inherits the excellent features of these themes, and adds new features and optimizations on those basis. Please read [Why Choose FixIt](#why-choose-fixit) to learn more.
 
-The FixIt theme inherits the excellent functions of these themes, and adds new functions and optimizations on this basis. Please read [Why Choose FixIt](#why-choose-fixit) to learn more.
-
-![Hugo Theme FixIt](https://github.com/Lruihao/FixIt/raw/master/images/Apple-Devices-Preview.png)
+![Hugo Theme FixIt](https://fixit.lruihao.cn/images/Apple-Devices-Preview.jpg)
 
 ## Getting started
-Head to this [documentation page](https://fixit.lruihao.cn/theme-documentation-basics/) for a complete guidence to get started with the FixIt theme.
 
-### [Demo Site](https://fixit.lruihao.cn)
-To see this theme in action, here is a live [demo site](https://fixit.lruihao.cn) which is rendered with **FixIt** theme.
+Head to the [getting started page](http://fixit.lruihao.cn/documentation/getting-started/) or start with a template:
 
-### [Documentation](https://fixit.lruihao.cn/categories/documentation/)
-Build Documentation Locally:
+- [hugo-fixit/hugo-fixit-blog-git](https://github.com/hugo-fixit/hugo-fixit-blog-git)
+- [hugo-fixit/hugo-fixit-blog-go](https://github.com/hugo-fixit/hugo-fixit-blog-go)
 
-```bash
-hugo server --source=exampleSite
-```
+## [Documentation](https://fixit.lruihao.cn/categories/documentation/)
 
-Of course, you can also read the [FixIt wiki](https://github.com/Lruihao/FixIt/wiki) directly.
+Head to this [documentation page](https://fixit.lruihao.cn/documentation/basics/) for a complete guidence to get started with the FixIt theme.
+
+Or run [Documentation Site](https://fixit.lruihao.cn) locally, see more details from [Contributing](#contributing).
+
+In addition, there is the [FixIt wiki](https://github.com/hugo-fixit/FixIt/wiki).
 
 ## Migrate from LoveIt
 
 If you are currently using the LoveIt theme (or some other themes), it is very easy to migrate to FixIt.
 
-You can add this repo as a submodule of your site directory.
+You can add this repo as a submodule of your site directory. Alternatively, you can install the theme in [other ways](https://fixit.lruihao.cn/documentation/basics/#install-theme).
 
 ```bash
-git submodule add https://github.com/Lruihao/FixIt.git themes/FixIt
+git submodule add https://github.com/hugo-fixit/FixIt.git themes/FixIt
 ```
 
 And later you can update the submodule in your site directory to the latest commit using this command:
@@ -48,13 +45,7 @@ And later you can update the submodule in your site directory to the latest comm
 git submodule update --remote --merge
 ```
 
-Or use shell command `fixit_checker.sh` to update and commit in the theme directory.
-
-```bash
-sh fixit_checker.sh
-```
-
-Next, go to the `config.toml` and change the default theme to `FixIt`.
+Next, go to the `hugo.toml` and change the default theme to `FixIt`.
 
 ```diff
 - theme = "LoveIt"
@@ -65,171 +56,193 @@ Now the migration is finished and everything is ready 🎉
 
 ## Why choose FixIt
 
-* Custom **Header**
-* Custom **CSS Style**
-* A new **home page**, compatible with the latest version of Hugo
-* A lot of **style detail adjustments,** including color, font size, margins, code preview style
-* More readable **dark mode**
-* Some beautiful **CSS animations**
-* Easy-to-use and self-expanding **table of contents**
-* More **social links**, **share sites** and **comment system**
-* **Search** supported by [Lunr.js](https://lunrjs.com/) or [algolia](https://www.algolia.com/)
-* **Copy code** to clipboard with one click
-* Extended Markdown syntax for **[Font Awesome](https://fontawesome.com/) icons**
-* Extended Markdown syntax for **ruby annotation**
-* Extended Markdown syntax for **fraction**
-* **Mathematical formula** supported by [KaTeX](https://katex.org/)
-* **Diagram syntax** shortcode supported by [mermaid](https://github.com/knsv/mermaid)
-* **Interactive data visualization** shortcode supported by [ECharts](https://echarts.apache.org/)
-* **Mapbox** shortcode supported by [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
-* Embedded **music player** supported by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
-* **Bilibili** player supported
-* Kinds of **admonitions** shortcode supported
-* Custom style shortcodes supported
-* **CDN** for all third-party libraries supported
-* **PWA (Progressive Web App)** supported
-* **Web Watermark** supported by [cell-watermark](https://github.com/Lruihao/watermark)
-* **Chinese typesetting** supported by [pangu.js](https://github.com/vinta/pangu.js)
-* **Card type** link shortcode
-* **Friends** page embedded template
-* ...
+The FixIt theme inherits the excellent features of themes such as LoveIt, and adds new features and optimizations on those basis, as detailed in [Features](#features). In addition, the FixIt theme has the following advantages:
 
-In short,  
-if you prefer the design language and freedom of the FixIt theme,  
-if you want to use the extended Font Awesome icons conveniently,  
-if you want to embed mathematical formulas, flowcharts, music or Bilibili videos in your posts,  
-the FixIt theme may be more suitable for you.  
+- Complete Chinese and English official documentations
+- Community support: Theme official website, Discussions and official QQ group
+- Continuously and actively update
+- Constantly incorporate suggestions and ideas from all sides
+- Highly open theme customizable section
+
+In short, if you prefer the design language and freedom of the FixIt theme, and if you like to personalize your own themes as I do, the FixIt theme may be more suitable for you.
+
+## Who used FixIt
+
+To see this theme in action, here are some [live demo sites](https://fixit.lruihao.cn/friends/) which are rendered with **FixIt** theme.
 
 ## Features
 
 ### Performance and SEO
 
-* Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
-* Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
-* **[Google Analytics](https://analytics.google.com/analytics)** supported
-* **[Fathom Analytics](https://usefathom.com/)** supported
-* Search engine **verification** supported (Google, Bind, Yandex and Baidu)
-* **CDN** for third-party libraries supported
-* Automatically converted images with **Lazy Load** by [lazysizes](https://github.com/aFarkas/lazysizes)
+- Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
+- Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
+- **[Google Analytics](https://analytics.google.com/analytics)** supported
+- **[Fathom Analytics](https://usefathom.com/)** supported
+- Search engine **verification** supported (Google, Bing, Yandex, Pinterest, Baidu, 360 and Sogou)
+- **CDN** for third-party libraries supported
 
 ### Appearance and Layout
 
-* **Responsive** layout
-* **Light/Dark** mode
-* Globally consistent **design language**
-* **Pagination** supported
-* Easy-to-use and self-expanding **table of contents**
-* **Multilanguage** supported and i18n ready
-* Beautiful **CSS animation**
+- **Responsive** layout
+- **Light/Dark** mode
+- Globally consistent **design language**
+- **Pagination** supported
+- Easy-to-use and self-expanding **table of contents**
+- **Multilanguage** supported and i18n ready
+- Beautiful **CSS animation**
 
 ### Social and Comment Systems
 
-* **Gravatar** supported by [Gravatar](https://gravatar.com)
-* Local **Avatar** supported
-* Up to **73** social links supported
-* Up to **28** share sites supported
-* **Disqus** comment system supported by [Disqus](https://disqus.com)
-* **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
-* **Valine** comment system supported by [Valine](https://valine.js.org/)
-* **Waline** comment system supported by [Waline](https://waline.js.org/)
-* **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
-* **Telegram comments** system supported by [Telegram Comments](https://comments.app/)
-* **Commento** comment system supported by [Commento](https://commento.io/)
-* **Utterances** comment system supported by [Utterances](https://utteranc.es/)
-* **Artalk** comment system supported by [Artalk](https://artalk.js.org/)
-* **Twikoo** comment system supported by [Twikoo](https://twikoo.js.org/)
+- **Gravatar** supported by [Gravatar](https://gravatar.com)
+- Local **Avatar** supported
+- Up to **87** social links supported
+- Up to **28** share sites supported
+- **Disqus** comment system supported by [Disqus](https://disqus.com)
+- **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
+- **Valine** comment system supported by [Valine](https://valine.js.org/)
+- **Waline** comment system supported by [Waline](https://waline.js.org/)
+- **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
+- **Telegram comments** system supported by [Telegram Comments](https://comments.app/)
+- **Commento** comment system supported by [Commento](https://commento.io/)
+- **Utterances** comment system supported by [Utterances](https://utteranc.es/)
+- **Artalk** comment system supported by [Artalk](https://artalk.js.org/)
+- **Twikoo** comment system supported by [Twikoo](https://twikoo.js.org/)
+- **giscus** comment system supported by [giscus](https://giscus.app/)
 
 ### Extended Features
 
-* **Search** supported by [Lunr.js](https://lunrjs.com/) or [algolia](https://www.algolia.com/)
-* **Twemoji** supported
-* Automatically **highlighting** code
-* **Copy code** to clipboard with one click
-* **Images gallery** supported by [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js)
-* Extended Markdown syntax for **[Font Awesome](https://fontawesome.com/) icons**
-* Extended Markdown syntax for **ruby annotation**
-* Extended Markdown syntax for **fraction**
-* **Mathematical formula** supported by [KaTeX](https://katex.org/)
-* **Diagrams** shortcode supported by [mermaid](https://github.com/knsv/mermaid)
-* **Interactive data visualization** shortcode supported by [ECharts](https://echarts.apache.org/)
-* **Mapbox** shortcode supported by [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
-* **Music player** shortcode supported by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
-* **Bilibili player** shortcode
-* Kinds of **admonitions** shortcode
-* **Custom style** shortcode
-* **Custom script** shortcode
-* **Animated typing** supported by [TypeIt](https://typeitjs.com/)
-* **Cookie consent banner** supported by [cookieconsent](https://github.com/osano/cookieconsent)
-* **PWA (Progressive Web App)** supported
-* **Web Watermark** supported by [cell-watermark](https://github.com/Lruihao/watermark)
-* **Chinese typesetting** supported by [pangu.js](https://github.com/vinta/pangu.js)
-* **Card type** link shortcode
-* **Friends** page embedded template
-* ...
+- **PWA (Progressive Web App)** supported
+- **Sub Menu** supported
+- **Content Encryption** supported (Pages, Partial)
+- **Friends** page embedded template
+- **Search** supported by [algolia](https://www.algolia.com/) or [Fuse.js](https://fusejs.io/)
+- **Twemoji** supported
+- Automatically **highlighting** code
+- **Copy code** to clipboard with one click
+- **Images gallery** supported by [lightgallery](https://github.com/sachinchoolur/lightgallery)
+- Extended Markdown syntax for **[Font Awesome](https://fontawesome.com/) icons**
+- Extended Markdown syntax for **ruby annotation**
+- Extended Markdown syntax for **fraction**
+- **Mathematical formula** supported by [KaTeX](https://katex.org/)
+- **Diagrams** shortcode supported by [mermaid](https://github.com/knsv/mermaid)
+- **Interactive data visualization** shortcode supported by [ECharts](https://echarts.apache.org/)
+- **Mapbox** shortcode supported by [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
+- **Music player** shortcode supported by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
+- **Bilibili player** shortcode
+- Kinds of **admonitions** shortcode
+- **Custom style** shortcode
+- **Custom script** shortcode
+- **Animated typing** supported by [TypeIt](https://typeitjs.com/)
+- **Cookie consent banner** supported by [cookieconsent](https://github.com/osano/cookieconsent)
+- **Web Watermark** supported by [cell-watermark](https://github.com/Lruihao/watermark)
+- **Chinese typesetting** supported by [pangu.js](https://github.com/vinta/pangu.js)
+- Options to **cache remote image** locally
+- ...
 
 ## Multilingual and i18n
 
 FixIt supports the following languages:
 
-* English
-* Simplified Chinese
-* French
-* Polish
-* Brazilian Portuguese
-* Italian
-* Spanish
-* German
-* Serbian
-* Russian
-* Romanian
-* Vietnamese
-* Traditional Chinese
-* [Contribute with a new language](https://github.com/Lruihao/FixIt/pulls)
-[Languages Compatibility](https://fixit.lruihao.cn/theme-documentation-basics/#language-compatibility)
+- English
+- Simplified Chinese
+- Traditional Chinese
+- French
+- Polish
+- Brazilian Portuguese
+- Italian
+- Spanish
+- German
+- Serbian
+- Russian
+- Romanian
+- Vietnamese
+- [Contribute with a new language](https://github.com/hugo-fixit/FixIt/pulls)
 
-## [Roadmap](https://github.com/Lruihao/FixIt/projects/1)
+[Languages Compatibility](https://fixit.lruihao.cn/documentation/basics/#language-compatibility)
 
-## [Changelog](https://github.com/Lruihao/FixIt/blob/master/CHANGELOG.md)
+## [Roadmap](https://github.com/hugo-fixit/FixIt/projects/1)
+
+## [Changelog](/CHANGELOG.md)
 
 ## Questions, ideas, bugs, pull requests
 
-All feedback is welcome! Head over to the [issue tracker](https://github.com/Lruihao/FixIt/issues).
+All feedback is welcome! Head over to the [issues](https://github.com/hugo-fixit/FixIt/issues) or [discussions](https://github.com/hugo-fixit/FixIt/discussions) tracker.
+
+## Contributing
+
+Please see [CONTRIBUTING.md](CONTRIBUTING.md) for getting started with the contribution.
+
+Make sure that you follow [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) while contributing and engaging in the discussions.
+
+**When contributing, please first discuss the change you wish to make via an issue on this repository before making the actual change**.
+
+## [Contributors](contributors.md)
+
+## Acknowledgements
+
+<details open>
+<summary>Thanks to the authors of following resources included in the theme:</summary>
+
+- [normalize.css](https://github.com/necolas/normalize.css)
+- [Font Awesome](https://fontawesome.com/)
+- [Simple Icons](https://github.com/simple-icons/simple-icons)
+- [Animate.css](https://daneden.github.io/animate.css/)
+- [autocomplete-js](https://github.com/algolia/autocomplete)
+- [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
+- [Fuse.js](https://fusejs.io/)
+- [object-fit-images](https://github.com/fregante/object-fit-images)
+- [Twemoji](https://github.com/twitter/twemoji)
+- [emoji-data](https://github.com/iamcal/emoji-data)
+- [lightgallery](https://github.com/sachinchoolur/lightgallery)
+- [Sharer.js](https://github.com/ellisonleao/sharer.js)
+- [TypeIt](https://typeitjs.com/)
+- [KaTeX](https://katex.org/)
+- [mermaid](https://github.com/mermaid-js/mermaid)
+- [ECharts](https://echarts.apache.org/)
+- [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
+- [APlayer](https://github.com/MoePlayer/APlayer)
+- [MetingJS](https://github.com/metowolf/MetingJS)
+- [Gitalk](https://github.com/gitalk/gitalk)
+- [Valine](https://valine.js.org/)
+- [cookieconsent](https://github.com/osano/cookieconsent)
+- [cell-watermark](https://github.com/Lruihao/watermark)
+- [不蒜子](http://busuanzi.ibruce.info/)
+- [pangu.js](https://github.com/vinta/pangu.js)
+- [Artalk](https://artalk.js.org/)
+- [Waline](https://waline.js.org/)
+- [Twikoo](https://twikoo.js.org/)
+- [github-corners](https://github.com/tholman/github-corners)
+- [giscus](https://giscus.app/)
+- [crypto-js](https://github.com/brix/crypto-js)
+- [vConsole](https://github.com/Tencent/vConsole)
+- [eruda](https://github.com/liriliri/eruda)
+- [pace](https://github.com/CodeByZach/pace)
+
+</details>
+
+<details open>
+<summary>The FixIt also draws on some features of the following projects, and thanks to their authors as well:</summary>
+
+- [DoIt](https://github.com/HEIGE-PCloud/DoIt)
+- [NexT](https://github.com/next-theme/hexo-theme-next)
+
+</details>
 
 ## License
 
-FixIt is licensed under the **MIT** license. Check the [LICENSE file](https://github.com/Lruihao/FixIt/blob/master/LICENSE) for details.
-
-Thanks to the authors of following resources included in the theme:
-
-* [normalize.css](https://github.com/necolas/normalize.css)
-* [Font Awesome](https://fontawesome.com/)
-* [Simple Icons](https://github.com/simple-icons/simple-icons)
-* [Animate.css](https://daneden.github.io/animate.css/)
-* [autocomplete.js](https://github.com/algolia/autocomplete.js)
-* [Lunr.js](https://lunrjs.com/)
-* [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
-* [lazysizes](https://github.com/aFarkas/lazysizes)
-* [object-fit-images](https://github.com/fregante/object-fit-images)
-* [Twemoji](https://github.com/twitter/twemoji)
-* [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js)
-* [clipboard.js](https://github.com/zenorocha/clipboard.js)
-* [Sharer.js](https://github.com/ellisonleao/sharer.js)
-* [TypeIt](https://typeitjs.com/)
-* [KaTeX](https://katex.org/)
-* [mermaid](https://github.com/knsv/mermaid)
-* [ECharts](https://echarts.apache.org/)
-* [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
-* [APlayer](https://github.com/MoePlayer/APlayer)
-* [MetingJS](https://github.com/metowolf/MetingJS)
-* [Gitalk](https://github.com/gitalk/gitalk)
-* [Valine](https://valine.js.org/)
-* [cookieconsent](https://github.com/osano/cookieconsent)
-* [cell-watermark](https://github.com/Lruihao/watermark)
-* [pangu.js](https://github.com/vinta/pangu.js)
-* [Artalk](https://artalk.js.org/)
-* [Waline](https://waline.js.org/)
-* [Twikoo](https://twikoo.js.org/)
+FixIt is licensed under the **MIT** license. Check the [LICENSE file](LICENSE) for details.
 
 ## Author
 
-[Lruihao](https://lruihao.cn)
+[Lruihao](https://github.com/Lruihao "Follow me on GitHub")
+
+## Sponsor
+
+Giving me a Star 🌟 is already the greatest encouragement and support for me.\
+If you enjoy the theme, please consider buying me a coffee ☕️.
+
+- [PayPal](https://paypal.me/Lruihao)
+- [Alipay](images/alipay.jpg)
+- [Wechat](images/wechatpay.jpg)
+
+Thanks! ❤️

README.zh-cn.md

@@ -1,44 +1,42 @@
 # FixIt 主题 | Hugo
 
-[![GitHub release (latest by date)](https://img.shields.io/github/v/release/Lruihao/FixIt?style=flat-square)](https://github.com/Lruihao/FixIt/releases)
-[![GitHub commits since tagged version](https://img.shields.io/github/commits-since/Lruihao/FixIt/v0.2.10?style=flat-square)](https://github.com/Lruihao/FixIt/compare/v0.2.10...master)
-[![Hugo](https://img.shields.io/badge/Hugo-%5E0.62.0-ff4088?style=flat-square&logo=hugo)](https://gohugo.io/)
-[![License](https://img.shields.io/github/license/Lruihao/FixIt?style=flat-square)](https://github.com/Lruihao/FixIt/blob/master/LICENSE)
+[![GitHub release (latest by date)](https://img.shields.io/github/v/release/hugo-fixit/FixIt?style=flat)](https://github.com/hugo-fixit/FixIt/releases)
+[![Hugo](https://img.shields.io/badge/Hugo-%5E0.112.0-ff4088?style=flat&logo=hugo)](https://gohugo.io/)
+[![License](https://img.shields.io/github/license/hugo-fixit/FixIt?style=flat)](/LICENSE)
 
-[English README](https://github.com/Lruihao/FixIt/blob/master/README.md) | 简体中文说明
+👉 [English README](README.md) | 简体中文说明
 
-> [FixIt](https://github.com/Lruihao/FixIt) 是一个**简洁**、**优雅**且**高效**的 [Hugo](https://gohugo.io/) 博客主题。
+> [FixIt](https://github.com/hugo-fixit/FixIt) 是一个**简洁**、**优雅**且**高效**的 [Hugo](https://gohugo.io/) 博客主题。
 
-它的原型基于 [LoveIt 主题](https://github.com/dillonzq/LoveIt), [LeaveIt 主题](https://github.com/liuzc/LeaveIt) 和 [KeepIt 主题](https://github.com/Fastbyte01/KeepIt)。
-
-[LoveIt 主题](https://github.com/dillonzq/LoveIt) 对我们来说是一个很棒的 Hugo 主题，很抱歉的是它的存储库已经停止维护很长一段时间了，所以我重建了一个名为 FixIt 的新主题，这样我可以更好地 **Fix It** 并使它用户体验更好。
+它的原型基于 [LoveIt 主题](https://github.com/dillonzq/LoveIt)，[KeepIt 主题](https://github.com/Fastbyte01/KeepIt) 和 [LeaveIt 主题](https://github.com/liuzc/LeaveIt)。
 
 FixIt 主题继承了这些主题的优秀功能，并在此基础上添加了新的功能与优化，请阅读 [为什么选择 FixIt](#为什么选择-FixIt) 来了解更多。
 
-![Hugo Theme FixIt](https://github.com/Lruihao/FixIt/raw/master/images/Apple-Devices-Preview.png)
+![Hugo Theme FixIt](https://fixit.lruihao.cn/images/Apple-Devices-Preview.jpg)
 
-## 立即开始
-前往这篇 [文档](https://fixit.lruihao.cn/zh-cn/theme-documentation-basics/)，阅读关于安装与使用的详细指南。
+## 快速上手
 
-### 主题 [预览](https://fixit.lruihao.cn/zh-cn/)
-为了直观地浏览主题特性，这里有一个基于 **FixIt** 主题渲染的 [预览网站](https://fixit.lruihao.cn/zh-cn/)。
+前往 [快速上手页面](https://fixit.lruihao.cn/zh-cn/documentation/getting-started/) 或从一个模板直接开始：
 
-### [文档](https://fixit.lruihao.cn/zh-cn/categories/documentation/)
-在本地构建文档：
-```bash
-hugo server --source=exampleSite
-```
+- [hugo-fixit/hugo-fixit-blog-git](https://github.com/hugo-fixit/hugo-fixit-blog-git)
+- [hugo-fixit/hugo-fixit-blog-go](https://github.com/hugo-fixit/hugo-fixit-blog-go)
 
-当然，你也可以直接阅读 [FixIt 主题维基](https://github.com/Lruihao/FixIt/wiki)
+## [完整文档](https://fixit.lruihao.cn/zh-cn/categories/documentation/)
+
+前往这篇 [文档](https://fixit.lruihao.cn/zh-cn/documentation/basics/)，阅读关于安装与使用的详细指南。
+
+或者在本地运行 [文档站点](https://fixit.lruihao.cn/zh-cn/)，更多细节详见 [参与贡献](#参与贡献)。
+
+除此之外，还有 [FixIt 主题维基](https://github.com/hugo-fixit/FixIt/wiki)。
 
 ## 从 LoveIt 迁移
 
 如果你现在正在使用 LoveIt 主题（或者一些其他的主题），你可以很容易地迁移至 FixIt。
 
-你可以将这个主题仓库添加为你的网站目录的子模块。
+你可以将这个主题仓库添加为你的网站目录的子模块。或者，你可以通过 [其他方式](https://fixit.lruihao.cn/zh-cn/documentation/basics/#install-theme) 安装主题。
 
 ```bash
-git submodule add https://github.com/Lruihao/FixIt.git themes/FixIt
+git submodule add https://github.com/hugo-fixit/FixIt.git themes/FixIt
 ```
 
 之后，你可以在站点目录通过这条命令来将主题更新至最新版本：
@@ -47,13 +45,7 @@ git submodule add https://github.com/Lruihao/FixIt.git themes/FixIt
 git submodule update --remote --merge
 ```
 
-或者在主题目录中使用 shell 命令 `fixit_checker.sh` 将主题更新至最新版本：
-
-```bash
-sh fixit_checker.sh
-```
-
-接着，前往 `config.toml` 并将默认主题更改为 `FixIt`。
+接着，前往 `hugo.toml` 并将默认主题更改为 `FixIt`。
 
 ```diff
 - theme = "LoveIt"
@@ -64,171 +56,197 @@ sh fixit_checker.sh
 
 ## 为什么选择 FixIt
 
-* 自定义**标题栏**
-* 自定义 **CSS 样式**
-* 焕然一新的**主页**，已经兼容最新版 Hugo
-* 大量的**样式细节调整**，包括颜色、字体大小、边距、代码预览样式
-* 可读性更强的**深色模式**
-* 一些美观的 **CSS 动画**
-* 易用和自动展开的**文章目录**
-* 支持更多的**社交链接**、**网站分享**和**评论系统**
-* 支持基于 [Lunr.js](https://lunrjs.com/) 或 [algolia](https://www.algolia.com/) 的**搜索**
-* 一键**复制代码**到剪贴板
-* 支持基于 **[Font Awesome](https://fontawesome.com/) 图标**的扩展 Markdown 语法
-* 支持**上标注释**的扩展 Markdown 语法
-* 支持**分数**的扩展 Markdown 语法
-* 支持基于 [KaTeX](https://katex.org/) 的**数学公式**
-* 支持基于 [mermaid](https://github.com/knsv/mermaid) 的**图表**生成功能
-* 支持基于 [ECharts](https://echarts.apache.org/) 的**交互式数据可视化**生成功能
-* 支持基于 [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js) 的 **Mapbox** 地图显示功能
-* 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的内嵌**音乐播放器**
-* 支持内嵌 **Bilibili** 视频
-* 支持多种**注释**的 shortcode
-* 支持自定义样式的 shortcode
-* 支持所有第三方库的 **CDN**
-* 支持**渐进式网页应用**
-* 支持基于 [cell-watermark](https://github.com/Lruihao/watermark) 的**网页水印**
-* 支持基于 [pangu.js](https://github.com/vinta/pangu.js) 的**中文排版**
-* 支持**卡片式链接**的 shortcode
-* 支持**友情链接**的页面模板
-* ...
+FixIt 主题继承了 LoveIt 等主题的优秀功能，并在它们的基础上添加了新的功能与优化，详见 [特性](#特性)。除此之外，FixIt 主题还有以下优点：
 
-所以，  
-如果你更偏好 FixIt 主题的设计语言和自由度，  
-如果你想便捷地使用扩展的 Font Awesome 图标，  
-如果你想在文章内嵌数学公式、流程图、音乐或是 Bilibili 视频，  
-那么，FixIt 主题可能是更适合你。  
+- 完善的中英文官方文档
+- 社区支持：主题官网、Discussions 和官方 QQ 群
+- 持续积极地更新
+- 不断收纳各方的建议和想法
+- 高度开放主题可自定义部分
+
+总之，如果你更偏好 FixIt 主题的设计语言和自由度，如果你和我一样喜欢个性化自定义主题，那么，FixIt 主题可能是更适合你。  
+
+## 谁在用 FixIt
+
+为了直观地浏览主题特性，这里有一些基于 **FixIt** 主题渲染的 [预览网站](https://fixit.lruihao.cn/zh-cn/friends/)。
 
 ## 特性
 
 ### 性能和 SEO
 
-* **性能**优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中， 99/100 的移动设备得分和 100/100 的桌面设备得分
-* 使用基于 JSON-LD 格式 的 **SEO SCHEMA** 文件进行 SEO 优化
-* 支持 **[Google Analytics](https://analytics.google.com/analytics)**
-* 支持 **[Fathom Analytics](https://usefathom.com/)**
-* 支持搜索引擎的**网站验证** (Google, Bind, Yandex and Baidu)
-* 支持所有第三方库的 **CDN**
-* 基于 [lazysizes](https://github.com/aFarkas/lazysizes) 自动转换图片为**懒加载**
+- **性能**优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中，99/100 的移动设备得分和 100/100 的桌面设备得分
+- 使用基于 JSON-LD 格式 的 **SEO SCHEMA** 文件进行 SEO 优化
+- 支持 **[Google Analytics](https://analytics.google.com/analytics)**
+- 支持 **[Fathom Analytics](https://usefathom.com/)**
+- 支持搜索引擎的**网站验证** (Google, Bing, Yandex, Pinterest, Baidu, 360 and Sogou)
+- 支持所有第三方库的 **CDN**
 
 ### 外观和布局
 
-* **响应式**布局
-* **浅色/深色** 主题模式
-* 全局一致的**设计语言**
-* 支持**分页**
-* 易用和自动展开的**文章目录**
-* 支持**多语言**和国际化
-* 美观的 **CSS 动画**
+- **响应式**布局
+- **浅色/深色** 主题模式
+- 全局一致的**设计语言**
+- 支持**分页**
+- 易用和自动展开的**文章目录**
+- 支持**多语言**和国际化
+- 美观的 **CSS 动画**
 
 ### 社交和评论系统
 
-* 支持 **[Gravatar](https://gravatar.com)** 头像
-* 支持本地**头像**
-* 支持多达 **73** 种社交链接
-* 支持多达 **28** 种网站分享
-* 支持 **[Disqus](https://disqus.com)** 评论系统
-* 支持 **[Gitalk](https://github.com/gitalk/gitalk)** 评论系统
-* 支持 **[Valine](https://valine.js.org/)** 评论系统
-* 支持 **[Waline](https://waline.js.org/)** 评论系统
-* 支持 **[Facebook](https://developers.facebook.com/docs/plugins/comments/) 评论**系统
-* 支持 **[Telegram comments](https://comments.app/) 评论**系统
-* 支持 **[Commento](https://commento.io/)** 评论系统
-* 支持 **[Utterances](https://utteranc.es/)** 评论系统
-* 支持 **[Artalk](https://artalk.js.org/)** 评论系统
-* 支持 **[Twikoo](https://twikoo.js.org/)** 评论系统
+- 支持 **[Gravatar](https://gravatar.com)** 头像
+- 支持本地**头像**
+- 支持多达 **87** 种社交链接
+- 支持多达 **28** 种网站分享
+- 支持 **[Disqus](https://disqus.com)** 评论系统
+- 支持 **[Gitalk](https://github.com/gitalk/gitalk)** 评论系统
+- 支持 **[Valine](https://valine.js.org/)** 评论系统
+- 支持 **[Waline](https://waline.js.org/)** 评论系统
+- 支持 **[Facebook](https://developers.facebook.com/docs/plugins/comments/) 评论**系统
+- 支持 **[Telegram comments](https://comments.app/) 评论**系统
+- 支持 **[Commento](https://commento.io/)** 评论系统
+- 支持 **[Utterances](https://utteranc.es/)** 评论系统
+- 支持 **[Artalk](https://artalk.js.org/)** 评论系统
+- 支持 **[Twikoo](https://twikoo.js.org/)** 评论系统
+- 支持 **[giscus](https://giscus.app/zh-CN/)** 评论系统
 
 ### 扩展功能
 
-* 支持基于 [Lunr.js](https://lunrjs.com/) 或 [algolia](https://www.algolia.com/) 的**搜索**
-* 支持 **Twemoji**
-* 支持**代码高亮**
-* 一键**复制代码**到剪贴板
-* 支持基于 [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js) 的**图片画廊**
-* 支持 **[Font Awesome](https://fontawesome.com/) 图标**的扩展 Markdown 语法
-* 支持**上标注释**的扩展 Markdown 语法
-* 支持**分数**的扩展 Markdown 语法
-* 支持基于 [KaTeX](https://katex.org/) 的**数学公式**
-* 支持基于 [mermaid](https://github.com/knsv/mermaid) 的**图表** shortcode
-* 支持基于 [ECharts](https://echarts.apache.org/) 的**交互式数据可视化** shortcode
-* 支持基于 [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js) 的 **Mapbox** shortcode
-* 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的**音乐播放器** shortcode
-* 支持 **Bilibili 视频** shortcode
-* 支持多种**注释**的 shortcode
-* 支持**自定义样式**的 shortcode
-* 支持**自定义脚本**的 shortcode
-* 支持基于 [TypeIt](https://typeitjs.com/) 的**打字动画** shortcode
-* 支持基于 [cookieconsent](https://github.com/osano/cookieconsent) 的 **Cookie 许可横幅**
-* 支持**渐进式网页应用**
-* 支持基于 [cell-watermark](https://github.com/Lruihao/watermark) 的**网页水印**
-* 支持基于 [pangu.js](https://github.com/vinta/pangu.js) 的**中文排版**
-* 支持**卡片式链接**的 shortcode
-* 支持**友情链接**的页面模板
-* ...
+- 支持**渐进式网页应用**
+- 支持**二级菜单**
+- 支持**内容加密**（页面、局部）
+- 支持**友情链接**的页面模板
+- 支持基于 [algolia](https://www.algolia.com/) 或 [Fuse.js](https://fusejs.io/) 的**搜索**
+- 支持 **Twemoji**
+- 支持**代码高亮**
+- 一键**复制代码**到剪贴板
+- 支持基于 [lightgallery](https://github.com/sachinchoolur/lightgallery) 的**图片画廊**
+- 支持 **[Font Awesome](https://fontawesome.com/) 图标**的扩展 Markdown 语法
+- 支持**上标注释**的扩展 Markdown 语法
+- 支持**分数**的扩展 Markdown 语法
+- 支持基于 [KaTeX](https://katex.org/) 的**数学公式**
+- 支持基于 [mermaid](https://github.com/knsv/mermaid) 的**图表** shortcode
+- 支持基于 [ECharts](https://echarts.apache.org/) 的**交互式数据可视化** shortcode
+- 支持基于 [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js) 的 **Mapbox** shortcode
+- 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的**音乐播放器** shortcode
+- 支持 **Bilibili 视频** shortcode
+- 支持多种**注释**的 shortcode
+- 支持**自定义样式**的 shortcode
+- 支持**自定义脚本**的 shortcode
+- 支持基于 [TypeIt](https://typeitjs.com/) 的**打字动画** shortcode
+- 支持基于 [cookieconsent](https://github.com/osano/cookieconsent) 的 **Cookie 许可横幅**
+- 支持基于 [cell-watermark](https://github.com/Lruihao/watermark) 的**网页水印**
+- 支持基于 [pangu.js](https://github.com/vinta/pangu.js) 的**中文排版**
+- 支持本地**缓存远程图床图片**
+- ……
 
 ## 多语言和国际化
 
 FixIt 支持下列语言：
 
-* 英语
-* 简体中文
-* 法语
-* 波兰语
-* 巴西葡萄牙语
-* 意大利语
-* 西班牙语
-* 德语
-* 塞尔维亚语
-* 俄语
-* 罗马尼亚语
-* 越南语
-* 繁体中文
-* [贡献一种新的语言](https://github.com/Lruihao/FixIt/pulls)
+- 英语
+- 简体中文
+- 繁体中文
+- 法语
+- 波兰语
+- 巴西葡萄牙语
+- 意大利语
+- 西班牙语
+- 德语
+- 塞尔维亚语
+- 俄语
+- 罗马尼亚语
+- 越南语
+- [贡献一种新的语言](https://github.com/hugo-fixit/FixIt/pulls)
+
 [语言兼容性](https://fixit.lruihao.cn/zh-cn/theme-documentation-basics/#language-compatibility)
 
-## [路线图](https://github.com/Lruihao/FixIt/projects/1)
+## [路线图](https://github.com/hugo-fixit/FixIt/projects/1)
 
-## [更新日志](https://github.com/Lruihao/FixIt/blob/master/CHANGELOG.md)
+## [更新日志](/CHANGELOG.md)
 
-## 问题、想法、 bugs 和 PRs
+## 问题、想法、bugs 和 PRs
 
-所有的反馈都是欢迎的！详见 [issue tracker](https://github.com/Lruihao/FixIt/issues)。
+所有的反馈都是欢迎的！详见 [议题](https://github.com/hugo-fixit/FixIt/issues) 或者 [讨论](https://github.com/hugo-fixit/FixIt/discussions)。
+
+## 参与贡献
+
+请参阅 [CONTRIBUTING.md](CONTRIBUTING.md) 以了解贡献该项目的基本信息。
+
+确保在贡献和参与讨论时遵守 [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md)。
+
+**贡献时，请先通过此存储库上的问题讨论你希望进行的更改，然后再进行实际更改**。
+
+## [所有贡献者](contributors.md)
+
+## 镜像
+
+- Gitee 镜像仓库：<https://gitee.com/lruihao/FixIt>
+
+## 致谢
+
+<details open>
+<summary>FixIt 主题中用到了以下项目，感谢它们的作者：</summary>
+
+- [normalize.css](https://github.com/necolas/normalize.css)
+- [Font Awesome](https://fontawesome.com/)
+- [Simple Icons](https://github.com/simple-icons/simple-icons)
+- [Animate.css](https://daneden.github.io/animate.css/)
+- [autocomplete-js](https://github.com/algolia/autocomplete)
+- [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
+- [Fuse.js](https://fusejs.io/)
+- [object-fit-images](https://github.com/fregante/object-fit-images)
+- [Twemoji](https://github.com/twitter/twemoji)
+- [emoji-data](https://github.com/iamcal/emoji-data)
+- [lightgallery](https://github.com/sachinchoolur/lightgallery)
+- [Sharer.js](https://github.com/ellisonleao/sharer.js)
+- [TypeIt](https://typeitjs.com/)
+- [KaTeX](https://katex.org/)
+- [mermaid](https://github.com/mermaid-js/mermaid)
+- [ECharts](https://echarts.apache.org/)
+- [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
+- [APlayer](https://github.com/MoePlayer/APlayer)
+- [MetingJS](https://github.com/metowolf/MetingJS)
+- [Gitalk](https://github.com/gitalk/gitalk)
+- [Valine](https://valine.js.org/)
+- [cookieconsent](https://github.com/osano/cookieconsent)
+- [cell-watermark](https://github.com/Lruihao/watermark)
+- [不蒜子](http://busuanzi.ibruce.info/)
+- [pangu.js](https://github.com/vinta/pangu.js)
+- [Artalk](https://artalk.js.org/)
+- [Waline](https://waline.js.org/)
+- [Twikoo](https://twikoo.js.org/)
+- [github-corners](https://github.com/tholman/github-corners)
+- [giscus](https://giscus.app/zh-CN)
+- [crypto-js](https://github.com/brix/crypto-js)
+- [vConsole](https://github.com/Tencent/vConsole)
+- [eruda](https://github.com/liriliri/eruda)
+- [pace](https://github.com/CodeByZach/pace)
+
+</details>
+
+<details open>
+<summary>FixIt 主题还借鉴了以下项目的部分功能，同样感谢它们的作者：</summary>
+
+- [DoIt](https://github.com/HEIGE-PCloud/DoIt)
+- [NexT](https://github.com/next-theme/hexo-theme-next)
+
+</details>
 
 ## 许可协议
 
-FixIt 根据 **MIT** 许可协议授权。 更多信息请查看 [LICENSE 文件](https://github.com/Lruihao/FixIt/blob/master/LICENSE)。
-
-FixIt 主题中用到了以下项目，感谢它们的作者：
-
-* [normalize.css](https://github.com/necolas/normalize.css)
-* [Font Awesome](https://fontawesome.com/)
-* [Simple Icons](https://github.com/simple-icons/simple-icons)
-* [Animate.css](https://daneden.github.io/animate.css/)
-* [autocomplete.js](https://github.com/algolia/autocomplete.js)
-* [Lunr.js](https://lunrjs.com/)
-* [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
-* [lazysizes](https://github.com/aFarkas/lazysizes)
-* [object-fit-images](https://github.com/fregante/object-fit-images)
-* [Twemoji](https://github.com/twitter/twemoji)
-* [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js)
-* [clipboard.js](https://github.com/zenorocha/clipboard.js)
-* [Sharer.js](https://github.com/ellisonleao/sharer.js)
-* [TypeIt](https://typeitjs.com/)
-* [KaTeX](https://katex.org/)
-* [mermaid](https://github.com/knsv/mermaid)
-* [ECharts](https://echarts.apache.org/)
-* [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
-* [APlayer](https://github.com/MoePlayer/APlayer)
-* [MetingJS](https://github.com/metowolf/MetingJS)
-* [Gitalk](https://github.com/gitalk/gitalk)
-* [Valine](https://valine.js.org/)
-* [cookieconsent](https://github.com/osano/cookieconsent)
-* [cell-watermark](https://github.com/Lruihao/watermark)
-* [pangu.js](https://github.com/vinta/pangu.js)
-* [Artalk](https://artalk.js.org/)
-* [Waline](https://waline.js.org/)
-* [Twikoo](https://twikoo.js.org/)
+FixIt 根据 **MIT** 许可协议授权。 更多信息请查看 [LICENSE 文件](LICENSE)。
 
 ## 作者
 
-[Lruihao](https://lruihao.cn)
+[Lruihao](https://github.com/Lruihao "在 GitHub 上关注我")
+
+## 赞助支持
+
+给我一个 Star 🌟 已经是对我最大的鼓励和支持了。\
+如果你喜爱这个主题，请考虑给我买杯咖啡 ☕️。
+
+- [PayPal](https://paypal.me/Lruihao)
+- [支付宝](images/alipay.jpg)
+- [微信支付](images/wechatpay.jpg)
+
+谢谢！❤️

SECURITY.md

@@ -0,0 +1,14 @@
+# Security Policy
+
+## Supported Versions
+
+| Version       | Supported          | LoveIt Compatibility |
+| :-----------: | :----------------: | :------------------: |
+| 0.1.x         | :x:                | :white_check_mark:   |
+| 0.2.x ~ 0.5.x | :x:                | :white_check_mark:   |
+| 0.5.x ~ 1.0   | :white_check_mark: | :x:                  |
+| > 1.0         | :white_check_mark: | :x:                  |
+
+## Reporting a Vulnerability
+
+If you want to report a vulnerability, create a new issue at https://github.com/hugo-fixit/FixIt/issues. Any vulnerabilities will be fixed as soon as possible.

archetypes/default.md

@@ -1,8 +1,9 @@
 ---
-title: "{{ replace .TranslationBaseName "-" " " | title }}"
-subtitle: ""
+title: {{ replace .TranslationBaseName "-" " " | title }}
+subtitle:
 date: {{ .Date }}
-description: ""
-keywords: ""
-comment: false
+slug: {{ substr .File.UniqueID 0 7 }}
+description:
+keywords:
+draft: true
 ---

archetypes/friends.md

@@ -1,18 +1,22 @@
 ---
-title: "{{ replace .TranslationBaseName "-" " " | title }}"
-subtitle: ""
-type: "friends"
+title: {{ replace .TranslationBaseName "-" " " | title }}
+subtitle:
+layout: friends
 date: {{ .Date }}
-description: "{{ .Site.Author.name }}'s friends"
-keywords: 
-  - Hugo
-  - friends tempalate
+description: "{{ .Site.Params.author.name }}'s friends"
+keywords:
+  - 'Hugo FixIt'
+  - 'friends template'
+  - 友情链接
 comment: false
 ---
 
 <!-- When you set data `friends.yml` in `yourProject/data/` directory, it will be automatically loaded here. -->
+
 ---
+
 <!-- You can define additional content below for this page. -->
+
 ## Base info
 
 ```yaml
@@ -25,7 +29,9 @@ comment: false
 ## Friendly Reminder
 
 {{< admonition info "Notice" true >}}
+
 1. If you want to exchange link, please leave a comment in the above format. (personal non-commercial blogs / websites only)
-2. Warn: Website failure, stop maintenance and improper content may be cancelled!
+2. :(fa-solid fa-exclamation-triangle): Website failure, stop maintenance and improper content may be unlinked!
 3. Those websites that do not respect other people's labor achievements, reprint without source, or malicious acts, please do not come to exchange.
+
 {{< /admonition >}}

archetypes/offline.md

@@ -1,10 +0,0 @@
----
-type: "offline"
-description: "{{ T "offlineTitle" }} - {{ .Site.Title }}"
-keywords: 
-  - PWA
-  - offline
-  - 离线
----
-
-<!-- You need do nothing for this page. -->

archetypes/post-bundle/index.md

@@ -1,40 +1,43 @@
 ---
-title: "{{ replace .TranslationBaseName "-" " " | title }}"
-subtitle: ""
+title: {{ replace .TranslationBaseName "-" " " | title }}
+subtitle:
 date: {{ .Date }}
+slug: {{ substr .File.UniqueID 0 7 }}
 draft: true
-author: ""
-authorLink: ""
-description: ""
-keywords: ""
-license: ""
+author:
+  name:
+  link:
+  email:
+  avatar:
+description:
+keywords:
+license:
 comment: false
 weight: 0
-
 tags:
-- draft
+  - draft
 categories:
-- draft
-
+  - draft
 hiddenFromHomePage: false
 hiddenFromSearch: false
-
-summary: ""
+hiddenFromRss: false
+hiddenFromRelated: false
+summary:
 resources:
-- name: featured-image
-  src: featured-image.jpg
-- name: featured-image-preview
-  src: featured-image-preview.jpg
-
-toc:
-  enable: true
-math:
-  enable: false
+  - name: featured-image
+    src: featured-image.jpg
+  - name: featured-image-preview
+    src: featured-image-preview.jpg
+toc: true
+math: false
 lightgallery: false
-seo:
-  images: []
+password:
+message:
+repost:
+  enable: true
+  url:
 
-# See details front matter: /theme-documentation-content/#front-matter
+# See details front matter: https://fixit.lruihao.cn/documentation/content-management/introduction/#front-matter
 ---
 
 <!--more-->

archetypes/posts.md

@@ -1,40 +1,43 @@
 ---
-title: "{{ replace .TranslationBaseName "-" " " | title }}"
-subtitle: ""
+title: {{ replace .TranslationBaseName "-" " " | title }}
+subtitle:
 date: {{ .Date }}
+slug: {{ substr .File.UniqueID 0 7 }}
 draft: true
-author: ""
-authorLink: ""
-description: ""
-keywords: ""
-license: ""
+author:
+  name:
+  link:
+  email:
+  avatar:
+description:
+keywords:
+license:
 comment: false
 weight: 0
-
 tags:
-- draft
+  - draft
 categories:
-- draft
-
+  - draft
 hiddenFromHomePage: false
 hiddenFromSearch: false
-
-summary: ""
+hiddenFromRss: false
+hiddenFromRelated: false
+summary:
 resources:
-- name: featured-image
-  src: featured-image.jpg
-- name: featured-image-preview
-  src: featured-image-preview.jpg
-
-toc:
-  enable: true
-math:
-  enable: false
+  - name: featured-image
+    src: featured-image.jpg
+  - name: featured-image-preview
+    src: featured-image-preview.jpg
+toc: true
+math: false
 lightgallery: false
-seo:
-  images: []
+password:
+message:
+repost:
+  enable: true
+  url:
 
-# See details front matter: /theme-documentation-content/#front-matter
+# See details front matter: https://fixit.lruihao.cn/documentation/content-management/introduction/#front-matter
 ---
 
 <!--more-->

assets/css/_core/_base.scss

@@ -1,3 +1,5 @@
+@import "../../lib/normalize/normalize";
+
 html {
   font-family: $global-font-family;
   font-weight: $global-font-weight;
@@ -33,7 +35,7 @@ html {
 ::selection {
   background-color: $selection-color;
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     background-color: $selection-color-dark;
   }
 }
@@ -41,29 +43,54 @@ html {
 body {
   background-color: $global-background-color;
   color: $global-font-color;
-  @include overflow-wrap(break-word);
   scrollbar-color: auto;
+  @include overflow-wrap(break-word);
 
-  &[theme='dark'] {
+  &::-webkit-scrollbar {
+    width: 0.75rem;
+    height: 0.75rem;
+    background-color: transparent;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: transparent;
+    background-clip: content-box;
+    border: 2px solid transparent;
+    @include border-radius(0.5rem);
+  }
+
+  &[data-scroll]::-webkit-scrollbar-thumb {
+    background-color: $scrollbar-color;
+  }
+
+  &[data-theme='dark'] {
     color: $global-font-color-dark;
     background-color: $global-background-color-dark;
   }
 }
 
-img {
-  @include object-fit(contain);
-  @include border-radius($global-border-radius/2);
-}
-
 iframe {
+  border: 0;
   @include border-radius($global-border-radius);
 }
 
-@include ms;
+[role='button'] {
+  cursor: pointer;
+}
+
+summary {
+  cursor: pointer;
+}
+
+abbr[title] {
+  cursor: help;
+  text-decoration-skip-ink: none;
+}
+
 @include link(true, true);
 
-@import '../_partial/mask';
-@import '../_partial/icon';
-@import '../_partial/details';
-@import '../_partial/fixed-button';
-@import '../_partial/cookieconsent';
+@import '../_partials/mask';
+@import '../_partials/img';
+@import '../_partials/icon';
+@import '../_partials/details';
+@import '../_partials/widgets';

assets/css/_core/_breadcrumb.scss

@@ -0,0 +1,49 @@
+.breadcrumb-container {
+  padding-inline: 1rem;
+  font-size: 0.75rem;
+  background-color: $global-background-color;
+  @include z-index(1);
+  @extend .print-d-none;
+
+  [data-theme='dark'] & {
+    background-color: $global-background-color-dark;
+  }
+
+  &.sticky {
+    position: sticky;
+    top: $header-height;
+  }
+
+  .breadcrumb {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 0.5rem 0;
+    margin: 0 auto;
+    list-style: none;
+    border-bottom: 1px inset $global-border-color;
+    @extend %page-style;
+
+    [data-theme='dark'] & {
+      border-bottom-color: $global-border-color-dark;
+    }
+
+    .breadcrumb-item {
+      display: flex;
+
+      +.breadcrumb-item::before {
+        content: "/";
+        display: inline-block;
+        padding-inline: 0.5rem;
+        color: $global-font-secondary-color;
+
+        [data-theme='dark'] & {
+          color: $global-font-secondary-color-dark;
+        }
+      }
+
+      &.active {
+        @extend .text-secondary;
+      }
+    }
+  }
+}

assets/css/_core/_common.scss

@@ -0,0 +1,66 @@
+// ==============================
+// Common Styles
+// 常用样式
+// ==============================
+
+.text-truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.text-start {
+  text-align: left !important;
+}
+.text-end {
+  text-align: right !important;
+}
+.text-center {
+  text-align: center !important;
+}
+
+.d-none {
+  display: none !important;
+}
+.d-none-desktop {
+  display: none;
+}
+.d-none-mobile {
+  display: block;
+}
+
+.ms-1,
+.mx-1 {
+  margin-left: 0.25em !important;
+}
+.me-1,
+.mx-1 {
+  margin-right: 0.25em !important;
+}
+.ps-1,
+.px-1 {
+  padding-left: 0.25em !important;
+}
+.pe-1,
+.px-1 {
+  padding-right: 0.25em !important;
+}
+
+@each $color, $value in $theme-colors {
+  .text-#{$color} {
+    color: #{$value} !important;
+
+    [data-theme='dark'] & {
+      color: #{darken($value, 5%)} !important;
+    }
+  }
+}
+
+@each $key, $value in $orders {
+  .order-#{$key} {
+    order: #{$value} !important;
+  }
+}
+
+.variant-numeric {
+  font-variant-numeric: tabular-nums lining-nums;
+}

assets/css/_core/_footer.scss

@@ -4,23 +4,22 @@ footer {
   text-align: center;
   line-height: 1.25rem;
   padding: 1rem 0;
+  @extend .print-d-none;
 
   .footer-container {
+    display: flex;
+    flex-direction: column;
     font-size: 0.875rem;
 
     .footer-line {
       width: 100%;
 
-      .footer-divider::before {
+      .footer-divider:not(:first-child)::before {
         content: '|';
         margin-left: 0.25rem;
         margin-right: 0.25rem;
       }
 
-      .fixit-icon {
-        top: 0.25em;
-      }
-
       .animate-icon {
         color: #dc143c;
         animation: icon-animate 1.33s ease-in-out infinite;
@@ -38,23 +37,23 @@ footer {
 @keyframes icon-animate {
   0%,
   100% {
-    transform: scale(1);
+    @include transform(scale(1));
   }
 
   10%,
   30% {
-    transform: scale(0.9);
+    @include transform(scale(0.9));
   }
 
   20%,
   40%,
   60%,
   80% {
-    transform: scale(1.1);
+    @include transform(scale(1.1));
   }
 
   50%,
   70% {
-    transform: scale(1.1);
+    @include transform(scale(1.1));
   }
 }

assets/css/_core/_header.scss

@@ -1,15 +1,20 @@
 header {
   width: 100%;
-  z-index: 150;
   background-color: $header-background-color;
+  @include z-index(2);
   @include transition(box-shadow 0.3s ease);
+  @extend .print-d-none;
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     background-color: $header-background-color-dark;
   }
 
   &:hover {
     @include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.1));
+
+    [data-theme='dark'] & {
+      @include box-shadow(0 0 1.5rem 0 rgba(255, 255, 255, 0.1));
+    }
   }
 }
 
@@ -34,7 +39,8 @@ header {
   .logo {
     min-height: 1.5em;
     height: 1.5em;
-    vertical-align: text-bottom;
+    vertical-align: middle;
+    width: auto;
   }
 
   .header-title-text {
@@ -48,20 +54,52 @@ header {
   }
 }
 
-.menu .menu-item {
-  position: relative;
-}
+.menu {
+  margin: 0;
+  padding: 0;
 
-.language-select {
-  position: absolute;
-  opacity: 0;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
+  .menu-item {
+    list-style: none;
 
-  &:hover {
-    cursor: pointer;
+    & .dropdown-icon {
+      margin-left: 0.25rem;
+      font-size: .875em;
+      color: $global-font-color;
+
+      [data-theme='dark'] & {
+        color: $global-font-color-dark;
+      }
+
+      &.open::before {
+        content: "\f078";
+      }
+    }
+
+    &.active {
+      >.menu-link,
+      >.nested-item>.menu-link {
+        font-weight: bold;
+        color: $menu-active-color;
+
+        [data-theme='dark'] & {
+          color: $menu-active-color-dark;
+        }
+      }
+    }
+
+    .menu-link i {
+      @include transform(perspective(1rem));
+      @include transition(transform 0.4s ease);
+    }
+
+    .menu-link:hover i {
+      @include transform(perspective(1rem) translateZ(0.2rem));
+    }
+
+    &.language-switch,
+    &.theme-switch {
+      cursor: pointer;
+    }
   }
 }
 
@@ -72,17 +110,13 @@ header {
     color: transparent;
     box-sizing: border-box;
     height: 2.5rem;
-    width: 2.5rem;
+    width: 1.25rem;
     @include border-radius(0.5rem);
     border: none;
     outline: none;
-    background-color: $header-background-color;
+    background-color: transparent;
     vertical-align: baseline !important;
     @include transition(width 0.3s ease);
-
-    [theme='dark'] & {
-      background-color: $header-background-color-dark;
-    }
   }
 
   @include placeholder(transparent);
@@ -97,6 +131,10 @@ header {
   .search-toggle {
     left: 0.5rem;
     right: auto;
+
+    #header-desktop.open & {
+      left: 1rem;
+    }
   }
 
   .search-loading {
@@ -115,7 +153,7 @@ header {
       padding: 0 2rem 0 2rem;
     }
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       input {
         color: $global-font-color-dark;
         background-color: $search-background-color-dark;
@@ -129,7 +167,7 @@ header {
     .search-button {
       color: $global-font-secondary-color;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         color: $global-font-secondary-color-dark;
       }
     }
@@ -144,8 +182,15 @@ header {
   }
 }
 
-.theme-switch i {
-  @include transform(rotate(225deg));
+.theme-switch {
+  i {
+    @include transform(rotate(225deg));
+    @include transition(transform 0.4s ease);
+  }
+
+  &:hover i {
+    @include transform(rotate(45deg));
+  }
 }
 
 #header-desktop {
@@ -154,60 +199,93 @@ header {
   top: 0;
   height: $header-height;
   line-height: $header-height;
+  box-sizing: border-box;
 
-  [header-desktop='normal'] & {
+  [data-header-desktop='normal'] & {
     position: static;
   }
 
+  nav {
+    overflow: hidden;
+    white-space: nowrap;
+  }
+
   .header-wrapper {
-    padding: 0 2rem 0 10vh;
+    // use css native function to calculate max value
+    padding: 0 2rem 0 MAX(10vh, $header-height);
+    height: 100%;
+
+    &[data-github-corner='right'] {
+      padding-right: $header-height;
+    }
 
     .header-title {
       font-size: $header-title-font-size;
+      height: 100%;
     }
 
     .menu {
-      overflow: hidden;
-      white-space: nowrap;
+      display: flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      float: right;
 
-      .menu-inner {
-        float: right;
+      >.menu-item {
+        &:hover .sub-menu {
+          display: block;
+          @include transform(translateX(-0.5rem));
+        }
+        &.language-switch:hover .sub-menu {
+          @include transform(translateX(calc(1.75rem - 100%)));
+        }
       }
 
       .menu-item {
-        margin: 0 0.5rem;
+        padding: 0 0.5rem;
 
         &.delimiter {
-          border-left: 1.5px solid $global-font-color;
+          width: 0;
+          margin: 0.125rem 0.25rem;
+          padding: 0;
+          border-left: 1px dashed lighten($global-font-secondary-color, 15%);
 
-          [theme='dark'] & {
-            border-left-color: $global-border-color-dark;
+          [data-theme='dark'] & {
+            border-left-color: darken($global-font-secondary-color-dark, 15%);
           }
         }
-
-        &.language {
-          margin-right: 0;
-        }
-
-        &.search {
-          margin: 0 -0.5rem 0 0;
-        }
       }
 
-      a.active {
-        font-weight: 900;
-        color: $header-hover-color;
+      .sub-menu {
+        position: absolute;
+        margin: 0;
+        padding: 0.25rem 0;
+        display: none;
+        top: calc(#{$header-height} - 0.75rem);
+        border-radius: $global-border-radius;
+        border: 1px solid $global-border-color;
+        background-color: $header-background-color;
+        @include transition(box-shadow 0.3s ease);
+        @include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.1));
 
-        [theme='dark'] & {
-          color: $header-hover-color-dark;
+        [data-theme='dark'] & {
+          background-color: $header-background-color-dark;
+          border-color: $global-border-color-dark;
+          @include box-shadow(0 0 1.5rem 0 rgba(255, 255, 255, 0.1));
+        }
+
+        .menu-item {
+          height: $header-height*0.5;
+          line-height: $header-height*0.5;
+          max-width: 15rem;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          overflow-x: hidden;
         }
       }
     }
   }
 
   &.open .header-wrapper .menu .menu-item.search {
-    margin: 0 0.25rem 0 0.5rem;
-
     input {
       width: 24rem;
     }
@@ -221,7 +299,7 @@ header {
   min-height: $header-height;
   line-height: $header-height;
 
-  [header-mobile='normal'] & {
+  [data-header-mobile='normal'] & {
     position: static;
   }
 
@@ -252,7 +330,7 @@ header {
           @include border-radius(3px);
           @include transition(all 0.3s ease-in-out);
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             background: $global-font-color-dark;
           }
         }
@@ -282,13 +360,21 @@ header {
     }
 
     .menu {
-      text-align: center;
       background: $header-background-color;
       border-top: 2px solid $global-border-color;
       display: none;
-      padding-top: 0.5rem;
+      overflow-y: overlay;
+      max-height: 70vh;
       @include box-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.1));
 
+      [data-theme='dark'] & {
+        @include box-shadow(0 0.125rem 0.25rem rgba(255, 255, 255, 0.1));
+      }
+      
+      &::-webkit-scrollbar {
+        width: 0;
+      }
+
       .search-wrapper {
         display: flex;
         justify-content: space-between;
@@ -296,6 +382,14 @@ header {
         box-sizing: border-box;
         padding: ($header-height - 2.5rem) / 2 1rem;
         line-height: 2.5rem;
+        position: sticky;
+        top: 0;
+        background-color: $header-background-color;
+        @include z-index(0, 50);
+ 
+        [data-theme='dark'] & {
+          background-color: $header-background-color-dark;
+        }
       }
 
       .search {
@@ -307,6 +401,11 @@ header {
         }
       }
 
+      .search-loading,
+      .search-clear {
+        right:  0.5rem;
+      }
+
       .search-button {
         top: 0;
       }
@@ -318,14 +417,91 @@ header {
 
       .menu-item {
         display: block;
+        position: relative;
         line-height: 2.5rem;
+        padding: 0 1rem;
+
+        &:not(.menu-system):hover {
+          background-color: lighten($global-font-secondary-color, 24%);
+
+          [data-theme='dark'] & {
+            background-color: darken($global-font-secondary-color-dark, 24%);
+          }
+        }
+
+        .menu-link {
+          display: block;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          overflow-x: hidden;
+          @include flex(4);
+        }
+
+        & .nested-item {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+
+          .menu-link {
+            max-width: 80%;
+          }
+        }
+      }
+
+      .menu-system {
+        display: flex;
+        justify-content: center;
+        gap: 0.25rem;
+        position: sticky;
+        bottom: 0;
+        line-height: 2.5rem;
+        padding: 0 1rem;
+        background-color: $header-background-color;
+ 
+        [data-theme='dark'] & {
+          background-color: $header-background-color-dark;
+        }
+
+        .menu-system-item {
+          padding-inline: 0.5rem;
+        }
+
+        .language-switch {
+          position: relative;
+
+          .language-select {
+            position: absolute;
+            opacity: 0;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+          }
+        }
+      }
+
+      .sub-menu {
+        padding-left: 0;
+        display: none;
+
+        &.open {
+          display: block;
+        }
+
+        .menu-item:hover {
+          background-color: lighten($global-font-secondary-color, 20%);
+
+          [data-theme='dark'] & {
+            background-color: darken($global-font-secondary-color-dark, 20%);
+          }
+        }
       }
 
       &.active {
         display: block;
       }
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         background: $header-background-color-dark;
         border-top-color: $global-border-color-dark;
       }
@@ -354,10 +530,14 @@ header {
 
 .search-dropdown {
   position: fixed;
-  z-index: 200;
   top: $header-height;
+  @include z-index(2);
   @include box-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.1));
 
+  [data-theme='dark'] & {
+    @include box-shadow(0 0.125rem 0.25rem rgba(255, 255, 255, 0.1));
+  }
+
   &.desktop {
     right: 2rem;
     width: 30rem;
@@ -372,7 +552,7 @@ header {
     right: 0 !important;
     background-color: $global-background-color;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: $global-background-color-dark;
     }
 
@@ -399,7 +579,7 @@ header {
           text-align: right;
           color: $global-font-secondary-color;
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             color: $global-font-secondary-color-dark;
           }
         }
@@ -413,7 +593,7 @@ header {
           @include overflow-wrap(break-word);
           color: $global-font-secondary-color;
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             color: $global-font-secondary-color-dark;
           }
         }
@@ -422,7 +602,7 @@ header {
           font-style: normal;
           background-color: $selection-color;
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             background-color: $selection-color-dark;
           }
         }
@@ -430,7 +610,7 @@ header {
         &.cursor {
           background: darken($code-background-color, 5%);
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             background: lighten($code-background-color-dark, 5%);
           }
         }
@@ -448,7 +628,7 @@ header {
       .search-query {
         font-weight: bold;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           color: #ddd;
         }
       }
@@ -460,7 +640,7 @@ header {
       font-size: 0.8rem;
       color: $global-font-secondary-color;
 
-      [theme='dark'] {
+      [data-theme='dark'] {
         color: $global-font-secondary-color-dark;
       }
 

assets/css/_core/_layout.scss

@@ -8,20 +8,34 @@
   main {
     flex: 1 0 auto;
 
-    aside:first-child {
-      order: 2;
+    aside {
+      flex: 1;
+      padding: 0.5rem;
+
+      &:not(:has(~ aside)) {
+        display: none;
+      }
     }
 
     &.container {
       display: flex;
       align-items: flex-start;
       justify-content: center;
-      padding: 0 1rem;
-    }
+      padding-inline: 1rem;
+      gap: 0.5rem;
 
-    &.container-reverse {
-      @extend .container;
-      flex-direction: row-reverse;
+      &.container-reverse {
+        flex-direction: row-reverse;
+      }
+
+      &:has(.home:not(.posts)) {
+        align-items: center;
+      }
     }
   }
 }
+
+@import "_header";
+@import "_breadcrumb";
+@import "_footer";
+@import "_pagination";

assets/css/_core/_media.scss

@@ -1,64 +1,36 @@
 @media only screen and (min-width: 1441px) {
-  .page {
+  %page-style {
     width: 60%;
 
-    [page-style='wide'] & {
+    [data-page-style='wide'] & {
       width: 64%;
     }
 
-    [page-style='narrow'] & {
+    [data-page-style='narrow'] & {
       max-width: 800px;
     }
   }
-
-  aside {
-    width: 20%;
-
-    [page-style='wide'] & {
-      width: 18%;
-    }
-
-    [page-style='narrow'] & {
-      width: calc(50% - 400px);
-    }
-  }
 }
 
 @media only screen and (max-width: 1440px) {
-  .page {
+  %page-style {
     width: 56%;
 
-    [page-style='wide'] & {
+    [data-page-style='wide'] & {
       width: 60%;
     }
   }
-
-  aside {
-    width: 22%;
-
-    [page-style='wide'] & {
-      width: 20%;
-    }
-  }
 }
 
 @media only screen and (max-width: 1200px) {
-  .page {
+  %page-style {
     width: 52%;
 
-    [page-style='wide'] & {
+    [data-page-style='wide'] & {
       width: 56%;
     }
   }
 
-  aside {
-    width: 24%;
-
-    [page-style='wide'] & {
-      width: 22%;
-    }
-  }
-
   #header-desktop .header-wrapper {
     padding-right: 1rem;
   }
@@ -69,6 +41,10 @@
 }
 
 @media only screen and (max-width: 960px) {
+  %page-style {
+    width: 80% !important;
+  }
+  
   aside {
     display: none !important;
   }
@@ -77,36 +53,63 @@
     display: block;
   }
 
-  .page {
-    width: 80% !important;
-  }
-
   #header-desktop .header-wrapper {
     padding-left: 1rem;
   }
 }
 
+
+@media only screen and (min-width: 681px) {
+  .breadcrumb-container.sticky {
+    body:not([data-header-desktop='sticky']) & {
+      top: 0;
+    }
+    // adjust the scroll margin top of the content anchors on the page
+    body:not([data-header-desktop='auto']) &+.container .content [id] {
+      scroll-margin-top: calc(var(--#{$prefix}scroll-mt) + var(--#{$prefix}breadcrumb-height));
+    }
+  }
+
+  [data-header-desktop='normal'] .page .content [id] {
+    --#{$prefix}scroll-mt: #{$global-scroll-margin-top};
+  }
+}
+
 @media only screen and (max-width: 680px) {
   #header-desktop {
     display: none;
   }
 
-  #header-mobile {
+  #header-mobile,
+  .d-none-desktop {
     display: block;
   }
 
-  .page {
-    width: 100% !important;
+  .d-none-mobile {
+    display: none !important;
+  }
 
-    .content {
-      [id] {
-        [header-mobile='normal'] & {
-          scroll-margin-top: 0;
-        }
-      }
+  .breadcrumb-container.sticky {
+    body:not([data-header-mobile='sticky']) & {
+      top: 0;
     }
+    // adjust the scroll margin top of the content anchors on the page
+    body:not([data-header-mobile='auto']) &+.container .content [id] {
+      scroll-margin-top: calc(var(--#{$prefix}scroll-mt) + var(--#{$prefix}breadcrumb-height));
+    }
+  }
 
-    .categories-card {
+  [data-header-mobile='normal'] .page .content [id] {
+    --#{$prefix}scroll-mt: #{$global-scroll-margin-top};
+  }
+  
+  %page-style {
+    width: 100% !important;
+  }
+
+  .page {
+    .categories-card,
+    .collections-card {
       .card-item {
         width: 100%;
       }
@@ -118,6 +121,10 @@
       font-size: 0.618rem;
     }
   }
+
+  .pagination .page-item {
+    margin: 0 5px;
+  }
 }
 
 @media only print {
@@ -130,10 +137,12 @@
     width: 100% !important;
     padding-top: 0 !important;
 
-    .single-title,
-    .single-subtitle,
-    .post-meta {
-      text-align: center;
+    &.single {
+      .single-title,
+      .single-subtitle,
+      .post-meta {
+        text-align: center;
+      }
     }
 
     h1:not(.single-title),
@@ -146,15 +155,7 @@
     }
   }
 
-  .print-d-none,
-  header,
-  footer .footer-line:not(.powered):not(.copyright),
-  #toc-auto,
-  .post-info-share,
-  .post-info-more section:last-child,
-  .post-nav,
-  #fixed-buttons,
-  #comments {
+  .print-d-none {
     display: none !important;
   }
 }

assets/css/_core/_pagination.scss

@@ -2,10 +2,11 @@
   display: flex;
   flex-direction: row;
   justify-content: center;
+  flex-wrap: wrap;
   list-style: none;
   white-space: nowrap;
   width: 100%;
-  padding: 1rem 0 0;
+  padding: 1rem 0;
 
   a {
     font-size: 0.8rem;
@@ -16,14 +17,14 @@
     text-decoration: none;
     @include transition(0.3s);
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       color: $pagination-link-color-dark;
     }
   }
 
   li {
-    padding-bottom: 3px;
-    margin: 0 20px;
+    padding: 5px;
+    margin: 0 10px;
     box-sizing: border-box;
     position: relative;
     display: inline;
@@ -36,12 +37,12 @@
       color: $pagination-link-hover-color;
     }
 
-    [theme='dark'] &:hover a {
+    [data-theme='dark'] &:hover a {
       color: $pagination-link-hover-color-dark;
     }
 
-    &:before,
-    &:after {
+    &::before,
+    &::after {
       position: absolute;
       content: '';
       width: 0;
@@ -51,27 +52,22 @@
       bottom: 0px;
     }
 
-    [theme='dark'] &:before,
-    [theme='dark'] &:after {
+    [data-theme='dark'] &::before,
+    [data-theme='dark'] &::after {
       background: $pagination-link-hover-color-dark;
     }
 
-    &:before .active,
-    &:after .active {
-      width: 100%;
-    }
-
-    &:before {
+    &::before {
       left: 50%;
     }
 
-    &:after {
+    &::after {
       right: 50%;
     }
 
     &:hover {
-      &:before,
-      &:after {
+      &::before,
+      &::after {
         width: 50%;
       }
     }
@@ -81,13 +77,13 @@
         color: $pagination-link-hover-color;
       }
 
-      [theme='dark'] & a {
+      [data-theme='dark'] & a {
         color: $pagination-link-hover-color-dark;
       }
 
-      &:before,
-      &:after {
-        width: 60%;
+      &::before,
+      &::after {
+        width: 50%;
       }
     }
   }

assets/css/_core/_patch.scss

@@ -0,0 +1,20 @@
+/* Resolve style conflicts between third-party plugins */
+
+@keyframes #{$prefix}pulse {
+  from {
+    @include transform(scale3d(1, 1, 1));
+  }
+
+  50% {
+    @include transform(scale3d(1.05, 1.05, 1.05));
+  }
+
+  to {
+    @include transform(scale3d(1, 1, 1));
+  }
+}
+
+.animate__pulse {
+  -webkit-animation-name: #{$prefix}pulse !important;
+  animation-name: #{$prefix}pulse !important;
+}

assets/css/_core/_root.scss

@@ -0,0 +1,17 @@
+:root {
+  // Note: Custom variable values only support SassScript inside `#{}`.
+
+  // Theme colors varibles
+  @each $color, $value in $theme-colors {
+    --#{$prefix}#{$color}: #{$value};
+  }
+  @each $color, $value in $theme-colors {
+    --#{$prefix}#{$color}-dark: #{darken($value, 5%)};
+  }
+
+  // Scroll margin top and Stack sticky top related
+  --#{$prefix}scroll-mt: calc(#{$header-height} + #{$global-scroll-margin-top});
+
+  // Set breadcrumb height to 0px if breadcrumb is disabled
+  --#{$prefix}breadcrumb-height: 0px;
+}

assets/css/_mixin/_compatibility.scss

@@ -18,7 +18,6 @@
 
 @mixin transform($value) {
   -webkit-transform: $value;
-  -moz-transform: $value;
   -ms-transform: $value;
   -o-transform: $value;
   transform: $value;
@@ -26,8 +25,6 @@
 
 @mixin filter($value) {
   -webkit-filter: $value;
-  -moz-filter: $value;
-  -ms-filter: $value;
   filter: $value;
 }
 
@@ -97,14 +94,14 @@
   line-break: $value;
 }
 
-@mixin ms {
-  input::-ms-clear {
-    display: none;
-  }
-}
-
 @mixin object-fit($value) {
   -o-object-fit: $value;
   object-fit: $value;
   font-family: 'object-fit: #{$value};';
 }
+
+@mixin user-select($value) {
+  -webkit-user-select: $value !important;
+  -moz-user-select: $value !important;
+  user-select: $value !important;
+}

assets/css/_mixin/_index.scss

@@ -2,3 +2,4 @@
 @import '_link';
 @import '_blur';
 @import '_details';
+@import '_z-index';

assets/css/_mixin/_link.scss

@@ -1,22 +1,52 @@
-@mixin link($light, $dark) {
+/**
+ * Link mixin
+ * @param {Boolean} $light use global link color
+ * @param {Boolean} $dark use global link color dark
+ * @param {String} $decoration text-decoration, default none
+ */
+@mixin link($light, $dark, $decoration: none) {
   a,
   a::before,
   a::after {
-    text-decoration: none;
+    text-decoration: $decoration;
 
-    color: if($light, $global-link-color, $single-link-color);
+    @if $light {
+      color: $global-link-color;
+    }
 
-    [theme='dark'] & {
-      color: if($dark, $global-link-color-dark, $single-link-color-dark);
+    @else {
+      color: $single-link-color;
+    }
+
+    [data-theme='dark'] & {
+      @if $dark {
+        color: $global-link-color-dark;
+      }
+
+      @else {
+        color: $single-link-color-dark;
+      }
     }
   }
 
   a:active,
   a:hover {
-    color: if($light, $global-link-hover-color, $single-link-hover-color);
+    @if $light {
+      color: $global-link-hover-color;
+    }
 
-    [theme='dark'] & {
-      color: if($dark, $global-link-hover-color-dark, $single-link-hover-color-dark);
+    @else {
+      color: $single-link-hover-color;
+    }
+
+    [data-theme='dark'] & {
+      @if $dark {
+        color: $global-link-hover-color-dark;
+      }
+
+      @else {
+        color: $single-link-hover-color-dark;
+      }
     }
   }
 }

assets/css/_mixin/_z-index.scss

@@ -0,0 +1,3 @@
+@mixin z-index($level, $diff: 0) {
+  z-index: ($level * 100) + $diff;
+}

assets/css/_page/_archive.scss

@@ -1,21 +1,27 @@
 .archive {
   .single-title {
+    padding: 1rem 0 0.5rem;
+    margin: 0;
+    font-size: 1.6rem;
+    font-weight: bold;
+    line-height: 140%;
     text-align: right;
+  }
 
-    sup {
-      color: $global-font-secondary-color;
-
-      [theme='dark'] & {
-        color: $global-font-secondary-color-dark;
-      }
-    }
+  .single-subtitle {
+    margin: 0.5rem 0;
+    font-size: 1.2rem;
+    font-weight: normal;
+    line-height: 100%;
+    text-align: right;
   }
 
   .group-title {
+    font-size: 1.2rem;
     margin-top: 1.5rem;
     margin-bottom: 1rem;
   }
 
-  @import '../_partial/_archive/terms';
-  @import '../_partial/_archive/tags';
+  @import '../_partials/_archive/terms';
+  @import '../_partials/_archive/tags';
 }

assets/css/_page/_friends.scss

@@ -34,7 +34,7 @@
 }
 .friend-link:hover {
   background: #fff;
-  transform: scale(1.03);
+  @include transform(scale(1.03));
   box-shadow: 0 0 3px #aaa;
 }
 .friend-avatar {

assets/css/_page/_home.scss

@@ -1,7 +1,5 @@
 .home {
   .home-profile {
-    @include transform(translateY(16vh));
-    padding: 0 0 0.5rem;
     text-align: center;
 
     .home-avatar {
@@ -16,6 +14,10 @@
         @include box-shadow(0 0 0 0.3618em rgba(0, 0, 0, 0.05));
         @include transition(all 0.4s ease);
 
+        [data-theme='dark'] & {
+          @include box-shadow(0 0 0 0.3618em rgba(255, 255, 255, 0.05));
+        }
+
         &:hover {
           position: relative;
           @include transform(translateY(-0.75rem));
@@ -27,7 +29,10 @@
       font-size: 1.25rem;
       font-weight: bold;
       margin: 0;
-      padding: 0.5rem;
+
+      &:not(:empty) {
+        padding: 0.5rem;
+      }
     }
 
     .home-subtitle {
@@ -59,17 +64,16 @@
       padding: 0.5rem;
       color: $global-font-secondary-color;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         color: $global-font-secondary-color-dark;
       }
     }
   }
 }
 
-.home[posts] {
+.home.posts {
   .home-profile {
-    @include transform(translateY(0));
-    padding-top: 2rem;
+    padding: 2rem 0;
   }
 
   .home-avatar img {
@@ -82,7 +86,11 @@
     color: $global-font-color;
     border-bottom: 1px dashed $global-border-color;
 
-    [theme='dark'] & {
+    &:first-of-type {
+      padding-top: 0;
+    }
+
+    [data-theme='dark'] & {
       color: $global-font-color-dark;
       border-bottom: 1px dashed $global-border-color-dark;
     }
@@ -100,10 +108,6 @@
         height: 100%;
         left: 0;
         top: 0;
-        @include object-fit(none);
-      }
-
-      img.lazyloaded {
         @include object-fit(cover);
       }
 
@@ -128,7 +132,7 @@
       @include overflow-wrap(break-word);
       color: $global-font-secondary-color;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         color: $global-font-secondary-color-dark;
       }
 
@@ -158,7 +162,7 @@
       strong {
         color: $global-font-secondary-color;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           color: $global-font-secondary-color-dark;
         }
       }
@@ -177,6 +181,11 @@
         padding: 0;
 
         @include link(true, true);
+        
+        .post-tag:not(:last-child)::after {
+          content: ',';
+          margin-right: 0.25rem;
+        }
       }
     }
   }

assets/css/_page/_index.scss

@@ -1,13 +1,10 @@
 .page {
   position: relative;
+  @extend %page-style;
 
   .content {
     [id] {
-      scroll-margin-top: $header-height;
-
-      [header-desktop='normal'] & {
-        scroll-margin-top: 0;
-      }
+      scroll-margin-top: var(--#{$prefix}scroll-mt);
     }
   }
 

assets/css/_page/_single.scss

@@ -1,4 +1,6 @@
-@import '../_partial/_single/toc';
+@import '../_partials/_single/toc';
+@import '../_partials/_single/fixit-decryptor';
+@import '../_partials/_single/collections';
 
 .single {
   .single-title {
@@ -7,13 +9,27 @@
     font-size: 1.6rem;
     font-weight: bold;
     line-height: 140%;
+
+    .icon-pin {
+      display: inline-block;
+      width: max-content;
+      transform: rotate(30deg);
+      margin-right: 0.25em;
+      @extend .text-danger;
+    }
+
+    .icon-repost {
+      display: inline-block;
+      width: max-content;
+      margin-right: 0.25em;
+      @extend .text-success;
+    }
   }
 
   .single-subtitle {
-    margin: 0.4rem 0;
+    margin: 0.5rem 0;
     font-size: 1.2rem;
     font-weight: normal;
-    font-style: italic;
     line-height: 100%;
   }
 
@@ -21,11 +37,16 @@
     font-size: 0.875rem;
     color: $global-font-secondary-color;
 
+    .comment-visitors,
+    .comment-count {
+      @extend .print-d-none;
+    }
+
     span {
       display: inline-block;
     }
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       color: $global-font-secondary-color-dark;
     }
 
@@ -33,6 +54,21 @@
 
     .author {
       font-size: 1.05rem;
+
+      img.avatar {
+        width: 1.3rem;
+        height: 1.3rem;
+        border-radius: 50%;
+        vertical-align: text-bottom;
+        border: 0.25px solid $global-border-color;
+        box-sizing: border-box;
+        object-position: center;
+        @include object-fit(cover);
+
+        [data-theme='dark'] & {
+          border-color: $global-border-color-dark;
+        }
+      }
     }
   }
 
@@ -41,15 +77,21 @@
 
     img {
       display: block;
+      width: 100%;
       max-width: 100%;
       height: auto;
       margin: 0 auto;
       overflow: hidden;
     }
+  }
 
-    img.lazyloaded {
-      width: 100%;
-    }
+  #content[data-end-flag]:not([data-password])::after {
+    content: attr(data-end-flag);
+    display: block;
+    text-align: center;
+    color: $global-font-secondary-color;
+    font-size: 15px;
+    padding: 5px;
   }
 
   .content {
@@ -94,7 +136,7 @@
       font-weight: bold;
       margin: 1.2rem 0;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         font-weight: bolder;
       }
     }
@@ -104,18 +146,18 @@
     > h4,
     > h5,
     > h6 {
-      > .header-mark::before {
+      > .heading-mark::before {
         content: '|';
         margin-right: 0.3125rem;
         color: $single-link-color;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           color: $single-link-color-dark;
         }
       }
     }
 
-    > h2 > .header-mark::before {
+    > h2 > .heading-mark::before {
       content: '#';
     }
 
@@ -127,7 +169,7 @@
     strong {
       font-weight: bold;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         color: #ddd;
       }
     }
@@ -135,29 +177,39 @@
     @include link(false, false);
 
     a {
+      white-space: normal;
       @include overflow-wrap(break-word);
 
-      [theme='dark'] & b,
-      [theme='dark'] & strong {
+      [data-theme='dark'] & b,
+      [data-theme='dark'] & strong {
         color: $single-link-color-dark;
       }
     }
 
-    [theme='dark'] a:hover b,
-    [theme='dark'] a:hover strong {
+    [data-theme='dark'] a:hover b,
+    [data-theme='dark'] a:hover strong {
       color: $single-link-hover-color-dark;
     }
 
     ul,
-    ol {
-      margin: 0.5rem 0;
-      padding-left: 2.5rem;
+    ol,
+    dl {
+      margin-block: 0.5em;
     }
 
     ul {
       list-style-type: disc;
     }
 
+    dl {
+      dt {
+        margin-bottom: 0.5em;
+      }
+      dd {
+        margin-inline-start: 1.25em;
+      }
+    }
+
     ruby {
       background: $code-background-color;
 
@@ -165,7 +217,7 @@
         color: $global-font-secondary-color;
       }
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         background: $code-background-color-dark;
 
         rt {
@@ -180,7 +232,7 @@
       &::-webkit-scrollbar {
         background-color: $table-background-color;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           background-color: $table-background-color-dark;
         }
       }
@@ -193,14 +245,14 @@
         background: $table-background-color;
         border-collapse: collapse;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           background: $table-background-color-dark;
         }
 
         thead {
           background: $table-thead-color;
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             background-color: $table-thead-color-dark;
           }
         }
@@ -209,15 +261,15 @@
           & tr:nth-child(odd) {
             background: darken($table-background-color, 2.25%);
 
-            [theme='dark'] & {
+            [data-theme='dark'] & {
               background-color: lighten($table-background-color-dark, 2.75%);
             }
           }
-          
+
           & tr:hover {
             background: darken($table-background-color, 4.5%);
 
-            [theme='dark'] & {
+            [data-theme='dark'] & {
               background-color: lighten($table-background-color-dark, 5.5%);
             }
           }
@@ -228,7 +280,7 @@
           padding: 0.3rem 1rem;
           border: 1px solid darken($table-thead-color, 2%);
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             border-color: darken($table-thead-color-dark, 2%);
           }
         }
@@ -238,6 +290,39 @@
     img {
       max-width: 100%;
       min-height: 1em;
+
+      &:not([height]) {
+        height: auto;
+      }
+
+      &[loading='lazy'][srcset]:not([data-lazyloaded]) {
+        &:not(.suffix-invalid__small) {
+          width: var(--width-small, var(--width));
+          aspect-ratio: var(--aspect-ratio-small, var(--aspect-ratio));
+        }
+
+        &:not(.suffix-invalid) {
+          @media (min-resolution: 1.01dppx) and (max-resolution: 1.5dppx) {
+            width: calc(var(--width) / 1.5);
+            aspect-ratio: var(--aspect-ratio);
+          }
+        }
+
+        &:not(.suffix-invalid__large) {
+          @media (min-resolution: 1.51dppx) {
+            width: calc(var(--width-large, var(--width)) / 2);
+            aspect-ratio: var(--aspect-ratio-large, var(--aspect-ratio));
+          }
+        }
+      }
+
+      &.version {
+        height: 1.25em;
+        vertical-align: text-bottom;
+      }
+    }
+    svg {
+      max-width: 100%;
     }
 
     figure {
@@ -256,16 +341,11 @@
 
       img {
         display: block;
-        height: auto;
         margin: 0 auto;
         overflow: hidden;
       }
     }
 
-    .lazyloading {
-      @include object-fit(none);
-    }
-
     blockquote {
       display: block;
       border-left: 0.25em solid $global-border-color;
@@ -278,7 +358,11 @@
         padding-left: 1.5em;
       }
 
-      [theme='dark'] & {
+      dl dd {
+        margin-inline-start: 0.25em;
+      }
+
+      [data-theme='dark'] & {
         color: $blockquote-color-dark;
         border-left-color: $global-border-color-dark;
       }
@@ -286,11 +370,40 @@
       @include link(false, true);
     }
 
-    .footnotes {
-      color: $global-font-secondary-color;
+    sup[id^='fnref:']:has(.footnote-ref) {
+      padding: 2px 4px;
+      background-color: rgba(238, 238, 238, 0.7);
+      color: #555555;
+      border-radius: 4px;
+      cursor: pointer;
 
-      [theme='dark'] & {
-        color: $global-font-secondary-color-dark;
+      [data-theme='dark'] & {
+        background-color: rgba(56, 139, 253, 0.1);
+        color: #58a6ff;
+      }
+
+      @include link(true, false);
+    }
+
+    .footnotes {
+      font-size: 0.75rem;
+      white-space: normal;
+      color: darken($global-font-secondary-color, 5%);
+
+      ol {
+        margin-block: 1em;
+        padding-left: 1rem;
+      }
+
+      a:not(.footnote-backref) {
+        color: inherit;
+        text-decoration: underline;
+      }
+
+      @include link(false, true);
+
+      [data-theme='dark'] & {
+        color: lighten($global-font-secondary-color-dark, 5%);
       }
 
       p {
@@ -298,59 +411,43 @@
       }
     }
 
-    @import '../_partial/_single/code';
-    @import '../_shortcodes/index';
+    @import '../_partials/_single/code';
+    @import '../_shortcodes';
 
     hr {
-      margin: 1rem 0;
+      margin-block: 1em;
       position: relative;
-      border-top: 1px dashed $global-border-color;
+      border-top: 1px dashed darken($global-border-color, 5%);
       border-bottom: none;
 
-      [theme='dark'] & {
-        border-top: 1px dashed $global-border-color-dark;
+      [data-theme='dark'] & {
+        border-top: 1px dashed lighten($global-border-color-dark, 5%);
       }
     }
 
     kbd {
       display: inline-block;
-      padding: 0.25rem;
+      padding: 0 0.25rem;
       background-color: $global-background-color;
       border: 1px solid $global-border-color;
-      border-bottom-color: $global-border-color;
-      @include border-radius(3px);
-      @include box-shadow(inset 0 -1px 0 $global-border-color);
       font-size: 0.8rem;
       font-family: $code-font-family;
       color: $code-color;
+      @include border-radius($global-border-radius);
+      @include box-shadow(inset 0 -1px 0 $global-border-color);
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         background-color: $global-background-color-dark;
         border: 1px solid $global-border-color-dark;
-        border-bottom-color: $global-border-color-dark;
-        @include box-shadow(inset 0 -1px 0 $global-border-color-dark);
         color: $code-color-dark;
+        @include box-shadow(inset 0 -1px 0 $global-border-color-dark);
       }
     }
-
-    .typeit {
-      .code {
-        padding: 0.375rem;
-        font-size: 0.875rem;
-        font-family: $code-font-family;
-        font-weight: bold;
-        word-break: break-all;
-      }
-    }
-
-    .version {
-      height: 1.25em;
-      vertical-align: text-bottom;
-    }
   }
 
-  @import '../_partial/_single/footer';
-  @import '../_partial/_single/comment';
+  @import '../_partials/_single/reward';
+  @import '../_partials/_single/footer';
+  @import '../_partials/_single/comment';
 }
 
 .lg-toolbar .lg-icon::after {

assets/css/_partial/_archive/_tags.scss

@@ -1,27 +0,0 @@
-.tag-cloud-tags {
-  margin: 10px 0;
-
-  @include link(true, true);
-
-  a {
-    display: inline-block;
-    position: relative;
-    margin: 5px 10px;
-    @include overflow-wrap(break-word);
-    @include transition(all ease-out 0.3s);
-
-    &:active,
-    &:focus,
-    &:hover {
-      @include transform(scale(1.2));
-    }
-
-    sup {
-      color: $global-font-secondary-color;
-
-      [theme='dark'] & {
-        color: $global-font-secondary-color-dark;
-      }
-    }
-  }
-}

assets/css/_partial/_single/_comment.scss

@@ -1,3 +0,0 @@
-#comments {
-  padding: 8rem 0 2rem;
-}

assets/css/_partial/_single/_toc.scss

@@ -1,157 +0,0 @@
-.toc {
-  .toc-title {
-    font-size: $toc-title-font-size;
-    font-weight: bold;
-    text-transform: uppercase;
-  }
-
-  .toc-content {
-    font-size: $toc-content-font-size;
-
-    ul {
-      text-indent: -0.85rem;
-      padding-left: 0.8rem;
-      list-style: none;
-
-      a:first-child::before {
-        content: '|';
-        font-weight: bolder;
-        margin-right: 0.5rem;
-        color: $single-link-color;
-
-        [theme='dark'] & {
-          color: $single-link-color-dark;
-        }
-      }
-
-      ul {
-        padding-left: 1.5rem;
-      }
-    }
-  }
-
-  ruby {
-    background: $code-background-color;
-
-    rt {
-      color: $global-font-secondary-color;
-    }
-
-    [theme='dark'] & {
-      background: $code-background-color-dark;
-
-      rt {
-        color: $global-font-secondary-color-dark;
-      }
-    }
-  }
-}
-
-#toc-auto {
-  display: block;
-  position: sticky;
-  top: $header-height + 0.5rem;
-  padding-left: 1rem;
-  padding-right: 1rem;
-  @include overflow-wrap(break-word);
-  box-sizing: border-box;
-  visibility: hidden;
-
-  @include blur;
-
-  .toc-title {
-    margin: 0.5rem 0;
-
-    &::before {
-      content: '|';
-      font-weight: bolder;
-      margin-right: 0.5rem;
-      color: $global-border-color;
-
-      [theme='dark'] & {
-        color: $global-border-color-dark;
-      }
-    }
-  }
-
-  .toc-content {
-    &.always-active ul {
-      display: block;
-    }
-
-    > nav > ul {
-      margin: 0.625rem 0;
-    }
-
-    ul {
-      ul {
-        display: none;
-      }
-
-      .has-active > ul {
-        display: block;
-      }
-    }
-
-    a.active {
-      font-weight: bold;
-      color: $single-link-color;
-
-      [theme='dark'] & {
-        color: $single-link-color-dark;
-      }
-
-      &::before {
-        color: $single-link-hover-color;
-
-        [theme='dark'] & {
-          color: $single-link-hover-color-dark;
-        }
-      }
-    }
-  }
-}
-
-#toc-static {
-  display: none;
-  margin: 0.8rem 0;
-
-  &[kept='true'] {
-    display: block;
-  }
-
-  .toc-title {
-    display: flex;
-    justify-content: space-between;
-    line-height: 2em;
-    padding: 0 0.75rem;
-    background: darken($code-background-color, 6%);
-
-    [theme='dark'] & {
-      background: darken($code-background-color-dark, 6%);
-    }
-  }
-
-  .toc-content {
-    background-color: $code-background-color;
-
-    > nav > ul {
-      margin: 0;
-      padding: 0.4rem 1rem 0.4rem 1.8rem;
-    }
-
-    [theme='dark'] & {
-      background-color: $code-background-color-dark;
-    }
-  }
-
-  &.open {
-    .toc-title {
-      background: darken($code-background-color, 3%);
-
-      [theme='dark'] & {
-        background: darken($code-background-color-dark, 3%);
-      }
-    }
-  }
-}

assets/css/_partials/_archive/_tags.scss

@@ -0,0 +1,69 @@
+.tag-cloud-tags {
+  margin: 10px 0;
+
+  @include link(true, true);
+
+  a {
+    display: inline-block;
+    position: relative;
+    margin: 5px 10px;
+    @include overflow-wrap(break-word);
+    @include transition(all ease-out 0.3s);
+
+    &:active,
+    &:focus,
+    &:hover {
+      @include transform(scale(1.2));
+
+      sup {
+        color: $global-font-color;
+        @include transition(all ease-out 0.3s);
+
+        [data-theme='dark'] & {
+          color: $global-font-color-dark;
+        }
+      }
+    }
+
+    sup {
+      color: $global-font-secondary-color;
+
+      [data-theme='dark'] & {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+  }
+}
+
+@for $grade from 0 through 10 {
+  $tag-cloud-color: mix($tag-cloud-end, $tag-cloud-start, $grade * 10);
+  $tag-cloud-color-dark: mix($tag-cloud-end-dark, $tag-cloud-start-dark, $grade * 10);
+
+  .tag-cloud-#{$grade} {
+    color: $tag-cloud-color!important;
+    font-size: var(--tag-font);
+    margin: 10px!important;
+
+    &:active,
+    &:focus,
+    &:hover {
+      color: $global-link-hover-color!important;
+
+      [data-theme='dark'] & {
+        color: $global-link-hover-color-dark;
+      }
+
+      sup {
+        opacity: 1;
+      }
+    }
+
+    [data-theme='dark'] & {
+      color: $tag-cloud-color-dark!important;
+    }
+
+    sup {
+      opacity: 0;
+    }
+  }
+}

assets/css/_partials/_archive/_terms.scss

@@ -1,6 +1,6 @@
-.categories-card {
+.categories-card,
+.collections-card {
   margin: 0 auto;
-  margin-top: 3rem;
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
@@ -14,11 +14,14 @@
     width: 45%;
     display: flex;
     align-items: flex-start;
-    margin-top: 2rem;
     min-height: 10rem;
     padding: 0 2%;
     position: relative;
 
+    &:nth-child(n+3){
+      margin-top: 2rem;
+    }
+
     .card-item-wrapper {
       width: 100%;
       overflow: hidden;
@@ -58,7 +61,7 @@
     background-color: transparent;
   }
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     color: $global-link-color-dark;
 
     &:hover {
@@ -73,7 +76,7 @@
   white-space: nowrap;
   font-variant-numeric: tabular-nums lining-nums;
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     color: $global-font-secondary-color-dark;
   }
 }

assets/css/_partials/_details.scss

@@ -11,7 +11,7 @@
     color: $global-font-secondary-color;
     @include transition(transform 0.2s ease);
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       color: $global-font-secondary-color-dark;
     }
   }

assets/css/_partials/_icon.scss

@@ -10,17 +10,19 @@ svg.icon {
 }
 
 img.emoji {
+  display: inline-block;
   height: 1em;
   width: 1em;
   margin: 0 0.05em 0 0.1em;
   vertical-align: -0.1em;
 }
 
+.hugo-icon,
 .fixit-icon {
   display: inline-block;
-  height: 1.5em;
-  width: 1.5em;
-  line-height: 1.5em;
+  height: 1.2em;
+  width: 1.2em;
+  line-height: 1.2em;
   position: relative;
   vertical-align: text-bottom;
 }

assets/css/_partials/_img.scss

@@ -0,0 +1,3 @@
+img {
+  @include border-radius($global-border-radius/2);
+}

assets/css/_partials/_maps/_admonition.scss

@@ -0,0 +1,15 @@
+// Color map of admonition [$type $color $background-color, ... ]
+$admonition-color-map:
+  'note' #448aff rgba(68, 138, 255, 0.1),
+  'abstract' #00b0ff rgba(0, 176, 255, 0.1),
+  'info' #00b8d4 rgba(0, 184, 212, 0.1),
+  'tip' #00bfa5 rgba(0, 191, 165, 0.1),
+  'success' #00c853 rgba(0, 200, 83, 0.1),
+  'question' #64dd17 rgba(100, 221, 23, 0.1),
+  'warning' #ff9100 rgba(255, 145, 0, 0.1),
+  'failure' #ff5252 rgba(255, 82, 82, 0.1),
+  'danger' #ff1744 rgba(255, 23, 68, 0.1),
+  'bug' #f50057 rgba(245, 0, 87, 0.1),
+  'example' #651fff rgba(101, 31, 255, 0.1),
+  'quote' #9e9e9e rgba(159, 159, 159, 0.1)
+  !default;

assets/css/_partials/_maps/_code-highlight.scss

@@ -0,0 +1,157 @@
+// Color map of the code highlight
+$code-highlight-color-map: (
+  /* Error */ 'err': $code-error-color,
+  /* Keyword */ 'k': #cf222e,
+  /* KeywordConstant */ 'kc': #0550ae,
+  /* KeywordDeclaration */ 'kd': #cf222e,
+  /* KeywordNamespace */ 'kn': #cf222e,
+  /* KeywordPseudo */ 'kp': #cf222e,
+  /* KeywordReserved */ 'kr': #cf222e,
+  /* KeywordType */ 'kt': #cf222e,
+  /* Name */ 'n': $code-color,
+  /* NameAttribute */ 'na': #0550ae,
+  /* NameBuiltin */ 'nb': #0550ae,
+  /* NameBuiltinPseudo */ 'bp': $code-color,
+  /* NameClass */ 'nc': #8250df,
+  /* NameConstant */ 'no': #cf222e,
+  /* NameDecorator */ 'nd': #8250df,
+  /* NameEntity */ 'ni': #0550ae,
+  /* NameException */ 'ne': #0550ae,
+  /* NameFunction */ 'nf': #0550ae,
+  /* NameFunctionMagic */ 'fm': #0550ae,
+  /* NameLabel */ 'nl': #0550ae,
+  /* NameNamespace */ 'nn': #8250df,
+  /* NameOther */ 'nx': #0550ae,
+  /* NameProperty */ 'py': #0550ae,
+  /* NameTag */ 'nt': #116329,
+  /* NameVariable */ 'nv': #953800,
+  /* NameVariableClass */ 'vc': #0550ae,
+  /* NameVariableGlobal */ 'vg': #0550ae,
+  /* NameVariableInstance */ 'vi': #0550ae,
+  /* NameVariableMagic */ 'vm': #0550ae,
+  /* Literal */ 'l': #0550ae,
+  /* LiteralDate */ 'ld': #0a3069,
+  /* LiteralString */ 's': #0a3069,
+  /* LiteralStringAffix */ 'sa': #0a3069,
+  /* LiteralStringBacktick */ 'sb': #0a3069,
+  /* LiteralStringChar */ 'sc': #0a3069,
+  /* LiteralStringDelimiter */ 'dl': #0a3069,
+  /* LiteralStringDoc */ 'sd': #0a3069,
+  /* LiteralStringDouble */ 's2': #0a3069,
+  /* LiteralStringEscape */ 'se': #0a3069,
+  /* LiteralStringHeredoc */ 'sh': #0a3069,
+  /* LiteralStringInterpol */ 'si': #0a3069,
+  /* LiteralStringOther */ 'sx': #0a3069,
+  /* LiteralStringRegex */ 'sr': #0a3069,
+  /* LiteralStringSingle */ 's1': #0a3069,
+  /* LiteralStringSymbol */ 'ss': #0a3069,
+  /* LiteralNumber */ 'm': #0550ae,
+  /* LiteralNumberBin */ 'mb': #0550ae,
+  /* LiteralNumberFloat */ 'mf': #0550ae,
+  /* LiteralNumberHex */ 'mh': #0550ae,
+  /* LiteralNumberInteger */ 'mi': #0550ae,
+  /* LiteralNumberIntegerLong */ 'il': #0550ae,
+  /* LiteralNumberOct */ 'mo': #0550ae,
+  /* Operator */ 'o': #cf222e,
+  /* OperatorWord */ 'ow': #cf222e,
+  /* Punctuation */ 'p': $code-color,
+  /* Comment */ 'c': #6e7781,
+  /* CommentHashbang */ 'ch': #6e7781,
+  /* CommentMultiline */ 'cm': #6e7781,
+  /* CommentSingle */ 'c1': #6e7781,
+  /* CommentSpecial */ 'cs': #6e7781,
+  /* CommentPreproc */ 'cp': #0550ae,
+  /* CommentPreprocFile */ 'cpf': #6e7781,
+  /* Generic */ 'g': $code-color,
+  /* GenericDeleted */ 'gd': #82071e,
+  /* GenericEmph */ 'ge': $code-color,
+  /* GenericError */ 'gr': $code-error-color,
+  /* GenericHeading */ 'gh': $code-color,
+  /* GenericInserted */ 'gi': #116329,
+  /* GenericOutput */ 'go': $code-color,
+  /* GenericPrompt */ 'gp': $code-color,
+  /* GenericStrong */ 'gs': $code-color,
+  /* GenericSubheading */ 'gu': $code-color,
+  /* GenericTraceback */ 'gt': $code-error-color,
+  /* GenericUnderline */ 'gl': $code-color,
+  /* TextWhitespace */ 'w': $code-color,
+  /* Other */ 'x': $code-color
+) !default;
+$code-highlight-color-map-dark: (
+  /* Error */ 'err': $code-error-color,
+  /* Keyword */ 'k': #f47067,
+  /* KeywordConstant */ 'kc': #6cb6ff,
+  /* KeywordDeclaration */ 'kd': #f47067,
+  /* KeywordNamespace */ 'kn': #f47067,
+  /* KeywordPseudo */ 'kp': #f47067,
+  /* KeywordReserved */ 'kr': #f47067,
+  /* KeywordType */ 'kt': #f47067,
+  /* Name */ 'n': $code-color-dark,
+  /* NameAttribute */ 'na': #6cb6ff,
+  /* NameBuiltin */ 'nb': #dcbdfb,
+  /* NameBuiltinPseudo */ 'bp': $code-color-dark,
+  /* NameClass */ 'nc': #dcbdfb,
+  /* NameConstant */ 'no': #6cb6ff,
+  /* NameDecorator */ 'nd': #dcbdfb,
+  /* NameEntity */ 'ni': #6cb6ff,
+  /* NameException */ 'ne': #6cb6ff,
+  /* NameFunction */ 'nf': #dcbdfb,
+  /* NameFunctionMagic */ 'fm': #6cb6ff,
+  /* NameLabel */ 'nl': #6cb6ff,
+  /* NameNamespace */ 'nn': #f47067,
+  /* NameOther */ 'nx': #dcbdfb,
+  /* NameProperty */ 'py': #6cb6ff,
+  /* NameTag */ 'nt': #8ddb8c,
+  /* NameVariable */ 'nv': #f69d50,
+  /* NameVariableClass */ 'vc': #6cb6ff,
+  /* NameVariableGlobal */ 'vg': #6cb6ff,
+  /* NameVariableInstance */ 'vi': #6cb6ff,
+  /* NameVariableMagic */ 'vm': #6cb6ff,
+  /* Literal */ 'l': #6cb6ff,
+  /* LiteralDate */ 'ld': #96d0ff,
+  /* LiteralString */ 's': #96d0ff,
+  /* LiteralStringAffix */ 'sa': #96d0ff,
+  /* LiteralStringBacktick */ 'sb': #96d0ff,
+  /* LiteralStringChar */ 'sc': #96d0ff,
+  /* LiteralStringDelimiter */ 'dl': #96d0ff,
+  /* LiteralStringDoc */ 'sd': #96d0ff,
+  /* LiteralStringDouble */ 's2': #96d0ff,
+  /* LiteralStringEscape */ 'se': #96d0ff,
+  /* LiteralStringHeredoc */ 'sh': #96d0ff,
+  /* LiteralStringInterpol */ 'si': #96d0ff,
+  /* LiteralStringOther */ 'sx': #96d0ff,
+  /* LiteralStringRegex */ 'sr': #96d0ff,
+  /* LiteralStringSingle */ 's1': #96d0ff,
+  /* LiteralStringSymbol */ 'ss': #96d0ff,
+  /* LiteralNumber */ 'm': #6cb6ff,
+  /* LiteralNumberBin */ 'mb': #6cb6ff,
+  /* LiteralNumberFloat */ 'mf': #6cb6ff,
+  /* LiteralNumberHex */ 'mh': #6cb6ff,
+  /* LiteralNumberInteger */ 'mi': #6cb6ff,
+  /* LiteralNumberIntegerLong */ 'il': #6cb6ff,
+  /* LiteralNumberOct */ 'mo': #6cb6ff,
+  /* Operator */ 'o': #f47067,
+  /* OperatorWord */ 'ow': #f47067,
+  /* Punctuation */ 'p': $code-color-dark,
+  /* Comment */ 'c': #768390,
+  /* CommentHashbang */ 'ch': #768390,
+  /* CommentMultiline */ 'cm': #768390,
+  /* CommentSingle */ 'c1': #768390,
+  /* CommentSpecial */ 'cs': #768390,
+  /* CommentPreproc */ 'cp': #6cb6ff,
+  /* CommentPreprocFile */ 'cpf': #768390,
+  /* Generic */ 'g': $code-color-dark,
+  /* GenericDeleted */ 'gd': #ffd8d3,
+  /* GenericEmph */ 'ge': $code-color-dark,
+  /* GenericError */ 'gr': $code-error-color,
+  /* GenericHeading */ 'gh': $code-color-dark,
+  /* GenericInserted */ 'gi': #b4f1b4,
+  /* GenericOutput */ 'go': $code-color-dark,
+  /* GenericPrompt */ 'gp': $code-color-dark,
+  /* GenericStrong */ 'gs': $code-color-dark,
+  /* GenericSubheading */ 'gu': $code-color-dark,
+  /* GenericTraceback */ 'gt': $code-error-color,
+  /* GenericUnderline */ 'gl': $code-color-dark,
+  /* TextWhitespace */ 'w': $code-color-dark,
+  /* Other */ 'x': $code-color-dark
+) !default;

assets/css/_partials/_maps/_code-type.scss

@@ -0,0 +1,373 @@
+// Code type map
+$code-type-map: (
+  // Chroma supported languages
+  // @generator https://github.com/hugo-fixit/.tools/blob/main/tampermonkey/code-type-map-fetcher.user.js
+  "abap": "ABAP",
+  "abnf": "ABNF",
+  "as": "ActionScript",
+  "actionscript": "ActionScript",
+  "as3": "ActionScript 3",
+  "actionscript3": "ActionScript 3",
+  "ada": "Ada",
+  "ada95": "Ada",
+  "ada2005": "Ada",
+  "al": "AL",
+  "ng2": "Angular2",
+  "antlr": "ANTLR",
+  "apacheconf": "ApacheConf",
+  "aconf": "ApacheConf",
+  "apache": "ApacheConf",
+  "apl": "APL",
+  "applescript": "AppleScript",
+  "arduino": "Arduino",
+  "armasm": "ArmAsm",
+  "awk": "Awk",
+  "gawk": "Awk",
+  "mawk": "Awk",
+  "nawk": "Awk",
+  "ballerina": "Ballerina",
+  "make": "Base Makefile",
+  "makefile": "Base Makefile",
+  "mf": "Base Makefile",
+  "bsdmake": "Base Makefile",
+  "bash": "Bash",
+  "sh": "Bash",
+  "ksh": "Bash",
+  "zsh": "Bash",
+  "shell": "Bash",
+  "bash-session": "BashSession",
+  "console": "BashSession",
+  "shell-session": "BashSession",
+  "bat": "Batchfile",
+  "batch": "Batchfile",
+  "dosbatch": "Batchfile",
+  "winbatch": "Batchfile",
+  "bib": "BibTeX",
+  "bibtex": "BibTeX",
+  "bicep": "Bicep",
+  "blitzbasic": "BlitzBasic",
+  "b3d": "BlitzBasic",
+  "bplus": "BlitzBasic",
+  "bnf": "BNF",
+  "brainfuck": "Brainfuck",
+  "bf": "Brainfuck",
+  "c": "C",
+  "csharp": "C#",
+  "c\\#": "C#",
+  "cpp": "C++",
+  "c\\+\\+": "C++",
+  "caddyfile": "Caddyfile",
+  "caddy": "Caddyfile",
+  "caddyfile-directives": "Caddyfile Directives",
+  "caddyfile-d": "Caddyfile Directives",
+  "caddy-d": "Caddyfile Directives",
+  "capnp": "Cap'n Proto",
+  "cassandra": "Cassandra CQL",
+  "cql": "Cassandra CQL",
+  "ceylon": "Ceylon",
+  "cfengine3": "CFEngine3",
+  "cf3": "CFEngine3",
+  "cfs": "cfstatement",
+  "chai": "ChaiScript",
+  "chaiscript": "ChaiScript",
+  "cheetah": "Cheetah",
+  "spitfire": "Cheetah",
+  "clojure": "Clojure",
+  "clj": "Clojure",
+  "cmake": "CMake",
+  "cobol": "COBOL",
+  "coffee-script": "CoffeeScript",
+  "coffeescript": "CoffeeScript",
+  "coffee": "CoffeeScript",
+  "common-lisp": "Common Lisp",
+  "cl": "Common Lisp",
+  "lisp": "Common Lisp",
+  "coq": "Coq",
+  "cr": "Crystal",
+  "crystal": "Crystal",
+  "css": "CSS",
+  "cython": "Cython",
+  "pyx": "Cython",
+  "pyrex": "Cython",
+  "d": "D",
+  "dart": "Dart",
+  "diff": "Diff",
+  "udiff": "Diff",
+  "django": "Django/Jinja",
+  "jinja": "Django/Jinja",
+  "docker": "Docker",
+  "dockerfile": "Docker",
+  "dtd": "DTD",
+  "dylan": "Dylan",
+  "ebnf": "EBNF",
+  "elixir": "Elixir",
+  "ex": "Elixir",
+  "exs": "Elixir",
+  "elm": "Elm",
+  "emacs": "EmacsLisp",
+  "elisp": "EmacsLisp",
+  "emacs-lisp": "EmacsLisp",
+  "erlang": "Erlang",
+  "factor": "Factor",
+  "fennel": "Fennel",
+  "fnl": "Fennel",
+  "fish": "Fish",
+  "fishshell": "Fish",
+  "forth": "Forth",
+  "fortran": "Fortran",
+  "fortranfixed": "FortranFixed",
+  "fsharp": "FSharp",
+  "gas": "GAS",
+  "asm": "GAS",
+  "gdscript": "GDScript",
+  "gd": "GDScript",
+  "genshi": "Genshi",
+  "kid": "Genshi",
+  "xml\\+genshi": "Genshi",
+  "xml\\+kid": "Genshi",
+  "html\\+genshi": "Genshi HTML",
+  "html\\+kid": "Genshi HTML",
+  "genshitext": "Genshi Text",
+  "cucumber": "Gherkin",
+  "Cucumber": "Gherkin",
+  "gherkin": "Gherkin",
+  "Gherkin": "Gherkin",
+  "glsl": "GLSL",
+  "gnuplot": "Gnuplot",
+  "go": "Go",
+  "golang": "Go",
+  "go-html-template": "Go HTML Template",
+  "go-text-template": "Go Text Template",
+  "graphql": "GraphQL",
+  "graphqls": "GraphQL",
+  "gql": "GraphQL",
+  "groff": "Groff",
+  "nroff": "Groff",
+  "man": "Groff",
+  "groovy": "Groovy",
+  "handlebars": "Handlebars",
+  "hbs": "Handlebars",
+  "haskell": "Haskell",
+  "hs": "Haskell",
+  "hx": "Haxe",
+  "haxe": "Haxe",
+  "hxsl": "Haxe",
+  "hcl": "HCL",
+  "hexdump": "Hexdump",
+  "hlb": "HLB",
+  "html": "HTML",
+  "http": "HTTP",
+  "hylang": "Hy",
+  "idris": "Idris",
+  "idr": "Idris",
+  "igor": "Igor",
+  "igorpro": "Igor",
+  "ini": "INI",
+  "cfg": "INI",
+  "dosini": "INI",
+  "io": "Io",
+  "j": "J",
+  "java": "Java",
+  "js": "JavaScript",
+  "javascript": "JavaScript",
+  "json": "JSON",
+  "julia": "Julia",
+  "jl": "Julia",
+  "jungle": "Jungle",
+  "kotlin": "Kotlin",
+  "lighty": "Lighttpd configuration file",
+  "lighttpd": "Lighttpd configuration file",
+  "llvm": "LLVM",
+  "lua": "Lua",
+  "mako": "Mako",
+  "md": "markdown",
+  "mkd": "markdown",
+  "mason": "Mason",
+  "mathematica": "Mathematica",
+  "mma": "Mathematica",
+  "nb": "Mathematica",
+  "matlab": "Matlab",
+  "mcfunction": "mcfunction",
+  "meson": "Meson",
+  "meson\\.build": "Meson",
+  "metal": "Metal",
+  "minizinc": "MiniZinc",
+  "MZN": "MiniZinc",
+  "mzn": "MiniZinc",
+  "mlir": "MLIR",
+  "modula2": "Modula-2",
+  "m2": "Modula-2",
+  "monkeyc": "MonkeyC",
+  "morrowind": "MorrowindScript",
+  "mwscript": "MorrowindScript",
+  "myghty": "Myghty",
+  "mysql": "MySQL",
+  "mariadb": "MySQL",
+  "nasm": "NASM",
+  "newspeak": "Newspeak",
+  "nginx": "Nginx configuration file",
+  "nim": "Nim",
+  "nimrod": "Nim",
+  "nixos": "Nix",
+  "nix": "Nix",
+  "objective-c": "Objective-C",
+  "objectivec": "Objective-C",
+  "obj-c": "Objective-C",
+  "objc": "Objective-C",
+  "ocaml": "OCaml",
+  "octave": "Octave",
+  "ones": "OnesEnterprise",
+  "onesenterprise": "OnesEnterprise",
+  "1S": "OnesEnterprise",
+  "1S:Enterprise": "OnesEnterprise",
+  "openedge": "OpenEdge ABL",
+  "abl": "OpenEdge ABL",
+  "progress": "OpenEdge ABL",
+  "openedgeabl": "OpenEdge ABL",
+  "openscad": "OpenSCAD",
+  "org": "Org Mode",
+  "orgmode": "Org Mode",
+  "pacmanconf": "PacmanConf",
+  "perl": "Perl",
+  "pl": "Perl",
+  "php": "PHP",
+  "php3": "PHP",
+  "php4": "PHP",
+  "php5": "PHP",
+  "phtml": "PHTML",
+  "pig": "Pig",
+  "pkgconfig": "PkgConfig",
+  "plpgsql": "PL/pgSQL",
+  "text": "plaintext",
+  "plain": "plaintext",
+  "no-highlight": "plaintext",
+  "plutus-core": "Plutus Core",
+  "plc": "Plutus Core",
+  "pony": "Pony",
+  "postgresql": "PostgreSQL SQL dialect",
+  "postgres": "PostgreSQL SQL dialect",
+  "postscript": "PostScript",
+  "postscr": "PostScript",
+  "pov": "POVRay",
+  "powerquery": "PowerQuery",
+  "pq": "PowerQuery",
+  "powershell": "PowerShell",
+  "posh": "PowerShell",
+  "ps1": "PowerShell",
+  "psm1": "PowerShell",
+  "psd1": "PowerShell",
+  "prolog": "Prolog",
+  "promql": "PromQL",
+  "protobuf": "Protocol Buffer",
+  "proto": "Protocol Buffer",
+  "puppet": "Puppet",
+  "python": "Python",
+  "py": "Python",
+  "sage": "Python",
+  "python3": "Python",
+  "py3": "Python",
+  "python2": "Python 2",
+  "py2": "Python 2",
+  "qbasic": "QBasic",
+  "basic": "QBasic",
+  "qml": "QML",
+  "qbs": "QML",
+  "splus": "R",
+  "s": "R",
+  "r": "R",
+  "racket": "Racket",
+  "rkt": "Racket",
+  "ragel": "Ragel",
+  "perl6": "Raku",
+  "pl6": "Raku",
+  "raku": "Raku",
+  "jsx": "react",
+  "react": "react",
+  "reason": "ReasonML",
+  "reasonml": "ReasonML",
+  "registry": "reg",
+  "rst": "reStructuredText",
+  "rest": "reStructuredText",
+  "restructuredtext": "reStructuredText",
+  "rexx": "Rexx",
+  "arexx": "Rexx",
+  "rb": "Ruby",
+  "ruby": "Ruby",
+  "duby": "Ruby",
+  "rust": "Rust",
+  "rs": "Rust",
+  "sas": "SAS",
+  "sass": "Sass",
+  "scala": "Scala",
+  "scheme": "Scheme",
+  "scm": "Scheme",
+  "scilab": "Scilab",
+  "scss": "SCSS",
+  "sieve": "Sieve",
+  "smalltalk": "Smalltalk",
+  "squeak": "Smalltalk",
+  "st": "Smalltalk",
+  "smarty": "Smarty",
+  "snobol": "Snobol",
+  "sol": "Solidity",
+  "solidity": "Solidity",
+  "sparql": "SPARQL",
+  "sql": "SQL",
+  "squidconf": "SquidConf",
+  "squid\\.conf": "SquidConf",
+  "squid": "SquidConf",
+  "sml": "Standard ML",
+  "stylus": "Stylus",
+  "svelte": "Svelte",
+  "swift": "Swift",
+  "systemd": "SYSTEMD",
+  "systemverilog": "systemverilog",
+  "sv": "systemverilog",
+  "tablegen": "TableGen",
+  "tasm": "TASM",
+  "tcl": "Tcl",
+  "tcsh": "Tcsh",
+  "csh": "Tcsh",
+  "termcap": "Termcap",
+  "terminfo": "Terminfo",
+  "terraform": "Terraform",
+  "tf": "Terraform",
+  "tex": "TeX",
+  "latex": "TeX",
+  "thrift": "Thrift",
+  "toml": "TOML",
+  "tradingview": "TradingView",
+  "tv": "TradingView",
+  "tsql": "Transact-SQL",
+  "t-sql": "Transact-SQL",
+  "turing": "Turing",
+  "turtle": "Turtle",
+  "twig": "Twig",
+  "ts": "TypeScript",
+  "tsx": "TypeScript",
+  "typescript": "TypeScript",
+  "typoscript": "TypoScript",
+  "typoscriptcssdata": "TypoScriptCssData",
+  "typoscripthtmldata": "TypoScriptHtmlData",
+  "v": "verilog",
+  "vlang": "V",
+  "vsh": "V shell",
+  "vshell": "V shell",
+  "vb\\.net": "VB.net",
+  "vbnet": "VB.net",
+  "verilog": "verilog",
+  "vhdl": "VHDL",
+  "vim": "VimL",
+  "vue": "vue",
+  "vuejs": "vue",
+  "whiley": "Whiley",
+  "xml": "XML",
+  "xorg\\.conf": "Xorg",
+  "yaml": "YAML",
+  "yang": "YANG",
+  "zed": "Zed",
+  "zig": "Zig",
+  // Custom code type
+  "markdown": "markdown",
+  "yml": "YAML"
+) !default;

assets/css/_partials/_maps/_colors.scss

@@ -0,0 +1,17 @@
+// Theme colors
+$primary: #1772ee !default;
+$secondary: #919191 !default;
+$success: #13ce66 !default;
+$info: #0dcaf0 !default;
+$warning: #ffba00 !default;
+$danger: #ff4949 !default;
+
+// Theme colors map
+$theme-colors: (
+  'primary': $primary,
+  'secondary': $secondary,
+  'success': $success,
+  'info': $info,
+  'warning': $warning,
+  'danger': $danger
+) !default;

assets/css/_partials/_maps/_utilities.scss

@@ -0,0 +1,13 @@
+// Utilities
+
+// property order
+$orders: (
+  first: -1,
+  0: 0,
+  1: 1,
+  2: 2,
+  3: 3,
+  4: 4,
+  5: 5,
+  last: 6,
+) !default;

assets/css/_partials/_mask.scss

@@ -6,11 +6,11 @@
   left: 0;
   width: 100%;
   height: 100%;
-  z-index: -1;
   background-color: rgba(0, 0, 0, 0);
+  @include z-index(0, -1);
 
   .blur & {
-    z-index: 100;
+    @include z-index(1);
     background-color: rgba(0, 0, 0, 0.25);
   }
 }

assets/css/_partials/_single/_code.scss

@@ -1,17 +1,17 @@
 // inline code
 code {
-  display: inline-block;
-  max-width: 100%;
-  padding: 0 0.4rem;
+  padding: 0.2em 0.4em;
+  margin: 0;
   font-size: $code-font-size;
   font-family: $code-font-family;
   color: $code-color;
   background-color: rgba(175, 184, 193, 0.2);
+  text-decoration: inherit;
   @include border-radius($global-border-radius);
   @include overflow-wrap(break-word);
-  @include line-break(anywhere);
+  @include line-break(auto);
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     color: $code-color-dark;
     background-color: rgba(99, 110, 123, 0.4);
   }
@@ -30,7 +30,7 @@ pre {
 
   background-color: $code-background-color;
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     background-color: $code-background-color-dark;
   }
 
@@ -40,7 +40,7 @@ pre {
     @include border-radius(0);
     @include max-content(min-width);
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: transparent;
     }
   }
@@ -91,7 +91,7 @@ pre {
       @include border-radius($global-border-radius);
       @include transition(border-radius 0.2s ease);
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         color: $code-info-color-dark;
         background-color: darken($code-background-color-dark, 6%);
       }
@@ -100,6 +100,12 @@ pre {
         cursor: pointer;
       }
 
+      .ellipses,
+      .edit,
+      .copy {
+        @extend .print-d-none;
+      }
+
       .code-title {
         width: 100%;
         padding: 0.4rem;
@@ -108,6 +114,12 @@ pre {
           padding: 0 0.2rem;
           @include transition(transform 0.2s ease);
         }
+
+        .title-inner {
+          position: absolute;
+          left: 50%;
+          transform: translateX(-50%);
+        }
       }
 
       .code-title::after {
@@ -128,14 +140,14 @@ pre {
           cursor: pointer;
           color: $global-link-hover-color;
 
-          [theme='dark'] & {
+          [data-theme='dark'] & {
             color: $global-link-hover-color-dark;
           }
         }
       }
 
       @each $type, $text in $code-type-map {
-        &.#{$type} .code-title::after {
+        &.language-#{$type} .code-title::after {
           content: $text;
         }
       }
@@ -156,7 +168,7 @@ pre {
       display: block;
       background-color: $code-background-color;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         background-color: $code-background-color-dark;
       }
 
@@ -181,9 +193,11 @@ pre {
       .lntd:first-child {
         min-width: 1.6rem;
         text-align: right;
+        position: sticky;
+        left: 0;
 
         pre {
-          padding-right: 0;
+          @include user-select(none);
         }
       }
       // code content
@@ -206,7 +220,7 @@ pre {
         background-color: darken($code-background-color, 6%);
         @include border-radius($global-border-radius $global-border-radius 0 0);
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           background-color: darken($code-background-color-dark, 3%);
         }
       }
@@ -237,7 +251,7 @@ pre {
     background-color: $code-hightlight-color;
     box-shadow: -0.5rem 0 0 $code-hightlight-color, 0.5rem 0 0 $code-hightlight-color;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: $code-hightlight-color-dark;
       box-shadow: -0.5rem 0 0 $code-hightlight-color-dark, 0.5rem 0 0 $code-hightlight-color-dark;
     }
@@ -266,7 +280,7 @@ pre {
   .ln {
     color: $global-font-secondary-color;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       color: $global-font-secondary-color-dark;
     }
   }
@@ -282,7 +296,7 @@ pre {
   .gd {
     background-color: #ffebe9;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: #78191b;
     }
   }
@@ -290,7 +304,7 @@ pre {
   .gi {
     background-color: #dafbe1;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: #1b4721;
     }
   }
@@ -301,7 +315,7 @@ pre {
     }
   }
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     @each $class, $color in $code-highlight-color-map-dark {
       .#{$class} {
         color: $color;
@@ -328,7 +342,7 @@ pre {
     @include link(false, false);
     background-color: darken($code-background-color, 5%);
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       background-color: darken($code-background-color-dark, 5%);
     }
   }
@@ -338,13 +352,13 @@ pre {
     &::-webkit-scrollbar {
       background-color: #f6f8fa;
 
-      [theme='dark'] & {
+      [data-theme='dark'] & {
         background-color: #2d333b;
       }
     }
   }
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     @import './github-dark-dimmed';
   }
 }

assets/css/_partials/_single/_collections.scss

@@ -0,0 +1,232 @@
+// Collection Navigation
+.collection-card {
+  font-size: 0.875rem;
+  background-color: darken($global-background-color, 3%);
+  margin-block: 2rem -1rem;
+  padding: 1rem 1.25rem;
+  position: relative;
+  @include border-radius($global-border-radius * 1.5);
+  @include user-select(none);
+  @extend .print-d-none;
+
+  [data-theme='dark'] & {
+    background-color: lighten($global-background-color-dark, 3%);
+  }
+
+  &:has(.collection-nav-item:nth-child(2))::before {
+    content: '';
+    position: absolute;
+    left: 50%;
+    bottom: 0.75rem;
+    width: 1px;
+    height: 2rem;
+    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.03) 100%);
+
+    [data-theme='dark'] & {
+      background: linear-gradient(
+        to bottom,
+        rgba(255, 255, 255, 0.03),
+        rgba(255, 255, 255, 0.05) 50%,
+        rgba(255, 255, 255, 0.03) 100%
+      );
+    }
+  }
+
+  .collection-title {
+    @include link(false, false);
+  }
+
+  .collection-nav {
+    display: flex;
+    justify-content: space-between;
+    gap: 1rem;
+
+    &:not(:empty) {
+      margin-top: 0.5rem;
+    }
+
+    .collection-nav-item {
+      flex-grow: 1;
+      max-width: calc(50% - 0.5rem);
+      font-weight: 500;
+      display: flex;
+      align-items: center;
+      @include transition(all 0.3s ease-out);
+
+      &:only-child {
+        max-width: 100%;
+      }
+
+      i {
+        flex-shrink: 0;
+      }
+
+      span {
+        flex-grow: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      &[rel='next'] {
+        text-align: right;
+      }
+
+      &[rel='prev']:hover {
+        @include transform(translateX(-4px));
+      }
+
+      &[rel='next']:hover {
+        @include transform(translateX(4px));
+      }
+    }
+  }
+}
+
+// Collection aside container
+.aside-collection {
+  position: sticky;
+  top: calc(#{$header-height} + var(--#{$prefix}breadcrumb-height));
+  box-sizing: border-box;
+  @include overflow-wrap(break-word);
+  @include blur;
+  @extend .print-d-none;
+}
+
+// Collection List
+.collection-details {
+  &:not(:last-of-type) {
+    margin-bottom: 0.5rem;
+  }
+
+  &.open {
+    .collection-summary {
+      background-color: darken($global-background-color, 4%);
+
+      [data-theme='dark'] & {
+        background-color: lighten($global-background-color-dark, 4%);
+      }
+    }
+  }
+
+  .collection-summary {
+    display: flex;
+    align-items: baseline;
+    gap: 0.25em;
+    padding: 0.2em 0.5em;
+    background-color: darken($global-background-color, 3%);
+
+    [data-theme='dark'] & {
+      background-color: lighten($global-background-color-dark, 3%);
+    }
+    
+    > i.fa-layer-group {
+      flex-shrink: 0;
+    }
+
+    .collection-name {
+      flex-grow: 1;
+      font-weight: bold;
+
+      &::before {
+        content: attr(data-collections) '・';
+      }
+    }
+
+    .collection-count {
+      flex-shrink: 0;
+      @extend .text-secondary;
+    }
+
+    .details-icon {
+      flex-shrink: 0;
+    }
+
+    @include user-select(none);
+  }
+
+  .collection-content {
+    font-size: $toc-content-font-size;
+    background-color: darken($global-background-color, 2%);
+
+    [data-theme='dark'] & {
+      background-color: lighten($global-background-color-dark, 2%);
+    }
+
+    .collection-list {
+      margin: 0;
+      padding-inline: 1.6em 0.8em;
+      padding-block: 0.4em;
+      text-indent: -0.8em;
+      list-style: none;
+      overflow-y: scroll;
+      max-height: 60vh;
+
+      &::-webkit-scrollbar {
+        width: 0;
+      }
+
+      .collection-item > a::before,
+      .collection-item > span::before {
+        content: '|';
+        font-weight: 600;
+        margin-right: 0.5em;
+        position: relative;
+        bottom: 2px;
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+      }
+
+      .collection-item > .active {
+        font-weight: bold;
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+
+        &::before {
+          color: $single-link-hover-color;
+  
+          [data-theme='dark'] & {
+            color: $single-link-hover-color-dark;
+          }
+        }
+      }
+    }
+
+    .collection-nav-simple {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 0.5em;
+      background-color: darken($global-background-color, 3%);
+
+      [data-theme='dark'] & {
+        background-color: lighten($global-background-color-dark, 3%);
+      }
+
+      a.collection-nav-item {
+        padding-inline: 2px;
+        border-radius: 50%;
+        @include transition(background-color 0.3s ease-out);
+
+        &:hover {
+          background-color: darken($global-background-color, 10%);
+
+          [data-theme='dark'] & {
+            background-color: lighten($global-background-color-dark, 10%);
+          }
+        }
+      }
+
+      > i.collection-nav-item {
+        padding: 4px 2px;
+        cursor: not-allowed;
+      }
+    }
+  }
+}

assets/css/_partials/_single/_comment.scss

@@ -0,0 +1,4 @@
+>#comments {
+  padding: 2rem 0;
+  @extend .print-d-none;
+}

assets/css/_partials/_single/_fixit-decryptor.scss

@@ -0,0 +1,71 @@
+.fixit-decryptor-container {
+  font-family: $global-font-family;
+  text-align: center;
+  margin-top: 3rem;
+
+  .fixit-encryptor-shortcode & {
+    margin-top: 1rem;
+  }
+
+  #fixit-decryptor-input,
+  .fixit-decryptor-input,
+  .fixit-encryptor-btn {
+    display: inline-block;
+    box-sizing: border-box;
+    outline: none;
+    color: $global-font-color;
+    border: 1px solid darken($global-border-color, 15%);
+    border-radius: $global-border-radius;
+    @include transition(all 0.1s ease-out);
+    box-shadow: 0px 0px 5px 0px darken($global-border-color, 15%);
+
+    &:active,
+    &:focus,
+    &:hover {
+      color: darken($global-link-hover-color, 6%);
+      border-color: $global-link-hover-color;
+      box-shadow: 0px 0px 5px 0px lighten($global-link-hover-color, 20%);
+
+      [data-theme='dark'] & {
+        color: lighten($global-link-hover-color-dark, 6%);
+        border-color: $global-link-hover-color-dark;
+        box-shadow: 0px 0px 5px 0px darken($global-link-hover-color-dark, 20%);
+      }
+    }
+
+    [data-theme='dark'] & {
+      color: $global-font-color-dark;
+      border-color: lighten($global-border-color-dark, 15%);
+      box-shadow: 0px 0px 5px 0px lighten($global-border-color-dark, 15%);
+    }
+  }
+
+  #fixit-decryptor-input,
+  .fixit-decryptor-input {
+    width: clamp(50%, 400px, 100%);
+    height: 3rem;
+    padding-left: 1rem;
+    padding-right: 1rem;
+    background-color: $global-background-color;
+
+    [data-theme='dark'] & {
+      background-color: $global-background-color-dark;
+    }
+  }
+
+  .fixit-encryptor-btn {
+    cursor: pointer;
+    @include transition(all 0.1s ease-out);
+    padding: 0.6rem 1rem;
+
+    background-color: $header-background-color;
+
+    [data-theme='dark'] & {
+      background-color: $header-background-color-dark;
+    }
+  }
+}
+
+.encrypted-hidden {
+  display: none;
+}

assets/css/_partials/_single/_footer.scss

@@ -1,11 +1,15 @@
 .post-footer {
-  margin-top: 3rem;
+  margin: 2rem 0;
+
+  &~.post-reward {
+    margin-block: -2rem 0;
+  }
 
   .post-info {
     border-bottom: 1px solid $global-border-color;
-    padding: 1rem 0 0.3rem;
+    padding: 0.3rem 0;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       border-bottom: 1px solid $global-border-color-dark;
     }
 
@@ -17,7 +21,7 @@
         font-size: 0.8em;
         color: $global-font-secondary-color;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           color: $global-font-secondary-color-dark;
         }
 
@@ -28,7 +32,7 @@
         font-size: 0.8em;
         color: $global-font-secondary-color;
 
-        [theme='dark'] & {
+        [data-theme='dark'] & {
           color: $global-font-secondary-color-dark;
         }
 
@@ -37,12 +41,19 @@
 
       .post-info-md {
         font-size: 0.8rem;
-        width: 8rem;
+        width: fit-content;
 
         @include link(false, false);
+
+        >span:not(:first-child)::before {
+          content: '|';
+          margin-left: 0.25rem;
+          margin-right: 0.25rem;
+        }
       }
 
       .post-info-share {
+        @extend .print-d-none;
         a * {
           vertical-align: text-bottom;
         }
@@ -51,10 +62,14 @@
   }
 
   .post-info-more {
-    padding: 0.3rem 0 1rem;
+    padding: 0.3rem 0;
     display: flex;
     justify-content: space-between;
     font-size: 0.9rem;
+
+    section:last-child {
+      @extend .print-d-none;
+    }
   }
 
   .post-tags {
@@ -63,36 +78,39 @@
     * {
       display: inline;
     }
+
+    @include link(true, true);
+
+    .post-tag:not(:last-child)::after {
+      content: ',';
+      margin-right: 0.25rem;
+    }
   }
 
   .post-nav {
-    &::before,
-    &::after {
-      content: ' ';
-      display: table;
-    }
+    display: flex;
+    justify-content: space-between;
+    gap: 1.5rem;
+    padding-block: 0.5rem;
+    @extend .print-d-none;
 
-    & a.prev,
-    & a.next {
+    .post-nav-item {
+      flex: 1;
       font-size: 1rem;
       font-weight: 600;
       @include transition(all 0.3s ease-out);
-    }
 
-    & a.prev {
-      float: left;
-    }
+      &[rel='next'] {
+        text-align: right;
+      }
 
-    & a.prev:hover {
-      @include transform(translateX(-4px));
-    }
+      &[rel='prev']:hover {
+        @include transform(translateX(-4px));
+      }
 
-    & a.next {
-      float: right;
-    }
-
-    & a.next:hover {
-      @include transform(translateX(4px));
+      &[rel='next']:hover {
+        @include transform(translateX(4px));
+      }
     }
   }
 }

assets/css/_partials/_single/_github-dark-dimmed.scss

@@ -2,7 +2,7 @@
  * Theme: GitHub Dark Dimmed
  * Description: Dark Dimmed theme as seen on github.com
  * Author: github.com
- * Maintainer: https://github.com/Lruihao/FixIt
+ * Maintainer: https://github.com/hugo-fixit/FixIt
  * Updated: 2022-03-01
  */
 & {

assets/css/_partials/_single/_reward.scss

@@ -0,0 +1,98 @@
+.post-reward {
+  padding: 1rem;
+  text-align: center;
+  margin-bottom: -1rem;
+  @extend .print-d-none;
+
+  &:has(.reward-ways:empty) {
+    display: none;
+  }
+
+  .comment {
+    margin: 0.5rem 0;
+    font-weight: 500;
+  }
+
+  .reward-ways {
+    display: none;
+  }
+
+  .reward-input:checked~.reward-ways {
+    display: block;
+    padding-top: 20px;
+
+    div {
+      display: inline-block;
+      @include user-select(none);
+  
+      span {
+        display: block;
+      }
+  
+      &:hover span[data-animation] {
+        animation: var(--animation-reward, jackInTheBox) 0.8s infinite linear;
+        // The animation may affect :hover of img in dark mode
+        pointer-events: none;
+      }
+  
+      img {
+        display: inline-block;
+        margin: 0.8em 2em 0;
+        max-width: 100%;
+        width: $reward-img-width;
+      }
+    }
+
+    // `fixed` mode only supports desktop
+    &[data-mode='fixed'] {
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      padding: 1rem;
+      background-color: $global-background-color;
+      @include z-index(2);
+      @include border-radius($global-border-radius);
+      @include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.2));
+
+      [data-theme='dark'] & {
+        background-color: $global-background-color-dark;
+        @include box-shadow(0 0 1.5rem 0 rgba(255, 255, 255, 0.2));
+      }
+    }
+  }
+
+  .reward-button {
+    display: inline-block;
+    box-sizing: border-box;
+    cursor: pointer;
+    outline: none;
+    color: lighten($reward-color, 5%);
+    border: 2px solid lighten($reward-color, 10%);
+    border-radius: $global-border-radius;
+    padding: 0.6rem 1rem;
+    background-color: $global-background-color;
+    vertical-align: text-top;
+    line-height: 1rem;
+    @include transition(all 0.3s ease-out);
+
+    &:active,
+    &:hover {
+      color: #ffffff;
+      border-color: $reward-color;
+      background-color: $reward-color;
+
+      [data-theme='dark'] & {
+        color: #ffffff;
+        border-color: $reward-color-dark;
+        background-color: $reward-color-dark;
+      }
+    }
+
+    [data-theme='dark'] & {
+      color: $reward-color;
+      border-color: lighten($reward-color, 5%);
+      background-color: $global-background-color-dark;
+    }
+  }
+}

assets/css/_partials/_single/_toc.scss

@@ -0,0 +1,252 @@
+.toc {
+  .toc-title {
+    font-size: $toc-title-font-size;
+    font-weight: bold;
+    text-transform: uppercase;
+  }
+
+  .toc-content {
+    font-size: $toc-content-font-size;
+
+    ul {
+      text-indent: -0.8em;
+      padding-left: 0.8em;
+      list-style: none;
+
+      a:first-child::before {
+        content: '|';
+        font-weight: bolder;
+        margin-right: 0.5em;
+        position: relative;
+        bottom: 2px;
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+      }
+
+      ul {
+        padding-left: 1em;
+      }
+    }
+
+    ol {
+      margin: 0;
+      padding-left: 2.25em;
+
+      ol {
+        padding-left: 1.25em;
+      }
+
+      li:has(> a:hover)::marker {
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+      }
+    }
+  }
+
+  ruby {
+    background: $code-background-color;
+
+    rt {
+      color: $global-font-secondary-color;
+    }
+
+    [data-theme='dark'] & {
+      background: $code-background-color-dark;
+
+      rt {
+        color: $global-font-secondary-color-dark;
+      }
+    }
+  }
+}
+
+#toc-auto {
+  display: block;
+  position: sticky;
+  top: calc(#{$header-height} + var(--#{$prefix}breadcrumb-height));
+  box-sizing: border-box;
+  visibility: hidden;
+  @include overflow-wrap(break-word);
+  @include blur;
+  @extend .print-d-none;
+
+  [data-header-desktop='normal'] & {
+    --#{$prefix}scroll-mt: #{$global-scroll-margin-top};
+  }
+
+  .toc-title {
+    margin-block: 0 0.5em;
+    cursor: pointer;
+    @include user-select(none);
+
+    &::before {
+      content: '|';
+      font-weight: bolder;
+      margin-right: 0.5em;
+      position: relative;
+      bottom: 2px;
+      color: $global-border-color;
+
+      [data-theme='dark'] & {
+        color: $global-border-color-dark;
+      }
+    }
+
+    i.toc-icon {
+      @include transition(transform 0.2s ease);
+    }
+  }
+
+  &.toc-hidden i.toc-icon {
+    @include transform(rotate(-90deg));
+    @include transition(transform 0.2s ease);
+  }
+
+  .toc-content {
+    overflow-y: scroll;
+    max-height: calc(100vh - #{2*$header-height});
+    
+    &::-webkit-scrollbar {
+      width: 0;
+    }
+
+    &.always-active ul,
+    &.always-active ol {
+      display: block;
+    }
+
+    > nav > ul {
+      margin: 0;
+    }
+
+    li.has-active {
+      &::marker {
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+      }
+
+      &:has(> .active)::marker {
+        font-weight: bold;
+      }
+
+      > a {
+        color: $single-link-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-color-dark;
+        }
+      }
+    }
+
+    // for unordered list automatically collapsed
+    ul {
+      ul {
+        display: none;
+      }
+
+      .has-active > ul {
+        display: block;
+      }
+
+      a.active::before {
+        color: $single-link-hover-color;
+
+        [data-theme='dark'] & {
+          color: $single-link-hover-color-dark;
+        }
+      }
+    }
+
+    // for ordered list automatically collapsed
+    ol {
+      ol {
+        display: none;
+      }
+
+      .has-active > ol {
+        display: block;
+      }
+    }
+
+    a.active {
+      font-weight: bold;
+    }
+  }
+}
+
+#toc-static {
+  display: none;
+  margin: 0.8em 0;
+
+  &[data-kept='true'] {
+    display: block;
+  }
+
+  .toc-title {
+    display: flex;
+    justify-content: space-between;
+    line-height: 2em;
+    padding: 0 0.75em;
+    background: darken($code-background-color, 3%);
+
+    [data-theme='dark'] & {
+      background: darken($code-background-color-dark, 6%);
+    }
+  }
+
+  .toc-content {
+    background-color: $code-background-color;
+
+    > nav {
+      > ul {
+        margin: 0;
+        padding: 0.4em 1em 0.4em 1.8em;
+
+        a:hover {
+          font-weight: bold;
+
+          &::before {
+            color: $single-link-hover-color;
+  
+            [data-theme='dark'] & {
+              color: $single-link-hover-color-dark;
+            }
+          }
+        }
+      }
+      
+      > ol {
+        margin: 0;
+        padding: 0.4em 1em 0.4em 2.25em;
+
+        li:has(> a:hover)::marker,
+        a:hover {
+          font-weight: bold;
+        }
+      }
+    }
+
+    [data-theme='dark'] & {
+      background-color: $code-background-color-dark;
+    }
+  }
+
+  &.open {
+    .toc-title {
+      background: darken($code-background-color, 6%);
+
+      [data-theme='dark'] & {
+        background: darken($code-background-color-dark, 3%);
+      }
+    }
+  }
+}

assets/css/_partials/_widgets.scss

@@ -0,0 +1,6 @@
+@import '_widgets/cookieconsent';
+@import '_widgets/fixed-button';
+@import '_widgets/github-corner';
+@import '_widgets/noscript-warning';
+@import '_widgets/reading-progress';
+@import '_widgets/typeit';

assets/css/_partials/_widgets/_cookieconsent.scss

@@ -7,7 +7,7 @@
       background-color: #ccc;
     }
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       color: $global-font-color;
 
       &:hover,

assets/css/_partials/_widgets/_fixed-button.scss

@@ -1,21 +1,16 @@
-#fixed-buttons {
-  display: none;
-}
-
 .fixed-button {
-  display: none;
-  z-index: 100;
   position: fixed;
   right: 1.5rem;
   font-size: 1rem;
-  line-height: 1.3rem;
-  padding: 0.6rem 0.6rem;
+  line-height: 1.5rem;
+  padding: 0.5rem 0.625rem;
   color: $global-font-secondary-color;
-  background: $header-background-color;
-  @include border-radius(2rem);
+  background-color: $header-background-color;
+  @include z-index(1);
+  @include border-radius(1.25rem);
   @include transition(color 0.4s ease);
-
   @include blur;
+  @extend .print-d-none;
 
   &:hover,
   &:active {
@@ -29,9 +24,9 @@
     outline: none;
   }
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     color: $global-font-secondary-color-dark;
-    background: $header-background-color-dark;
+    background-color: $header-background-color-dark;
 
     &:hover,
     &:active {
@@ -40,11 +35,10 @@
   }
 }
 
-#back-to-top {
-  display: block;
+.back-to-top {
   bottom: 1.5rem;
 }
 
-#view-comments {
+.view-comments {
   bottom: 4.5rem;
 }

assets/css/_partials/_widgets/_github-corner.scss

@@ -0,0 +1,47 @@
+@keyframes octocat-wave {
+  0%,
+  100% {
+    @include transform(rotate(0));
+  }
+  20%,
+  60% {
+    @include transform(rotate(-25deg));
+  }
+  40%,
+  80% {
+    @include transform(rotate(10deg));
+  }
+}
+
+.github-corner {
+  position: fixed;
+  top: 0;
+  @include z-index(2);
+  @extend .print-d-none;
+
+  :hover .octo-arm {
+    animation: octocat-wave 560ms ease-in-out;
+  }
+  svg {
+    width: $header-height;
+    height: $header-height;
+    border: 0;
+    color: $github-corner-color;
+    fill: $github-corner-fill;
+
+    [data-theme='dark'] & {
+      color: $github-corner-color-dark;
+      fill: $github-corner-fill-dark;
+    }
+  }
+  &.left {
+    left: 0;
+
+    svg {
+      @include transform(scale(-1, 1));
+    }
+  }
+  &.right {
+    right: 0;
+  }
+}

assets/css/_partials/_widgets/_noscript-warning.scss

@@ -0,0 +1,16 @@
+.noscript-warning {
+  background-color: var(--#{$prefix}danger);
+  color: white;
+  font-size: 1rem;
+  font-weight: bold;
+  position: fixed;
+  text-align: center;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  @include z-index(2);
+
+  [data-theme='dark'] & {
+    background-color: var(--#{$prefix}danger-dark);
+  }
+}

assets/css/_partials/_widgets/_reading-progress.scss

@@ -0,0 +1,13 @@
+.reading-progress-bar {
+  --progress: 0;
+  height: var(--progress-h, 2px);
+  width: var(--progress);
+  background-color: var(--bg-progress, var(--#{$prefix}info));
+  position: fixed;
+  @include z-index(2);
+  @extend .print-d-none;
+  
+  [data-theme="dark"] & {
+    background-color: var(--bg-progress-dark, var(--#{$prefix}info-dark));
+  }
+}

assets/css/_partials/_widgets/_typeit.scss

@@ -0,0 +1,22 @@
+.typeit {
+  .highlight {
+    padding: 0.375rem;
+    font-size: 0.875rem;
+    font-family: $code-font-family;
+    font-weight: bold;
+    word-break: break-all;
+    white-space: pre-wrap;
+  }
+
+  --ti-cursor-font-family: #{$global-font-family};
+  --ti-cursor-font-size: #{$global-font-size};
+  --ti-cursor-font-style: normal;
+  --ti-cursor-font-weight: #{$global-font-weight};
+  --ti-cursor-line-height: #{$global-line-height};
+  --ti-cursor-color: #{$global-font-color};
+  --ti-cursor-transform: translateX(0);
+
+  [data-theme='dark'] & {
+    --ti-cursor-color: #{$global-font-color-dark};
+  }
+}

assets/css/_shortcodes/_admonition.scss

@@ -2,8 +2,7 @@
   position: relative;
   margin: 1rem 0;
   padding: 0 0.75rem;
-  background-color: map-get($admonition-background-color-map, 'note');
-  border-left: 0.25rem solid map-get($admonition-color-map, 'note');
+  border-left: .25rem solid;
   overflow: auto;
   @include border-radius($global-border-radius);
 
@@ -11,22 +10,16 @@
     font-weight: bold;
     margin: 0 -0.75rem;
     padding: 0.25rem 1.8rem;
-    border-bottom: 1px solid map-get($admonition-background-color-map, 'note');
-    background-color: opacify(map-get($admonition-background-color-map, 'note'), 0.15);
+    border-bottom: 1px solid;
     @include border-radius(0);
   }
 
-  &.open .admonition-title {
-    background-color: map-get($admonition-background-color-map, 'note');
-  }
-
   .admonition-content {
     padding: 0.5rem 0;
   }
 
   i.icon {
     font-size: 0.85rem;
-    color: map-get($admonition-color-map, 'note');
     position: absolute;
     top: 0.6rem;
     left: 0.4rem;
@@ -38,27 +31,42 @@
     right: 0.3rem;
   }
 
-  @each $type, $color in $admonition-color-map {
-    &.#{$type} {
+  @each $type, $color, $background-color in $admonition-color-map {
+    @if $type == 'note' {
+      background-color: $background-color;
       border-left-color: $color;
 
+      .admonition-title {
+        border-bottom-color: $background-color;
+        background-color: opacify($background-color, 0.15);
+      }
+
+      &.open .admonition-title {
+        background-color: $background-color;
+      }
+
       i.icon {
         color: $color;
       }
     }
-  }
+    
+    @else {
+      &.#{$type} {
+        background-color: $background-color;
+        border-left-color: $color;
 
-  @each $type, $color in $admonition-background-color-map {
-    &.#{$type} {
-      background-color: $color;
+        .admonition-title {
+          border-bottom-color: $background-color;
+          background-color: opacify($background-color, 0.15);
+        }
 
-      .admonition-title {
-        border-bottom-color: $color;
-        background-color: opacify($color, 0.15);
-      }
+        &.open .admonition-title {
+          background-color: $background-color;
+        }
 
-      &.open .admonition-title {
-        background-color: $color;
+        i.icon {
+          color: $color;
+        }
       }
     }
   }

assets/css/_shortcodes/_cardlink.scss

@@ -8,7 +8,7 @@
   display: block;
   margin: 0.5rem auto;
   box-sizing: border-box;
-  width: 400px;
+  width: clamp(50%, 400px, 100%);
   max-width: 100%;
   overflow: hidden;
   text-decoration: none;
@@ -23,9 +23,9 @@
     bottom: 0.75rem;
     left: 0;
     right: 0;
-    background-image: url('/images/fixit.svg');
+    background-image: var(--cl-bg-url);
     background-repeat: no-repeat;
-    filter: blur(0.15rem);
+    filter: blur(0.5rem);
     opacity: 0.5;
     background-size: contain;
     background-position: center;
@@ -83,7 +83,7 @@
     margin-left: 0.25rem;
   }
 
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     &content {
       background-color: rgba(61, 62, 65, 0.88);
     }

assets/css/_shortcodes/_center-quote.scss

@@ -4,6 +4,7 @@
   padding: 0;
   position: relative;
   text-align: center;
+  color: initial;
 
   &::after,
   &::before {
@@ -22,7 +23,7 @@
     font-family: 'Font Awesome 5 Free';
     font-weight: 900;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       border-top-color: $global-border-color-dark;
     }
   }
@@ -35,7 +36,7 @@
     font-family: 'Font Awesome 5 Free';
     font-weight: 900;
 
-    [theme='dark'] & {
+    [data-theme='dark'] & {
       border-bottom-color: $global-border-color-dark;
     }
   }

assets/css/_shortcodes/_index.scss

@@ -5,3 +5,4 @@
 @import '_echarts';
 @import '_instagram';
 @import '_mapbox';
+@import '_mermaid';

assets/css/_shortcodes/_instagram.scss

@@ -1,5 +1,5 @@
 iframe.instagram-media {
-  [theme='dark'] & {
+  [data-theme='dark'] & {
     border: none !important;
   }
 }

assets/css/_shortcodes/_mermaid.scss

@@ -0,0 +1,8 @@
+.mermaid {
+  text-align: center;
+
+  svg {
+    max-width: 100%;
+    height: auto; 
+  }
+}

assets/css/_variables.scss

@@ -3,11 +3,17 @@
 // ==============================
 
 // ========== Global ========== //
+// Prefix for :root CSS variables.
+$prefix: fi- !default;
+
 // Font and Line Height
 $global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default;
-$global-font-size: 16px;
-$global-font-weight: 400;
-$global-line-height: 1.5rem;
+$global-font-size: 16px !default;
+$global-font-weight: 400 !default;
+$global-line-height: 1.5rem !default;
+
+// scroll-margin-top of content anchor
+$global-scroll-margin-top: 0.5rem;
 
 // Radius of the border
 $global-border-radius: 5px !default;
@@ -63,15 +69,23 @@ $header-background-color-dark: #252627 !default;
 $header-title-font-family: $global-font-family !default;
 $header-title-font-size: 1.5rem !default;
 
-// Color of the hover header item
-$header-hover-color: #161209 !default;
-$header-hover-color-dark: #fff !default;
+// Color of the active menu item
+$menu-active-color: #161209 !default;
+$menu-active-color-dark: #fff !default;
 
 // Color of the search background
 $search-background-color: #e9e9e9 !default;
 $search-background-color-dark: #363636 !default;
 // ========== Header ========== //
 
+// ========== Tag Cloud ========== //
+// Color range of tag cloud
+$tag-cloud-start: $global-font-secondary-color!default;
+$tag-cloud-end: $global-font-color!default;
+$tag-cloud-start-dark: $global-font-secondary-color-dark!default;
+$tag-cloud-end-dark: $global-font-color-dark!default;
+// ========== Tag Cloud ========== //
+
 // ========== Single Content ========== //
 // Font size of the TOC
 $toc-title-font-size: 1.2rem !default;
@@ -83,7 +97,7 @@ $single-link-color-dark: #1781b5 !default; // 釉蓝
 
 // Color of the hover single link
 $single-link-hover-color: #ea517f !default; // 莲瓣红
-$single-link-hover-color-dark: #619ac3 !default; // 羽扇豆蓝
+$single-link-hover-color-dark: #cc5595 !default; // 龙须红
 
 // Color of the table background
 $table-background-color: #fff !default;
@@ -94,8 +108,15 @@ $table-thead-color: #ededed !default;
 $table-thead-color-dark: #20252b !default;
 
 // Color of the blockquote
-$blockquote-color: #bbc2c8 !default; 
-$blockquote-color-dark: #808992 !default;
+$blockquote-color: #697681 !default;
+$blockquote-color-dark: #9ba3aa !default;
+
+// Color of reward
+$reward-color: tomato !default;
+$reward-color-dark: darken($reward-color, 5%) !default;
+
+// Width of reward image
+$reward-img-width: 180px !default;
 // ========== Single Content ========== //
 
 // ========== Pagination ========== //
@@ -131,249 +152,20 @@ $code-font-size: 0.875rem !default;
 
 // Font family of the code
 $code-font-family: Source Code Pro, Menlo, Consolas, Monaco, monospace, $global-font-family !default;
-
-// Code type map
-$code-type-map: (
-  // Custom code type
-  language-bash: 'Bash',
-  language-c: 'C',
-  language-cs: 'C#',
-  language-cpp: 'C++',
-  language-clojure: 'Clojure',
-  language-coffeescript: 'CoffeeScript',
-  language-css: 'CSS',
-  language-dart: 'Dart',
-  language-diff: 'Diff',
-  language-erlang: 'Erlang',
-  language-go: 'Go',
-  language-go-html-template: 'Go HTML Template',
-  language-groovy: 'Groovy',
-  language-haskell: 'Haskell',
-  language-html: 'HTML',
-  language-http: 'HTTP',
-  language-xml: 'XML',
-  language-java: 'Java',
-  language-js: 'JavaScript',
-  language-javascript: 'JavaScript',
-  language-json: 'JSON',
-  language-kotlin: 'Kotlin',
-  language-latex: 'LaTeX',
-  language-less: 'Less',
-  language-lisp: 'Lisp',
-  language-lua: 'Lua',
-  language-makefile: 'Makefile',
-  language-markdown: 'Markdown',
-  language-matlab: 'Matlab',
-  language-objectivec: 'Objective-C',
-  language-php: 'PHP',
-  language-perl: 'Perl',
-  language-python: 'Python',
-  language-r: 'R',
-  language-ruby: 'Ruby',
-  language-rust: 'Rust',
-  language-scala: 'Scala',
-  language-scss: 'Scss',
-  language-shell: 'Shell',
-  language-sql: 'SQL',
-  language-swift: 'Swift',
-  language-tex: 'TeX',
-  language-toml: 'TOML',
-  language-ts: 'TypeScript',
-  language-typescript: 'TypeScript',
-  language-vue: 'Vue',
-  language-yml: 'YAML',
-  language-yaml: 'YAML'
-) !default;
-
-// Color map of the code highlight
-$code-highlight-color-map: (
-  /* Error */ 'err': $code-error-color,
-  /* Keyword */ 'k': #cf222e,
-  /* KeywordConstant */ 'kc': #0550ae,
-  /* KeywordDeclaration */ 'kd': #cf222e,
-  /* KeywordNamespace */ 'kn': #cf222e,
-  /* KeywordPseudo */ 'kp': #cf222e,
-  /* KeywordReserved */ 'kr': #cf222e,
-  /* KeywordType */ 'kt': #cf222e,
-  /* Name */ 'n': $code-color,
-  /* NameAttribute */ 'na': #0550ae,
-  /* NameBuiltin */ 'nb': #0550ae,
-  /* NameBuiltinPseudo */ 'bp': $code-color,
-  /* NameClass */ 'nc': #8250df,
-  /* NameConstant */ 'no': #cf222e,
-  /* NameDecorator */ 'nd': #8250df,
-  /* NameEntity */ 'ni': #0550ae,
-  /* NameException */ 'ne': #0550ae,
-  /* NameFunction */ 'nf': #0550ae,
-  /* NameFunctionMagic */ 'fm': #0550ae,
-  /* NameLabel */ 'nl': #0550ae,
-  /* NameNamespace */ 'nn': #8250df,
-  /* NameOther */ 'nx': #0550ae,
-  /* NameProperty */ 'py': #0550ae,
-  /* NameTag */ 'nt': #116329,
-  /* NameVariable */ 'nv': #953800,
-  /* NameVariableClass */ 'vc': #0550ae,
-  /* NameVariableGlobal */ 'vg': #0550ae,
-  /* NameVariableInstance */ 'vi': #0550ae,
-  /* NameVariableMagic */ 'vm': #0550ae,
-  /* Literal */ 'l': #0550ae,
-  /* LiteralDate */ 'ld': #0a3069,
-  /* LiteralString */ 's': #0a3069,
-  /* LiteralStringAffix */ 'sa': #0a3069,
-  /* LiteralStringBacktick */ 'sb': #0a3069,
-  /* LiteralStringChar */ 'sc': #0a3069,
-  /* LiteralStringDelimiter */ 'dl': #0a3069,
-  /* LiteralStringDoc */ 'sd': #0a3069,
-  /* LiteralStringDouble */ 's2': #0a3069,
-  /* LiteralStringEscape */ 'se': #0a3069,
-  /* LiteralStringHeredoc */ 'sh': #0a3069,
-  /* LiteralStringInterpol */ 'si': #0a3069,
-  /* LiteralStringOther */ 'sx': #0a3069,
-  /* LiteralStringRegex */ 'sr': #0a3069,
-  /* LiteralStringSingle */ 's1': #0a3069,
-  /* LiteralStringSymbol */ 'ss': #0a3069,
-  /* LiteralNumber */ 'm': #0550ae,
-  /* LiteralNumberBin */ 'mb': #0550ae,
-  /* LiteralNumberFloat */ 'mf': #0550ae,
-  /* LiteralNumberHex */ 'mh': #0550ae,
-  /* LiteralNumberInteger */ 'mi': #0550ae,
-  /* LiteralNumberIntegerLong */ 'il': #0550ae,
-  /* LiteralNumberOct */ 'mo': #0550ae,
-  /* Operator */ 'o': #cf222e,
-  /* OperatorWord */ 'ow': #cf222e,
-  /* Punctuation */ 'p': $code-color,
-  /* Comment */ 'c': #6e7781,
-  /* CommentHashbang */ 'ch': #6e7781,
-  /* CommentMultiline */ 'cm': #6e7781,
-  /* CommentSingle */ 'c1': #6e7781,
-  /* CommentSpecial */ 'cs': #6e7781,
-  /* CommentPreproc */ 'cp': #0550ae,
-  /* CommentPreprocFile */ 'cpf': #6e7781,
-  /* Generic */ 'g': $code-color,
-  /* GenericDeleted */ 'gd': #82071e,
-  /* GenericEmph */ 'ge': $code-color,
-  /* GenericError */ 'gr': $code-error-color,
-  /* GenericHeading */ 'gh': $code-color,
-  /* GenericInserted */ 'gi': #116329,
-  /* GenericOutput */ 'go': $code-color,
-  /* GenericPrompt */ 'gp': $code-color,
-  /* GenericStrong */ 'gs': $code-color,
-  /* GenericSubheading */ 'gu': $code-color,
-  /* GenericTraceback */ 'gt': $code-error-color,
-  /* GenericUnderline */ 'gl': $code-color,
-  /* TextWhitespace */ 'w': $code-color,
-  /* Other */ 'x': $code-color
-) !default;
-$code-highlight-color-map-dark: (
-  /* Error */ 'err': $code-error-color,
-  /* Keyword */ 'k': #f47067,
-  /* KeywordConstant */ 'kc': #6cb6ff,
-  /* KeywordDeclaration */ 'kd': #f47067,
-  /* KeywordNamespace */ 'kn': #f47067,
-  /* KeywordPseudo */ 'kp': #f47067,
-  /* KeywordReserved */ 'kr': #f47067,
-  /* KeywordType */ 'kt': #f47067,
-  /* Name */ 'n': $code-color-dark,
-  /* NameAttribute */ 'na': #6cb6ff,
-  /* NameBuiltin */ 'nb': #dcbdfb,
-  /* NameBuiltinPseudo */ 'bp': $code-color-dark,
-  /* NameClass */ 'nc': #dcbdfb,
-  /* NameConstant */ 'no': #6cb6ff,
-  /* NameDecorator */ 'nd': #dcbdfb,
-  /* NameEntity */ 'ni': #6cb6ff,
-  /* NameException */ 'ne': #6cb6ff,
-  /* NameFunction */ 'nf': #dcbdfb,
-  /* NameFunctionMagic */ 'fm': #6cb6ff,
-  /* NameLabel */ 'nl': #6cb6ff,
-  /* NameNamespace */ 'nn': #f47067,
-  /* NameOther */ 'nx': #dcbdfb,
-  /* NameProperty */ 'py': #6cb6ff,
-  /* NameTag */ 'nt': #8ddb8c,
-  /* NameVariable */ 'nv': #f69d50,
-  /* NameVariableClass */ 'vc': #6cb6ff,
-  /* NameVariableGlobal */ 'vg': #6cb6ff,
-  /* NameVariableInstance */ 'vi': #6cb6ff,
-  /* NameVariableMagic */ 'vm': #6cb6ff,
-  /* Literal */ 'l': #6cb6ff,
-  /* LiteralDate */ 'ld': #96d0ff,
-  /* LiteralString */ 's': #96d0ff,
-  /* LiteralStringAffix */ 'sa': #96d0ff,
-  /* LiteralStringBacktick */ 'sb': #96d0ff,
-  /* LiteralStringChar */ 'sc': #96d0ff,
-  /* LiteralStringDelimiter */ 'dl': #96d0ff,
-  /* LiteralStringDoc */ 'sd': #96d0ff,
-  /* LiteralStringDouble */ 's2': #96d0ff,
-  /* LiteralStringEscape */ 'se': #96d0ff,
-  /* LiteralStringHeredoc */ 'sh': #96d0ff,
-  /* LiteralStringInterpol */ 'si': #96d0ff,
-  /* LiteralStringOther */ 'sx': #96d0ff,
-  /* LiteralStringRegex */ 'sr': #96d0ff,
-  /* LiteralStringSingle */ 's1': #96d0ff,
-  /* LiteralStringSymbol */ 'ss': #96d0ff,
-  /* LiteralNumber */ 'm': #6cb6ff,
-  /* LiteralNumberBin */ 'mb': #6cb6ff,
-  /* LiteralNumberFloat */ 'mf': #6cb6ff,
-  /* LiteralNumberHex */ 'mh': #6cb6ff,
-  /* LiteralNumberInteger */ 'mi': #6cb6ff,
-  /* LiteralNumberIntegerLong */ 'il': #6cb6ff,
-  /* LiteralNumberOct */ 'mo': #6cb6ff,
-  /* Operator */ 'o': #f47067,
-  /* OperatorWord */ 'ow': #f47067,
-  /* Punctuation */ 'p': $code-color-dark,
-  /* Comment */ 'c': #768390,
-  /* CommentHashbang */ 'ch': #768390,
-  /* CommentMultiline */ 'cm': #768390,
-  /* CommentSingle */ 'c1': #768390,
-  /* CommentSpecial */ 'cs': #768390,
-  /* CommentPreproc */ 'cp': #6cb6ff,
-  /* CommentPreprocFile */ 'cpf': #768390,
-  /* Generic */ 'g': $code-color-dark,
-  /* GenericDeleted */ 'gd': #ffd8d3,
-  /* GenericEmph */ 'ge': $code-color-dark,
-  /* GenericError */ 'gr': $code-error-color,
-  /* GenericHeading */ 'gh': $code-color-dark,
-  /* GenericInserted */ 'gi': #b4f1b4,
-  /* GenericOutput */ 'go': $code-color-dark,
-  /* GenericPrompt */ 'gp': $code-color-dark,
-  /* GenericStrong */ 'gs': $code-color-dark,
-  /* GenericSubheading */ 'gu': $code-color-dark,
-  /* GenericTraceback */ 'gt': $code-error-color,
-  /* GenericUnderline */ 'gl': $code-color-dark,
-  /* TextWhitespace */ 'w': $code-color-dark,
-  /* Other */ 'x': $code-color-dark
-) !default;
 // ========== Code ========== //
 
-// ========== Admonition ========== //
-// Color map of the admonition
-$admonition-color-map: (
-  'note': #448aff,
-  'abstract': #00b0ff,
-  'info': #00b8d4,
-  'tip': #00bfa5,
-  'success': #00c853,
-  'question': #64dd17,
-  'warning': #ff9100,
-  'failure': #ff5252,
-  'danger': #ff1744,
-  'bug': #f50057,
-  'example': #651fff,
-  'quote': #9e9e9e
-) !default;
+// ========== GitHub Corners ========== //
+// Color of the GitHub Corners
+$github-corner-color: white !default;
+$github-corner-color-dark: black !default;
 
-// Color map of the admonition background
-$admonition-background-color-map: (
-  'note': rgba(68, 138, 255, 0.1),
-  'abstract': rgba(0, 176, 255, 0.1),
-  'info': rgba(0, 184, 212, 0.1),
-  'tip': rgba(0, 191, 165, 0.1),
-  'success': rgba(0, 200, 83, 0.1),
-  'question': rgba(100, 221, 23, 0.1),
-  'warning': rgba(255, 145, 0, 0.1),
-  'failure': rgba(255, 82, 82, 0.1),
-  'danger': rgba(255, 23, 68, 0.1),
-  'bug': rgba(245, 0, 87, 0.1),
-  'example': rgba(101, 31, 255, 0.1),
-  'quote': rgba(159, 159, 159, 0.1)
-) !default;
-// ========== Admonition ========== //
+// Color of the GitHub Corners background
+$github-corner-fill: $header-background-color-dark !default;
+$github-corner-fill-dark: $header-background-color !default;
+// ========== GitHub Corners ========== //
+
+@import '_partials/_maps/admonition';
+@import '_partials/_maps/code-highlight';
+@import '_partials/_maps/code-type';
+@import '_partials/_maps/colors';
+@import '_partials/_maps/utilities';

assets/css/style.scss

@@ -2,18 +2,12 @@
 
 @import "_variables";
 @import "_override";
-
 @import "_mixin/index";
-
+@import "_core/root";
 @import "_core/base";
 @import "_core/layout";
-
-@import "_page/index";
-
-@import "_partial/header";
-@import "_partial/footer";
-@import "_partial/pagination";
-
+@import "_core/common";
+@import "_core/patch";
+@import "_page";
 @import "_core/media";
-
 @import "_custom";

assets/data/cdn/jsdelivr.yml

@@ -1,73 +1,86 @@
+# Tips: remove sourceMappingURL of local libraries to avoid source map 404 error.
+# See https://github.com/hugo-fixit/FixIt/issues/67
+
 prefix:
   libFiles: https://cdn.jsdelivr.net/npm/
-  # simple-icons@6.3.0 https://github.com/simple-icons/simple-icons
-  simpleIcons: https://cdn.jsdelivr.net/npm/simple-icons@6.3.0/icons/
+  # simple-icons@9.19.0 https://github.com/simple-icons/simple-icons
+  simpleIcons: https://cdn.jsdelivr.net/npm/simple-icons@9.19.0/icons/
 libFiles:
-  # algoliasearch@4.11.0 https://github.com/algolia/algoliasearch-client-javascript
-  algoliasearchJS: algoliasearch@4.11.0/dist/algoliasearch-lite.umd.min.js
+  # algoliasearch@4.20.0 https://github.com/algolia/algoliasearch-client-javascript
+  algoliasearchJS: algoliasearch@4.20.0/dist/algoliasearch-lite.umd.min.js
   # animate.css@4.1.1 https://github.com/daneden/animate.css
   animateCSS: animate.css@4.1.1/animate.min.css
   # aplayer@1.10.1 https://github.com/MoePlayer/APlayer
   aplayerCSS: aplayer@1.10.1/dist/APlayer.min.css
   aplayerJS: aplayer@1.10.1/dist/APlayer.min.js
-  # artalk@2.1.4 https://github.com/ArtalkJS/Artalk
-  artalkCSS: artalk@2.1.4/dist/Artalk.min.css
-  artalkJS: artalk@2.1.4/dist/Artalk.min.js
-  # autocomplete.js@0.38.1 https://github.com/algolia/autocomplete.js
+  # artalk@2.6.4 https://github.com/ArtalkJS/Artalk
+  artalkCSS: artalk@2.6.4/dist/Artalk.css
+  artalkJS: artalk@2.6.4/dist/Artalk.js
+  # autocomplete-js@0.38.1 https://github.com/algolia/autocomplete
+  # TODO update autocompleteJS: '@algolia/autocomplete-js@1.7.1/dist/umd/index.production.js'
   autocompleteJS: autocomplete.js@0.38.1/dist/autocomplete.min.js
   # cell-watermark@1.0.3 https://github.com/Lruihao/watermark
   cellWatermarkJS: cell-watermark@1.0.3/src/watermark.min.js
-  # clipboard.js@2.0.8 https://github.com/zenorocha/clipboard.js
-  clipboardJS: clipboard@2.0.8/dist/clipboard.min.js
   # cookieconsent@3.1.1 https://github.com/osano/cookieconsent
   cookieconsentCSS: cookieconsent@3.1.1/build/cookieconsent.min.css
   cookieconsentJS: cookieconsent@3.1.1/build/cookieconsent.min.js
-  # echarts@5.2.2 https://github.com/apache/echarts
-  echartsJS: echarts@5.2.2/dist/echarts.min.js
-  echartsMacaronsJS: echarts@5.2.2/theme/macarons.min.js
-  # fontawesome-free@5.14.0 https://github.com/FortAwesome/Font-Awesome
-  fontawesomeFreeCSS: '@fortawesome/fontawesome-free@5.14.0/css/all.min.css'
+  # crypto-js@4.1.1 https://github.com/brix/crypto-js
+  cryptoCoreJS: crypto-js@4.1.1/core.js
+  cryptoEncBase64JS: crypto-js@4.1.1/enc-base64.js
+  cryptoMd5JS: crypto-js@4.1.1/md5.js
+  cryptoSha256JS: crypto-js@4.1.1/sha256.js
+  # echarts@5.3.3 https://github.com/apache/echarts
+  echartsJS: echarts@5.3.3/dist/echarts.min.js
+  # eruda@3.0.1 https://github.com/liriliri/eruda
+  erudaJS: eruda@3.0.1/eruda.js
+  # fontawesome-free@6.4.2 https://github.com/FortAwesome/Font-Awesome
+  fontawesomeFreeCSS: '@fortawesome/fontawesome-free@6.4.2/css/all.min.css'
+  # fusejs@6.6.2 https://github.com/krisk/fuse
+  fuseJS: fuse.js@6.6.2/dist/fuse.min.js
   # gitalk@1.7.2 https://github.com/gitalk/gitalk
   gitalkCSS: gitalk@1.7.2/dist/gitalk.min.css
   gitalkJS: gitalk@1.7.2/dist/gitalk.min.js
-  # katex@0.15.1 https://github.com/KaTeX/KaTeX
-  katexAutoRenderJS: katex@0.15.1/dist/contrib/auto-render.min.js
-  katexCopyTexCSS: katex@0.15.1/dist/contrib/copy-tex.min.css
-  katexCopyTexJS: katex@0.15.1/dist/contrib/copy-tex.min.js
-  katexCSS: katex@0.15.1/dist/katex.min.css
-  katexJS: katex@0.15.1/dist/katex.min.js
-  katexMhchemJS: katex@0.15.1/dist/contrib/mhchem.min.js
-  # lazysizes@5.3.2 https://github.com/aFarkas/lazysizes
-  lazysizesJS: lazysizes@5.3.2/lazysizes.min.js
-   # lightgallery.js@1.4.0 https://github.com/sachinchoolur/lightgallery.js
-  # lg-thumbnail.js@1.4.0 https://github.com/sachinchoolur/lg-thumbnail.js
-  # lg-zoom.js@1.3.0 https://github.com/sachinchoolur/lg-zoom.js
-  lightgalleryCSS: lightgallery.js@1.4.0/dist/css/lightgallery.min.css
-  lightgalleryJS: lightgallery.js@1.4.0/dist/js/lightgallery.min.js
-  lightgalleryThumbnailJS: lg-thumbnail.js@1.2.0/dist/lg-thumbnail.min.js
-  lightgalleryZoomJS: lg-zoom.js@1.3.0/dist/lg-zoom.min.js
-  # lunr.js@2.3.9 https://github.com/olivernn/lunr.js
-  lunrJS: lunr@2.3.9/lunr.min.js
-  # mapbox-gl@1.10.1 https://docs.mapbox.com/mapbox-gl-js
-  mapboxGLCSS: mapbox-gl@1.10.1/dist/mapbox-gl.min.css
-  mapboxGLJS: mapbox-gl@1.10.1/dist/mapbox-gl.min.js
-  # mermaid@8.5.1 https://github.com/knsv/mermaid
-  mermaidJS: mermaid@8.5.1/dist/mermaid.min.js
+  # instant.page@5.2.0 https://github.com/instantpage/instant.page
+  instantPage: instant.page@5.2.0/instantpage.min.js
+  # katex@0.16.9 https://github.com/KaTeX/KaTeX
+  katexAutoRenderJS: katex@0.16.9/dist/contrib/auto-render.min.js
+  katexCopyTexJS: katex@0.16.9/dist/contrib/copy-tex.min.js
+  katexCSS: katex@0.16.9/dist/katex.min.css
+  katexJS: katex@0.16.9/dist/katex.min.js
+  katexMhchemJS: katex@0.16.9/dist/contrib/mhchem.min.js
+  # lightgallery@2.7.2 https://github.com/sachinchoolur/lightgallery
+  lightgalleryCSS: lightgallery@2.7.2/css/lightgallery-bundle.min.css
+  lightgalleryJS: lightgallery@2.7.2/lightgallery.min.js
+  lightgalleryThumbnailJS: lightgallery@2.7.2/plugins/thumbnail/lg-thumbnail.min.js
+  lightgalleryZoomJS: lightgallery@2.7.2/plugins/zoom/lg-zoom.min.js
+  # mapbox-gl@2.10.0 https://docs.mapbox.com/mapbox-gl-js
+  # TODO update to 3.x
+  mapboxGLCSS: mapbox-gl@2.10.0/dist/mapbox-gl.css
+  mapboxGLJS: mapbox-gl@2.10.0/dist/mapbox-gl.js
+  # mermaid@9.4.3 https://github.com/mermaid-js/mermaid
+  # TODO bump Mermaid from 9.x to 10.x
+  mermaidJS: mermaid@9.4.3/dist/mermaid.min.js
   # meting@2.0.1 https://github.com/metowolf/MetingJS
   metingJS: meting@2.0.1/dist/Meting.min.js
-  # normalize.css@8.0.1 https://github.com/necolas/normalize.css
-  normalizeCSS: normalize.css@8.0.1/normalize.min.css
   # object-fit-images@3.2.4 https://github.com/fregante/object-fit-images
   objectFitImagesJS: object-fit-images@3.2.4/dist/ofi.min.js
   # pangu.js@4.0.7 https://github.com/vinta/pangu.js
   panguJS: pangu@4.0.7/dist/browser/pangu.min.js
-  # sharer.js@0.4.2 https://github.com/ellisonleao/sharer.js
-  sharerJS: sharer.js@0.4.2/sharer.min.js
-  # twemoji@13.1.0 https://github.com/twitter/twemoji
-  twemojiJS: twemoji@13.0.0/dist/twemoji.min.js
-  # typeit@7.0.4 https://github.com/alexmacarthur/typeit
-  typeitJS: typeit@7.0.4/dist/typeit.min.js
-  # valine@1.4.16 https://github.com/xCss/Valine
-  valineJS: valine@1.4.16/dist/Valine.min.js
-  # waline@1.5.2 https://github.com/walinejs/waline
-  walineJS: "@waline/client@1.5.2/dist/Waline.min.js"
+  # pace-js@1.2.4 https://github.com/CodeByZach/pace
+  paceJS: pace-js@1.2.4
+  # sharer.js@0.5.1 https://github.com/ellisonleao/sharer.js
+  sharerJS: sharer.js@0.5.1/sharer.min.js
+  # twemoji@14.0.2 https://github.com/twitter/twemoji
+  twemojiJS: twemoji@14.0.2/dist/twemoji.min.js
+  # twikoo@1.6.22 https://github.com/imaegoo/twikoo
+  twikooJS: twikoo@1.6.22/dist/twikoo.all.min.js
+  # typeit@8.7.1 https://github.com/alexmacarthur/typeit
+  typeitJS: typeit@8.7.1/dist/index.umd.js
+  # valine@1.5.1 https://github.com/xCss/Valine
+  valineJS: valine@1.5.1/dist/Valine.min.js
+  # vconsole@3.15.1 https://github.com/Tencent/vConsole
+  vconsoleJS: vconsole@3.15.1/dist/vconsole.min.js
+  # waline@2.15.8 https://github.com/walinejs/waline
+  walineCSS: '@waline/client@2.15.8/dist/waline.css'
+  walineJS: '@waline/client@2.15.8/dist/waline.js'
+  

assets/data/cdn/unpkg.yml

@@ -0,0 +1,86 @@
+# Tips: remove sourceMappingURL of local libraries to avoid source map 404 error.
+# See https://github.com/hugo-fixit/FixIt/issues/67
+
+prefix:
+  libFiles: https://unpkg.com/
+  # simple-icons@9.19.0 https://github.com/simple-icons/simple-icons
+  simpleIcons: https://unpkg.com/simple-icons@9.19.0/icons/
+libFiles:
+  # algoliasearch@4.20.0 https://github.com/algolia/algoliasearch-client-javascript
+  algoliasearchJS: algoliasearch@4.20.0/dist/algoliasearch-lite.umd.js
+  # animate.css@4.1.1 https://github.com/daneden/animate.css
+  animateCSS: animate.css@4.1.1/animate.min.css
+  # aplayer@1.10.1 https://github.com/MoePlayer/APlayer
+  aplayerCSS: aplayer@1.10.1/dist/APlayer.min.css
+  aplayerJS: aplayer@1.10.1/dist/APlayer.min.js
+  # artalk@2.6.4 https://github.com/ArtalkJS/Artalk
+  artalkCSS: artalk@2.6.4/dist/Artalk.css
+  artalkJS: artalk@2.6.4/dist/Artalk.js
+  # autocomplete-js@0.38.1 https://github.com/algolia/autocomplete
+  # TODO update autocompleteJS: '@algolia/autocomplete-js@1.7.1/dist/umd/index.production.js'
+  autocompleteJS: autocomplete.js@0.38.1/dist/autocomplete.min.js
+  # cell-watermark@1.0.3 https://github.com/Lruihao/watermark
+  cellWatermarkJS: cell-watermark@1.0.3/src/watermark.min.js
+  # cookieconsent@3.1.1 https://github.com/osano/cookieconsent
+  cookieconsentCSS: cookieconsent@3.1.1/build/cookieconsent.min.css
+  cookieconsentJS: cookieconsent@3.1.1/build/cookieconsent.min.js
+  # crypto-js@4.1.1 https://github.com/brix/crypto-js
+  cryptoCoreJS: crypto-js@4.1.1/core.js
+  cryptoEncBase64JS: crypto-js@4.1.1/enc-base64.js
+  cryptoMd5JS: crypto-js@4.1.1/md5.js
+  cryptoSha256JS: crypto-js@4.1.1/sha256.js
+  # echarts@5.3.3 https://github.com/apache/echarts
+  echartsJS: echarts@5.3.3/dist/echarts.min.js
+  # eruda@3.0.1 https://github.com/liriliri/eruda
+  erudaJS: eruda@3.0.1/eruda.js
+  # fontawesome-free@6.4.2 https://github.com/FortAwesome/Font-Awesome
+  fontawesomeFreeCSS: '@fortawesome/fontawesome-free@6.4.2/css/all.min.css'
+  # fusejs@6.6.2 https://github.com/krisk/fuse
+  fuseJS: fuse.js@6.6.2/dist/fuse.min.js
+  # gitalk@1.7.2 https://github.com/gitalk/gitalk
+  gitalkCSS: gitalk@1.7.2/dist/gitalk.min.css
+  gitalkJS: gitalk@1.7.2/dist/gitalk.min.js
+  # instant.page@5.2.0 https://github.com/instantpage/instant.page
+  instantPage: instant.page@5.2.0/instantpage.js
+  # katex@0.16.9 https://github.com/KaTeX/KaTeX
+  katexAutoRenderJS: katex@0.16.9/dist/contrib/auto-render.min.js
+  katexCopyTexJS: katex@0.16.9/dist/contrib/copy-tex.min.js
+  katexCSS: katex@0.16.9/dist/katex.min.css
+  katexJS: katex@0.16.9/dist/katex.min.js
+  katexMhchemJS: katex@0.16.9/dist/contrib/mhchem.min.js
+  # lightgallery@2.7.2 https://github.com/sachinchoolur/lightgallery
+  lightgalleryCSS: lightgallery@2.7.2/css/lightgallery-bundle.min.css
+  lightgalleryJS: lightgallery@2.7.2/lightgallery.min.js
+  lightgalleryThumbnailJS: lightgallery@2.7.2/plugins/thumbnail/lg-thumbnail.min.js
+  lightgalleryZoomJS: lightgallery@2.7.2/plugins/zoom/lg-zoom.min.js
+  # mapbox-gl@2.10.0 https://docs.mapbox.com/mapbox-gl-js
+  # TODO update to 3.x
+  mapboxGLCSS: mapbox-gl@2.10.0/dist/mapbox-gl.css
+  mapboxGLJS: mapbox-gl@2.10.0/dist/mapbox-gl.js
+  # mermaid@9.4.3 https://github.com/mermaid-js/mermaid
+  # TODO bump Mermaid from 9.x to 10.x
+  mermaidJS: mermaid@9.4.3/dist/mermaid.min.js
+  # meting@2.0.1 https://github.com/metowolf/MetingJS
+  metingJS: meting@2.0.1/dist/Meting.min.js
+  # object-fit-images@3.2.4 https://github.com/fregante/object-fit-images
+  objectFitImagesJS: object-fit-images@3.2.4/dist/ofi.min.js
+  # pangu.js@4.0.7 https://github.com/vinta/pangu.js
+  panguJS: pangu@4.0.7/dist/browser/pangu.min.js
+  # pace-js@1.2.4 https://github.com/CodeByZach/pace
+  paceJS: pace-js@1.2.4
+  # sharer.js@0.5.1 https://github.com/ellisonleao/sharer.js
+  sharerJS: sharer.js@0.5.1/sharer.min.js
+  # twemoji@14.0.2 https://github.com/twitter/twemoji
+  twemojiJS: twemoji@14.0.2/dist/twemoji.min.js
+  # twikoo@1.6.22 https://github.com/imaegoo/twikoo
+  twikooJS: twikoo@1.6.22/dist/twikoo.all.min.js
+  # typeit@8.7.1 https://github.com/alexmacarthur/typeit
+  typeitJS: typeit@8.7.1/dist/index.umd.js
+  # valine@1.5.1 https://github.com/xCss/Valine
+  valineJS: valine@1.5.1/dist/Valine.min.js
+  # vconsole@3.15.1 https://github.com/Tencent/vConsole
+  vconsoleJS: vconsole@3.15.1/dist/vconsole.min.js
+  # waline@2.15.8 https://github.com/walinejs/waline
+  walineCSS: '@waline/client@2.15.8/dist/waline.css'
+  walineJS: '@waline/client@2.15.8/dist/waline.js'
+  

assets/data/social.yml

@@ -4,7 +4,7 @@ github:
   Prefix: https://github.com/
   Title: GitHub
   Icon:
-    Class: fab fa-github-alt fa-fw
+    Class: fa-brands fa-github-alt fa-fw
 
 # 002: LinkedIn
 linkedin:
@@ -12,7 +12,7 @@ linkedin:
   Prefix: https://linkedin.com/in/
   Title: LinkedIn
   Icon:
-    Class: fab fa-linkedin fa-fw
+    Class: fa-brands fa-linkedin fa-fw
 
 # 003: Twitter
 twitter:
@@ -20,7 +20,7 @@ twitter:
   Prefix: https://twitter.com/
   Title: Twitter
   Icon:
-    Class: fab fa-twitter fa-fw
+    Class: fa-brands fa-twitter fa-fw
 
 # 004: Instagram
 instagram:
@@ -28,7 +28,7 @@ instagram:
   Prefix: https://www.instagram.com/
   Title: Instagram
   Icon:
-    Class: fab fa-instagram fa-fw
+    Class: fa-brands fa-instagram fa-fw
 
 # 005: facebook
 facebook:
@@ -36,7 +36,7 @@ facebook:
   Prefix: https://facebook.com/
   Title: facebook
   Icon:
-    Class: fab fa-facebook fa-fw
+    Class: fa-brands fa-facebook fa-fw
 
 # 006: Telegram
 telegram:
@@ -44,7 +44,7 @@ telegram:
   Prefix: https://t.me/
   Title: Telegram
   Icon:
-    Class: fab fa-telegram-plane fa-fw
+    Class: fa-brands fa-telegram-plane fa-fw
 
 # 007: Medium
 medium:
@@ -52,7 +52,7 @@ medium:
   Prefix: https://medium.com/
   Title: Medium
   Icon:
-    Class: fab fa-medium fa-fw
+    Class: fa-brands fa-medium fa-fw
 
 # 008: GitLab
 gitlab:
@@ -60,7 +60,7 @@ gitlab:
   Prefix: https://gitlab.com/
   Title: GitLab
   Icon:
-    Class: fab fa-gitlab fa-fw
+    Class: fa-brands fa-gitlab fa-fw
 
 # 009: YouTube Legacy
 youtubelegacy:
@@ -68,7 +68,7 @@ youtubelegacy:
   Prefix: https://www.youtube.com/user/
   Title: YouTube
   Icon:
-    Class: fab fa-youtube fa-fw
+    Class: fa-brands fa-youtube fa-fw
 
 # 010: YouTube Custom
 youtubecustom:
@@ -76,7 +76,7 @@ youtubecustom:
   Prefix: https://www.youtube.com/c/
   Title: YouTube
   Icon:
-    Class: fab fa-youtube fa-fw
+    Class: fa-brands fa-youtube fa-fw
 
 # 011: YouTube Channel
 youtubechannel:
@@ -84,7 +84,7 @@ youtubechannel:
   Prefix: https://www.youtube.com/channel/
   Title: YouTube
   Icon:
-    Class: fab fa-youtube fa-fw
+    Class: fa-brands fa-youtube fa-fw
 
 # 012: Tumblr
 tumblr:
@@ -92,7 +92,7 @@ tumblr:
   Template: https://%v.tumblr.com/
   Title: Tumblr
   Icon:
-    Class: fab fa-tumblr fa-fw
+    Class: fa-brands fa-tumblr fa-fw
 
 # 013: Quora
 quora:
@@ -100,7 +100,7 @@ quora:
   Prefix: https://www.quora.com/profile/
   Title: Quora
   Icon:
-    Class: fab fa-quora fa-fw
+    Class: fa-brands fa-quora fa-fw
 
 # 014: Keybase
 keybase:
@@ -108,7 +108,7 @@ keybase:
   Prefix: https://keybase.io/
   Title: Keybase
   Icon:
-    Class: fab fa-keybase fa-fw
+    Class: fa-brands fa-keybase fa-fw
 
 # 015: Pinterest
 pinterest:
@@ -116,7 +116,7 @@ pinterest:
   Prefix: https://www.pinterest.com/
   Title: Pinterest
   Icon:
-    Class: fab fa-pinterest fa-fw
+    Class: fa-brands fa-pinterest fa-fw
 
 # 016: Reddit
 reddit:
@@ -124,7 +124,7 @@ reddit:
   Prefix: https://www.reddit.com/user/
   Title: Reddit
   Icon:
-    Class: fab fa-reddit fa-fw
+    Class: fa-brands fa-reddit fa-fw
 
 # 017: CodePen
 codepen:
@@ -132,7 +132,7 @@ codepen:
   Prefix: https://codepen.io/
   Title: CodePen
   Icon:
-    Class: fab fa-codepen fa-fw
+    Class: fa-brands fa-codepen fa-fw
 
 # 018: freeCodeCamp
 freecodecamp:
@@ -140,7 +140,7 @@ freecodecamp:
   Prefix: https://freecodecamp.org/
   Title: freeCodeCamp
   Icon:
-    Class: fab fa-free-code-camp fa-fw
+    Class: fa-brands fa-free-code-camp fa-fw
 
 # 019: Bitbucket
 bitbucket:
@@ -148,7 +148,7 @@ bitbucket:
   Prefix: https://bitbucket.org/
   Title: Bitbucket
   Icon:
-    Class: fab fa-bitbucket fa-fw
+    Class: fa-brands fa-bitbucket fa-fw
 
 # 020: Stack Overflow
 stackoverflow:
@@ -156,7 +156,7 @@ stackoverflow:
   Prefix: https://stackoverflow.com/users/
   Title: Stack Overflow
   Icon:
-    Class: fab fa-codepen fa-fw
+    Class: fa-brands fa-stack-overflow fa-fw
 
 # 021: 微博
 weibo:
@@ -164,7 +164,7 @@ weibo:
   Prefix: https://weibo.com/
   Title: 微博
   Icon:
-    Class: fab fa-weibo fa-fw
+    Class: fa-brands fa-weibo fa-fw
 
 # 022: OK.RU
 odnoklassniki:
@@ -172,7 +172,7 @@ odnoklassniki:
   Prefix: https://ok.ru/
   Title: OK.RU
   Icon:
-    Class: fab fa-odnoklassniki fa-fw
+    Class: fa-brands fa-odnoklassniki fa-fw
 
 # 023: VK
 vk:
@@ -180,7 +180,7 @@ vk:
   Prefix: https://vk.com/
   Title: VK
   Icon:
-    Class: fab fa-vk fa-fw
+    Class: fa-brands fa-vk fa-fw
 
 # 024: Flickr
 flickr:
@@ -188,7 +188,7 @@ flickr:
   Prefix: https://www.flickr.com/photos/
   Title: Flickr
   Icon:
-    Class: fab fa-flickr fa-fw
+    Class: fa-brands fa-flickr fa-fw
 
 # 025: Xing
 xing:
@@ -196,7 +196,7 @@ xing:
   Prefix: https://www.xing.com/profile/
   Title: Xing
   Icon:
-    Class: fab fa-xing fa-fw
+    Class: fa-brands fa-xing fa-fw
 
 # 026: Snapchat
 snapchat:
@@ -204,7 +204,7 @@ snapchat:
   Prefix: https://www.snapchat.com/add/
   Title: Snapchat
   Icon:
-    Class: fab fa-snapchat fa-fw
+    Class: fa-brands fa-snapchat fa-fw
 
 # 027: SoundCloud
 soundcloud:
@@ -212,7 +212,7 @@ soundcloud:
   Prefix: https://soundcloud.com/
   Title: SoundCloud
   Icon:
-    Class: fab fa-soundcloud fa-fw
+    Class: fa-brands fa-soundcloud fa-fw
 
 # 028: Spotify
 spotify:
@@ -220,7 +220,7 @@ spotify:
   Prefix: https://open.spotify.com/user/
   Title: Spotify
   Icon:
-    Class: fab fa-spotify fa-fw
+    Class: fa-brands fa-spotify fa-fw
 
 # 029: Bandcamp
 bandcamp:
@@ -228,7 +228,7 @@ bandcamp:
   Template: https://%v.bandcamp.com/
   Title: Bandcamp
   Icon:
-    Class: fab fa-bandcamp fa-fw
+    Class: fa-brands fa-bandcamp fa-fw
 
 # 030: PayPal
 paypal:
@@ -236,7 +236,7 @@ paypal:
   Prefix: https://paypal.me/
   Title: PayPal
   Icon:
-    Class: fab fa-paypal fa-fw
+    Class: fa-brands fa-paypal fa-fw
 
 # 031: 500px
 fivehundredpx:
@@ -244,7 +244,7 @@ fivehundredpx:
   Prefix: https://500px.com/
   Title: 500px
   Icon:
-    Class: fab fa-500px fa-fw
+    Class: fa-brands fa-500px fa-fw
 
 # 032: Mix
 mix:
@@ -252,7 +252,7 @@ mix:
   Prefix: https://mix.com/
   Title: Mix
   Icon:
-    Class: fab fa-mix fa-fw
+    Class: fa-brands fa-mix fa-fw
 
 # 033: Goodreads
 goodreads:
@@ -260,7 +260,7 @@ goodreads:
   Prefix: https://www.goodreads.com/user/show/
   Title: Goodreads
   Icon:
-    Class: fab fa-goodreads fa-fw
+    Class: fa-brands fa-goodreads fa-fw
 
 # 034: Last.fm
 lastfm:
@@ -268,7 +268,7 @@ lastfm:
   Prefix: https://www.last.fm/user/
   Title: Last.fm
   Icon:
-    Class: fab fa-lastfm fa-fw
+    Class: fa-brands fa-lastfm fa-fw
 
 # 035: Foursquare
 foursquare:
@@ -276,7 +276,7 @@ foursquare:
   Prefix: https://foursquare.com/
   Title: Foursquare
   Icon:
-    Class: fab fa-foursquare fa-fw
+    Class: fa-brands fa-foursquare fa-fw
 
 # 036: Hacker News
 hackernews:
@@ -284,7 +284,7 @@ hackernews:
   Template: https://news.ycombinator.com/user?id=%v
   Title: Hacker News
   Icon:
-    Class: fab fa-hacker-news fa-fw
+    Class: fa-brands fa-hacker-news fa-fw
 
 # 037: Kickstarter
 kickstarter:
@@ -292,7 +292,7 @@ kickstarter:
   Prefix: https://kickstarter.com/profile/
   Title: Kickstarter
   Icon:
-    Class: fab fa-kickstarter fa-fw
+    Class: fa-brands fa-kickstarter fa-fw
 
 # 038: Patreon
 patreon:
@@ -300,7 +300,7 @@ patreon:
   Prefix: https://patreon.com/
   Title: Patreon
   Icon:
-    Class: fab fa-patreon fa-fw
+    Class: fa-brands fa-patreon fa-fw
 
 # 039: Steam
 steam:
@@ -308,7 +308,7 @@ steam:
   Prefix: https://steamcommunity.com/id/
   Title: Steam
   Icon:
-    Class: fab fa-steam fa-fw
+    Class: fa-brands fa-steam fa-fw
 
 # 040: Twitch
 twitch:
@@ -316,7 +316,7 @@ twitch:
   Prefix: https://www.twitch.tv/
   Title: Twitch
   Icon:
-    Class: fab fa-twitch fa-fw
+    Class: fa-brands fa-twitch fa-fw
 
 # 041: Strava
 strava:
@@ -324,7 +324,7 @@ strava:
   Prefix: https://www.strava.com/athletes/
   Title: Strava
   Icon:
-    Class: fab fa-strava fa-fw
+    Class: fa-brands fa-strava fa-fw
 
 # 042: Skype
 skype:
@@ -332,7 +332,7 @@ skype:
   Template: "skype:"
   Title: Skype
   Icon:
-    Class: fab fa-skype fa-fw
+    Class: fa-brands fa-skype fa-fw
 
 # 043: WhatsApp
 whatsapp:
@@ -340,7 +340,7 @@ whatsapp:
   Prefix: https://wa.me/
   Title: WhatsApp
   Icon:
-    Class: fab fa-whatsapp fa-fw
+    Class: fa-brands fa-whatsapp fa-fw
 
 # 044: 知乎
 zhihu:
@@ -348,7 +348,7 @@ zhihu:
   Prefix: https://www.zhihu.com/people/
   Title: 知乎
   Icon:
-    Simpleicons: zhihu
+    Class: fa-brands fa-zhihu fa-fw
 
 # 045: 豆瓣
 douban:
@@ -364,7 +364,7 @@ angellist:
   Prefix: https://angel.co/
   Title: Angellist
   Icon:
-    Class: fab fa-angellist fa-fw
+    Class: fa-brands fa-angellist fa-fw
 
 # 047: SlideShare
 slideshare:
@@ -372,7 +372,7 @@ slideshare:
   Prefix: https://slideshare.com/
   Title: SlideShare
   Icon:
-    Class: fab fa-slideshare fa-fw
+    Class: fa-brands fa-slideshare fa-fw
 
 # 048: JSFiddle
 jsfiddle:
@@ -380,7 +380,7 @@ jsfiddle:
   Prefix: https://jsfiddle.com/
   Title: JSFiddle
   Icon:
-    Class: fab fa-jsfiddle fa-fw
+    Class: fa-brands fa-jsfiddle fa-fw
 
 # 049: DeviantArt
 deviantart:
@@ -388,7 +388,7 @@ deviantart:
   Template: https://%v.deviantart.com/
   Title: DeviantArt
   Icon:
-    Class: fab fa-deviantart fa-fw
+    Class: fa-brands fa-deviantart fa-fw
 
 # 050: Behance
 behance:
@@ -396,7 +396,7 @@ behance:
   Prefix: https://behance.net/
   Title: Behance
   Icon:
-    Class: fab fa-behance fa-fw
+    Class: fa-brands fa-behance fa-fw
 
 # 051: Dribbble
 dribbble:
@@ -404,7 +404,7 @@ dribbble:
   Prefix: https://dribbble.com/
   Title: Dribbble
   Icon:
-    Class: fab fa-dribbble fa-fw
+    Class: fa-brands fa-dribbble fa-fw
 
 # 052: WordPress
 wordpress:
@@ -412,7 +412,7 @@ wordpress:
   Template: https://%v.wordpress.com/
   Title: WordPress
   Icon:
-    Class: fab fa-wordpress fa-fw
+    Class: fa-brands fa-wordpress fa-fw
 
 # 053: Vine
 vine:
@@ -420,7 +420,7 @@ vine:
   Prefix: https://vine.co/
   Title: Vine
   Icon:
-    Class: fab fa-vine fa-fw
+    Class: fa-brands fa-vine fa-fw
 
 # 054: Google Scholar
 googlescholar:
@@ -436,7 +436,7 @@ researchgate:
   Prefix: https://www.researchgate.net/profile/
   Title: ResearchGate
   Icon:
-    Class: fab fa-researchgate fa-fw
+    Class: fa-brands fa-researchgate fa-fw
 
 # 056: Mastodon
 mastodon:
@@ -444,7 +444,7 @@ mastodon:
   Prefix: https://mastodon.social/
   Title: Mastodon
   Icon:
-    Class: fab fa-mastodon fa-fw
+    Class: fa-brands fa-mastodon fa-fw
 
 # 057: Thingiverse
 thingiverse:
@@ -452,7 +452,7 @@ thingiverse:
   Prefix: https://www.thingiverse.com/
   Title: Thingiverse
   Icon:
-    Src: svg/icons/thingiverse.svg
+    Simpleicons: thingiverse
 
 # 058: Dev.To
 devto:
@@ -460,7 +460,7 @@ devto:
   Prefix: https://dev.to/
   Title: Dev.To
   Icon:
-    Class: fab fa-dev fa-fw
+    Class: fa-brands fa-dev fa-fw
 
 # 059: Gitea
 gitea:
@@ -491,7 +491,7 @@ bilibili:
   Prefix: https://space.bilibili.com/
   Title: bilibili
   Icon:
-    Src: svg/icons/bilibili.svg
+    Class: fa-brands fa-bilibili
 
 # 063: ORCID
 orcid:
@@ -499,7 +499,7 @@ orcid:
   Prefix: https://orcid.org/
   Title: ORCID
   Icon:
-    Class: fab fa-orcid fa-fw
+    Class: fa-brands fa-orcid fa-fw
 
 # 064 Liberapay
 liberapay:
@@ -541,13 +541,13 @@ qq:
   Icon:
     Simpleicons: tencentqq
 
-# 069: QQGroup
+# 069: QQ Group
 qqgroup:
   Weight: 69
   Template: https://qm.qq.com/cgi-bin/qm/qr?k=%v&jump_from=webapi
-  Title: QQGroup
+  Title: QQ Group
   Icon:
-    Class: fas fa-users
+    Simpleicons: tencentqq
 
 # 070: Diaspora
 diaspora:
@@ -562,21 +562,130 @@ csdn:
   Prefix: https://blog.csdn.net/
   Title: CSDN
   Icon:
-    Src: svg/icons/csdn.svg
+    Src: images/icons/csdn.svg
 
-# 072: Email
-email:
+# 072: Discord User Profile
+discord:
   Weight: 72
+  Prefix: https://discordapp.com/users/
+  Title: Discord
+  Icon:
+    Class: fa-brands fa-discord fa-fw
+
+# 073: Discord Server Invite Link
+discordinvite:
+  Weight: 73
+  Prefix: https://discord.gg/
+  Title: Discord
+  Icon:
+    Class: fa-brands fa-discord fa-fw
+
+# 074: Lichess user profile
+lichess:
+  Weight: 74
+  Prefix: https://lichess.org/@/
+  Title: Lichess
+  Icon:
+    Simpleicons: lichess
+
+# 075: Pleroma
+pleroma:
+  Weight: 75
+  Title: Pleroma
+  Icon:
+    Simpleicons: pleroma
+
+# 076: Kaggle
+kaggle:
+  Weight: 76
+  Prefix: https://kaggle.com/
+  Title: Kaggle
+  Icon:
+    Class: fa-brands fa-kaggle fa-fw
+
+# 077: MediaWiki
+mediawiki:
+  Weight: 77
+  Title: MediaWiki
+  Icon:
+    Class: fa-brands fa-wikipedia-w fa-fw
+
+# 078: Plume
+plume:
+  Weight: 78
+  Title: Plume
+  Icon:
+    Src: images/icons/plume.svg
+
+# 079: Hack The Box
+hackthebox:
+  Weight: 79
+  Title: Hack The Box
+  Prefix: https://app.hackthebox.com/users/
+  Icon:
+    Simpleicons: hackthebox
+
+# 080: Root-Me
+rootme:
+  Weight: 80
+  Title: Root-Me
+  Prefix: https://www.root-me.org/
+  Icon:
+    Src: images/icons/rootme.svg
+
+# 081: Feishu
+feishu:
+  Weight: 81
+  Title: Feishu
+  Template: https://www.feishu.cn/invitation/page/add_contact/?token=%v
+  Icon:
+    Class: fa-solid fa-dove
+
+# 082: TryHackMe
+tryhackme:
+  Weight: 82
+  Title: TryHackMe
+  Prefix: https://tryhackme.com/p/
+  Icon:
+    Simpleicons: tryhackme
+
+# 083 douyin
+douyin:
+  Weight: 83
+  Title: 抖音
+  Prefix: https://www.douyin.com/user/
+  Icon:
+    Class: fa-brands fa-tiktok
+
+# 084 TikTok
+tiktok:
+  Weight: 84
+  Title: TikTok
+  Prefix: https://www.tiktok.com/
+  Icon:
+    Class: fa-brands fa-tiktok
+
+# Phone
+phone:
+  Weight: 997
+  Template: tel:%v
+  Title: Phone
+  Icon:
+    Class: fa-solid fa-phone fa-fw
+
+# Email
+email:
+  Weight: 998
   Template: mailto:%v
   Title: Email
   Icon:
-    Class: far fa-envelope fa-fw
+    Class: fa-regular fa-envelope fa-fw
 
-# 073: RSS
+# RSS
 rss:
-  Weight: 73
+  Weight: 999
   Url: /index.xml
   Title: RSS
   Newtab: true
   Icon:
-    Class: fas fa-rss fa-fw
+    Class: fa-solid fa-rss fa-fw

assets/images/fixit.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" version="1.1">
+  <defs>
+    <style>.fixit-ban{opacity:.9;}</style>
+  </defs>
+  <path
+    d="M159.12 338.69l24.8-16.54a78.87 78.87 0 0 1-6.77-22.72l-30.88 4.41a16 16 0 0 1-4.54-31.68l34.27-4.9v-.76l98.94 98.95a76.89 76.89 0 0 1-71.68-17.73l-26.39 17.59c-.15.11-.31.21-.47.31a16 16 0 0 1-17.28-26.93zm224.72-48.42a16 16 0 0 0-13.57-18.11l-34.27-4.9V244.9l34.27-4.9a16 16 0 1 0-4.54-31.68l-30.54 4.36a79.31 79.31 0 0 0-6.85-22.85l24.54-16.36a16 16 0 1 0-17.29-26.93l-.46.31-26 17.34a79.9 79.9 0 0 0-102.64-3l139.83 139.88 19.41 2.77a16 16 0 0 0 18.11-13.57z"
+    fill="#358C3C" class="fixit-bug" />
+  <path
+    d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 432c-101.46 0-184-82.54-184-184a182.84 182.84 0 0 1 33.38-105.37l256 256A182.86 182.86 0 0 1 256 440zm150.62-78.63l-256-256A182.84 182.84 0 0 1 256 72c101.46 0 184 82.54 184 184a182.84 182.84 0 0 1-33.38 105.37z"
+    fill="#FF6347" class="fixit-ban" />
+</svg>

assets/images/hugo.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+  viewBox="0 0 370 391" xml:space="preserve">
+<style type="text/css">
+	.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#FF4088;stroke:#C9177E;stroke-width:27;}
+	.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
+</style>
+<path class="st0" d="M207.5,22.4L321.9,89c13.5,7.9,21.9,22.4,21.9,38v136.4c0,17.3-9.3,33.3-24.5,41.8l-113.5,63.9
+	c-15.1,8.5-33.5,8.4-48.5-0.2L52.8,308.8c-16.4-9.5-26.6-27-26.6-45.9V133.4c0-19.1,9.9-36.8,26.1-46.8l102.8-63.5
+	C171.1,13.2,191.3,13,207.5,22.4z"/>
+<polygon class="st1" points="105.6,298.2 105.6,91 149,91 149,166.5 220.9,166.5 220.9,91 264.4,91 264.4,298.2 220.9,298.2 
+	220.9,207.6 149,207.6 149,298.2 "/>
+</svg>

assets/images/icons/plume.svg

@@ -0,0 +1,92 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg169"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="plumeFeatherBlack.svg"
+   inkscape:export-filename="D:\Graphics\PlumeLogo\plumeFeatherFilled16.png"
+   inkscape:export-xdpi="3.0000005"
+   inkscape:export-ydpi="3.0000005">
+  <title
+     id="title8">Plume Logo - Feather (Black)</title>
+  <defs
+     id="defs163" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1.4"
+     inkscape:cx="126.20524"
+     inkscape:cy="304.85245"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1200"
+     inkscape:window-height="1577"
+     inkscape:window-x="3752"
+     inkscape:window-y="-8"
+     inkscape:window-maximized="1"
+     inkscape:pagecheckerboard="true" />
+  <metadata
+     id="metadata166">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>Plume Logo - Feather (Black)</dc:title>
+        <cc:license
+           rdf:resource="http://creativecommons.org/publicdomain/zero/1.0/" />
+        <dc:date>2018/10/07</dc:date>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Abdullah Tarawneh (trwnh.com)</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:description>A Plume concept logo, with a soft stylized feather. Solid black fill, no path.</dc:description>
+        <dc:contributor>
+          <cc:Agent>
+            <dc:title>trwnh</dc:title>
+          </cc:Agent>
+        </dc:contributor>
+      </cc:Work>
+      <cc:License
+         rdf:about="http://creativecommons.org/publicdomain/zero/1.0/">
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Reproduction" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Distribution" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#DerivativeWorks" />
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <path
+       d="M 11.343027,288.41445 C 1.112349,298.81005 0.43838995,295.69058 4.3446684,285.90553 L 16.157848,265.54671 c 1.615107,0.40548 13.891904,-55.26212 54.748175,-81.96673 -9.221995,15.79094 -3.917955,18.80285 -3.917955,18.80285 7.337901,-21.96856 13.652749,-30.76839 66.341642,-38.70978 -15.16261,11.41531 -6.45286,41.25445 -50.134453,55.21738 12.683753,-2.73301 25.822443,-8.73747 31.679703,-15.66516 -3.25494,22.40519 -51.89095,60.24666 -84.84585,64.99456 z"
+       id="path872"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccccccc" />
+  </g>
+</svg>

assets/images/icons/rootme.svg

@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Root Me</title><path d="M10.865 0a.972.972 0 00-.943.764c-4.205.953-7.285 4.738-7.285 9.125 0 1.249.248 2.498.734 3.642a.94.94 0 00-.287.686c0 .429.277.782.658.916v3.756c0 .066.019.134.057.191l.21.143 2.852 2.011v2.403c0 .2.161.363.362.363h9.535c.2 0 .363-.163.363-.363v-2.403l2.86-2.011.21-.153a.345.345 0 00.057-.191v-3.785a.957.957 0 00.6-.887.976.976 0 00-.246-.648 9.024 9.024 0 00.761-3.66c0-.449-.029-.898-.095-1.327 0-.028-.01-.057-.01-.086-.582-3.785-3.45-6.893-7.227-7.722a.96.96 0 10-1.145 1.143v3.519c0 .057.03.114.077.152.028.02.067.03.105.03.02 0 .048 0 .067-.01l1.41-.535c.095.143.238.239.41.287v1.658c-.715.877-1.6 1.67-2.545 2.375l-1.078-2.498a.732.732 0 00-.4-1.346.735.735 0 000 1.469h.039l1.125 2.603c-.658.477-1.335.906-2.002 1.297l-3.205-.963a.157.157 0 00-.114.01l-.955.371a.735.735 0 10.145.44c0-.029-.01-.058-.01-.086l.897-.354 2.793.84a33.433 33.433 0 01-4.874 2.23l-.17.06a.92.92 0 00-.554-.183H4.02a8.67 8.67 0 01-.678-3.367c0-.572.057-1.134.162-1.677h4.185a.733.733 0 100-.38l-4.1-.001c.773-3.137 3.252-5.645 6.456-6.389a.974.974 0 00.82.467.96.96 0 00.963-.963.96.96 0 00-.963-.963zm2.23.496c.134 0 .249.057.335.143.076.085.125.19.125.314a.466.466 0 01-.201.381.422.422 0 01-.266.086.452.452 0 01-.46-.457c0-.258.21-.467.468-.467zm-2.22.01a.467.467 0 110 .934.467.467 0 010-.934zm3.05.933a8.448 8.448 0 012.823 1.202c-.01 1.41-.552 2.708-1.41 3.88V5.34a.726.726 0 00.543-.705c0-.4-.325-.735-.735-.735a.739.739 0 00-.724.735c0 .028.01.047.01.066l-1.164.438v-3.24a.926.926 0 00.658-.46zM10.942 2.9a.735.735 0 00-.734.697l-1.459.533a.195.195 0 00-.133.182v.923H7.441a.726.726 0 00-.705-.543.735.735 0 000 1.47c.344 0 .62-.231.705-.546h1.366a.19.19 0 00.19-.19v-.982l1.286-.476c.124.238.372.4.649.4.4 0 .734-.324.734-.734a.726.726 0 00-.725-.735zm6.465.228a8.743 8.743 0 013.157 5.475c-.048 4.777-8.372 7.723-8.458 7.752-.019.01-.067.018-.105.037-.105-.02-.21-.038-.324-.057-.076-.02-.162-.03-.239-.049-.123-.019-.247-.047-.37-.076-.02-.01-.05-.008-.069-.008l-.143-.03c-.057-.009-.114-.029-.171-.038-.134-.029-.267-.056-.391-.094-.238-.057-.466-.124-.695-.182-.22-.066-.449-.124-.659-.191h-.02a6.686 6.686 0 01-.466-.152.93.93 0 00-.152-.047 2.67 2.67 0 00-.211-.069 2.851 2.851 0 01-.342-.123h-.01a5.97 5.97 0 01-.459-.171c-.143-.058-.266-.105-.361-.143-.095-.048-.18-.077-.229-.106-.057-.028-.085-.037-.085-.037s.018.029.056.067c.038.047.096.113.182.19.076.075.18.171.304.267.124.095.268.2.42.304h.01c-.057.191-.096.402-.096.612 0 1.096.896 1.992 1.993 1.992a1.99 1.99 0 001.859-1.287l.297.03c.172.009.334.009.486.009.01 0 .018.008.028.008l1.61 1.64c.41.41 1.05.477 1.526.163l2.518-1.41a.795.795 0 00.363-.659v-2.898c.973-.773 1.85-1.69 2.422-2.729a8.15 8.15 0 01-.602 2.147h-.085a.96.96 0 00-.334 1.859v3.508l-3.002 2.117a.37.37 0 00-.155.297v2.021a.21.21 0 01-.209.21H15.08a.212.212 0 01-.21-.21v-.724c0-.19-.134-.364-.325-.383a.367.367 0 00-.4.363v.752c0 .115-.095.211-.21.211h-1.363a.212.212 0 01-.209-.21v-1.116c0-.19-.133-.362-.324-.38a.367.367 0 00-.402.36v1.145c0 .114-.095.21-.21.21h-1.363a.212.212 0 01-.209-.21v-.742c0-.19-.133-.364-.324-.383a.367.367 0 00-.4.363v.752c0 .115-.097.211-.211.211H7.805a.212.212 0 01-.21-.21v-2.022a.366.366 0 00-.154-.295L4.447 18.64v-3.547a.96.96 0 00.545-1.05c.382-.133 3.29-1.171 6.15-2.954 3.872-2.413 6.016-5.15 6.264-7.963zM4.046 13.77a.464.464 0 01.459.467.458.458 0 01-.066.228.417.417 0 01-.382.219.5.5 0 01-.305-.114.472.472 0 01-.162-.343.465.465 0 01.457-.457zm15.868 0a.477.477 0 01.467.466.67.67 0 01-.113.268.481.481 0 01-.364.18.468.468 0 01-.334-.143.463.463 0 01-.123-.314c0-.2.124-.373.305-.43a.445.445 0 01.162-.027zm-11.68 2.287c.363.362 1.24 1.012 2.184 1.03a1.258 1.258 0 01-1.908 0 1.228 1.228 0 01-.295-.81c0-.076.01-.144.02-.22zm.477.228c.22.096.447.191.685.268a8.254 8.254 0 010 0 11.414 11.414 0 01-.685-.268zm3.242 2.795c-.01 0-.02 0-.03.01-.009 0-.019.01-.019.01-.01 0-.018.01-.027.01-.01 0-.02.007-.03.017-.009 0-.01.01-.019.01l-.02.02-.017.019-.773.963a.275.275 0 00.218.447.287.287 0 00.221-.104l.01-.01a.7.7 0 011.095 0l.01.01a.283.283 0 00.39.047.276.276 0 00.048-.39l-.781-.953c-.01-.01-.02-.02-.02-.03l-.018-.02c-.01 0-.01-.009-.02-.009-.009-.01-.019-.008-.028-.018-.01 0-.018-.01-.028-.01-.01 0-.02-.01-.02-.01-.009 0-.02 0-.029-.009H11.953z"/></svg>

assets/images/version.template.svg

@@ -0,0 +1,27 @@
+{{- /* https://img.shields.io/badge/$label-$version-$color?style=flat&labelColor=403c3d */ -}}
+{{- $labelWidth := strings.RuneCount .label | mul (cond .isCJK 11.5 8.5) | add 10 -}}
+{{- $versionWidth := strings.RuneCount .version | mul 6 | add 10 -}}
+{{- $width := add $labelWidth $versionWidth -}}
+{{- $labelLength := sub $labelWidth 10 | mul 10 -}}
+{{- $versionLength := sub $versionWidth 10 | mul 10 -}}
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{ $width }}" height="20" role="img" aria-label="{{ .label }}: {{ .version }}">
+  <title>{{ .label }}: {{ .version }}</title>
+  <linearGradient id="s" x2="0" y2="100%">
+    <stop offset="0" stop-color="#bbb" stop-opacity=".1" />
+    <stop offset="1" stop-opacity=".1" />
+  </linearGradient>
+  <clipPath id="r">
+    <rect width="{{ $width }}" height="20" rx="3" fill="#fff" />
+  </clipPath>
+  <g clip-path="url(#r)">
+    <rect width="{{ $labelWidth }}" height="20" fill="#403c3d" />
+    <rect x="{{ $labelWidth }}" width="{{ $versionWidth }}" height="20" fill="#{{ .color }}" />
+    <rect width="{{ $width }}" height="20" fill="url(#s)" />
+  </g>
+  <g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110">
+    <text aria-hidden="true" x="{{ div $labelLength 2 | add 60 }}" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="{{ $labelLength }}">{{ .label }}</text>
+    <text x="{{ div $labelLength 2 | add 60 }}" y="140" transform="scale(.1)" fill="#fff" textLength="{{ $labelLength }}">{{ .label }}</text>
+    <text aria-hidden="true" x="{{ div $versionLength 2 | add $labelLength | add 140 }}" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="{{ $versionLength }}">{{ .version }}</text>
+    <text x="{{ div $versionLength 2 | add $labelLength | add 140 }}" y="140" transform="scale(.1)" fill="#fff" textLength="{{ $versionLength }}">{{ .version }}</text>
+  </g>
+</svg>

assets/js/custom.js.example

@@ -1,20 +1,20 @@
 /**
+ * Custom javascript for FixIt site.
  * @author @Lruihao https://lruihao.cn
- * @description Custom javascript for the hugo theme FixIt.
  */
-const CustomJS = new (function () {
+const FixItCustom = new (function () {
   /**
    * Hello World
    * You can define your own functions below.
-   * @returns {CustomJS}
+   * @returns {FixItCustom}
    */
   this.hello = () => {
-    // console.log('Hello CustomJS!');
+    console.log('FixItCustom echo: Hello FixIt!');
     return this;
-  }
+  };
   /**
    * Initialize.
-   * @returns {CustomJS}
+   * @returns {FixItCustom}
    */
   this.init = () => {
     // Custom infos.
@@ -27,9 +27,9 @@ const CustomJS = new (function () {
  * Immediate.
  */
 (() => {
-  CustomJS.init();
+  FixItCustom.init();
   // It will be executed when the DOM tree is built.
   document.addEventListener('DOMContentLoaded', () => {
-    // console.log('DOM content loaded!')
+    // FixItCustom.init();
   });
 })();

assets/js/fixit-decryptor.js

@@ -0,0 +1,223 @@
+/**
+ * FixIt decryptor for encrypted pages and fixit-encryptor shortcode
+ * @param {Object} options
+ * @param {Function} [options.decrypted] [Lifecycle Hooks] handler after decrypting
+ * @param {Function} [options.reset] [Lifecycle Hooks] handler after encrypting again
+ * @param {Number} [options.duration=86400] number of seconds to cache decryption statistics. unit: s
+ * @author @Lruihao https://lruihao.cn
+ * @since v0.2.15
+ */
+FixItDecryptor = function (options = {}) {
+  var _proto = FixItDecryptor.prototype;
+  this.options = options || {};
+  this.options.duration = this.options.duration || 24 * 60 * 60; // default cache one day
+  this.decryptedEventSet = new Set();
+  this.resetEventSet = new Set();
+  this.$el = document.querySelector('.fixit-decryptor-container');
+
+  /**
+   * decrypt content
+   * @param {String} base64EncodeContent encrypted content
+   */
+  var _decryptContent = (base64EncodeContent) => {
+    try {
+      this.$el.querySelector('.fixit-decryptor-loading').classList.add('d-none');
+      this.$el.querySelector('#fixit-decryptor-input').classList.add('d-none');
+      this.$el.querySelector('.fixit-encryptor-btn').classList.remove('d-none');
+      document.querySelector('#content').insertAdjacentHTML(
+        'afterbegin',
+        CryptoJS.enc.Base64.parse(base64EncodeContent).toString(CryptoJS.enc.Utf8)
+      );
+    } catch (err) {
+      return console.error(err);
+    }
+    // decrypted hook
+    console.log(this.decryptedEventSet)
+    for (const event of this.decryptedEventSet) {
+      event();
+    }    
+  };
+
+  /**
+   * initialize FixIt decryptor
+   */
+  _proto.init = () => {
+    this.addEventListener('decrypted', this.options?.decrypted);
+    this.addEventListener('reset', this.options?.reset);
+    this.validateCache();
+
+    const _decryptor = this;
+    this.$el.querySelector('#fixit-decryptor-input')?.addEventListener('keydown', function (e) {
+      if (e.key === 'Enter') {
+        e.preventDefault();
+        const $content = document.querySelector('#content');
+        const password = $content.getAttribute('data-password');
+        const input = this.value.trim();
+        const saltLen = input.length % 2 ? input.length : input.length + 1;
+        const inputMd5 = CryptoJS.MD5(input).toString();
+        const inputSha256 = CryptoJS.SHA256(input).toString();
+
+        this.value = '';
+        this.blur();
+        if (!input) {
+          alert('Please enter the correct password!');
+          return console.warn('Please enter the correct password!');
+        }
+        if (inputMd5 !== password) {
+          alert(`Password error: ${input} not the correct password!`);
+          return console.warn(`Password error: ${input} not the correct password!`);
+        }
+        // cache decryption statistics
+        window.localStorage?.setItem(
+          `fixit-decryptor/#${location.pathname}`,
+          JSON.stringify({
+            expiration: Math.ceil(Date.now() / 1000) + _decryptor.options.duration,
+            md5: inputMd5,
+            sha256: inputSha256.slice(saltLen)
+          })
+        );
+        _decryptContent($content.getAttribute('data-content').replace(inputSha256.slice(saltLen), ''));
+      }
+    });
+
+    this.$el.querySelector('.fixit-encryptor-btn')?.addEventListener('click', function (e) {
+      e.preventDefault();
+      this.classList.add('d-none')
+      _decryptor.$el.querySelector('#fixit-decryptor-input').classList.remove('d-none');
+      document.querySelector('#content').innerHTML = '';
+      document.querySelector('#content').insertAdjacentElement(
+        'afterbegin',
+        _decryptor.$el
+      );
+      window.localStorage?.removeItem(`fixit-decryptor/#${location.pathname}`);
+      // reset hook
+      for (const event of _decryptor.resetEventSet) {
+        event();
+      }
+    });
+  };
+
+  /**
+   * initialize fixit-encryptor shortcodes
+   */
+  _proto.initShortcodes = () => {
+    // TODO TODO shortcode decrypted event
+    // this.addEventListener('decrypted', this.options?.decrypted);
+    const _decryptor = this;
+    const $shortcodes = document.querySelectorAll('fixit-encryptor:not(.decrypted)');
+
+    $shortcodes.forEach($shortcode => {
+      $shortcode.querySelector('.fixit-decryptor-input')?.addEventListener('keydown', function (e) {
+        if (e.key === 'Enter') {
+          e.preventDefault();
+          const $decryptor = this.parentElement.parentElement;
+          const $content = $decryptor.nextElementSibling;
+          const password = $content.getAttribute('data-password');
+          const input = this.value.trim();
+          const saltLen = input.length % 2 ? input.length : input.length + 1;
+          const inputMd5 = CryptoJS.MD5(input).toString();
+          const inputSha256 = CryptoJS.SHA256(input).toString();
+  
+          this.value = '';
+          this.blur();
+          if (!input) {
+            alert('Please enter the correct password!');
+            return console.warn('Please enter the correct password!');
+          }
+          if (inputMd5 !== password) {
+            alert(`Password error: ${input} not the correct password!`);
+            return console.warn(`Password error: ${input} not the correct password!`);
+          }
+          try {
+            const base64EncodeContent = $content.getAttribute('data-content').replace(inputSha256.slice(saltLen), '');
+            $decryptor.querySelector('.fixit-decryptor-input').classList.add('d-none');
+            $content.insertAdjacentHTML(
+              'afterbegin',
+              CryptoJS.enc.Base64.parse(base64EncodeContent).toString(CryptoJS.enc.Utf8)
+            );
+            $decryptor.parentElement.classList.add('decrypted');
+          } catch (err) {
+            return console.error(err);
+          }
+          // TODO shortcode decrypted hook
+          // for (const event of _decryptor.decryptedEventSet) {
+          //   event();
+          // }
+        }
+      });
+    });
+  };
+
+  /**
+   * validate the cached decryption statistics in localStorage
+   * @returns {FixItDecryptor}
+   */
+  _proto.validateCache = () => {
+    const $content = document.querySelector('#content');
+    const password = $content.getAttribute('data-password');
+    const cachedStat = JSON.parse(window.localStorage?.getItem(`fixit-decryptor/#${location.pathname}`));
+
+    if (!cachedStat) {
+      this.$el.querySelector('.fixit-decryptor-loading').classList.add('d-none');
+      this.$el.querySelector('#fixit-decryptor-input').classList.remove('d-none');
+      return this;
+    }
+    if (cachedStat?.md5 !== password || Number(cachedStat?.expiration) < Math.ceil(Date.now() / 1000)) {
+      this.$el.querySelector('.fixit-decryptor-loading').classList.add('d-none');
+      this.$el.querySelector('#fixit-decryptor-input').classList.remove('d-none');
+      window.localStorage?.removeItem(`fixit-decryptor/#${location.pathname}`);
+      console.warn('The password has expired, please re-enter!');
+      return this;
+    }
+    _decryptContent($content.getAttribute('data-content').replace(cachedStat.sha256, ''));
+    return this;
+  };
+
+  /**
+   * add event listener for FixIt Decryptor
+   * @param {String} event event name
+   * @param {Function} listener event handler
+   * @returns {FixItDecryptor}
+   */
+  _proto.addEventListener = (event, listener) => {
+    if (typeof listener !== 'function') {
+      return this;
+    }
+    switch (event) {
+      case 'decrypted':
+        this.decryptedEventSet.add(listener);
+        break;
+      case 'reset':
+        this.resetEventSet.add(listener);
+        break;
+      default:
+        console.warn(`Event ${event} not found in FixIt Decryptor!`);
+        break;
+    }
+    return this;
+  };
+
+  /**
+   * remove event listener for FixIt Decryptor
+   * @param {String} event event name
+   * @param {Function} listener event handler
+   * @returns {FixItDecryptor}
+   */
+  _proto.removeEventListener = (event, listener) => {
+    if (typeof listener !== 'function') {
+      return this;
+    }
+    switch (event) {
+      case 'decrypted':
+        this.decryptedEventSet.delete(listener);
+        break;
+      case 'reset':
+        this.resetEventSet.delete(listener);
+        break;
+      default:
+        console.warn(`Event ${event} not found in FixIt Decryptor!`);
+        break;
+    }
+    return this;
+  };
+};

assets/js/service-worker.js

@@ -1,17 +1,19 @@
-const CACHE_VERSION = 1;
+/**
+ * Service Worker
+ * imported from https://github.com/HEIGE-PCloud/DoIt/blob/v0.2.11/src/js/sw.js
+ */
+CACHE_VERSION = 1;
 
 const BASE_CACHE_FILES = [
   '/css/style.min.css',
   '/js/theme.min.js',
   '/site.webmanifest',
-  '/images/fixit.svg'
 ];
 
 const OFFLINE_CACHE_FILES = [
   '/css/style.min.css',
   '/js/theme.min.js',
   '/site.webmanifest',
-  '/images/fixit.svg',
   '/offline/'
 ];
 
@@ -19,7 +21,6 @@ const NOT_FOUND_CACHE_FILES = [
   '/css/style.min.css',
   '/js/theme.min.js',
   '/site.webmanifest',
-  '/images/fixit.svg',
   '/404.html'
 ];