Merge branch 'master' into production

Resolves #957

.browserslistrc

@@ -0,0 +1,5 @@
+# https://github.com/browserslist/browserslist#browserslistrc
+
+last 2 versions
+> 0.2%
+not dead

.commitlintrc.json

@@ -1,5 +1,8 @@
 {
   "rules": {
-    "body-max-line-length": [0, "always"]
+    "body-max-line-length": [
+      0,
+      "always"
+    ]
   }
 }

.editorconfig

@@ -2,10 +2,18 @@ root = true
 
 [*]
 charset = utf-8
-# 2 space indentation
 indent_style = space
 indent_size = 2
 trim_trailing_whitespace = true
 # Unix-style newlines with a newline ending every file
 end_of_line = lf
 insert_final_newline = true
+
+[*.{js,css,scss}]
+quote_type = single
+
+[*.{yml,yaml}]
+quote_type = double
+
+[*.md]
+trim_trailing_whitespace = false

.github/CODE_OF_CONDUCT.md

@@ -70,4 +70,4 @@ available at <https://www.contributor-covenant.org/version/1/4/code-of-conduct.h
 For answers to common questions about this code of conduct, see
 <https://www.contributor-covenant.org/faq>
 
-[homepage]: https://www.contributor-covenant.org
+[homepage]: https://www.contributor-covenant.org

.github/CONTRIBUTING.md

@@ -1,66 +1,55 @@
 # How to Contribute
 
-We'd like to thank you for sparing time to improve this project! Here are some guidelines for contributing：
+:tada: We really appreciate you taking the time to improve this project! :tada:
 
-To ensure that the blog design is not confused, this project does not accept suggestions for design changes, such as color scheme, fonts, typography, etc. If your request is about an enhancement, it is recommended to first submit a [_Feature Request_](https://github.com/cotes2020/jekyll-theme-chirpy/issues/new?labels=enhancement&template=feature_request.md) issue to discuss whether your idea fits the project.
+To ensure that the blog design is not confusing, this project does not accept
+suggestions for design changes, such as color scheme, fonts, typography, etc.
+If your request is about an enhancement, it is recommended to first submit a
+[Feature Request][pr-issue] issue to discuss whether your idea fits the project.
 
-## Basic Process
-
-Generally, contribute to the project by:
+Basically, you can follow these steps to complete the contribution.
 
 1. Fork this project on GitHub and clone it locally.
-2. Create a new branch from the default branch and give it a descriptive name (format: `feature/<add-new-feat>` / `fix/<fix-a-bug>`).
-3. After completing the development, submit a new _Pull Request_. Note that the commit message must follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/), otherwise it will fail the PR check.
+2. Create a new branch from the default branch and give it a descriptive name
+   (format: `feature/<add-new-feat>` or `fix/<fix-a-bug>`).
+3. After completing development, create a [Conventional Commit][cc] with git.
+  (See also: ["Verify the commits"](#verify-the-commits))
+4. Create a [Pull Request][gh-pr].
 
-## Modifying JavaScript
+## Make sure you can pass the CI tests
 
-If your contribution involves JavaScript modification, please read the following sections.
-
-### Inline Scripts
-
-If you need to add comments to the inline JavaScript (the code between the HTML tags `<script>` and `</script>`), please use `/* */` instead of two slashes `//`. Because the HTML will be compressed by [jekyll-compress-html](https://github.com/penibelst/jekyll-compress-html) during deployment, but it cannot handle the `//` properly, which will disrupt the structure of the compressed HTML.
-
-### External Scripts
-
-If you need to add/change/delete the JavaScript in the directory `_javascript/`, setting up [`Node.js`](https://nodejs.org/) and [`npx`](https://www.npmjs.com/package/npx) is a requirement. And then install the development dependencies:
+This project has [CI][ci] turned on. In order for your [PR][gh-pr] to pass the test,
+please read the following.
 
+### Check the core functionality
+  
 ```console
-$ npm i
+bash ./tools/test
 ```
 
-During JavaScript development, real-time debugging can be performed through the following commands:
-
-Firstly, start a Jekyll server:
+### Check the SASS syntax style
 
 ```console
-$ bash tools/run.sh
+npm test
 ```
 
-And then open a new terminal tab and run:
+### Verify the commits
 
-```console
-# Type 'Ctrl + C' to stop
-$ npx gulp dev
-```
-
-After debugging, run the command `npx gulp` (without any argument) will automatically output the compressed files to the directory `assets/js/dist/`.
-
-## Verify the commit messages
-
-If you want to make sure your commits pass the CI check, you can refer to the following steps.
+Before you create a git commit, please complete the following setup.
 
 Install `commitlint` & `husky`:
 
 ```console
-$ npm i -g @commitlint/{cli,config-conventional} husky
+npm i -g @commitlint/{cli,config-conventional} husky
 ```
 
 And then enable `husky`:
 
 ```console
-$ husky install
+husky install
 ```
 
----
-
-:tada: Your volunteering will make the open-source world more beautiful, thanks again! :tada:
+[pr-issue]: https://github.com/cotes2020/jekyll-theme-chirpy/issues/new?labels=enhancement&template=feature_request.md
+[gh-pr]: https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/about-pull-requests
+[cc]: https://www.conventionalcommits.org/
+[ci]: https://en.wikipedia.org/wiki/Continuous_integration

.github/FUNDING.yml

@@ -1,2 +1,2 @@
 ko_fi: coteschung
-custom: https://cotes.gitee.io/alipay-wechat-donation
+custom: https://sponsor.cotes.page

.github/ISSUE_TEMPLATE/bug_report.md

@@ -3,21 +3,20 @@ name: Bug Report
 about: Create a report to help us improve
 ---
 
-<!-- NOTE: Please maintain all sections, otherwise the issue will be automatically closed :) -->
+**NOTE:** Before you start, the following should be completed.
 
-## Checklist
+- Read [tutorial][tutorial] to understand the usage and the correct effect of functional design.
+- Make sure no [similar issue(including closed ones)][issues] exists.
+- Make sure the bug is found in the latest code of the `master` branch.
 
-<!-- Please complete the following list of tasks, and then check it by changing the "[ ]" to "[x]" -->
-
-- [ ] I have read the [tutorials](https://cotes2020.github.io/chirpy-demo/categories/tutorial/) and know the correct effect of the functional design.
-- [ ] There are no similar reports on [existing issues](https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue) (including closed ones).
-- [ ] I found the bug on the latest code of the `master` branch.
+[tutorial]: https://cotes2020.github.io/chirpy-demo/categories/tutorial/
+[issues]: https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue
 
 ## Describe the bug
 
 <!-- A clear and concise description of what the bug is. -->
 
-### To Reproduce
+## To Reproduce
 
 Steps to reproduce the behavior:
 <!--
@@ -27,15 +26,15 @@ Steps to reproduce the behavior:
 4. See error
 -->
 
-### Expected behavior
+## Expected behavior
 
 <!-- A clear and concise description of what you expected to happen. -->
 
-### Screenshots
+## Logs/Screenshots
 
-<!-- If applicable, add screenshots to help explain your problem. -->
+<!-- If applicable, add logs/screenshots to help explain your problem. -->
 
-### Environment
+## Environment
 
 | Command                           | Version |
 |-----------------------------------|---------|
@@ -45,21 +44,25 @@ Steps to reproduce the behavior:
 | `bundle exec jekyll -v`           |         |
 | `bundle info jekyll-theme-chirpy` |         |
 
+<!-- If necessary, uncomment and fill in the following list:
+
 ### Desktop
 
-<!-- If necessary, uncomment and fill in the following list:
 - OS: [e.g. macOS 10.15.6]
 - Browser: [e.g. Chrome 85.0.4183.83 (64-bit)]
+
 -->
 
+<!-- If necessary, uncomment and fill in the following list:
+
 ### Smartphone
 
-<!-- If necessary, uncomment and fill in the following list:
 - Device: [e.g. iPhone 6]
 - OS: [e.g. iOS 13.6.1]
 - Browser: [e.g. Chrome 22]
+
 -->
 
-### Additional context
+## Additional context
 
 <!-- Add any other context about the problem here. -->

.github/ISSUE_TEMPLATE/feature_request.md

@@ -4,16 +4,14 @@ about: Suggest an idea for this project
 labels: enhancement
 ---
 
-<!-- NOTE: Please maintain all sections, otherwise the issue will be automatically closed :) -->
+**NOTE:** Before you start, the following should be completed.
 
-## Checklist
-
-<!-- Please complete the following list of tasks, and then check it by changing the "[ ]" to "[x]" -->
-- [ ] I have read the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/.github/CONTRIBUTING.md).
-- [ ] There is no similar request on [existing issues](https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue) (including closed ones).
-- [ ] I have read the [project progress](https://github.com/cotes2020/jekyll-theme-chirpy/projects) and know the current progress of the project.
-- [ ] I was in the `master` branch of the latest code.
+- Read [tutorial][tutorial] to understand the usage and the correct effect of functional design.
+- Make sure no [similar issue(including closed ones)][issues] exists.
+- Make sure the request is based on the latest code in the `master` branch.
 
+[tutorial]: https://cotes2020.github.io/chirpy-demo/categories/tutorial/
+[issues]: https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue
 
 ## Is your feature request related to a problem? Please describe
 

.github/ISSUE_TEMPLATE/help_wanted.md

@@ -0,0 +1,28 @@
+---
+name: Help Wanted
+about: Need help that is not covered in the tutorial
+labels: 'help wanted'
+---
+
+**NOTE:** Before you start, the following should be completed.
+
+- Read [tutorial][tutorial] to understand the usage and the correct effect of functional design.
+- Make sure no [similar issue(including closed ones)][issues] exists.
+- Try to find the answer on [Jekyll Forum][forum] and [StackOverflow][stack_overflow].
+
+[tutorial]: https://cotes2020.github.io/chirpy-demo/categories/tutorial/
+[issues]: https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue
+[forum]: https://talk.jekyllrb.com/
+[stack_overflow]: https://stackoverflow.com/questions/tagged/jekyll
+
+## Description
+
+<!-- Please describe your need in detail. -->
+
+## Operations you have already tried
+
+<!-- Describe the effort you went through. -->
+
+## Logs/Screenshots
+
+<!-- If applicable, add logs/screenshots to help explain your problem. -->

.github/ISSUE_TEMPLATE/question.md

@@ -1,19 +1,19 @@
 ---
 name: Question
-about: Ask whatever you want
+about: Issues that differ from other templates
 labels: question
 ---
 
-<!-- NOTE: Please maintain all sections, otherwise the issue will be automatically closed :) -->
+**NOTE:** Before you start, the following should be completed.
 
-## Checklist
+- Read [tutorial][tutorial] to understand the usage and the correct effect of functional design.
+- Make sure no [similar issue(including closed ones)][issues] exists.
+- Try to find the answer on [Jekyll Forum][forum] and [StackOverflow][stack_overflow].
 
-<!-- Please complete the following list of tasks, and then check it by changing the "[ ]" to "[x]" -->
-
-- [ ] I have read the [newlest tutorials](https://cotes2020.github.io/chirpy-demo/categories/tutorial/) and know the correct effect of the functional design.
-- [ ] There is no similar question on [existing issues](https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue) (including closed ones).
-- [ ] I have tried to find the answer on [Jekyll Forum](https://talk.jekyllrb.com/) and [StackOverflow](https://stackoverflow.com/questions/tagged/jekyll).
-- [ ] My question is based on the latest code of the `master` branch.
+[tutorial]: https://cotes2020.github.io/chirpy-demo/categories/tutorial/
+[issues]: https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue
+[forum]: https://talk.jekyllrb.com/
+[stack_overflow]: https://stackoverflow.com/questions/tagged/jekyll
 
 ## Description
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,6 +1,6 @@
 ## Description
 
-<!-- 
+<!--
 Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.
 
 e.g. Fixes #(issue)
@@ -8,7 +8,7 @@ e.g. Fixes #(issue)
 
 ## Type of change
 
-<!-- 
+<!--
 Please select the desired item checkbox and change it to "[x]", then delete options that are not relevant.
 -->
 - [ ] Bug fix (non-breaking change which fixes an issue)
@@ -18,11 +18,11 @@ Please select the desired item checkbox and change it to "[x]", then delete opti
 
 ## How has this been tested
 
-<!-- 
+<!--
 Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration
 -->
 
-- [ ] I have run `bash ./tools/deploy.sh --dry-run` (at the root of the project) locally and passed
+- [ ] I have run `bash ./tools/test` (at the root of the project) locally and passed
 - [ ] I have tested this feature in the browser
 
 ### Test Configuration
@@ -32,11 +32,3 @@ Please describe the tests that you ran to verify your changes. Provide instructi
 - Ruby version: <!-- by running: `ruby -v` -->
 - Bundler version: <!-- by running: `bundle -v`-->
 - Jekyll version: <!-- by running: `bundle list | grep " jekyll "` -->
-
-### Checklist
-
-<!-- Select checkboxes by change the "[ ]" to "[x]" -->
-- [ ] I have performed a self-review of my code
-- [ ] I have commented on my code, particularly in hard-to-understand areas
-- [ ] I have made corresponding changes to the documentation
-- [ ] My changes generate no new warnings

.github/SECURITY.md

@@ -0,0 +1,12 @@
+# Security Policy
+
+## Supported Versions
+
+| Version | Supported          |
+|---------| ------------------ |
+| 5.x     | :white_check_mark: |
+| < 5.0.0 | :x:                |
+
+## Reporting a Vulnerability
+
+If you find a vulnerability, please report it to `cotes.chung@gmail.com`. We will try our best to respond within a week. Thank you for your time!

.github/workflows/cd.yml

@@ -0,0 +1,14 @@
+name: CD
+on:
+  push:
+    branches: [production, docs]
+
+jobs:
+  launch:
+    runs-on: ubuntu-latest
+    steps:
+      - run: |
+          curl -X POST -H "Accept: application/vnd.github+json" \
+            -H "Authorization: Bearer ${{ secrets.GH_PAT }}" \
+            https://api.github.com/repos/${{ secrets.BUILDER }}/dispatches \
+            -d '{"event_type":"deploy", "client_payload":{"branch": "${{ github.ref_name }}"}}'

.github/workflows/ci.yml

@@ -1,37 +1,44 @@
-name: 'CI'
+name: "CI"
 on:
   push:
     branches-ignore:
-      - 'release/**'
-      - 'docs'
-    tags-ignore:
-      - '**'
+      - "production"
+      - "docs"
     paths-ignore:
-      - '.github/**'
-      - '!.github/workflows/ci.yml'
-      - '.travis.yml'
-      - '.gitignore'
-      - 'README.md'
-      - 'LICENSE'
+      - ".github/**"
+      - "!.github/workflows/ci.yml"
+      - ".gitignore"
+      - "README.md"
+      - "LICENSE"
   pull_request:
     paths:
-      - '**'
+      - "**"
 
 jobs:
   build:
     runs-on: ubuntu-latest
+
     strategy:
       matrix:
-        ruby: [2.5, 2.6, 2.7, 3]
+        ruby: [2.7, 3]
+
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
-          fetch-depth: 0  # for posts's lastmod
+          fetch-depth: 0 # for posts's lastmod
+
       - name: Setup Ruby
         uses: ruby/setup-ruby@v1
         with:
           ruby-version: ${{ matrix.ruby }}
           bundler-cache: true
+
+      - name: Setup Node
+        uses: actions/setup-node@v3
+
+      - name: Build Assets
+        run: npm i && npm run build
+
       - name: Test Site
-        run: bash tools/deploy.sh --dry-run
+        run: bash tools/test

.github/workflows/codeql.yml

@@ -0,0 +1,44 @@
+name: "CodeQL"
+
+on:
+  push:
+    paths: ["**.js"]
+  pull_request:
+    paths: ["**.js"]
+  schedule:
+    - cron: "0 0 * * 5"
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: ["javascript"]
+        # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v2
+        with:
+          languages: "${{ matrix.language }}"
+
+      # Autobuild attempts to build any compiled languages  (C/C++, C#, Go, 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@v2
+
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v2
+        with:
+          category: "/language:${{ matrix.language }}"

.github/workflows/issue-interceptor.yml

@@ -1,18 +0,0 @@
-name: Intercept bad issues
-
-on:
-  issues:
-    types: [opened, edited]
-
-jobs:
-  auto_close_issues:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v1
-      - name: Auto close issues that did not follow template
-        uses: lucasbento/auto-close-issues@v1.0.2
-        with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          issue-close-message: ":wave: Hi @${issue.user.login},\n\nThis issue is being automatically closed because it does not follow the issue template. Please DO NOT open another similar issue, try to edit the current issue according to the template, then it will be reopened automatically."
-          closed-issues-label: "🙁 Not following issue template"

.github/workflows/pages-deploy.yml.hook

@@ -1,29 +1,71 @@
-name: 'Automatic build'
+name: "Build and Deploy"
 on:
   push:
     branches:
+      - main
       - master
     paths-ignore:
       - .gitignore
       - README.md
       - LICENSE
 
-jobs:
-  continuous-delivery:
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
 
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow one concurrent deployment
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+jobs:
+  build:
     runs-on: ubuntu-latest
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
-          fetch-depth: 0  # for posts's lastmod
+          fetch-depth: 0
+          # submodules: true
+          # If using the 'assets' git submodule from Chirpy Starter, uncomment above
+          # (See: https://github.com/cotes2020/chirpy-starter/tree/main/assets)
+
+      - name: Setup Pages
+        id: pages
+        uses: actions/configure-pages@v3
 
       - name: Setup Ruby
         uses: ruby/setup-ruby@v1
         with:
-          ruby-version: 2.7
+          ruby-version: 3   # reads from a '.ruby-version' or '.tools-version' file if 'ruby-version' is omitted
           bundler-cache: true
 
-      - name: Deploy
-        run: bash tools/deploy.sh
+      - name: Build site
+        run: bundle exec jekyll b -d "_site${{ steps.pages.outputs.base_path }}"
+        env:
+          JEKYLL_ENV: "production"
+
+      - name: Test site
+        run: |
+          bundle exec htmlproofer _site --disable-external --check-html --allow_hash_href
+
+      - name: Upload site artifact
+        uses: actions/upload-pages-artifact@v1
+        with:
+          path: "_site${{ steps.pages.outputs.base_path }}"
+
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v1

.github/workflows/style-lint.yml

@@ -0,0 +1,25 @@
+name: "Style Lint"
+
+on:
+  push:
+    branches-ignore:
+      - "production"
+      - "docs"
+    paths:
+      - "_sass/**/*.scss"
+  pull_request:
+    paths:
+      - "_sass/**/*.scss"
+
+jobs:
+  stylelint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup Node
+        uses: actions/setup-node@v3
+      - run: npm i
+      - run: npm test

.gitignore

@@ -1,21 +1,22 @@
-# hidden files
-.*
-!.git*
-!.editorconfig
-!.nojekyll
-!.travis.yml
-!.husky
-!.commitlintrc.json
-!.versionrc.json
-
-# bundler cache
-_site
+# Bundler cache
+.bundle
 vendor
 Gemfile.lock
 
-# rubygem
+# Jekyll cache
+.jekyll-cache
+_site
+
+# RubyGems
 *.gem
 
-# npm dependencies
+# NPM dependencies
 node_modules
 package-lock.json
+
+# IDE configurations
+.idea
+.vscode
+
+# Misc
+assets/js/dist

.nojekyll

@@ -1 +0,0 @@
-

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "trailingComma": "none"
+}

.stylelintrc.json

@@ -0,0 +1,21 @@
+{
+  "extends": "stylelint-config-standard-scss",
+  "rules": {
+    "no-descending-specificity": null,
+    "shorthand-property-no-redundant-values": null,
+    "at-rule-no-vendor-prefix": null,
+    "property-no-vendor-prefix": null,
+    "selector-no-vendor-prefix": null,
+    "value-no-vendor-prefix": null,
+    "color-function-notation": "legacy",
+    "alpha-value-notation": "number",
+    "selector-not-notation": "simple",
+    "color-hex-length": "long",
+    "declaration-block-single-line-max-declarations": 3,
+    "scss/operator-no-newline-after": null,
+    "rule-empty-line-before": [
+      "always",
+      { "ignore": ["after-comment", "first-nested", "inside-block"] }
+    ]
+  }
+}

.travis.yml

@@ -1,48 +0,0 @@
-os: linux
-dist: bionic
-language: ruby
-rvm: 2.7.0
-
-addons:
-  apt:
-    packages:
-      - libcurl4-openssl-dev  # to avoid SSL error (for htmlproofer)
-
-# Overriding to drop the `--development` flag which requires the Gemfile.lock at build
-install: bundle install --jobs=3 --retry=3 --path=vendor/bundle
-
-before_script: git -C "$HOME" clone "$BUILDER_REPO" --depth=1 -q
-
-jobs:
-  include:
-    - stage: Upgrade
-      git:
-        depth: false  # for posts' lastmod
-      script: eval "$BUILD_CMD"
-    - stage: Starter
-      language: minimal
-      install: true   # skip install step
-      script: eval "$FLUSH_STARTER"
-    - stage: Docs
-      cache: bundler
-      git:
-        depth: false  # for posts' lastmod
-      script: eval "$DOCS_CMD"
-
-stages:
-  - name: Upgrade
-    if: branch = production
-  - name: Starter
-    if: branch = production
-  - name: Docs
-    if: branch = docs
-
-notifications:
-  email:
-    recipients:
-      - secure: "fFLqX7uOzFA8RE2AUFlU1mmxMw+rdV6DnODJ/1Gl+3ecNtrv5LeH3c5a4a5ShQqYTrx9BPfD40VRN7UB+lzOdXiWLI9yDGRPPxGG26/WfrKpdQPZilc8zAOEeDnLAJeGZLsUvgmNb3KCXW6S8NPqqh34CfWcTIzjCARhRgO33wcs8X5wP5cugtNqO5Ew/pUcfWcmiuXNX0GNT6l+nL5A7yN+IO5mRHqSRmlfYd5EHhGMTIL4La+Cd1CNv1m4Dl0Ah2cDeJwi5wLnVbqAgunLhAYmDtxIOCVYMTBrP37UiNe/7QeFelyJfODsmMg1mx3WCykbXydC753WVoAlTg6nNoeeI9fmK+/tuLK+sx/KnYfTVGBXQYq39DyV/2o/IfCzEAKImlzFKGD8R13+ddu4B5UML+cby5KBvhTKIGaC5tKoe39z/31UPpy11/EHMCof2BUOzIgu5Hsv4OSNJlw3oRE31oOPn8xP4e7uWR8bRUhAgzN0Cn0ht+UfpemfGAXrp0M3IXQdc9L4azEFqxRhivMTLK/P6INay7IM+DJ30Ht2dWylGw/sxcRTqyNm3YomJQnXIO4xeqTSLulWr80FFHTys3JEDJYrcKvJmpwLFEAOZtwKsZ6ZShrOIA4LE5fgQtakH3ZLJG9a7jVSlMcNIfaSKgjdDQOe6CoRQL7KouA="
-    on_success: never
-
-env:
-  global:
-    - NOKOGIRI_USE_SYSTEM_LIBRARIES=true # speeds up installation of html-proofer

CHANGELOG.md

@@ -2,6 +2,144 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [5.6.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.6.0...v5.6.1) (2023-03-30)
+
+
+### Bug Fixes
+
+* **deps:** `tocbot` has no initialization detection ([#957](https://github.com/cotes2020/jekyll-theme-chirpy/issues/957)) ([8225174](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8225174cb5e02fda7b3cc548ec821c876b0a5139))
+* mode-toggle leads to Disqus loading failure ([#945](https://github.com/cotes2020/jekyll-theme-chirpy/issues/945)) ([6fec411](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6fec411c18ca5689c467c7b216ddeda02df23623))
+* pageviews not updated immediately ([8b4f99c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8b4f99c87f9a9227f47e84fb39d7b0f551d6f4dd))
+
+## [5.6.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.2...v5.6.0) (2023-03-17)
+
+
+### Features
+
+* change TOC plugin to `tocbot` ([#774](https://github.com/cotes2020/jekyll-theme-chirpy/issues/774)) ([02b7bd5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/02b7bd5095a2affe5b4c5ed7b5b182baaf642ff3))
+* **i18n:** add Greek Language Support. ([#903](https://github.com/cotes2020/jekyll-theme-chirpy/issues/903)) ([712a9b2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/712a9b22401ce591cf4c0bb03fbdd1693fee30bb))
+* **ux:** turn home page posts into clickable cards ([#895](https://github.com/cotes2020/jekyll-theme-chirpy/issues/895)) ([b85f633](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b85f6330dea666350631c4461b742cdb54c5f052))
+
+
+### Bug Fixes
+
+* css selector string escaping vulnerability ([#888](https://github.com/cotes2020/jekyll-theme-chirpy/issues/888)) ([5c6ec9d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5c6ec9d06b6571e2c0efe6652078442dca8af477))
+* mathematics cannot scroll horizontally ([#760](https://github.com/cotes2020/jekyll-theme-chirpy/issues/760)) ([4681df7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4681df715118a37ae1e91b588de0adb67f4e331a))
+* notch status bar doesn't match theme color ([#918](https://github.com/cotes2020/jekyll-theme-chirpy/issues/918)) ([820ba62](https://github.com/cotes2020/jekyll-theme-chirpy/commit/820ba62e9e939090523a7077d01d01bd78ec84eb))
+* some console snippets will be incompletely copied ([e8e4901](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e8e4901e340dd7e5fc5f656dd3c7bcd6c97b886a))
+
+## [5.5.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.1...v5.5.2) (2023-01-30)
+
+
+### Bug Fixes
+
+* position of prompt icon is incorrect in paragraph on mobile ([5df953f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5df953f6c877e2aa3f1f4981c97a0b8007abe6d4))
+
+## [5.5.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.0...v5.5.1) (2023-01-29)
+
+
+### Bug Fixes
+
+* the icon position of the prompts in the list is incorrect ([0c9558d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0c9558de8a01e9ab795778f351a8bbf4d6b21763))
+
+## [5.5.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.4.0...v5.5.0) (2023-01-29)
+
+
+### Features
+
+* **i18n:** add Arabic translation ([#857](https://github.com/cotes2020/jekyll-theme-chirpy/issues/857)) ([765af53](https://github.com/cotes2020/jekyll-theme-chirpy/commit/765af53b77e5c63804784d5728f5970ae274c2c7))
+* **i18n:** add Czech language ([#833](https://github.com/cotes2020/jekyll-theme-chirpy/issues/833)) ([98d48f5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/98d48f5da412276d4a0c99cd01a87b19349bc6bc))
+* **i18n:** add Finnish translations ([#843](https://github.com/cotes2020/jekyll-theme-chirpy/issues/843)) ([d6d0318](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d6d03183eaf94b44e037cc48b6e1c47cee183f6e))
+* **i18n:** add Italian translation ([#850](https://github.com/cotes2020/jekyll-theme-chirpy/issues/850)) ([9a011e1](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9a011e14d66195d8b2fb9ec62f3e60a3e56cd032))
+
+
+### Bug Fixes
+
+*  copy command line incomplete(`.gp` part) ([41ed331](https://github.com/cotes2020/jekyll-theme-chirpy/commit/41ed33145639415148aec8e85edc7a6fd0de0ca3))
+* correct encoding of spaces in share URLs ([#835](https://github.com/cotes2020/jekyll-theme-chirpy/issues/835)) ([f2d2858](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f2d285844e6e2979f2b0eec1d20073d3c05b6c0c))
+* post's image would cover the PWA update alert ([bd374dd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bd374dd383c50f89c8f018ecb4e25772eeb8f6d8))
+* prompt with nested blockquotes renders incorrectly ([#846](https://github.com/cotes2020/jekyll-theme-chirpy/issues/846)) ([babb4a0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/babb4a0c5a58ceb2e4093bc465670accdd526c18))
+
+## [5.4.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.2...v5.4.0) (2022-12-27)
+
+
+### Features
+
+* add `rel="me"` to Mastodon sidebar contact links for verification ([#807](https://github.com/cotes2020/jekyll-theme-chirpy/issues/807)) ([d2190c7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d2190c726f61c8c9732b88b4aecf699dc8bc7deb))
+* add embed video support ([ed6dc53](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ed6dc539eff7003a3765bcd8c31ae5e91a863d65))
+* add shimmer background when image loads ([ab16fdc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ab16fdc7fc26811130b98a1773beb62bff6182e8))
+* set preview image ratio to 1.91 : 1 ([4b6ccbc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4b6ccbcbccce27b9fcb035812efefe4eb69301cf))
+* support dark and light mode images ([#481](https://github.com/cotes2020/jekyll-theme-chirpy/issues/481)) ([9306c7b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9306c7b39ecf9d9146bc1a25eebedc38eb2c3dd6))
+* support LQIP for images ([bffaf63](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bffaf6374f265cec96ef743d42b46fbec3b59797))
+
+
+### Bug Fixes
+
+* `hreflang` tag attribute of feed misses `site.alt_lang` ([7651d28](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7651d2851b4bb7d8f0d068b62c036c89a1089bbc))
+* `og:image` will be incorrect if the image uses a cross-domain URL ([8de1abd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8de1abda6be3633982392178731431b0ddb1b52b))
+* refactoring error when the image URL contains parameters ([ec98f07](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ec98f07aca0b80a9c07fbcdc8e0d7d66dba98ed2))
+* spaces in post title are encoded when sharing ([7efd2f8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7efd2f8aa2ea1c3aeb7d740bf9a018881c26fe65))
+
+
+### Improvements
+
+* **cdn:** optimize cache policy for static assets ([7fb0ee0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7fb0ee0bedb63eee3f90a49c6d7fb8b5d78c9830))
+
+## [5.3.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.1...v5.3.2) (2022-11-22)
+
+
+### Bug Fixes
+
+* `mermaid` occasionally fails to initialize ([#536](https://github.com/cotes2020/jekyll-theme-chirpy/issues/536)) ([48f14e3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/48f14e39ac81bbfb3b9913ea3ee789d775b2d1ae))
+* **comment:** disqus doesn't follow theme mode switching ([b0d5956](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b0d5956f5a0ed894984d6b1754efeba04d8bc966))
+* restore full-text search ([#741](https://github.com/cotes2020/jekyll-theme-chirpy/issues/741)) ([6774e0e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6774e0e1fb37cf467b14be481347412713763f05))
+* the image URL in the SEO-related tags is incomplete ([#754](https://github.com/cotes2020/jekyll-theme-chirpy/issues/754)) ([f6e9a3f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f6e9a3fccf7ab34db71f8aefaf86fdcc05861076))
+
+## [5.3.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.0...v5.3.1) (2022-10-25)
+
+
+### Bug Fixes
+
+* 404 page missing title in tablet/desktop view ([5511b28](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5511b2883fd5a395fddfb642588d00c122f18da7))
+* prompt content overflows horizontally ([#705](https://github.com/cotes2020/jekyll-theme-chirpy/issues/705)) ([fb13e32](https://github.com/cotes2020/jekyll-theme-chirpy/commit/fb13e3219b5eca0d2e4f86a1ecabfab75240369f))
+* **tools:** multiple configuration files will fail the test ([80cb0b3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/80cb0b371754e96772a7907877a8ce196398ba3d))
+
+
+### Improvements
+
+* **layout:** improve the min-height of main content ([#674](https://github.com/cotes2020/jekyll-theme-chirpy/issues/674)) ([49bb93c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/49bb93cc0c89ad9cfaad5edcf9cb28c3d5134575))
+* modify checkbox icon with `Liquid` ([1fd665b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1fd665bf4990c26ae23635c511c5abc9640184d1))
+* optimize the extra padding in lists ([#703](https://github.com/cotes2020/jekyll-theme-chirpy/issues/703)) ([39da11e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/39da11e3f3685f49321757576d2b87a48bf25db5)), closes [#702](https://github.com/cotes2020/jekyll-theme-chirpy/issues/702)
+* **posts:** improve core block bottom padding ([d2fb98b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d2fb98b3e57f2f6c3fc3816551cd0721731adf40))
+* truncate post content for search results ([647eea8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/647eea8dbd716f9d3cb8330c3139fa753903f51d))
+* **typography:** optimize the line height of post content ([eac3f9b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/eac3f9b434ca77e3dc64eea9cedea7b93e7b306b))
+
+### Others
+
+* **giscus:** add `reactions-enabled` option ([#712](https://github.com/cotes2020/jekyll-theme-chirpy/issues/712)) ([70662a0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/70662a0365e6b9378602dc0a57462ddad5aebcf5))
+* **locale:** restore options for changing date format ([#716](https://github.com/cotes2020/jekyll-theme-chirpy/issues/716)) ([f904e8c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f904e8cd48c343cc31e25859d9d50bfe2c056f41))
+* remove site config option `prefer_datetime_locale` ([6852ceb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6852ceb280927ff4e753a3e1131f2b396d9807d0))
+
+## [5.3.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.2.1...v5.3.0) (2022-09-23)
+
+
+### Features
+
+* add multiple authors to a post ([#677](https://github.com/cotes2020/jekyll-theme-chirpy/issues/677)) ([f1d9e99](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f1d9e99bc02d3cd0a6b0cd1beac545f0cc7a24f8)), closes [#675](https://github.com/cotes2020/jekyll-theme-chirpy/issues/675)
+* **i18n:** add Bulgarian support  ([#612](https://github.com/cotes2020/jekyll-theme-chirpy/issues/612)) ([2fed338](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2fed338ce6d078bf528c9717201fbc475f88cd22))
+* **i18n:** add German locale file ([#663](https://github.com/cotes2020/jekyll-theme-chirpy/issues/663)) ([940b281](https://github.com/cotes2020/jekyll-theme-chirpy/commit/940b2810e95065e30600ae8d5e4612e7183da60e))
+* **i18n:** add Hungarian locale file ([#597](https://github.com/cotes2020/jekyll-theme-chirpy/issues/597), [#598](https://github.com/cotes2020/jekyll-theme-chirpy/issues/598)) ([b032977](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b0329775fc24d0323e5cc04cda46ece8b4531802))
+* **i18n:** add Turkish language ([#631](https://github.com/cotes2020/jekyll-theme-chirpy/issues/631)) ([ad137fa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ad137fa2945b1870b9c1dd5e9212a5f4af7c3580))
+
+
+### Bug Fixes
+
+* add missing color to linkedin icon for share list ([#683](https://github.com/cotes2020/jekyll-theme-chirpy/issues/683)) ([0dcd39d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0dcd39d491c9c49e4acf7f75f83fe6e1d1839e37))
+* code contains spaces in headings ([#644](https://github.com/cotes2020/jekyll-theme-chirpy/issues/644)) ([3fa1bf3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/3fa1bf305451f645a7f3aa93863b076463c8f165))
+* correct spelling of `panel` ([#686](https://github.com/cotes2020/jekyll-theme-chirpy/issues/686)) ([b288587](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b288587c1c3d113a1c52c2d25fb46cddda348961))
+* correct the i18n for tab titles ([0c5b697](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0c5b697fd3b283b6a5c926742b61ed49d8688c18))
+* the `code` doesn't wrap inside the prompt ([#626](https://github.com/cotes2020/jekyll-theme-chirpy/issues/626)) ([378b65a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/378b65a0617787813519dde74d6f741f255eff3d))
+
 ## [5.2.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.2.0...v5.2.1) (2022-06-17)
 
 

Gemfile

@@ -10,13 +10,19 @@ end
 
 # Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem
 # and associated library.
-install_if -> { RUBY_PLATFORM =~ %r!mingw|mswin|java! } do
-  gem "tzinfo", "~> 1.2"
+platforms :mingw, :x64_mingw, :mswin, :jruby do
+  gem "tzinfo", ">= 1", "< 3"
   gem "tzinfo-data"
 end
 
 # Performance-booster for watching directories on Windows
-gem "wdm", "~> 0.1.1", :install_if => Gem.win_platform?
+gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin]
 
-# Jekyll <= 4.2.0 compatibility with Ruby 3.0
-gem "webrick", "~> 1.7"
+# Lock `http_parser.rb` gem to `v0.6.x` on JRuby builds since newer versions of the gem
+# do not have a Java counterpart.
+gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby]
+
+# Lock jekyll-sass-converter to 2.x on Linux-musl
+if RUBY_PLATFORM =~ /linux-musl/
+  gem "jekyll-sass-converter", "~> 2.0"
+end

README.md

@@ -2,104 +2,94 @@
 
   # Chirpy Jekyll Theme
 
-  A minimal, responsive, and powerful Jekyll theme for presenting professional writing.
+  A minimal, responsive and feature-rich Jekyll theme for technical writing.
 
   [![Gem Version](https://img.shields.io/gem/v/jekyll-theme-chirpy?color=brightgreen)](https://rubygems.org/gems/jekyll-theme-chirpy)
-  [![Build Status](https://github.com/cotes2020/jekyll-theme-chirpy/workflows/build/badge.svg?branch=master&event=push)](https://github.com/cotes2020/jekyll-theme-chirpy/actions?query=branch%3Amaster+event%3Apush)
+  [![CI](https://github.com/cotes2020/jekyll-theme-chirpy/actions/workflows/ci.yml/badge.svg)](https://github.com/cotes2020/jekyll-theme-chirpy/actions/workflows/ci.yml)
   [![Codacy Badge](https://app.codacy.com/project/badge/Grade/4e556876a3c54d5e8f2d2857c4f43894)](https://www.codacy.com/gh/cotes2020/jekyll-theme-chirpy/dashboard?utm_source=github.com&utm_medium=referral&utm_content=cotes2020/jekyll-theme-chirpy&utm_campaign=Badge_Grade)
   [![GitHub license](https://img.shields.io/github/license/cotes2020/jekyll-theme-chirpy.svg)](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE)
   [![996.icu](https://img.shields.io/badge/link-996.icu-%23FF4D5B.svg)](https://996.icu)
 
-  [**Live Demo →**](https://cotes2020.github.io/chirpy-demo)
+  [**Live Demo →**][demo]
 
-  [![Devices Mockup](https://raw.githubusercontent.com/cotes2020/chirpy-images/main/commons/devices-mockup.png)](https://cotes2020.github.io/chirpy-demo)
+  [![Devices Mockup](https://chirpy-img.netlify.app/commons/devices-mockup.png)][demo]
 
 </div>
 
 ## Features
 
-- Localized Layout
-- Dark/Light Theme Mode
-- Pinned Posts
-- Hierarchical Categories
-- Last Modified Date for Posts
-- Table of Contents
-- Auto-generated Related Posts
-- Syntax Highlighting
-- Mathematical Expressions
-- Mermaid Diagram & Flowchart
-- Disqus/Utterances/Giscus Comments
-- Search
-- Atom Feeds
-- Google Analytics
-- GA Pageviews Reporting
-- SEO & Performance Optimization
+<details>
+  <summary>
+    <i>Click to view features</i>
+  </summary>
+  <p>
 
+  - Dark / Light Theme Mode
+  - Localized UI language
+  - Pinned Posts
+  - Hierarchical Categories
+  - Trending Tags
+  - Table of Contents
+  - Last Modified Date of Posts
+  - Syntax Highlighting
+  - Mathematical Expressions
+  - Mermaid Diagram & Flowchart
+  - Dark / Light Mode Images
+  - Embed Videos
+  - Disqus / Utterances / Giscus Comments
+  - Search
+  - Atom Feeds
+  - Google Analytics
+  - Page Views Reporting
+  - SEO & Performance Optimization
 
-## Quick Start
-
-Before starting, please follow the instructions in the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems`, `Jekyll`, and `Bundler`. In addition, [Git](https://git-scm.com/) is also required to be installed.
-
-### Step 1. Creating a New Site
-
-Create a new repository from the [**Chirpy Starter**](https://github.com/cotes2020/chirpy-starter/generate) and name it `<GH_USERNAME>.github.io`, where `GH_USERNAME` represents your GitHub username.
-
-### Step 2. Installing Dependencies
-
-Before running for the first time, go to the root directory of your site, and install dependencies as follows:
-
-```console
-$ bundle
-```
-
-### Step 3. Running Local Server
-
-Run the following command in the root directory of the site:
-
-```console
-$ bundle exec jekyll s
-```
-
-Or run with Docker:
-
-```console
-$ docker run -it --rm \
-    --volume="$PWD:/srv/jekyll" \
-    -p 4000:4000 jekyll/jekyll \
-    jekyll serve
-```
-
-After a while, navigate to the site at <http://localhost:4000>.
+  </p>
+</details>
 
 ## Documentation
 
-For more details on usage, please refer to the tutorial on the [demo website](https://cotes2020.github.io/chirpy-demo/) / [wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki). Note that the tutorial is based on the [latest tag](https://github.com/cotes2020/jekyll-theme-chirpy/tags), and the features of the default branch are usually ahead of the documentation.
+To explore usage, development, and upgrade guide of the project, please refer to
+the [Wiki][wiki].
 
 ## Contributing
 
-Welcome to report bugs, improve code quality or submit a new feature. For more information, see [contributing guidelines](.github/CONTRIBUTING.md).
+Welcome to report bugs, help improve the code or submit new features.
+For more information, please see the ["Contributing Guidelines"][contribute-guide].
 
 ## Credits
 
-This theme is mainly built with [Jekyll](https://jekyllrb.com/) ecosystem, [Bootstrap](https://getbootstrap.com/), [Font Awesome](https://fontawesome.com/) and some other wonderful tools (their copyright information can be found in the relevant files). The avatar and favicon design come from [Clipart Max](https://www.clipartmax.com/middle/m2i8b1m2K9Z5m2K9_ant-clipart-childrens-ant-cute/).
+This theme is mainly built with [Jekyll][jekyllrb] ecosystem,
+[Bootstrap][bootstrap], [Font Awesome][icons] and some other [wonderful tools][lib].
+The avatar and favicon design come from [Clipart Max][image].
 
-:tada: Thanks to all the volunteers who contributed to this project, their GitHub IDs are on [this list](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors). Also, I won't forget those guys who submitted the issues or unmerged PR because they reported bugs, shared ideas, or inspired me to write more readable documentation.
+Thanks to all the [contributors][contributors]. Also, folks who submitted issues
+or unmerged PRs should not be forgotten. Because they reported bugs, shared ideas,
+or inspired me to write more readable documentation.
 
-Last but not least, thank [JetBrains][jb] for providing the OSS development license.
+Last but not least, thanks to [JetBrains][jetbrains] for providing the
+_Open Source Development_ license.
 
 ## Sponsoring
 
-If you like this theme or find it helpful, please consider sponsoring me, because it will encourage and help me better maintain the project, I will be very grateful!
+If you'd like to sponsor this project, the following options are available.
 
 [![Ko-fi](https://img.shields.io/badge/-Buy%20Me%20a%20Coffee-ff5f5f?logo=ko-fi&logoColor=white)](https://ko-fi.com/coteschung)
-[![Wechat Pay](https://img.shields.io/badge/-Tip%20Me%20on%20WeChat-brightgreen?logo=wechat&logoColor=white)][cn-donation]
-[![Alipay](https://img.shields.io/badge/-Tip%20Me%20on%20Alipay-blue?logo=alipay&logoColor=white)][cn-donation]
+[![Wechat Pay](https://img.shields.io/badge/-Tip%20Me%20on%20WeChat-brightgreen?logo=wechat&logoColor=white)][donation]
+[![Alipay](https://img.shields.io/badge/-Tip%20Me%20on%20Alipay-blue?logo=alipay&logoColor=white)][donation]
 
 ## License
 
-This work is published under [MIT](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE) License.
+This work is published under [MIT][mit] License.
 
-<!-- ReadMe links -->
-
-[jb]: https://www.jetbrains.com/?from=jekyll-theme-chirpy
-[cn-donation]: https://cotes.gitee.io/alipay-wechat-donation/
+[jekyllrb]: https://jekyllrb.com/
+[bootstrap]: https://getbootstrap.com/
+[icons]: https://fontawesome.com/
+[image]: https://www.clipartmax.com/middle/m2i8b1m2K9Z5m2K9_ant-clipart-childrens-ant-cute/
+[demo]: https://cotes2020.github.io/chirpy-demo/
+[wiki]: https://github.com/cotes2020/jekyll-theme-chirpy/wiki
+[contribute-guide]: https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/.github/CONTRIBUTING.md
+[contributors]: https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors
+[lib]: https://github.com/cotes2020/chirpy-static-assets
+[jetbrains]: https://www.jetbrains.com/?from=jekyll-theme-chirpy
+[donation]: https://sponsor.cotes.page/
+[mit]: https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE

_config.yml

@@ -5,62 +5,59 @@ theme: jekyll-theme-chirpy
 
 # Change the following value to '/PROJECT_NAME' ONLY IF your site type is GitHub Pages Project sites
 # and doesn't have a custom domain.
-baseurl: ''
+baseurl: ""
 
 # The language of the webpage › http://www.lingoes.net/en/translator/langcode.htm
 # If it has the same name as one of the files in folder `_data/locales`, the layout language will also be changed,
 # otherwise, the layout language will use the default value of 'en'.
 lang: en
 
-# Additional parameters for datetime localization, optional. › https://github.com/iamkun/dayjs/tree/dev/src/locale
-prefer_datetime_locale:
-
 # Change to your timezone › http://www.timezoneconverter.com/cgi-bin/findzone/findzone
 timezone: Asia/Shanghai
 
 # jekyll-seo-tag settings › https://github.com/jekyll/jekyll-seo-tag/blob/master/docs/usage.md
 # ↓ --------------------------
 
-title: Chirpy                          # the main title
+title: Chirpy # the main title
 
-tagline: A text-focused Jekyll theme   # it will display as the sub-title
+tagline: A text-focused Jekyll theme # it will display as the sub-title
 
-description: >-                        # used by seo meta and the atom feed
-  A minimal, responsive, and powerful Jekyll theme for presenting professional writing.
+description: >- # used by seo meta and the atom feed
+  A minimal, responsive and feature-rich Jekyll theme for technical writing.
 
 # fill in the protocol & hostname for your site, e.g., 'https://username.github.io'
-url: ''
+url: ""
 
 github:
-  username: github_username             # change to your github username
+  username: github_username # change to your github username
 
 twitter:
-  username: twitter_username            # change to your twitter username
+  username: twitter_username # change to your twitter username
 
 social:
   # Change to your full name.
   # It will be displayed as the default author of the posts and the copyright owner in the Footer
   name: your_full_name
-  email: example@doamin.com             # change to your email address
+  email: example@domain.com # change to your email address
   links:
     # The first element serves as the copyright owner's link
-    - https://twitter.com/username      # change to your twitter homepage
-    - https://github.com/username       # change to your github homepage
+    - https://twitter.com/username # change to your twitter homepage
+    - https://github.com/username # change to your github homepage
     # Uncomment below to add more social links
     # - https://www.facebook.com/username
     # - https://www.linkedin.com/in/username
 
-google_site_verification:               # fill in to your verification string
+google_site_verification: # fill in to your verification string
 
 # ↑ --------------------------
 # The end of `jekyll-seo-tag` settings
 
 google_analytics:
-  id:                 # fill in your Google Analytics ID
+  id: # fill in your Google Analytics ID
   # Google Analytics pageviews report settings
   pv:
-    proxy_endpoint:   # fill in the Google Analytics superProxy endpoint of Google App Engine
-    cache_path:       # the local PV cache data, friendly to visitors from GFW region
+    proxy_endpoint: # fill in the Google Analytics superProxy endpoint of Google App Engine
+    cache_path: # the local PV cache data, friendly to visitors from GFW region
 
 # Prefer color scheme setting.
 #
@@ -73,50 +70,51 @@ google_analytics:
 #     light  - Use the light color scheme
 #     dark   - Use the dark color scheme
 #
-theme_mode:   # [light|dark]
+theme_mode: # [light|dark]
 
 # The CDN endpoint for images.
 # Notice that once it is assigned, the CDN url
 # will be added to all image (site avatar & posts' images) paths starting with '/'
 #
 # e.g. 'https://cdn.com'
-img_cdn: 'https://raw.githubusercontent.com/cotes2020/chirpy-images/main'
+img_cdn: "https://chirpy-img.netlify.app"
 
 # the avatar on sidebar, support local or CORS resources
-avatar: '/commons/avatar.jpg'
+avatar: "/commons/avatar.jpg"
 
-# boolean type, the global switch for ToC in posts.
+# boolean type, the global switch for TOC in posts.
 toc: true
 
 comments:
-  active:         # The global switch for posts comments, e.g., 'disqus'.  Keep it empty means disable
+  active: # The global switch for posts comments, e.g., 'disqus'.  Keep it empty means disable
   # The active options are as follows:
   disqus:
-    shortname:    # fill with the Disqus shortname. › https://help.disqus.com/en/articles/1717111-what-s-a-shortname
+    shortname: # fill with the Disqus shortname. › https://help.disqus.com/en/articles/1717111-what-s-a-shortname
   # utterances settings › https://utteranc.es/
   utterances:
-    repo:         # <gh-username>/<repo>
-    issue_term:   # < url | pathname | title | ...>
+    repo: # <gh-username>/<repo>
+    issue_term: # < url | pathname | title | ...>
   # Giscus options › https://giscus.app
   giscus:
-    repo:             # <gh-username>/<repo>
+    repo: # <gh-username>/<repo>
     repo_id:
     category:
     category_id:
-    mapping:          # optional, default to 'pathname'
-    input_position:   # optional, default to 'bottom'
-    lang:             # optional, default to the value of `site.lang`
+    mapping: # optional, default to 'pathname'
+    input_position: # optional, default to 'bottom'
+    lang: # optional, default to the value of `site.lang`
+    reactions_enabled: # optional, default to the value of `1`
 
 # Self-hosted static assets, optional › https://github.com/cotes2020/chirpy-static-assets
 assets:
   self_host:
-    enabled:      # boolean, keep empty means false
+    enabled: # boolean, keep empty means false
     # specify the Jekyll environment, empty means both
     # only works if `assets.self_host.enabled` is 'true'
-    env:          # [development|production]
+    env: # [development|production]
 
 pwa:
-  enabled: true   # the option for PWA feature
+  enabled: true # the option for PWA feature
 
 paginate: 10
 
@@ -124,7 +122,7 @@ paginate: 10
 
 kramdown:
   syntax_highlighter: rouge
-  syntax_highlighter_opts:   # Rouge Options › https://github.com/jneen/rouge#full-options
+  syntax_highlighter_opts: # Rouge Options › https://github.com/jneen/rouge#full-options
     css_class: highlight
     # default_lang: console
     span:
@@ -140,12 +138,12 @@ collections:
 
 defaults:
   - scope:
-      path: ''          # An empty string here means all files in the project
+      path: "" # An empty string here means all files in the project
       type: posts
     values:
       layout: post
-      comments: true    # Enable comments in posts.
-      toc: true         # Display TOC column in posts.
+      comments: true # Enable comments in posts.
+      toc: true # Display TOC column in posts.
       # DO NOT modify the following parameter unless you are confident enough
       # to update the code of all other post links in this project.
       permalink: /posts/:title/
@@ -154,8 +152,8 @@ defaults:
     values:
       comments: false
   - scope:
-      path: ''
-      type: tabs             # see `site.collections`
+      path: ""
+      type: tabs # see `site.collections`
     values:
       layout: page
       permalink: /:title/
@@ -181,13 +179,13 @@ compress_html:
     envs: [development]
 
 exclude:
-  - '*.gem'
-  - '*.gemspec'
+  - "*.gem"
+  - "*.gemspec"
   - tools
   - README.md
   - CHANGELOG.md
   - LICENSE
-  - gulpfile.js
+  - rollup.config.js
   - node_modules
   - package*.json
 

_data/assets/cross_origin.yml

@@ -16,47 +16,47 @@ webfonts: https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:w
 # Libraries
 
 jquery:
-  js: https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js
+  js: https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.min.js
 
 bootstrap:
-  css: https://cdn.jsdelivr.net/npm/bootstrap@4/dist/css/bootstrap.min.css
-  js: https://cdn.jsdelivr.net/npm/bootstrap@4/dist/js/bootstrap.bundle.min.js
+  css: https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css
+  js: https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js
 
-bootstrap-toc:
-  css: https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.css
-  js: https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.js
+toc:
+  css: https://cdn.jsdelivr.net/npm/tocbot@4.20.1/dist/tocbot.min.css
+  js: https://cdn.jsdelivr.net/npm/tocbot@4.20.1/dist/tocbot.min.js
 
 fontawesome:
-  css: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.11.2/css/all.min.css
+  css: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.1/css/all.min.css
 
 search:
   js: https://cdn.jsdelivr.net/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js
 
 mermaid:
-  js: https://cdn.jsdelivr.net/npm/mermaid@8/dist/mermaid.min.js
+  js: https://cdn.jsdelivr.net/npm/mermaid@9.2.2/dist/mermaid.min.js
 
 dayjs:
   js:
-    common: https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js
-    locale: https://cdn.jsdelivr.net/npm/dayjs@1/locale/:LOCALE.min.js
-    relativeTime: https://cdn.jsdelivr.net/npm/dayjs@1/plugin/relativeTime.min.js
-    localizedFormat: https://cdn.jsdelivr.net/npm/dayjs@1/plugin/localizedFormat.min.js
+    common: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/dayjs.min.js
+    locale: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/locale/:LOCALE.min.js
+    relativeTime: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/plugin/relativeTime.min.js
+    localizedFormat: https://cdn.jsdelivr.net/npm/dayjs@1.11.6/plugin/localizedFormat.min.js
 
 countup:
   js: https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js
 
 magnific-popup:
-  css: https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/magnific-popup.min.css
-  js: https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/jquery.magnific-popup.min.js
+  css: https://cdn.jsdelivr.net/npm/magnific-popup@1.1.0/dist/magnific-popup.min.css
+  js: https://cdn.jsdelivr.net/npm/magnific-popup@1.1.0/dist/jquery.magnific-popup.min.js
 
-lozad:
-  js: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
+lazysizes:
+  js: https://cdn.jsdelivr.net/npm/lazysizes@5.3.2/lazysizes.min.js
 
 clipboard:
-  js:  https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js
+  js: https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js
 
 polyfill:
   js: https://polyfill.io/v3/polyfill.min.js?features=es6
 
 mathjax:
-  js: https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js
+  js: https://cdn.jsdelivr.net/npm/mathjax@3.2.2/es5/tex-chtml.js

_data/assets/self_host.yml

@@ -5,47 +5,47 @@ webfonts: /assets/lib/fonts/main.css
 # Libraries
 
 jquery:
-  js: /assets/lib/jquery-3.6.0/jquery.min.js
+  js: /assets/lib/jquery/jquery.min.js
 
 bootstrap:
-  css: /assets/lib/bootstrap-4.6.1/bootstrap.min.css
-  js: /assets/lib/bootstrap-4.6.1/bootstrap.bundle.min.js
+  css: /assets/lib/bootstrap/bootstrap.min.css
+  js: /assets/lib/bootstrap/bootstrap.bundle.min.js
 
-bootstrap-toc:
-  css: /assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css
-  js: /assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js
+toc:
+  css: /assets/lib/tocbot/tocbot.min.css
+  js: /assets/lib/tocbot/tocbot.min.js
 
 fontawesome:
-  css: /assets/lib/fontawesome-free-5.15.4/css/all.min.css
+  css: /assets/lib/fontawesome-free/css/all.min.css
 
 search:
-  js: /assets/lib/simple-jekyll-search-1.10.0/simple-jekyll-search.min.js
+  js: /assets/lib/simple-jekyll-search/simple-jekyll-search.min.js
 
 mermaid:
-  js: /assets/lib/mermaid-8.13.10/mermaid.min.js
+  js: /assets/lib/mermaid/mermaid.min.js
 
 dayjs:
   js:
-    common: /assets/lib/dayjs-1.10.7/dayjs.min.js
-    locale: /assets/lib/dayjs-1.10.7/locale/en.min.js
-    relativeTime: /assets/lib/dayjs-1.10.7/plugin/relativeTime.min.js
-    localizedFormat: /assets/lib/dayjs-1.10.7/plugin/localizedFormat.min.js
+    common: /assets/lib/dayjs/dayjs.min.js
+    locale: /assets/lib/dayjs/locale/en.min.js
+    relativeTime: /assets/lib/dayjs/plugin/relativeTime.min.js
+    localizedFormat: /assets/lib/dayjs/plugin/localizedFormat.min.js
 
 countup:
-  js: /assets/lib/countup.js-1.9.3/countUp.min.js
+  js: /assets/lib/countup.js/countUp.min.js
 
 magnific-popup:
-  css: /assets/lib/magnific-popup-1.1.0/magnific-popup.css
-  js: /assets/lib/magnific-popup-1.1.0/jquery.magnific-popup.min.js
+  css: /assets/lib/magnific-popup/magnific-popup.css
+  js: /assets/lib/magnific-popup/jquery.magnific-popup.min.js
 
-lozad:
-  js: /assets/lib/lozad-1.16.0/lozad.min.js
+lazysizes:
+  js: /assets/lib/lazysizes/lazysizes.min.js
 
 clipboard:
-  js: /assets/lib/clipboard-2.0.9/clipboard.min.js
+  js: /assets/lib/clipboard/clipboard.min.js
 
 polyfill:
   js: /assets/lib/polyfill-v3-es6/polyfill.min.js
 
 mathjax:
-  js: /assets/lib/mathjax-3.2.0/tex-chtml.js
+  js: /assets/lib/mathjax/tex-chtml.js

_data/contact.yml

@@ -1,30 +1,28 @@
 #  The contact options.
 
--
-  type: github
-  icon: 'fab fa-github'
--
-  type: twitter
-  icon: 'fab fa-twitter'
--
-  type: email
-  icon: 'fas fa-envelope'
-  noblank: true            # open link in current tab
--
-  type: rss
-  icon: 'fas fa-rss'
-  noblank: true
+- type: github
+  icon: "fab fa-github"
 
+- type: twitter
+  icon: "fab fa-twitter"
+
+- type: email
+  icon: "fas fa-envelope"
+  noblank: true # open link in current tab
+
+- type: rss
+  icon: "fas fa-rss"
+  noblank: true
 # Uncomment and complete the url below to enable more contact options
-# -
-#   type: mastodon
+#
+# - type: mastodon
 #   icon: 'fab fa-mastodon'   # icons powered by <https://fontawesome.com/>
-#   url:  ''                  # Fill with your mastodon account page
-# -
-#   type: linkedin
+#   url:  ''                  # Fill with your Mastodon account page, rel="me" will be applied for verification
+#
+# - type: linkedin
 #   icon: 'fab fa-linkedin'   # icons powered by <https://fontawesome.com/>
 #   url:  ''                  # Fill with your Linkedin homepage
-# -
-#   type: stack-overflow
+#
+# - type: stack-overflow
 #   icon: 'fab fa-stack-overflow'
 #   url:  ''                  # Fill with your stackoverflow homepage

_data/locales/ar.yml

@@ -0,0 +1,93 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: منشور
+  category: فئة
+  tag: وسم
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: الرئيسية
+  categories: الفئات
+  tags: الوسوم
+  archives: الأرشيف
+  about: حول
+
+# the text displayed in the search bar & search results
+search:
+  hint: بحث
+  cancel: إلغاء
+  no_results: نأسف! لا يوجد نتائج.
+
+panel:
+  lastmod: المحدثة مؤخرا
+  trending_tags: الوسوم الشائعة
+  toc: محتويات
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: هذا المنشور تحت ترخيص :LICENSE_NAME بواسطة المؤلف.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: بعض الحقوق محفوظة.
+  verbose: >-
+    ما لم يذكر خلاف ذلك ، يتم ترخيص منشورات المدونة على هذا الموقع
+    بموجب ترخيص Creative Commons Attribution 4.0 International (CC BY 4.0) من قبل المؤلف.
+
+meta: باستخدام :PLATFORM السمة :THEME.
+
+not_found:
+  statment: عذرا, الرابط التالي غير صالح أو انه يشير إلى صفحة غير موجودة.
+
+notification:
+  update_found: يتوفر اصدار جديد للمحتوى.
+  update: تحديث
+
+# ----- Posts related labels -----
+
+post:
+  written_by: بواسطة
+  posted: نشّر
+  updated: حدّث
+  words: كلمات
+  pageview_measure: مشاهدات
+  read_time:
+    unit: دقيقة
+    prompt: قراءة
+  relate_posts: إقرأ المزيد
+  share: شارك
+  button:
+    next: الأجدد
+    previous: الأقدم
+    copy_code:
+      succeed: تم النسخ!
+    share_link:
+      title: أنسخ الرابط
+      succeed: تم نسخ الرابط بنجاح!
+  # pinned prompt of posts list on homepage
+  pin_prompt: مثبت
+
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
+# categories page
+categories:
+  category_measure:
+    singular: فئة
+    plural: فئات
+  post_measure:
+    singular: منشور
+    plural: منشورات

_data/locales/bg-BG.yml

@@ -0,0 +1,83 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Публикация
+  category: Категория
+  tag: Таг
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Начало
+  categories: Категории
+  tags: Тагове
+  archives: Архив
+  about: За мен
+
+# the text displayed in the search bar & search results
+search:
+  hint: търси
+  cancel: Отмени
+  no_results: Упс! Не са намерени резултати.
+
+panel:
+  lastmod: Наскоро обновени
+  trending_tags: Популярни тагове
+  toc: Съдържание
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Тази публикация е лицензирана под :LICENSE_NAME от автора.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Някои права запазени.
+  verbose: >-
+    Освен ако не е посочено друго, публикациите в блога на този сайт са лицензирани
+    под лиценза Creative Commons Attribution 4.0 (CC BY 4.0) от автора.
+
+meta: Създадено чрез :PLATFORM и :THEME тема.
+
+not_found:
+  statment: Съжалявам, но на този URL адрес няма налично съдържание.
+
+notification:
+  update_found: Налична е нова версия на съдържанието.
+  update: Обнови
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Автор
+  posted: Публикувана
+  updated: Обновена
+  words: думи
+  pageview_measure: преглеждания
+  read_time:
+    unit: мин
+    prompt: четиво
+  relate_posts: Още за четене
+  share: Споделете
+  button:
+    next: По-нови
+    previous: По-стари
+    copy_code:
+      succeed: Копирано!
+    share_link:
+      title: Копирай линк
+      succeed: Линкът е копиран успешно!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Прикрепенa
+
+# categories page
+categories:
+  category_measure:
+    singular: категория
+    plural: категории
+  post_measure:
+    singular: публикация
+    plural: публикации

_data/locales/cs-CZ.yml

@@ -0,0 +1,91 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Příspěvek
+  category: Kategorie
+  tag: Štítek
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Domů
+  categories: Kategorie
+  tags: Štítky
+  archives: Archivy
+  about: O mně
+
+# the text displayed in the search bar & search results
+search:
+  hint: hledat
+  cancel: Zrušit
+  no_results: Ups! Žádný výsledek nenalezen.
+
+panel:
+  lastmod: Nedávno aktualizováno
+  trending_tags: Trendy štítky
+  toc: Obsah
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Tento příspěvek je licencován pod :LICENSE_NAME autorem.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Některá práva vyhrazena.
+  verbose: >-
+    Pokud není uvedeno jinak, jsou příspěvky na tomto webu licencovány
+    pod licencí Creative Commons Attribution 4.0 International (CC BY 4.0) Licence autora.
+
+meta: Použití :PLATFORM s motivem :THEME.
+
+not_found:
+  statment: Omlouváme se, adresu URL jsme špatně umístili nebo odkazuje na něco, co neexistuje.
+
+notification:
+  update_found: Je k dispozici nová verze obsahu.
+  update: Aktualizace
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Od
+  posted: Zveřejněno
+  updated: Aktualizováno
+  words: slova
+  pageview_measure: zhlednutí
+  read_time:
+    unit: minut
+    prompt: čtení
+  relate_posts: Další čtení
+  share: Sdílet
+  button:
+    next: Novější
+    previous: Starší
+    copy_code:
+      succeed: Zkopírováno!
+    share_link:
+      title: Kopírovat odkaz
+      succeed: Zkopírováno!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Připnuto
+
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
+# categories page
+categories:
+  category_measure: kategorie
+  post_measure:
+    singular: příspěvěk
+    plural: příspěvky

_data/locales/de-DE.yml

@@ -0,0 +1,82 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Eintrag
+  category: Kategorie
+  tag: Tag
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Startseite
+  categories: Kategorien
+  tags: Tags
+  archives: Archiv
+  about: Über
+
+# the text displayed in the search bar & search results
+search:
+  hint: Suche
+  cancel: Abbrechen
+  no_results: Ups! Keine Einträge gefunden.
+
+panel:
+  lastmod: Kürzlich aktualisiert
+  trending_tags: Beliebte Tags
+  toc: Inhalt
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Dieser Eintrag ist vom Autor unter :LICENSE_NAME lizensiert.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Einige Rechte vorbehalten.
+  verbose: >-
+    Alle Einträge auf dieser Seite stehen, soweit nicht anders angegeben, unter der Lizenz Creative Commons Attribution 4.0 (CC BY 4.0).
+
+meta: Powered by :PLATFORM with :THEME theme.
+
+not_found:
+  statment: Entschuldigung, dieser Link verweist auf keine vorhandene Ressource.
+
+notification:
+  update_found: Eine neue Version ist verfügbar.
+  update: Neue Version
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Von
+  posted: Veröffentlicht
+  updated: Aktualisiert
+  words: Wörter
+  pageview_measure: Aufrufe
+  read_time:
+    unit: Minuten
+    prompt: lesen
+  relate_posts: Weiterlesen
+  share: Teilen
+  button:
+    next: Nächster Eintrag
+    previous: Eintrag vorher
+    copy_code:
+      succeed: Kopiert!
+    share_link:
+      title: Link kopieren
+      succeed: Link erfolgreich kopiert!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Angepinnt
+
+# categories page
+categories:
+  category_measure:
+    singular: Kategorie
+    plural: Kategorien
+  post_measure:
+    singular: Eintrag
+    plural: Einträge

_data/locales/el-GR.yml

@@ -0,0 +1,93 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Δημοσίευση
+  category: Κατηγορία
+  tag: Ετικέτα
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Home
+  categories: Κατηγορίες
+  tags: Ετικέτες
+  archives: Αρχεία
+  about: Σχετικά
+
+# the text displayed in the search bar & search results
+search:
+  hint: αναζήτηση
+  cancel: Ακύρωση
+  no_results: Oops! Κανένα αποτέλεσμα δεν βρέθηκε.
+
+panel:
+  lastmod: Σχετικά ενημερωμένα
+  trending_tags: Ετικέτες τάσης
+  toc: Περιεχόμενα
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Η δημοσίευση αυτή βρίσκεται υπο την άδεια :LICENSE_NAME Greekforce1821.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Ορισμένα δικαιώματα reserved.
+  verbose: >-
+    Εκτός αλλού ή οπουδήποτε αλλού, τα blog posts σε αυτήν την σελίδα βρίσκονται υπο την άδεια
+    Creative Commons Attribution 4.0 International (CC BY 4.0) του δημιουργού.
+
+meta: Αξιοποιώντας την :PLATFORM theme :THEME.
+
+not_found:
+  statment: Συγνώμη, έχουμε τοποθετήσει λάθος αυτήν την διεύθυνση URL ή υποδεικνύει κάτι που δεν υπάρχει.
+
+notification:
+  update_found: Υπάρχει διαθέσιμη μια νέα έκδοση του περιεχομένου.
+  update: Ενημέρωση
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Από
+  posted: Δημοσιεύθηκε
+  updated: Ενημερώθηκε
+  words: λέξεις
+  pageview_measure: προβολές
+  read_time:
+    unit: Λεπτά
+    prompt: διαβάσματος
+  relate_posts: Περισσότερα
+  share: Κοινοποιήστε
+  button:
+    next: Νεότερα
+    previous: Παλαιότερα
+    copy_code:
+      succeed: Αντιγράφθηκε!
+    share_link:
+      title: Αντιγραφή συνδέσμου
+      succeed: Η διεύθυνση αντιγράφθηκε με επιτυχία!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Pinned
+
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
+# categories page
+categories:
+  category_measure:
+    singular: Κατηγορία
+    plural: Κατηγορίες
+  post_measure:
+    singular: Δημοσίευση
+    plural: Δημοσιεύσεις

_data/locales/en.yml

@@ -40,7 +40,7 @@ copyright:
     Except where otherwise noted, the blog posts on this site are licensed
     under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.
 
-meta: Powered by :PLATFORM with :THEME theme.
+meta: Using the :PLATFORM theme :THEME.
 
 not_found:
   statment: Sorry, we've misplaced that URL or it's pointing to something that doesn't exist.
@@ -73,6 +73,16 @@ post:
   # pinned prompt of posts list on homepage
   pin_prompt: Pinned
 
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
 # categories page
 categories:
   category_measure:

_data/locales/fi-FI.yml

@@ -0,0 +1,92 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Julkaisu
+  category: Kateogoria
+  tag: Tagi
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Koti
+  categories: Kateogoriat
+  tags: Tagit
+  archives: Arkistot
+  about: Minusta
+
+# the text displayed in the search bar & search results
+search:
+  hint: etsi
+  cancel: Peruuta
+  no_results: Hups! Ei tuloksia.
+
+panel:
+  lastmod: Viimeksi päivitetty
+  trending_tags: Trendaavat tagit
+  toc: Sisältö
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Tämä julkaisu on lisenssoitu :LICENSE_NAME julkaisijan toimesta.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Jotkut oikeudet pidätetään.
+  verbose: >-
+    Paitsi jos erikseen mainitaan on kaikki sisältö Creative Commons Attribution 4.0 International (CC BY 4.0) Lisensoitu kirjoittajan toimesta.
+
+meta: Käytetään :PLATFORM iä Teema :THEME.
+
+not_found:
+  statment: Valitettavasti tällä URL-osoitteella ei ole saatavilla sisältöä.
+
+notification:
+  update_found: Uusi versio sisällöstä on saatavilla.
+  update: Päivitä
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Kirjoittaja
+  posted: Julkaistu
+  updated: Päivitetty
+  words: sanaa
+  pageview_measure: katselukertoja
+  read_time:
+    unit: minuuttia
+    prompt: lukea
+  relate_posts: Jatka lukemista
+  share: Jaa
+  button:
+    next: Uudempi
+    previous: Vanhempi
+    copy_code:
+      succeed: Kopiotu!
+    share_link:
+      title: Kopioi linkki
+      succeed: Linkki kopioitu onnistuneesti!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Kiinnitetty
+
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
+# categories page
+categories:
+  category_measure:
+    singular: kategoria
+    plural: kategoriat
+  post_measure:
+    singular: julkaisu
+    plural: julkaisut

_data/locales/hu-HU.yml

@@ -0,0 +1,81 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Bejegyzés
+  category: Kategória
+  tag: Címke
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Kezdőlap
+  categories: Kategóriák
+  tags: Címkék
+  archives: Archívum
+  about: Rólam
+
+# the text displayed in the search bar & search results
+search:
+  hint: keresés
+  cancel: Mégse
+  no_results: Oops! Nincs találat a keresésre.
+
+panel:
+  lastmod: Legutóbb frissítve
+  trending_tags: Népszerű Címkék
+  toc: Tartalom
+  links: Blog linkek
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: A bejegyzés :LICENSE_NAME licenccel rendelkezik.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Néhány jog fenntartva.
+  verbose: >-
+   Az oldalon található tartalmak
+   Creative Commons Attribution 4.0 International (CC BY 4.0) licenccel rendelkeznek,
+   hacsak másképp nincs jelezve.
+
+meta: Készítve :PLATFORM motorral :THEME témával.
+
+not_found:
+  statment: Sajnáljuk, az URL-t rosszul helyeztük el, vagy valami nem létezőre mutat.
+
+notification:
+  update_found: Elérhető a tartalom új verziója.
+  update: Frissítés
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Szerző
+  posted: Létrehozva
+  updated: Frissítve
+  words: szó
+  pageview_measure: látogató
+  read_time:
+    unit: perc
+    prompt: elolvasni
+  relate_posts: További olvasnivaló
+  share: Megosztás
+  button:
+    next: Újabb
+    previous: Régebbi
+    copy_code:
+      succeed: Másolva!
+    share_link:
+      title: Link másolása
+      succeed: Link sikeresen másolva!
+  # pinned prompt of posts list on homepage
+  pin_prompt: Kitűzve
+
+# categories page
+categories:
+  category_measure: kategória
+  post_measure: bejegyzés

_data/locales/it-IT.yml

@@ -0,0 +1,93 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Post
+  category: Categoria
+  tag: Tag
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Pagina principale
+  categories: Categorie
+  tags: Tags
+  archives: Archivio
+  about: Informazioni
+
+# the text displayed in the search bar & search results
+search:
+  hint: ricerca
+  cancel: Cancella
+  no_results: Oops! La ricerca non ha fornito risultati.
+
+panel:
+  lastmod: Aggiornati recentemente
+  trending_tags: Tags più cliccati
+  toc: Contenuti
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Questo post è sotto licenza :LICENSE_NAME a nome dell'autore.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/
+
+  # Displayed in the footer
+  brief: Alcuni diritti riservati.
+  verbose: >-
+    Eccetto quando esplicitamente menzionato, i post di questo blog sono da ritenersi sotto
+    i termini di licenza Creative Commons Attribution 4.0 International (CC BY 4.0).
+
+
+meta: Servizio offerto da :PLATFORM con tema :THEME.                                       
+not_found:
+  statment: Ci scusiamo, non è stato possibile trovare l'URL in questione. Potrebbe puntare ad una pagina non esistente.
+
+notification:
+  update_found: Nuova versione del contenuto disponibile.
+  update: Aggiornamento
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Da
+  posted: Postato
+  updated: Aggiornato
+  words: parole
+  pageview_measure: visioni
+  read_time:
+    unit: min
+    prompt: lettura
+  relate_posts: Continua a leggere
+  share: Condividi
+  button:
+    next: Più recenti
+    previous: Meno recenti
+    copy_code:
+      succeed: Copiato!
+    share_link:
+      title: Copia link
+      succeed: Link copiato con successo!
+  # pinned prompt of posts list on homepage
+  pin_prompt: In alto
+
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%b %e, %Y'
+    dayjs: 'll'
+  archives:
+    strftime: '%b'
+    dayjs: 'MMM'
+
+# categories page
+categories:
+  category_measure:
+    singular: categoria
+    plural: categorie
+  post_measure:
+    singular: post
+    plural: posts

_data/locales/ko-KR.yml

@@ -73,6 +73,13 @@ post:
   # pinned prompt of posts list on homepage
   pin_prompt: 핀
 
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%Y/%m/%d'
+    dayjs: 'YYYY/MM/DD'
+
 # categories page
 categories:
   category_measure: 카테고리

_data/locales/pt-BR.yml

@@ -37,7 +37,7 @@ copyright:
   # Displayed in the footer
   brief: Alguns direitos reservados.
   verbose: >-
-    Exceto onde indicado de outra forma, as postagens do blog neste site são licenciadas sob a 
+    Exceto onde indicado de outra forma, as postagens do blog neste site são licenciadas sob a
     Creative Commons Attribution 4.0 International (CC BY 4.0) License pelo autor.
 
 meta: Feito com :PLATFORM usando o tema :THEME.

_data/locales/tr-TR.yml

@@ -0,0 +1,79 @@
+# The layout text of site
+
+# ----- Commons label -----
+
+layout:
+  post: Gönderi
+  category: Kategori
+  tag: Etiket
+
+# The tabs of sidebar
+tabs:
+  # format: <filename_without_extension>: <value>
+  home: Ana Sayfa
+  categories: Kategoriler
+  tags: Etiketler
+  archives: Arşiv
+  about: Hakkında
+
+# the text displayed in the search bar & search results
+search:
+  hint: Ara...
+  cancel: İptal
+  no_results: Hop! Öyle bir şey bulamadım.
+
+panel:
+  lastmod: Yeni Güncellendi
+  trending_tags: Yükselen Etiketler
+  toc: İçindekiler
+
+copyright:
+  # Shown at the bottom of the post
+  license:
+    template: Bu gönderi :LICENSE_NAME lisansı altındadır.
+    name: CC BY 4.0
+    link: https://creativecommons.org/licenses/by/4.0/deed.tr
+
+  # Displayed in the footer
+  brief: Bazı hakları saklıdır.
+  verbose: >-
+    Aksi belirtilmediği sürece, bu sitedeki gönderiler Creative Commons Atıf 4.0 Uluslararası (CC BY 4.0) Lisansı altındadır.
+    Kısaca sayfa linkini de vererek paylaşabilir veya düzenleyip paylaşabilirsin.
+
+meta: :PLATFORM ve :THEME teması.
+
+not_found:
+  statment: Üzgünüz, bu linki yanlış yerleştirdik veya var olmayan bir şeye işaret ediyor.
+
+notification:
+  update_found: İçeriğin yeni bir sürümü mevcut.
+  update: Güncelle
+
+# ----- Posts related labels -----
+
+post:
+  written_by: Yazan
+  posted: Gönderilme Tarihi
+  updated: Güncellenme Tarihi
+  words: sözcük
+  pageview_measure: görüntülenme
+  read_time:
+    unit: dakikada
+    prompt: okunabilir
+  relate_posts: Benzer Gönderiler
+  share: Paylaş
+  button:
+    next: İleri
+    previous: Geri
+    copy_code:
+      succeed: Kopyalandı.
+    share_link:
+      title: Linki kopyala
+      succeed: Link kopyalandı.
+  # pinned prompt of posts list on homepage
+  pin_prompt: Sabitlendi
+
+# categories page
+categories:
+  category_measure: kategori
+  post_measure: gönderi

_data/locales/zh-CN.yml

@@ -67,11 +67,18 @@ post:
     copy_code:
       succeed: 已复制！
     share_link:
-      title:  分享链接
+      title: 分享链接
       succeed: 链接已复制！
   # pinned prompt of posts list on homepage
   pin_prompt: 顶置
 
+# Date time format.
+# See: <http://strftime.net/>, <https://day.js.org/docs/en/display/format>
+df:
+  post:
+    strftime: '%Y/%m/%d'
+    dayjs: 'YYYY/MM/DD'
+
 # categories page
 categories:
   category_measure: 个分类

_data/share.yml

@@ -2,26 +2,24 @@
 #  Icons from <https://fontawesome.com/>
 
 platforms:
-  -
-    type: Twitter
+  - type: Twitter
     icon: "fab fa-twitter"
     link: "https://twitter.com/intent/tweet?text=TITLE&url=URL"
-  -
-    type: Facebook
+
+  - type: Facebook
     icon: "fab fa-facebook-square"
     link: "https://www.facebook.com/sharer/sharer.php?title=TITLE&u=URL"
-  -
-    type: Telegram
+
+  - type: Telegram
     icon: "fab fa-telegram"
     link: "https://t.me/share/url?url=URL&text=TITLE"
 
   # Uncomment below if you need to.
-  # -
-  #   type: Linkedin
+  #
+  # - type: Linkedin
   #   icon: "fab fa-linkedin"
   #   link: "https://www.linkedin.com/sharing/share-offsite/?url=URL"
   #
-  # -
-  #   type: Weibo
+  # - type: Weibo
   #   icon: "fab fa-weibo"
   #   link: "http://service.weibo.com/share/share.php?title=TITLE&url=URL"

_includes/comments/disqus.html

@@ -1,54 +1,49 @@
-<!--
-  The Disqus lazy loading.
--->
+<!-- The Disqus lazy loading. -->
 <div id="disqus_thread" class="pt-2 pb-2">
-  <p class="text-center text-muted small">
-    Comments powered by <a href="https://disqus.com/">Disqus</a>.
-  </p>
+  <p class="text-center text-muted small">Comments powered by <a href="https://disqus.com/">Disqus</a>.</p>
 </div>
 
 <script type="text/javascript">
-
   var disqus_config = function () {
     this.page.url = '{{ page.url | absolute_url }}';
     this.page.identifier = '{{ page.url }}';
   };
 
   /* Lazy loading */
-
-  var disqus_observer = new IntersectionObserver(function (entries) {
-    if(entries[0].isIntersecting) {
+  var disqus_observer = new IntersectionObserver(
+    function (entries) {
+      if (entries[0].isIntersecting) {
         (function () {
-            var d = document, s = d.createElement('script');
-            s.src = 'https://{{ site.comments.disqus.shortname }}.disqus.com/embed.js';
-            s.setAttribute('data-timestamp', +new Date());
-            (d.head || d.body).appendChild(s);
+          var d = document,
+            s = d.createElement('script');
+          s.src = 'https://{{ site.comments.disqus.shortname }}.disqus.com/embed.js';
+          s.setAttribute('data-timestamp', +new Date());
+          (d.head || d.body).appendChild(s);
         })();
 
         disqus_observer.disconnect();
-    }
-  }, { threshold: [0] });
+      }
+    },
+    { threshold: [0] }
+  );
 
   disqus_observer.observe(document.querySelector('#disqus_thread'));
 
   /* Auto switch theme */
-
   function reloadDisqus() {
-    /* Disqus hasn't been loaded */
-    if (typeof DISQUS === "undefined") {
-      return;
-    }
+    if (event.source === window && event.data && event.data.direction === ModeToggle.ID) {
+      /* Disqus hasn't been loaded */
+      if (typeof DISQUS === 'undefined') {
+        return;
+      }
 
-    if (document.readyState == 'complete') {
-      DISQUS.reset({ reload: true, config: disqus_config });
+      if (document.readyState == 'complete') {
+        DISQUS.reset({ reload: true, config: disqus_config });
+      }
     }
   }
 
-  const modeToggle = document.querySelector(".mode-toggle");
-
-  if (typeof modeToggle !== "undefined") {
-    /*  modeToggle.addEventListener('click', reloadDisqus); // not pretty for 'color-scheme'  */
-    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', reloadDisqus);
+  if (document.querySelector('.mode-toggle')) {
+    window.addEventListener('message', reloadDisqus);
   }
-
 </script>

_includes/comments/giscus.html

@@ -20,7 +20,7 @@
       "data-category": "{{ site.comments.giscus.category }}",
       "data-category-id": "{{ site.comments.giscus.category_id }}",
       "data-mapping": "{{ site.comments.giscus.mapping | default: 'pathname' }}",
-      "data-reactions-enabled": "1",
+      "data-reactions-enabled": "{{ site.comments.giscus.reactions_enabled | default: '1' }}",
       "data-emit-metadata": "0",
       "data-theme": initTheme,
       "data-input-position": "{{ site.comments.giscus.input_position | default: 'bottom' }}",

_includes/datetime.html

@@ -4,14 +4,8 @@
 -->
 
 {% assign wrap_elem = include.wrap | default: 'em' %}
-
-{% if site.prefer_datetime_locale == 'en' or lang == 'en' %}
-  {% assign df_strftime = '%b %e, %Y' %}
-  {% assign df_dayjs = 'll' %}
-{% else %}
-  {% assign df_strftime = '%F' %}
-  {% assign df_dayjs = 'YYYY-MM-DD' %}
-{% endif %}
+{% assign df_strftime = site.data.locales[site.lang].df.post.strftime | default: '%d/%m/%Y' %}
+{% assign df_dayjs = site.data.locales[site.lang].df.post.dayjs | default: 'DD/MM/YYYY' %}
 
 <{{ wrap_elem }} class="{% if include.class %}{{ include.class }}{% endif %}"
     data-ts="{{ include.date | date: '%s' }}"

_includes/embed/twitch.html

@@ -0,0 +1,4 @@
+<iframe class="embed-video twitch lazyload"
+  src="https://player.twitch.tv/?video={{ include.id }}&parent={{ site.url | split: '://' | last | remove: '/' }}"
+  frameborder="0" allowfullscreen="true"
+  scrolling="no"></iframe>

_includes/embed/youtube.html

@@ -0,0 +1,6 @@
+<iframe class="embed-video youtube lazyload"
+  src="https://www.youtube.com/embed/{{ include.id }}"
+  title="YouTube video player"
+  frameborder="0"
+  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+  allowfullscreen></iframe>

_includes/footer.html

@@ -1,36 +1,36 @@
 <!-- The Footer -->
 
-<footer class="row pl-3 pr-3">
-  <div class="col-12 d-flex justify-content-between align-items-center text-muted pl-0 pr-0">
-    <div class="footer-left">
-      <p class="mb-0">
-        © {{ 'now' | date: "%Y" }}
-        <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
-        {% if site.data.locales[lang].copyright.brief %}
-        <span data-toggle="tooltip" data-placement="top"
-          title="{{ site.data.locales[lang].copyright.verbose }}">{{ site.data.locales[lang].copyright.brief }}</span>
-        {% endif %}
-      </p>
-    </div>
+<footer>
+  <div class="container pl-lg-4 pr-lg-4">
+    <div class="d-flex justify-content-between align-items-center text-muted ml-md-3 mr-md-3">
+      <div class="footer-left">
+        <p class="mb-0">
+          © {{ 'now' | date: "%Y" }}
+          <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
+          {% if site.data.locales[site.lang].copyright.brief %}
+          <span data-toggle="tooltip" data-placement="top"
+            title="{{ site.data.locales[site.lang].copyright.verbose }}">{{ site.data.locales[site.lang].copyright.brief }}</span>
+          {% endif %}
+        </p>
+      </div>
 
-    <div class="footer-right">
-      <p class="mb-0">
-        {% capture _platform %}
+      <div class="footer-right">
+        <p class="mb-0">
+
+          {%- capture _platform -%}
           <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>
-        {% endcapture %}
+          {%- endcapture -%}
 
-        {% capture _theme %}
+          {%- capture _theme -%}
           <a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a>
-        {% endcapture %}
+          {%- endcapture -%}
 
-        {{ site.data.locales[lang].meta
-          | default: 'Powered by :PLATFORM with :THEME theme.'
-          | replace: ':PLATFORM', _platform | replace: ':THEME', _theme
-        }}
-
-      </p>
+          {{ site.data.locales[site.lang].meta
+            | default: 'Using the :PLATFORM theme :THEME.'
+            | replace: ':PLATFORM', _platform | replace: ':THEME', _theme
+          }}
+        </p>
+      </div>
     </div>
-
   </div>
-
 </footer>

_includes/head.html

@@ -1,18 +1,17 @@
-<!--
-  The Head
--->
+<!-- The Head -->
 
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-  <!-- Allow having a localized datetime different from the appearance language -->
-  {% if site.prefer_datetime_locale %}
-    <meta name="prefer-datetime-locale" content="{{ site.prefer_datetime_locale }}">
-  {% endif %}
+  <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f7f7f7">
+  <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1b1b1e">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <meta
+    name="viewport"
+    content="width=device-width, user-scalable=no initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
+  >
 
   {% if page.layout == 'home' or page.layout == 'post' %}
-
     {% if site.google_analytics.pv.proxy_endpoint %}
       <meta name="pv-proxy-endpoint" content="{{ site.google_analytics.pv.proxy_endpoint }}">
     {% endif %}
@@ -20,61 +19,58 @@
     {% if site.google_analytics.pv.cache_path %}
       <meta name="pv-cache-path" content="{{ site.google_analytics.pv.cache_path | relative_url }}">
     {% endif %}
-
   {% endif %}
 
   {% capture seo_tags %}
     {% seo title=false %}
   {% endcapture %}
 
-  {% if site.img_cdn and seo_tags contains 'og:image' %}
-    {% assign properties = 'og:image,twitter:image' | split: ',' %}
+  {% if page.image %}
+    {% assign img = page.image.path | default: page.image %}
+
+    {% unless img contains '://' %}
+      {% assign img_path = page.img_path | append: '/' | append: img | replace: '//', '/' %}
+      {% capture target %}"{{ img | absolute_url }}"{% endcapture %}
 
-    {% for prop in properties %}
       {% if site.img_cdn contains '//' %}
-        <!-- `site.img_cdn` is a cross-origin URL -->
-        {% capture target %}<meta property="{{ prop }}" content="{{ site.url }}{% endcapture %}
-        {% capture replacement %}<meta property="{{ prop }}" content="{{ site.img_cdn }}{% endcapture %}
+        <!-- it's a cross-origin URL -->
+        {% capture replacement %}"{{ site.img_cdn }}{{ img_path }}"{% endcapture %}
       {% else %}
-        <!-- `site.img_cdn` is a local file path -->
-        {% capture target %}<meta property="{{ prop }}" content="{{ site.url }}{{ site.baseurl }}{% endcapture %}
-        {% assign replacement = target | append: site.img_cdn %}
+        <!-- it's a local file path -->
+        {%- capture replacement -%}
+          "{{ site.img_cdn | append: '/' | append: img_path | replace: '//', '/' | absolute_url }}"
+        {%- endcapture -%}
       {% endif %}
 
       {% assign seo_tags = seo_tags | replace: target, replacement %}
-
-    {% endfor %}
+    {% endunless %}
   {% endif %}
 
   {{ seo_tags }}
 
   <title>
-  {%- unless page.layout == "home" -%}
-    {{ page.title | append: " | "}}
-  {%- endunless -%}
+    {%- unless page.layout == 'home' -%}
+      {{ page.title | append: ' | ' }}
+    {%- endunless -%}
     {{ site.title }}
   </title>
 
   {% include favicons.html %}
 
   {% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %}
-
     <link href="{{ site.data.assets[origin].webfonts | relative_url }}" rel="stylesheet">
 
   {% else %}
-
     {% for cdn in site.data.assets[origin].cdns %}
       <link rel="preconnect" href="{{ cdn.url }}" {{ cdn.args }}>
       <link rel="dns-prefetch" href="{{ cdn.url }}" {{ cdn.args }}>
     {% endfor %}
 
     <link rel="stylesheet" href="{{ site.data.assets[origin].webfonts | relative_url }}">
-
   {% endif %}
 
   <!-- GA -->
-  {% if jekyll.environment == 'production'
-      and site.google_analytics.id != empty and site.google_analytics.id %}
+  {% if jekyll.environment == 'production' and site.google_analytics.id != empty and site.google_analytics.id %}
     <link rel="preconnect" href="https://www.google-analytics.com" crossorigin="use-credentials">
     <link rel="dns-prefetch" href="https://www.google-analytics.com">
 
@@ -83,7 +79,11 @@
 
     {% if site.google_analytics.pv.proxy_endpoint %}
       {% assign proxy_url = site.google_analytics.pv.proxy_endpoint
-          | replace: "https://", "" | split: "/" | first | prepend: "https://" %}
+        | replace: 'https://', ''
+        | split: '/'
+        | first
+        | prepend: 'https://'
+      %}
       <link rel="preconnect" href="{{ proxy_url }}" crossorigin="use-credentials">
       <link rel="dns-prefetch" href="{{ proxy_url }}">
     {% endif %}
@@ -98,7 +98,7 @@
   <link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
 
   {% if site.toc and page.toc %}
-    <link rel="stylesheet" href="{{ site.data.assets[origin].bootstrap-toc.css | relative_url }}">
+    <link rel="stylesheet" href="{{ site.data.assets[origin].toc.css | relative_url }}">
   {% endif %}
 
   {% if page.layout == 'page' or page.layout == 'post' %}

_includes/js-selector.html

@@ -1,6 +1,4 @@
-<!--
-  JS selector for site.
--->
+<!-- JS selector for site. -->
 
 <!-- layout specified -->
 
@@ -8,56 +6,50 @@
   {% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
     <!-- pv-report needs countup.js -->
     <script async src="{{ site.data.assets[origin].countup.js | relative_url }}"></script>
-    <script defer src="{{ '/assets/js/dist/pvreport.min.js' | relative_url }}"></script>
   {% endif %}
 {% endif %}
 
 {% if page.layout == 'post' or page.layout == 'page' %}
   <!-- image lazy-loading & popup & clipboard -->
-  {% assign _urls = site.data.assets[origin].magnific-popup.js
-      | append: ',' | append: site.data.assets[origin].lozad.js
-      | append: ',' | append: site.data.assets[origin].clipboard.js
+  {% assign _urls = site.data.assets[origin]['magnific-popup'].js
+    | append: ','
+    | append: site.data.assets[origin].lazysizes.js
+    | append: ','
+    | append: site.data.assets[origin].clipboard.js
   %}
 
   {% include jsdelivr-combine.html urls=_urls %}
-
 {% endif %}
 
 {% if page.layout == 'home'
-    or page.layout == 'post'
-    or page.layout == 'archives'
-    or page.layout == 'category'
-    or page.layout == 'tag' %}
-
-  {% if site.prefer_datetime_locale %}
-    {% assign locale = site.prefer_datetime_locale | downcase %}
-  {% else %}
-    {% assign locale = site.lang | split: '-' | first %}
-  {% endif %}
+  or page.layout == 'post'
+  or page.layout == 'archives'
+  or page.layout == 'category'
+  or page.layout == 'tag'
+%}
+  {% assign locale = site.lang | split: '-' | first %}
 
   {% assign _urls = site.data.assets[origin].dayjs.js.common
-      | append: ',' | append: site.data.assets[origin].dayjs.js.locale
-      | replace: ':LOCALE', locale
-      | append: ',' | append: site.data.assets[origin].dayjs.js.relativeTime
-      | append: ',' | append: site.data.assets[origin].dayjs.js.localizedFormat
+    | append: ','
+    | append: site.data.assets[origin].dayjs.js.locale
+    | replace: ':LOCALE', locale
+    | append: ','
+    | append: site.data.assets[origin].dayjs.js.relativeTime
+    | append: ','
+    | append: site.data.assets[origin].dayjs.js.localizedFormat
   %}
 
   {% include jsdelivr-combine.html urls=_urls %}
-
 {% endif %}
 
-{% if page.layout == 'home'
-    or page.layout == 'categories'
-    or page.layout == 'post'
-    or page.layout == 'page' %}
-  {% assign type = page.layout %}
-{% elsif page.layout == 'archives'
-    or page.layout == 'category'
-    or page.layout == 'tag' %}
-  {% assign type = "misc" %}
-{% else %}
-  {% assign type = "commons" %}
-{% endif %}
+{% case page.layout %}
+  {% when 'categories', 'post', 'page' %}
+    {% assign type = page.layout %}
+  {% when 'home', 'archives', 'category', 'tag' %}
+    {% assign type = 'misc' %}
+  {% else %}
+    {% assign type = 'commons' %}
+{% endcase %}
 
 {% capture script %}/assets/js/dist/{{ type }}.min.js{% endcapture %}
 <script defer src="{{ script | relative_url }}"></script>
@@ -65,23 +57,24 @@
 {% if page.math %}
   <!-- MathJax -->
   <script>
-  /* see: <https://docs.mathjax.org/en/latest/options/input/tex.html#tex-options> */
-  MathJax = {
-    tex: {
-      inlineMath: [              /* start/end delimiter pairs for in-line math */
-        ['$','$'],
-        ['\\(','\\)']
-      ],
-      displayMath: [             /* start/end delimiter pairs for display math */
-        ['$$', '$$'],
-        ['\\[', '\\]']
-      ]
-    }
-  };
+    /* see: <https://docs.mathjax.org/en/latest/options/input/tex.html#tex-options> */
+    MathJax = {
+      tex: {
+        /* start/end delimiter pairs for in-line math */
+        inlineMath: [
+          ['$', '$'],
+          ['\\(', '\\)']
+        ],
+        /* start/end delimiter pairs for display math */
+        displayMath: [
+          ['$$', '$$'],
+          ['\\[', '\\]']
+        ]
+      }
+    };
   </script>
   <script src="{{ site.data.assets[origin].polyfill.js | relative_url }}"></script>
-  <script id="MathJax-script" async src="{{ site.data.assets[origin].mathjax.js | relative_url }}">
-  </script>
+  <script id="MathJax-script" async src="{{ site.data.assets[origin].mathjax.js | relative_url }}"></script>
 {% endif %}
 
 <!-- commons -->
@@ -100,5 +93,4 @@
   {% if site.google_analytics.id != empty and site.google_analytics.id %}
     {% include google-analytics.html %}
   {% endif %}
-
 {% endif %}

_includes/lang.html

@@ -1,8 +0,0 @@
-{% comment %}
-Detect appearance language and return it through variable "lang"
-{% endcomment %}
-{% if site.data.locales[site.lang] %}
-  {% assign lang = site.lang %}
-{% else %}
-  {% assign lang = 'en' %}
-{% endif %}

_includes/mermaid.html

@@ -5,10 +5,11 @@
 <script src="{{ site.data.assets[origin].mermaid.js | relative_url }}"></script>
 
 <script>
-  $(function() {
+  (function () {
+
     function updateMermaid(event) {
       if (event.source === window && event.data &&
-            event.data.direction === ModeToggle.ID) {
+        event.data.direction === ModeToggle.ID) {
 
         const mode = event.data.message;
 
@@ -16,11 +17,11 @@
           return;
         }
 
-        let expectedTheme = (mode === ModeToggle.DARK_MODE? "dark" : "default");
-        let config = { theme: expectedTheme };
+        let expectedTheme = (mode === ModeToggle.DARK_MODE ? "dark" : "default");
+        let config = {theme: expectedTheme};
 
         /* Re-render the SVG › <https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */
-        $(".mermaid").each(function() {
+        $(".mermaid").each(function () {
           let svgCode = $(this).prev().children().html();
           $(this).removeAttr("data-processed");
           $(this).html(svgCode);
@@ -35,7 +36,7 @@
 
     if ($("html[data-mode=dark]").length > 0
       || ($("html[data-mode]").length == 0
-        && window.matchMedia("(prefers-color-scheme: dark)").matches ) ) {
+        && window.matchMedia("(prefers-color-scheme: dark)").matches)) {
       initTheme = "dark";
     }
 
@@ -43,15 +44,16 @@
       theme: initTheme  /* <default|dark|forest|neutral> */
     };
 
-    /* Markdown converts to HTML */
-    $("pre").has("code.language-mermaid").each(function() {
+    /* Create mermaid tag */
+    $("pre").has("code.language-mermaid").each(function () {
       let svgCode = $(this).children().html();
       $(this).addClass("unloaded");
-      $(this).after(`<div class=\"mermaid\">${svgCode}</div>`);
+      $(this).after(`<pre class=\"mermaid\">${svgCode}</pre>`);
     });
 
     mermaid.initialize(mermaidConf);
 
     window.addEventListener("message", updateMermaid);
-  });
+  })();
+
 </script>

_includes/mode-toggle.html

@@ -26,13 +26,12 @@
       let self = this;
 
       /* always follow the system prefers */
-      this.sysDarkPrefers.addEventListener("change", () => {
+      this.sysDarkPrefers.addEventListener('change', () => {
         if (self.hasMode) {
           if (self.isDarkMode) {
             if (!self.isSysDarkPrefer) {
               self.setDark();
             }
-
           } else {
             if (self.isSysDarkPrefer) {
               self.setLight();
@@ -43,9 +42,7 @@
         }
 
         self.notify();
-
       });
-
     } /* constructor() */
 
     get sysDarkPrefers() { return window.matchMedia("(prefers-color-scheme: dark)"); }
@@ -62,8 +59,7 @@
 
     /* get the current mode on screen */
     get modeStatus() {
-      if (this.isDarkMode
-        || (!this.hasMode && this.isSysDarkPrefer)) {
+      if (this.isDarkMode || (!this.hasMode && this.isSysDarkPrefer)) {
         return ModeToggle.DARK_MODE;
       } else {
         return ModeToggle.LIGHT_MODE;
@@ -93,37 +89,32 @@
       }, "*");
     }
 
+    flipMode() {
+      if (this.hasMode) {
+        if (this.isSysDarkPrefer) {
+          if (this.isLightMode) {
+            this.clearMode();
+          } else {
+            this.setLight();
+          }
+        } else {
+          if (this.isDarkMode) {
+            this.clearMode();
+          } else {
+            this.setDark();
+          }
+        }
+      } else {
+        if (this.isSysDarkPrefer) {
+          this.setLight();
+        } else {
+          this.setDark();
+        }
+      }
+
+      this.notify();
+    } /* flipMode() */
   } /* ModeToggle */
 
-  const toggle = new ModeToggle();
-
-  function flipMode() {
-    if (toggle.hasMode) {
-      if (toggle.isSysDarkPrefer) {
-        if (toggle.isLightMode) {
-          toggle.clearMode();
-        } else {
-          toggle.setLight();
-        }
-
-      } else {
-        if (toggle.isDarkMode) {
-          toggle.clearMode();
-        } else {
-          toggle.setDark();
-        }
-      }
-
-    } else {
-      if (toggle.isSysDarkPrefer) {
-        toggle.setLight();
-      } else {
-        toggle.setDark();
-      }
-    }
-
-    toggle.notify();
-
-  } /* flipMode() */
-
+  const modeToggle = new ModeToggle();
 </script>

_includes/post-nav.html

@@ -5,24 +5,24 @@
 <div class="post-navigation d-flex justify-content-between">
   {% if page.previous.url %}
   <a href="{{ site.baseurl }}{{ page.previous.url }}" class="btn btn-outline-primary"
-    prompt="{{ site.data.locales[lang].post.button.previous }}">
+    prompt="{{ site.data.locales[site.lang].post.button.previous }}">
     <p>{{ page.previous.title }}</p>
   </a>
   {% else %}
   <div class="btn btn-outline-primary disabled"
-    prompt="{{ site.data.locales[lang].post.button.previous }}">
+    prompt="{{ site.data.locales[site.lang].post.button.previous }}">
     <p>-</p>
   </div>
   {% endif %}
 
   {% if page.next.url %}
   <a href="{{ site.baseurl }}{{page.next.url}}" class="btn btn-outline-primary"
-    prompt="{{ site.data.locales[lang].post.button.next }}">
+    prompt="{{ site.data.locales[site.lang].post.button.next }}">
     <p>{{ page.next.title }}</p>
   </a>
   {% else %}
   <div class="btn btn-outline-primary disabled"
-    prompt="{{ site.data.locales[lang].post.button.next }}">
+    prompt="{{ site.data.locales[site.lang].post.button.next }}">
     <p>-</p>
   </div>
   {% endif %}

_includes/post-paginator.html

@@ -2,7 +2,7 @@
   The paginator for post list on HomgPage.
 -->
 
-<ul class="pagination align-items-center mt-4 mb-5 pl-lg-2">
+<ul class="pagination align-items-center mt-4 pl-lg-2">
   <!-- left arrow -->
   {% if paginator.previous_page %}
     {% assign prev_url = paginator.previous_page_path | relative_url %}

_includes/post-sharing.html

@@ -3,10 +3,10 @@
 -->
 
 <div class="share-wrapper">
-  <span class="share-label text-muted mr-1">{{ site.data.locales[lang].post.share }}</span>
+  <span class="share-label text-muted mr-1">{{ site.data.locales[site.lang].post.share }}</span>
   <span class="share-icons">
     {% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %}
-    {% assign title = title | url_encode %}
+    {% assign title = title | uri_escape %}
     {% assign url = page.url | absolute_url | url_encode %}
 
     {% for share in site.data.share.platforms %}
@@ -19,8 +19,8 @@
 
     <i id="copy-link" class="fa-fw fas fa-link small"
         data-toggle="tooltip" data-placement="top"
-        title="{{ site.data.locales[lang].post.button.share_link.title }}"
-        data-title-succeed="{{ site.data.locales[lang].post.button.share_link.succeed }}">
+        title="{{ site.data.locales[site.lang].post.button.share_link.title }}"
+        data-title-succeed="{{ site.data.locales[site.lang].post.button.share_link.succeed }}">
     </i>
 
   </span>

_includes/read-time.html

@@ -16,13 +16,13 @@
 {% endunless %}
 
 {% capture read_prompt %}
-  {{- site.data.locales[lang].post.read_time.prompt -}}
+  {{- site.data.locales[site.lang].post.read_time.prompt -}}
 {% endcapture %}
 
 <!-- return element -->
 <span class="readtime" data-toggle="tooltip" data-placement="bottom"
-  title="{{ words }} {{ site.data.locales[lang].post.words }}">
-  <em>{{- read_time -}}{{" "}}{{- site.data.locales[lang].post.read_time.unit -}}</em>
+  title="{{ words }} {{ site.data.locales[site.lang].post.words }}">
+  <em>{{- read_time -}}{{" "}}{{- site.data.locales[site.lang].post.read_time.unit -}}</em>
   {%- if include.prompt -%}
     {%- assign _prompt_words = read_prompt | number_of_words: 'auto' -%}
     {%- unless _prompt_words > 1 -%}{{ " " }}{%- endunless -%}{{ read_prompt }}

_includes/refactor-content.html

@@ -31,11 +31,15 @@
   %}
 {% endif %}
 
-<!-- Add attribute 'hide-bullet' to the checkbox list -->
-
-{% if _content contains '<li class="task-list-item"><' %}
+<!-- Change the icon of checkbox -->
+{% if _content contains '<input type="checkbox"' %}
   {% assign _content = _content
-    | replace: '"task-list-item"><', '"task-list-item" hide-bullet><'
+    | replace:
+        '<input type="checkbox" class="task-list-item-checkbox" disabled="disabled" checked="checked" />',
+        '<i class="fas fa-check-circle fa-fw checked"></i>'
+    | replace:
+        '<input type="checkbox" class="task-list-item-checkbox" disabled="disabled" />',
+        '<i class="far fa-circle fa-fw"></i>'
   %}
 {% endif %}
 
@@ -47,31 +51,52 @@
   {% assign _img_content = nil %}
   {% assign _img_snippets = _content | split: IMG_TAG %}
 
+  <!-- CDN URL -->
+  {% if site.img_cdn %}
+    {% if site.img_cdn contains '//' %}
+      {% assign _path_prefix = site.img_cdn %}
+    {% else %}
+      {% assign _path_prefix = site.img_cdn | relative_url %}
+    {% endif %}
+  {% else %}
+    {% assign _path_prefix = site.baseurl %}
+  {% endif %}
+
+  <!-- Add image path -->
+  {% if page.img_path %}
+    {% assign _path = page.img_path | append: '/' | replace: '//', '/' %}
+    {% assign _path_prefix = _path_prefix | append: _path %}
+  {% endif %}
+
   {% for _img_snippet in _img_snippets %}
     {% if forloop.first %}
       {% assign _img_content = _img_snippet %}
       {% continue %}
     {% endif %}
 
-    {% assign _width = nil %}
-    {% assign _height = nil %}
-    {% assign _src = nil %}
-
     {% assign _left = _img_snippet | split: '>' | first %}
     {% assign _right = _img_snippet | remove: _left %}
 
-    {% assign _left = _left | remove: ' /' %}
-    {% assign _left = _left | replace: ' w=', ' width=' | replace: ' h=', ' height=' %}
-    {% assign _attrs = _left | split: ' ' %}
+    {% unless _left contains 'src=' %}
+      {% continue %}
+    {% endunless %}
+
+    {% assign _left = _left | remove: ' /' | replace: ' w=', ' width=' | replace: ' h=', ' height=' %}
+    {% assign _attrs = _left | split: '" ' %}
+
+    {% assign _width = nil %}
+    {% assign _height = nil %}
+    {% assign _lqip = nil %}
+    {% assign _class = nil %}
 
     {% for _attr in _attrs %}
-      {% assign _pair = _attr | split: '=' %}
-      {% if _pair.size < 2 %}
+      {% unless _attr contains '=' %}
         {% continue %}
-      {% endif %}
+      {% endunless %}
 
+      {% assign _pair = _attr | remove: '"' | split: '=' %}
       {% capture _key %}{{ _pair | first }}{% endcapture %}
-      {% capture _value %}{{ _pair | last | replace: '"', '' }}{% endcapture %}
+      {% capture _value %}{{ _pair | last }}{% endcapture %}
 
       {% case _key %}
         {% when 'width' %}
@@ -80,68 +105,91 @@
           {% assign _height = _value %}
         {% when 'src' %}
           {% assign _src = _value %}
+        {% when 'lqip' %}
+          {% assign _lqip = _value %}
+        {% when 'class' %}
+          {% assign _class = _value %}
       {% endcase %}
 
-      {% if _width and _height and _src %}
-        {% break %}
-      {% endif %}
     {% endfor %}
 
-    {% if _src %}
-      {% unless _src contains '://' %}
-
-        <!-- Add CDN URL -->
-        {% if site.img_cdn %}
-          {% if site.img_cdn contains '//' %}
-            {% assign _src_prefix = site.img_cdn %}
-          {% else %}
-            {% assign _src_prefix = site.img_cdn | relative_url %}
-          {% endif %}
-        {% else %}
-          {% assign _src_prefix = site.baseurl %}
-        {% endif %}
-
-        <!-- Add image path -->
-        {% if page.img_path %}
-          {% assign _path = page.img_path %}
-          {% assign last_char = _path | slice: -1 %}
-
-          {% unless last_char == '/' %}
-            {% assign _path = _path | append: '/' %}
-          {% endunless %}
-
-          {% assign _src_prefix = _src_prefix | append: _path %}
-        {% endif %}
-
-        {% assign _final_src = _src_prefix | append: _src %}
-        {% assign _left = _left | replace: _src, _final_src %}
-
-      {% endunless %}
-
-      <!-- lazy-load images <https://github.com/ApoorvSaxena/lozad.js#usage> -->
-
-      {% assign _left = _left | replace: 'src=', 'data-src=' %}
-
+    <!-- take out classes -->
+    {% if _class %}
+      {% capture _old_class %}class="{{ _class }}"{% endcapture %}
+      {% assign _left = _left | remove: _old_class %}
     {% endif %}
 
-    <!-- Add SVG placehoder to prevent layout reflow -->
+    {% assign _final_src = nil %}
 
-    {% if _width and _height %}
-      {%- capture _svg -%}
-        src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 {{ _width }} {{ _height }}'%3E%3C/svg%3E"
-      {%- endcapture -%}
+    {% unless _src contains '//' %}
+      {% assign _final_src = _path_prefix | append: _src %}
+      {% capture _src_from %}"{{ _src }}"{% endcapture %}
+      {% capture _src_to %}"{{ _final_src }}"{% endcapture %}
+      {% assign _left = _left | replace: _src_from, _src_to %}
+    {% endunless %}
 
-      {% assign _left =  _svg | append: ' ' | append: _left %}
+    {% if _lqip %}
+      {% unless _lqip contains ':' %}
+        {% assign _final_lqip = _path_prefix | append: _lqip %}
+        {% capture _lqip_from %}"{{ _lqip }}"{% endcapture %}
+        {% capture _lqip_to %}"{{ _final_lqip }}"{% endcapture %}
+        {% assign _left = _left | replace: _lqip_from, _lqip_to %}
+      {% endunless %}
+    {% endif %}
+
+    <!-- lazy-load images <https://github.com/aFarkas/lazysizes#readme> -->
+    {% assign _left = _left | replace: 'src=', 'data-src=' %}
+    {% if _left contains 'class=' %}
+      {% assign _left = _left | replace: 'class="', 'class="lazyload '%}
+    {% else %}
+      {% assign _left = _left | append: ' class="lazyload"' %}
+    {% endif %}
+
+    <!-- add image placeholder -->
+    {% if _lqip %}
+      {% assign _left = _left | replace: ' lqip=', ' data-lqip="true" src=' %}
+    {% else %}
+      {% if _width and _height %}
+        <!-- add SVG placehoder -->
+        {%- capture _svg -%}
+          src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 {{ _width  }} {{ _height }}'%3E%3C/svg%3E"
+        {%- endcapture -%}
+        {% assign _left =  _svg | append: ' ' | append: _left %}
+        {% assign _class = _class | append: ' shimmer' %}
+      {% endif %}
     {% endif %}
 
     <!-- Bypass the HTML-proofer test -->
     {% assign _left = _left | append: ' data-proofer-ignore' %}
 
+    <!-- make sure the `<img>` is wrapped by `<a>` -->
+    {% assign _parent = _right | slice: 1, 4 %}
+
+    {% if _parent == '</a>' %}
+      <!-- add class to exist <a> tag -->
+      {% assign _size = _img_content | size | minus: 1 %}
+      {% capture _class %}
+        class="img-link{% unless _lqip %} shimmer{% endunless %}"
+      {% endcapture %}
+      {% assign _img_content = _img_content | slice: 0, _size | append: _class | append: '>'  %}
+
+    {% else %}
+      <!-- create the image wrapper -->
+      {%- capture _wrapper_start -%}
+        <a href="{{ _final_src | default: _src  }}" class="popup img-link {{ _class }}">
+      {%- endcapture -%}
+      {% assign _img_content = _img_content | append: _wrapper_start %}
+      {% assign _right = _right | prepend: '></a' %}
+    {% endif %}
+
+    <!-- combine -->
     {% assign _img_content = _img_content | append: IMG_TAG | append: _left | append: _right %}
 
   {% endfor %}
 
-  {% assign _content = _img_content %}
+  {% if _img_content %}
+    {% assign _content = _img_content %}
+  {% endif %}
 
 {% endif %}
 
@@ -177,7 +225,7 @@
           | append: '<div class="code-header">'
           | append: _label
           | append: '<button aria-label="copy" data-title-succeed="'
-          | append: site.data.locales[lang].post.button.copy_code.succeed
+          | append: site.data.locales[site.lang].post.button.copy_code.succeed
           | append: '"><i class="far fa-clipboard"></i></button></div>'
           | append: '<div class="highlight"><code>'
       %}
@@ -214,7 +262,7 @@
 
       {% assign left = snippet | split: mark_end | first %}
       {% assign right = snippet | slice: left.size, snippet.size %}
-      {% assign left = left | replace: '">', '"><span class="mr-2">' | append: '</span>' %}
+      {% assign left = left | replace_first: '">', '"><span class="mr-2">' | append: '</span>' %}
 
       {% assign _new_content = _new_content | append: mark_start
           | append: left | append: anchor | append: right
@@ -229,54 +277,6 @@
 
 {% assign _content = _heading_content %}
 
-<!-- Wrap prompt element of blockquote with the <div> tag -->
-
-{% assign blockquote_start = '<blockquote class=' %}
-{% assign blockquote_end = '</blockquote>' %}
-{% assign cls_prefix = 'prompt-' %}
-
-{% if _content contains blockquote_start %}
-
-  {% assign _prompt_content = nil %}
-  {% assign _prompt_snippets = _content | split: blockquote_start %}
-
-  {% for _snippet in _prompt_snippets %}
-
-    {% if forloop.first %}
-      {% assign _prompt_content =  _snippet %}
-      {% continue %}
-    {% endif %}
-
-    {% assign left = _snippet | split: blockquote_end | first %}
-    {% assign right = _snippet | slice: left.size, _snippet.size %}
-
-    {% assign cls_str = left | split: '>' | first %}
-    {% assign cls_array = cls_str | remove: '"' | split: ' ' %}
-    {% assign is_prompt = false %}
-
-    {% for cls in cls_array %}
-      {% if cls contains cls_prefix %}
-        {% assign is_prompt = true %}
-        {% break %}
-      {% endif %}
-    {% endfor %}
-
-    {% unless is_prompt %}
-      {% assign _prompt_content = _prompt_content | append: blockquote_start | append: _snippet %}
-      {% continue %}
-    {% endunless %}
-
-    {% assign left = left | slice: cls_str.size, left.size %}
-    {% assign left = cls_str | append: '><div' | append: left | append: '</div>' %}
-
-    {% assign _prompt_content = _prompt_content | append: blockquote_start | append: left | append: right %}
-
-  {% endfor %}
-
-  {% assign _content = _prompt_content %}
-
-{% endif %}
-
 <!-- return -->
 
 {{ _content }}

_includes/related-posts.html

@@ -76,9 +76,9 @@
 {% endif %}
 
 {% if index_list.size > 0 %}
-  <div id="related-posts" class="mt-5 mb-2 mb-sm-4">
-    <h3 class="pt-2 mt-1 mb-4 ml-1"
-      data-toc-skip>{{ site.data.locales[lang].post.relate_posts }}</h3>
+  <div id="related-posts" class="mb-2 mb-sm-4">
+    <h3 class="pt-2 mb-4 ml-1"
+      data-toc-skip>{{ site.data.locales[site.lang].post.relate_posts }}</h3>
     <div class="card-deck mb-4">
     {% for entry in index_list %}
       {% assign index = entry | plus: 0 %}

_includes/search-loader.html

@@ -14,7 +14,7 @@
 </div>
 {% endcapture %}
 
-{% capture not_found %}<p class="mt-5">{{ site.data.locales[lang].search.no_results }}</p>{% endcapture %}
+{% capture not_found %}<p class="mt-5">{{ site.data.locales[site.lang].search.no_results }}</p>{% endcapture %}
 
 <script src="{{ site.data.assets[origin].search.js | relative_url }}"></script>
 

_includes/sidebar.html

@@ -21,7 +21,7 @@
       </a>
     </div>
 
-    <div class="site-title mt-3">
+    <div class="site-title">
       <a href="{{ '/' | relative_url }}">{{ site.title }}</a>
     </div>
     <div class="site-subtitle font-italic">{{ site.tagline }}</div>
@@ -34,7 +34,7 @@
     <li class="nav-item{% if page.layout == 'home' %}{{ " active" }}{% endif %}">
       <a href="{{ '/' | relative_url }}" class="nav-link">
         <i class="fa-fw fas fa-home ml-xl-3 mr-xl-3 unloaded"></i>
-        <span>{{ site.data.locales[lang].tabs.home | upcase }}</span>
+        <span>{{ site.data.locales[site.lang].tabs.home | upcase }}</span>
       </a>
     </li>
     <!-- the real tabs -->
@@ -44,7 +44,7 @@
         <i class="fa-fw {{ tab.icon }} ml-xl-3 mr-xl-3 unloaded"></i>
         {% capture tab_name %}{{ tab.url | split: '/' }}{% endcapture %}
 
-        <span>{{ site.data.locales[lang].tabs.[tab_name] | default: tab.title | upcase }}</span>
+        <span>{{ site.data.locales[site.lang].tabs.[tab_name] | default: tab.title | upcase }}</span>
       </a>
     </li> <!-- .nav-item -->
     {% endfor %}
@@ -64,24 +64,37 @@
     {% endunless %}
 
     {% for entry in site.data.contact %}
-      {% capture url %}
-        {%- if entry.type == 'github' -%}
-          https://github.com/{{ site.github.username }}
-        {%- elsif entry.type == 'twitter' -%}
-          https://twitter.com/{{ site.twitter.username }}
-        {%- elsif entry.type == 'email' -%}
+      {% case entry.type %}
+        {% when 'github', 'twitter' %}
+          {%- capture url -%}
+            https://{{ entry.type }}.com/{{ site[entry.type].username }}
+          {%- endcapture -%}
+        {% when 'email' %}
           {% assign email = site.social.email | split: '@' %}
-          javascript:location.href = 'mailto:' + ['{{ email[0] }}','{{ email[1] }}'].join('@')
-        {%- elsif entry.type == 'rss' -%}
-          {{ "/feed.xml" | relative_url }}
-        {%- else -%}
-          {{ entry.url }}
-        {%- endif -%}
-      {% endcapture %}
+          {%- capture url -%}
+            javascript:location.href = 'mailto:' + ['{{ email[0] }}','{{ email[1] }}'].join('@')
+          {%- endcapture -%}
+        {% when 'rss' %}
+          {% assign url = '/feed.xml' | relative_url %}
+        {% else %}
+          {% assign url = entry.url %}
+      {% endcase %}
 
       {% if url %}
       <a href="{{ url }}" aria-label="{{ entry.type }}"
-        {% unless entry.noblank %}target="_blank" rel="noopener"{% endunless %}>
+        {% assign link_types = '' %}
+
+        {% unless entry.noblank %}
+          target="_blank"
+          {% assign link_types = 'noopener noreferrer' %}
+        {% endunless %}
+
+        {% if entry.type == 'mastodon' %}
+          {% assign link_types = link_types | append: ' me' | strip %}
+        {% endif %}
+
+        {% unless link_types == empty %}rel="{{ link_types }}"{% endunless %}>
+
         <i class="{{ entry.icon }}"></i>
       </a>
       {% endif %}

_includes/toc.html

@@ -6,11 +6,11 @@
 {% endif %}
 
 {% if enable_toc %}
-<!-- BS-toc.js will be loaded at medium priority -->
-<script src="{{ site.data.assets[origin].bootstrap-toc.js | relative_url }}"></script>
+  <div id="toc-wrapper" class="pl-0 pr-4 mb-5">
+    <div class="panel-heading pl-3 pt-2 mb-2">{{- site.data.locales[site.lang].panel.toc -}}</div>
+    <nav id="toc"></nav>
+  </div>
 
-<div id="toc-wrapper" class="pl-0 pr-4 mb-5">
-  <div class="panel-heading pl-3 pt-2 mb-2">{{- site.data.locales[lang].panel.toc -}}</div>
-  <nav id="toc" data-toggle="toc"></nav>
-</div>
+  <!-- toc.js will be loaded at medium priority -->
+  <script src="{{ site.data.assets[origin].toc.js | relative_url }}"></script>
 {% endif %}

_includes/topbar.html

@@ -10,7 +10,7 @@
 
     {% if paths.size == 0 or page.layout == 'home' %}
       <!-- index page -->
-      <span>{{ site.data.locales[lang].tabs.home | capitalize }}</span>
+      <span>{{ site.data.locales[site.lang].tabs.home | capitalize }}</span>
 
     {% else %}
 
@@ -19,14 +19,14 @@
         {% if forloop.first %}
           <span>
             <a href="{{ '/' | relative_url }}">
-              {{ site.data.locales[lang].tabs.home | capitalize }}
+              {{ site.data.locales[site.lang].tabs.home | capitalize }}
             </a>
           </span>
 
         {% elsif forloop.last %}
 
           {% if page.collection == 'tabs' %}
-            <span>{{ site.data.locales[lang].tabs[item] | default: page.title }}</span>
+            <span>{{ site.data.locales[site.lang].tabs[item] | default: page.title }}</span>
           {% else %}
             <span>{{ page.title }}</span>
           {% endif %}
@@ -34,7 +34,7 @@
         {% elsif page.layout == 'category' or page.layout == 'tag' %}
           <span>
             <a href="{{ item | relative_url }}">
-              {{ site.data.locales[lang].tabs[item] | default: page.title }}
+              {{ site.data.locales[site.lang].tabs[item] | default: page.title }}
             </a>
           </span>
         {% endif %}
@@ -49,12 +49,12 @@
 
     <div id="topbar-title">
       {% if page.layout == 'home' %}
-        {{- site.data.locales[lang].title | default: site.title -}}
+        {{- site.data.locales[site.lang].title | default: site.title -}}
       {% elsif page.collection == 'tabs' or page.layout == 'page' %}
         {%- capture tab_key -%}{{ page.url | split: '/' }}{%- endcapture -%}
-        {{- site.data.locales[lang].tabs[tab_key] | default: page.title -}}
+        {{- site.data.locales[site.lang].tabs[tab_key] | default: page.title -}}
       {% else %}
-        {{- site.data.locales[lang].layout[page.layout] | default: page.layout | capitalize -}}
+        {{- site.data.locales[site.lang].layout[page.layout] | default: page.layout | capitalize -}}
       {% endif %}
     </div>
 
@@ -62,9 +62,9 @@
     <span id="search-wrapper" class="align-items-center">
       <i class="fas fa-search fa-fw"></i>
       <input class="form-control" id="search-input" type="search"
-        aria-label="search" autocomplete="off" placeholder="{{ site.data.locales[lang].search.hint | capitalize }}...">
+        aria-label="search" autocomplete="off" placeholder="{{ site.data.locales[site.lang].search.hint | capitalize }}...">
     </span>
-    <span id="search-cancel" >{{ site.data.locales[lang].search.cancel }}</span>
+    <span id="search-cancel" >{{ site.data.locales[site.lang].search.cancel }}</span>
   </div>
 
 </div>

_includes/trending-tags.html

@@ -37,7 +37,7 @@
 
 {% if trending_tags.size > 0 %}
   <div id="access-tags">
-    <div class="panel-heading">{{- site.data.locales[lang].panel.trending_tags -}}</div>
+    <div class="panel-heading">{{- site.data.locales[site.lang].panel.trending_tags -}}</div>
     <div class="d-flex flex-wrap mt-3 mb-1 mr-3">
 
     {% for tag_name in trending_tags %}

_includes/update-list.html

@@ -26,7 +26,7 @@
 {% if update_list.size > 0 %}
 
   <div id="access-lastmod" class="post">
-    <div class="panel-heading">{{- site.data.locales[lang].panel.lastmod -}}</div>
+    <div class="panel-heading">{{- site.data.locales[site.lang].panel.lastmod -}}</div>
     <ul class="post-content pl-0 pb-1 ml-1 mt-2">
       {% for item in update_list %}
         {% assign index = item | split: "::" | last | plus: 0 %}

_javascript/_copyright

@@ -0,0 +1,3 @@
+Chirpy v<%= pkg.version %> (<%= pkg.homepage %>)
+© 2019 <%= pkg.author %>
+<%= pkg.license %> Licensed

_javascript/categories.js

@@ -0,0 +1,7 @@
+import { basic, initSidebar, initTopbar } from './modules/layouts';
+import { categoryCollapse } from './modules/plugins';
+
+basic();
+initSidebar();
+initTopbar();
+categoryCollapse();

_javascript/commons.js

@@ -0,0 +1,5 @@
+import { basic, initSidebar, initTopbar } from './modules/layouts';
+
+basic();
+initSidebar();
+initTopbar();

_javascript/commons/back-to-top.js

@@ -1,20 +0,0 @@
-/*
-Reference: https://bootsnipp.com/snippets/featured/link-to-top-page
-*/
-$(function() {
-  $(window).scroll(() => {
-    if ($(this).scrollTop() > 50 &&
-      $("#sidebar-trigger").css("display") === "none") {
-      $("#back-to-top").fadeIn();
-    } else {
-      $("#back-to-top").fadeOut();
-    }
-  });
-
-  $("#back-to-top").click(() => {
-    $("body,html").animate({
-      scrollTop: 0
-    }, 800);
-    return false;
-  });
-});

_javascript/commons/mode-toggle.js

@@ -1,13 +0,0 @@
-/*
- * Listener for theme mode toggle
- */
-$(function() {
-  $(".mode-toggle").click((e) => {
-    const $target = $(e.target);
-    let $btn = ($target.prop("tagName") === "button".toUpperCase() ?
-      $target : $target.parent());
-
-    $btn.blur(); // remove the clicking outline
-    flipMode();
-  });
-});

_javascript/commons/scroll-helper.js

@@ -1,36 +0,0 @@
-/**
- * A tool for smooth scrolling and topbar switcher
- */
-const ScrollHelper = (function () {
-  const $body = $("body");
-  const ATTR_TOPBAR_VISIBLE = "data-topbar-visible";
-  const topbarHeight = $("#topbar-wrapper").outerHeight();
-
-  let scrollUpCount = 0; // the number of times the scroll up was triggered by ToC or anchor
-  let topbarLocked = false;
-  let orientationLocked = false;
-
-  return {
-    hideTopbar: () => $body.attr(ATTR_TOPBAR_VISIBLE, false),
-    showTopbar: () => $body.attr(ATTR_TOPBAR_VISIBLE, true),
-
-    // scroll up
-
-    addScrollUpTask: () => {
-      scrollUpCount += 1;
-      if (!topbarLocked) { topbarLocked = true; }
-    },
-    popScrollUpTask: () => scrollUpCount -= 1,
-    hasScrollUpTask: () => scrollUpCount > 0,
-    topbarLocked: () => topbarLocked === true,
-    unlockTopbar: () => topbarLocked = false,
-    getTopbarHeight: () => topbarHeight,
-
-    // orientation change
-
-    orientationLocked: () => orientationLocked === true,
-    lockOrientation: () => orientationLocked = true,
-    unLockOrientation: () => orientationLocked = false
-  };
-
-}());

_javascript/commons/search-display.js

@@ -1,129 +0,0 @@
-/*
-* This script make #search-result-wrapper switch to unloaded or shown automatically.
-*/
-
-$(function() {
-  const btnSbTrigger = $("#sidebar-trigger");
-  const btnSearchTrigger = $("#search-trigger");
-  const btnCancel = $("#search-cancel");
-  const main = $("#main");
-  const topbarTitle = $("#topbar-title");
-  const searchWrapper = $("#search-wrapper");
-  const resultWrapper = $("#search-result-wrapper");
-  const results = $("#search-results");
-  const input = $("#search-input");
-  const hints = $("#search-hints");
-
-  const scrollBlocker = (function () {
-    let offset = 0;
-    return {
-      block() {
-        offset = window.scrollY;
-        $("html,body").scrollTop(0);
-      },
-      release() {
-        $("html,body").scrollTop(offset);
-      },
-      getOffset() {
-        return offset;
-      }
-    };
-  }());
-
-  /*--- Actions in mobile screens (Sidebar hidden) ---*/
-
-  const mobileSearchBar = (function () {
-    return {
-      on() {
-        btnSbTrigger.addClass("unloaded");
-        topbarTitle.addClass("unloaded");
-        btnSearchTrigger.addClass("unloaded");
-        searchWrapper.addClass("d-flex");
-        btnCancel.addClass("loaded");
-      },
-      off() {
-        btnCancel.removeClass("loaded");
-        searchWrapper.removeClass("d-flex");
-        btnSbTrigger.removeClass("unloaded");
-        topbarTitle.removeClass("unloaded");
-        btnSearchTrigger.removeClass("unloaded");
-      }
-    };
-  }());
-
-  const resultSwitch = (function () {
-    let visible = false;
-
-    return {
-      on() {
-        if (!visible) {
-          // the block method must be called before $(#main) unloaded.
-          scrollBlocker.block();
-          resultWrapper.removeClass("unloaded");
-          main.addClass("unloaded");
-          visible = true;
-        }
-      },
-      off() {
-        if (visible) {
-          results.empty();
-          if (hints.hasClass("unloaded")) {
-            hints.removeClass("unloaded");
-          }
-          resultWrapper.addClass("unloaded");
-          main.removeClass("unloaded");
-
-          // now the release method must be called after $(#main) display
-          scrollBlocker.release();
-
-          input.val("");
-          visible = false;
-        }
-      },
-      isVisible() {
-        return visible;
-      }
-    };
-
-  }());
-
-  function isMobileView() {
-    return btnCancel.hasClass("loaded");
-  }
-
-  btnSearchTrigger.click(function() {
-    mobileSearchBar.on();
-    resultSwitch.on();
-    input.focus();
-  });
-
-  btnCancel.click(function() {
-    mobileSearchBar.off();
-    resultSwitch.off();
-  });
-
-  input.focus(function() {
-    searchWrapper.addClass("input-focus");
-  });
-
-  input.focusout(function() {
-    searchWrapper.removeClass("input-focus");
-  });
-
-  input.on("input", () => {
-    if (input.val() === "") {
-      if (isMobileView()) {
-        hints.removeClass("unloaded");
-      } else {
-        resultSwitch.off();
-      }
-
-    } else {
-      resultSwitch.on();
-      if (isMobileView()) {
-        hints.addClass("unloaded");
-      }
-    }
-  });
-
-});

_javascript/commons/sidebar.js

@@ -1,30 +0,0 @@
-/**
- * Expand or close the sidebar in mobile screens.
- */
-
-$(function() {
-
-  const sidebarUtil = (function () {
-    const ATTR_DISPLAY = "sidebar-display";
-    let isExpanded = false;
-    const body = $("body");
-
-    return {
-      toggle() {
-        if (isExpanded === false) {
-          body.attr(ATTR_DISPLAY, "");
-        } else {
-          body.removeAttr(ATTR_DISPLAY);
-        }
-
-        isExpanded = !isExpanded;
-      }
-    };
-
-  }());
-
-  $("#sidebar-trigger").click(sidebarUtil.toggle);
-
-  $("#mask").click(sidebarUtil.toggle);
-
-});

_javascript/commons/tooltip-loader.js

@@ -1,6 +0,0 @@
-/**
- * Initial Bootstrap Tooltip.
-*/
-$(function () {
-  $("[data-toggle=\"tooltip\"]").tooltip();
-});

_javascript/commons/topbar-switcher.js

@@ -1,90 +0,0 @@
-/*
- * Hide Header on scroll down
- */
-
-$(function() {
-  const $searchInput = $("#search-input");
-  const delta = ScrollHelper.getTopbarHeight();
-
-  let didScroll;
-  let lastScrollTop = 0;
-
-  function hasScrolled() {
-    let st = $(this).scrollTop();
-
-    /* Make sure they scroll more than delta */
-    if (Math.abs(lastScrollTop - st) <= delta) {
-      return;
-    }
-
-    if (st > lastScrollTop ) { // Scroll Down
-      ScrollHelper.hideTopbar();
-
-      if ($searchInput.is(":focus")) {
-        $searchInput.blur(); /* remove focus */
-      }
-
-    } else  { // Scroll up
-      // has not yet scrolled to the bottom of the screen, that is, there is still space for scrolling
-      if (st + $(window).height() < $(document).height()) {
-
-        if (ScrollHelper.hasScrollUpTask()) {
-          return;
-        }
-
-        if (ScrollHelper.topbarLocked()) { // avoid redundant scroll up event from smooth scrolling
-          ScrollHelper.unlockTopbar();
-        } else {
-          if (ScrollHelper.orientationLocked()) { // avoid device auto scroll up on orientation change
-            ScrollHelper.unLockOrientation();
-          } else {
-            ScrollHelper.showTopbar();
-          }
-        }
-      }
-    }
-
-    lastScrollTop = st;
-
-  } // hasScrolled()
-
-  function handleLandscape() {
-    if ($(window).scrollTop() === 0) {
-      return;
-    }
-    ScrollHelper.lockOrientation();
-    ScrollHelper.hideTopbar();
-  }
-
-  if (screen.orientation) {
-    screen.orientation.onchange = () => {
-      const type = screen.orientation.type;
-      if (type ===  "landscape-primary" || type === "landscape-secondary") {
-        handleLandscape();
-      }
-    };
-
-  } else {
-    // for the browsers that not support `window.screen.orientation` API
-    $(window).on("orientationchange",() => {
-      if ($(window).width() < $(window).height()) { // before rotating, it is still in portrait mode.
-        handleLandscape();
-      }
-    });
-  }
-
-  $(window).scroll(() => {
-    if (didScroll) {
-      return;
-    }
-    didScroll = true;
-  });
-
-  setInterval(() => {
-    if (didScroll) {
-      hasScrolled();
-      didScroll = false;
-    }
-  }, 250);
-
-});

_javascript/copyright

@@ -1,5 +0,0 @@
-/*!
- * Chirpy v5.2.1 (https://github.com/cotes2020/jekyll-theme-chirpy/)
- * © 2019 Cotes Chung
- * MIT Licensed
- */

_javascript/misc.js

@@ -0,0 +1,7 @@
+import { basic, initSidebar, initTopbar } from './modules/layouts';
+import { initLocaleDatetime } from './modules/plugins';
+
+basic();
+initSidebar();
+initTopbar();
+initLocaleDatetime();

_javascript/modules/components/back-to-top.js

@@ -0,0 +1,26 @@
+/**
+ * Reference: https://bootsnipp.com/snippets/featured/link-to-top-page
+ */
+
+export function back2top() {
+  $(window).on('scroll', () => {
+    if (
+      $(window).scrollTop() > 50 &&
+      $('#sidebar-trigger').css('display') === 'none'
+    ) {
+      $('#back-to-top').fadeIn();
+    } else {
+      $('#back-to-top').fadeOut();
+    }
+  });
+
+  $('#back-to-top').on('click', () => {
+    $('body,html').animate(
+      {
+        scrollTop: 0
+      },
+      800
+    );
+    return false;
+  });
+}

_javascript/modules/components/category-collapse.js

@@ -0,0 +1,36 @@
+/**
+ * Tab 'Categories' expand/close effect.
+ */
+const childPrefix = 'l_';
+const parentPrefix = 'h_';
+const collapse = $('.collapse');
+
+export function categoryCollapse() {
+  /* close up top-category */
+  collapse.on('hide.bs.collapse', function () {
+    /* Bootstrap collapse events. */ const parentId =
+      parentPrefix + $(this).attr('id').substring(childPrefix.length);
+    if (parentId) {
+      $(`#${parentId} .far.fa-folder-open`).attr(
+        'class',
+        'far fa-folder fa-fw'
+      );
+      $(`#${parentId} i.fas`).addClass('rotate');
+      $(`#${parentId}`).removeClass('hide-border-bottom');
+    }
+  });
+
+  /* expand the top category */
+  collapse.on('show.bs.collapse', function () {
+    const parentId =
+      parentPrefix + $(this).attr('id').substring(childPrefix.length);
+    if (parentId) {
+      $(`#${parentId} .far.fa-folder`).attr(
+        'class',
+        'far fa-folder-open fa-fw'
+      );
+      $(`#${parentId} i.fas`).removeClass('rotate');
+      $(`#${parentId}`).addClass('hide-border-bottom');
+    }
+  });
+}

_javascript/modules/components/clipboard.js

@@ -0,0 +1,118 @@
+/**
+ * Clipboard functions
+ *
+ * Dependencies:
+ *   - popper.js (https://github.com/popperjs/popper-core)
+ *   - clipboard.js (https://github.com/zenorocha/clipboard.js)
+ */
+
+const btnSelector = '.code-header>button';
+const ICON_SUCCESS = 'fas fa-check';
+const ATTR_TIMEOUT = 'timeout';
+const ATTR_TITLE_SUCCEED = 'data-title-succeed';
+const ATTR_TITLE_ORIGIN = 'data-original-title';
+const TIMEOUT = 2000; // in milliseconds
+
+function isLocked(node) {
+  if ($(node)[0].hasAttribute(ATTR_TIMEOUT)) {
+    let timeout = $(node).attr(ATTR_TIMEOUT);
+    if (Number(timeout) > Date.now()) {
+      return true;
+    }
+  }
+  return false;
+}
+
+function lock(node) {
+  $(node).attr(ATTR_TIMEOUT, Date.now() + TIMEOUT);
+}
+
+function unlock(node) {
+  $(node).removeAttr(ATTR_TIMEOUT);
+}
+
+function getIcon(btn) {
+  let iconNode = $(btn).children();
+  return iconNode.attr('class');
+}
+
+const ICON_DEFAULT = getIcon(btnSelector);
+
+function showTooltip(btn) {
+  const succeedTitle = $(btn).attr(ATTR_TITLE_SUCCEED);
+  $(btn).attr(ATTR_TITLE_ORIGIN, succeedTitle).tooltip('show');
+}
+
+function hideTooltip(btn) {
+  $(btn).tooltip('hide').removeAttr(ATTR_TITLE_ORIGIN);
+}
+
+function setSuccessIcon(btn) {
+  let btnNode = $(btn);
+  let iconNode = btnNode.children();
+  iconNode.attr('class', ICON_SUCCESS);
+}
+
+function resumeIcon(btn) {
+  let btnNode = $(btn);
+  let iconNode = btnNode.children();
+  iconNode.attr('class', ICON_DEFAULT);
+}
+
+export function initClipboard() {
+  // Initial the clipboard.js object
+  const clipboard = new ClipboardJS(btnSelector, {
+    target(trigger) {
+      let codeBlock = trigger.parentNode.nextElementSibling;
+      return codeBlock.querySelector('code .rouge-code');
+    }
+  });
+
+  $(btnSelector).tooltip({
+    trigger: 'hover',
+    placement: 'left'
+  });
+
+  clipboard.on('success', (e) => {
+    e.clearSelection();
+
+    const trigger = e.trigger;
+    if (isLocked(trigger)) {
+      return;
+    }
+
+    setSuccessIcon(trigger);
+    showTooltip(trigger);
+    lock(trigger);
+
+    setTimeout(() => {
+      hideTooltip(trigger);
+      resumeIcon(trigger);
+      unlock(trigger);
+    }, TIMEOUT);
+  });
+
+  /* --- Post link sharing --- */
+
+  $('#copy-link').on('click', (e) => {
+    let target = $(e.target);
+
+    if (isLocked(target)) {
+      return;
+    }
+
+    // Copy URL to clipboard
+    navigator.clipboard.writeText(window.location.href).then(() => {
+      const defaultTitle = target.attr(ATTR_TITLE_ORIGIN);
+      const succeedTitle = target.attr(ATTR_TITLE_SUCCEED);
+      // Switch tooltip title
+      target.attr(ATTR_TITLE_ORIGIN, succeedTitle).tooltip('show');
+      lock(target);
+
+      setTimeout(() => {
+        target.attr(ATTR_TITLE_ORIGIN, defaultTitle);
+        unlock(target);
+      }, TIMEOUT);
+    });
+  });
+}

_javascript/modules/components/convert-title.js

@@ -1,27 +1,29 @@
-/*
+/**
  * Top bar title auto change while scrolling up/down in mobile screens.
-*/
+ */
+const titleSelector = 'div.post>h1:first-of-type';
+const $pageTitle = $(titleSelector);
+const $topbarTitle = $('#topbar-title');
+const defaultTitleText = $topbarTitle.text().trim();
 
-$(function() {
-  const titleSelector = "div.post>h1:first-of-type";
-  const $pageTitle = $(titleSelector);
-  const $topbarTitle = $("#topbar-title");
-
-  if ($pageTitle.length === 0 /* on Home page */
-      || $pageTitle.hasClass("dynamic-title")
-      || $topbarTitle.is(":hidden")) {/* not in mobile views */
+export function convertTitle() {
+  if (
+    $pageTitle.length === 0 /* on Home page */ ||
+    $pageTitle.hasClass('dynamic-title') ||
+    $topbarTitle.is(':hidden')
+  ) {
+    /* not in mobile views */
     return;
   }
 
-  const defaultTitleText = $topbarTitle.text().trim();
   let pageTitleText = $pageTitle.text().trim();
   let hasScrolled = false;
   let lastScrollTop = 0;
 
-  if ($("#page-category").length || $("#page-tag").length) {
+  if ($('#page-category').length || $('#page-tag').length) {
     /* The title in Category or Tag page will be "<title> <count_of_posts>" */
     if (/\s/.test(pageTitleText)) {
-      pageTitleText = pageTitleText.replace(/[0-9]/g, "").trim();
+      pageTitleText = pageTitleText.replace(/[0-9]/g, '').trim();
     }
   }
 
@@ -60,8 +62,7 @@ $(function() {
   observer.observe(document.querySelector(titleSelector));
 
   /* Click title will scroll to top */
-  $topbarTitle.click(function() {
-    $("body,html").animate({scrollTop: 0}, 800);
+  $topbarTitle.on('click', function () {
+    $('body,html').animate({ scrollTop: 0 }, 800);
   });
-
-});
+}

_javascript/modules/components/img-extra.js

@@ -0,0 +1,27 @@
+/**
+ * Set up image stuff
+ */
+
+export function imgExtra() {
+  if ($('#core-wrapper img[data-src]') <= 0) {
+    return;
+  }
+
+  /* See: <https://github.com/dimsemenov/Magnific-Popup> */
+  $('.popup').magnificPopup({
+    type: 'image',
+    closeOnContentClick: true,
+    showCloseBtn: false,
+    zoom: {
+      enabled: true,
+      duration: 300,
+      easing: 'ease-in-out'
+    }
+  });
+
+  /* Stop shimmer when image loaded */
+  document.addEventListener('lazyloaded', function (e) {
+    const $img = $(e.target);
+    $img.parent().removeClass('shimmer');
+  });
+}

_javascript/modules/components/locale-datetime.js

@@ -0,0 +1,50 @@
+/**
+ * Update month/day to locale datetime
+ *
+ * Requirement: <https://github.com/iamkun/dayjs>
+ */
+
+/* A tool for locale datetime */
+class LocaleHelper {
+  static get attrTimestamp() {
+    return 'data-ts';
+  }
+
+  static get attrDateFormat() {
+    return 'data-df';
+  }
+
+  static get locale() {
+    return $('html').attr('lang').substring(0, 2);
+  }
+
+  static getTimestamp(elem) {
+    return Number(elem.attr(LocaleHelper.attrTimestamp)); // unix timestamp
+  }
+
+  static getDateFormat(elem) {
+    return elem.attr(LocaleHelper.attrDateFormat);
+  }
+}
+
+export function initLocaleDatetime() {
+  dayjs.locale(LocaleHelper.locale);
+  dayjs.extend(window.dayjs_plugin_localizedFormat);
+
+  $(`[${LocaleHelper.attrTimestamp}]`).each(function () {
+    const date = dayjs.unix(LocaleHelper.getTimestamp($(this)));
+    const text = date.format(LocaleHelper.getDateFormat($(this)));
+    $(this).text(text);
+    $(this).removeAttr(LocaleHelper.attrTimestamp);
+    $(this).removeAttr(LocaleHelper.attrDateFormat);
+
+    // setup tooltips
+    const tooltip = $(this).attr('data-toggle');
+    if (typeof tooltip === 'undefined' || tooltip !== 'tooltip') {
+      return;
+    }
+
+    const tooltipText = date.format('llll'); // see: https://day.js.org/docs/en/display/format#list-of-localized-formats
+    $(this).attr('data-original-title', tooltipText);
+  });
+}

_javascript/modules/components/mode-watcher.js

@@ -0,0 +1,21 @@
+/**
+ * Add listener for theme mode toggle
+ */
+const $toggleElem = $('.mode-toggle');
+
+export function modeWatcher() {
+  if ($toggleElem.length === 0) {
+    return;
+  }
+
+  $toggleElem.off().on('click', (e) => {
+    const $target = $(e.target);
+    let $btn =
+      $target.prop('tagName') === 'button'.toUpperCase()
+        ? $target
+        : $target.parent();
+
+    modeToggle.flipMode(); // modeToggle: `_includes/mode-toggle.html`
+    $btn.trigger('blur'); // remove the clicking outline
+  });
+}

_javascript/modules/components/pageviews.js

@@ -1,4 +1,4 @@
-/*
+/**
  * Count page views form GA or local cache file.
  *
  * Dependencies:
@@ -15,45 +15,44 @@ const getInitStatus = (function () {
     }
     return ret;
   };
-}());
+})();
 
 const PvOpts = (function () {
   function getContent(selector) {
-    return $(selector).attr("content");
+    return $(selector).attr('content');
   }
 
   function hasContent(selector) {
     let content = getContent(selector);
-    return (typeof content !== "undefined" && content !== false);
+    return typeof content !== 'undefined' && content !== false;
   }
 
   return {
     getProxyMeta() {
-      return getContent("meta[name=pv-proxy-endpoint]");
+      return getContent('meta[name=pv-proxy-endpoint]');
     },
     getLocalMeta() {
-      return getContent("meta[name=pv-cache-path]");
+      return getContent('meta[name=pv-cache-path]');
     },
     hasProxyMeta() {
-      return hasContent("meta[name=pv-proxy-endpoint]");
+      return hasContent('meta[name=pv-proxy-endpoint]');
     },
     hasLocalMeta() {
-      return hasContent("meta[name=pv-cache-path]");
+      return hasContent('meta[name=pv-cache-path]');
     }
   };
-
-}());
+})();
 
 const PvStorage = (function () {
   const Keys = {
-    KEY_PV: "pv",
-    KEY_PV_SRC: "pv_src",
-    KEY_CREATION: "pv_created_date"
+    KEY_PV: 'pv',
+    KEY_PV_SRC: 'pv_src',
+    KEY_CREATION: 'pv_created_date'
   };
 
   const Source = {
-    LOCAL: "same-origin",
-    PROXY: "cors"
+    LOCAL: 'same-origin',
+    PROXY: 'cors'
   };
 
   function get(key) {
@@ -75,7 +74,7 @@ const PvStorage = (function () {
       return Object.keys(Keys).length;
     },
     hasCache() {
-      return (localStorage.getItem(Keys.KEY_PV) !== null);
+      return localStorage.getItem(Keys.KEY_PV) !== null;
     },
     getCache() {
       return JSON.parse(localStorage.getItem(Keys.KEY_PV));
@@ -88,7 +87,7 @@ const PvStorage = (function () {
     },
     isExpired() {
       let date = new Date(get(Keys.KEY_CREATION));
-      date.setHours(date.getHours() + 1);   // per hour
+      date.setHours(date.getHours() + 1); // per hour
       return Date.now() >= date.getTime();
     },
     isFromLocal() {
@@ -98,7 +97,10 @@ const PvStorage = (function () {
       return get(Keys.KEY_PV_SRC) === Source.PROXY;
     },
     newerThan(pv) {
-      return PvStorage.getCache().totalsForAllResults["ga:pageviews"] > pv.totalsForAllResults["ga:pageviews"];
+      return (
+        PvStorage.getCache().totalsForAllResults['ga:pageviews'] >
+        pv.totalsForAllResults['ga:pageviews']
+      );
     },
     inspectKeys() {
       if (localStorage.length !== PvStorage.keysCount()) {
@@ -106,7 +108,7 @@ const PvStorage = (function () {
         return;
       }
 
-      for(let i = 0; i < localStorage.length; i++){
+      for (let i = 0; i < localStorage.length; i++) {
         const key = localStorage.key(i);
         switch (key) {
           case Keys.KEY_PV:
@@ -120,7 +122,7 @@ const PvStorage = (function () {
       }
     }
   };
-}()); /* PvStorage */
+})(); /* PvStorage */
 
 function countUp(min, max, destId) {
   if (min < max) {
@@ -136,10 +138,11 @@ function countUp(min, max, destId) {
 function countPV(path, rows) {
   let count = 0;
 
-  if (typeof rows !== "undefined" ) {
+  if (typeof rows !== 'undefined') {
     for (let i = 0; i < rows.length; ++i) {
       const gaPath = rows[parseInt(i, 10)][0];
-      if (gaPath === path) { /* path format see: site.permalink */
+      if (gaPath === path) {
+        /* path format see: site.permalink */
         count += parseInt(rows[parseInt(i, 10)][1], 10);
         break;
       }
@@ -151,50 +154,53 @@ function countPV(path, rows) {
 
 function tacklePV(rows, path, elem, hasInit) {
   let count = countPV(path, rows);
-  count = (count === 0 ? 1 : count);
+  count = count === 0 ? 1 : count;
 
   if (!hasInit) {
     elem.text(new Intl.NumberFormat().format(count));
   } else {
-    const initCount = parseInt(elem.text().replace(/,/g, ""), 10);
+    const initCount = parseInt(elem.text().replace(/,/g, ''), 10);
     if (count > initCount) {
-      countUp(initCount, count, elem.attr("id"));
+      countUp(initCount, count, elem.attr('id'));
     }
   }
 }
 
 function displayPageviews(data) {
-  if (typeof data === "undefined") {
+  if (typeof data === 'undefined') {
     return;
   }
 
   let hasInit = getInitStatus();
   const rows = data.rows; /* could be undefined */
 
-  if ($("#post-list").length > 0) { /* the Home page */
-    $(".post-preview").each(function() {
-      const path = $(this).find("a").attr("href");
-      tacklePV(rows, path, $(this).find(".pageviews"), hasInit);
+  if ($('#post-list').length > 0) {
+    /* the Home page */
+    $('.post-preview').each(function () {
+      const path = $(this).find('a').attr('href');
+      tacklePV(rows, path, $(this).find('.pageviews'), hasInit);
     });
-
-  } else if ($(".post").length > 0) { /* the post */
+  } else if ($('.post').length > 0) {
+    /* the post */
     const path = window.location.pathname;
-    tacklePV(rows, path, $("#pv"), hasInit);
+    tacklePV(rows, path, $('#pv'), hasInit);
   }
 }
 
 function fetchProxyPageviews() {
   if (PvOpts.hasProxyMeta()) {
     $.ajax({
-      type: "GET",
+      type: 'GET',
       url: PvOpts.getProxyMeta(),
-      dataType: "jsonp",
-      jsonpCallback: "displayPageviews",
+      dataType: 'jsonp',
       success: (data) => {
+        displayPageviews(data);
         PvStorage.saveProxyCache(JSON.stringify(data));
       },
       error: (jqXHR, textStatus, errorThrown) => {
-        console.log("Failed to load pageviews from proxy server: " + errorThrown);
+        console.log(
+          'Failed to load pageviews from proxy server: ' + errorThrown
+        );
       }
     });
   }
@@ -202,8 +208,8 @@ function fetchProxyPageviews() {
 
 function fetchLocalPageviews(hasCache = false) {
   return fetch(PvOpts.getLocalMeta())
-    .then(response => response.json())
-    .then(data => {
+    .then((response) => response.json())
+    .then((data) => {
       if (hasCache) {
         // The cache from the proxy will sometimes be more recent than the local one
         if (PvStorage.isFromProxy() && PvStorage.newerThan(data)) {
@@ -215,8 +221,8 @@ function fetchLocalPageviews(hasCache = false) {
     });
 }
 
-$(function() {
-  if ($(".pageviews").length <= 0) {
+export function initPageviews() {
+  if ($('.pageviews').length <= 0) {
     return;
   }
 
@@ -231,14 +237,13 @@ $(function() {
       } else {
         fetchProxyPageviews();
       }
-
     } else {
       if (PvStorage.isFromLocal()) {
         fetchProxyPageviews();
       }
     }
-
-  } else { // no cached
+  } else {
+    // no cached
 
     if (PvOpts.hasLocalMeta()) {
       fetchLocalPageviews().then(fetchProxyPageviews);
@@ -246,5 +251,4 @@ $(function() {
       fetchProxyPageviews();
     }
   }
-
-});
+}

_javascript/modules/components/search-display.js

@@ -0,0 +1,122 @@
+/**
+ * This script make #search-result-wrapper switch to unloaded or shown automatically.
+ */
+const $btnSbTrigger = $('#sidebar-trigger');
+const $btnSearchTrigger = $('#search-trigger');
+const $btnCancel = $('#search-cancel');
+const $main = $('#main');
+const $topbarTitle = $('#topbar-title');
+const $searchWrapper = $('#search-wrapper');
+const $resultWrapper = $('#search-result-wrapper');
+const $results = $('#search-results');
+const $input = $('#search-input');
+const $hints = $('#search-hints');
+const $viewport = $('html,body');
+
+// class names
+const C_LOADED = 'loaded';
+const C_UNLOADED = 'unloaded';
+const C_FOCUS = 'input-focus';
+const C_FLEX = 'd-flex';
+
+class ScrollBlocker {
+  static offset = 0;
+  static resultVisible = false;
+
+  static on() {
+    ScrollBlocker.offset = window.scrollY;
+    $viewport.scrollTop(0);
+  }
+
+  static off() {
+    $viewport.scrollTop(ScrollBlocker.offset);
+  }
+}
+
+/*--- Actions in mobile screens (Sidebar hidden) ---*/
+class MobileSearchBar {
+  static on() {
+    $btnSbTrigger.addClass(C_UNLOADED);
+    $topbarTitle.addClass(C_UNLOADED);
+    $btnSearchTrigger.addClass(C_UNLOADED);
+    $searchWrapper.addClass(C_FLEX);
+    $btnCancel.addClass(C_LOADED);
+  }
+
+  static off() {
+    $btnCancel.removeClass(C_LOADED);
+    $searchWrapper.removeClass(C_FLEX);
+    $btnSbTrigger.removeClass(C_UNLOADED);
+    $topbarTitle.removeClass(C_UNLOADED);
+    $btnSearchTrigger.removeClass(C_UNLOADED);
+  }
+}
+
+class ResultSwitch {
+  static on() {
+    if (!ScrollBlocker.resultVisible) {
+      // the block method must be called before $(#main) unloaded.
+      ScrollBlocker.on();
+      $resultWrapper.removeClass(C_UNLOADED);
+      $main.addClass(C_UNLOADED);
+      ScrollBlocker.resultVisible = true;
+    }
+  }
+
+  static off() {
+    if (ScrollBlocker.resultVisible) {
+      $results.empty();
+      if ($hints.hasClass(C_UNLOADED)) {
+        $hints.removeClass(C_UNLOADED);
+      }
+      $resultWrapper.addClass(C_UNLOADED);
+      $main.removeClass(C_UNLOADED);
+
+      // now the release method must be called after $(#main) display
+      ScrollBlocker.off();
+
+      $input.val('');
+      ScrollBlocker.resultVisible = false;
+    }
+  }
+}
+
+function isMobileView() {
+  return $btnCancel.hasClass(C_LOADED);
+}
+
+export function displaySearch() {
+  $btnSearchTrigger.on('click', function () {
+    MobileSearchBar.on();
+    ResultSwitch.on();
+    $input.trigger('focus');
+  });
+
+  $btnCancel.on('click', function () {
+    MobileSearchBar.off();
+    ResultSwitch.off();
+  });
+
+  $input.on('focus', function () {
+    $searchWrapper.addClass(C_FOCUS);
+  });
+
+  $input.on('focusout', function () {
+    $searchWrapper.removeClass(C_FOCUS);
+  });
+
+  $input.on('input', () => {
+    if ($input.val() === '') {
+      if (isMobileView()) {
+        $hints.removeClass(C_UNLOADED);
+      } else {
+        ResultSwitch.off();
+      }
+    } else {
+      ResultSwitch.on();
+      if (isMobileView()) {
+        $hints.addClass(C_UNLOADED);
+      }
+    }
+  });
+}

_javascript/modules/components/sidebar.js

@@ -0,0 +1,25 @@
+/**
+ * Expand or close the sidebar in mobile screens.
+ */
+
+const $body = $('body');
+const ATTR_DISPLAY = 'sidebar-display';
+
+class SidebarUtil {
+  static isExpanded = false;
+
+  static toggle() {
+    if (SidebarUtil.isExpanded === false) {
+      $body.attr(ATTR_DISPLAY, '');
+    } else {
+      $body.removeAttr(ATTR_DISPLAY);
+    }
+
+    SidebarUtil.isExpanded = !SidebarUtil.isExpanded;
+  }
+}
+
+export function sidebarExpand() {
+  $('#sidebar-trigger').on('click', SidebarUtil.toggle);
+  $('#mask').on('click', SidebarUtil.toggle);
+}

_javascript/modules/components/smooth-scroll.js

@@ -0,0 +1,109 @@
+/**
+ Safari doesn't support CSS `scroll-behavior: smooth`,
+ so here is a compatible solution for all browser to smooth scrolling
+
+ See: <https://css-tricks.com/snippets/jquery/smooth-scrolling/>
+
+ Warning: It must be called after all `<a>` tags (e.g., the dynamic TOC) are ready.
+ */
+import ScrollHelper from './utils/scroll-helper';
+
+export function smoothScroll() {
+  const $topbarTitle = $('#topbar-title');
+  const REM = 16; // in pixels
+  const ATTR_SCROLL_FOCUS = 'scroll-focus';
+  const SCOPE = "a[href*='#']:not([href='#']):not([href='#0'])";
+
+  $(SCOPE).on('click', function (event) {
+    if (
+      this.pathname.replace(/^\//, '') !== location.pathname.replace(/^\//, '')
+    ) {
+      return;
+    }
+
+    if (location.hostname !== this.hostname) {
+      return;
+    }
+
+    const hash = decodeURI(this.hash);
+    let toFootnoteRef = RegExp(/^#fnref:/).test(hash);
+    let toFootnote = toFootnoteRef ? false : RegExp(/^#fn:/).test(hash);
+    let selector = '#' + $.escapeSelector(hash.substring(1));
+    let $target = $(selector);
+
+    let isMobileViews = $topbarTitle.is(':visible');
+    let isPortrait = $(window).width() < $(window).height();
+
+    if (typeof $target === 'undefined') {
+      return;
+    }
+
+    event.preventDefault();
+
+    if (history.pushState) {
+      /* add hash to URL */
+      history.pushState(null, null, hash);
+    }
+
+    let curOffset = $(window).scrollTop();
+    let destOffset = ($target.offset().top -= REM / 2);
+
+    if (destOffset < curOffset) {
+      // scroll up
+      ScrollHelper.hideTopbar();
+      ScrollHelper.addScrollUpTask();
+
+      if (isMobileViews && isPortrait) {
+        destOffset -= ScrollHelper.getTopbarHeight();
+      }
+    } else {
+      // scroll down
+      if (isMobileViews && isPortrait) {
+        destOffset -= ScrollHelper.getTopbarHeight();
+      }
+    }
+
+    $('html').animate(
+      {
+        scrollTop: destOffset
+      },
+      500,
+      () => {
+        $target.trigger('focus');
+
+        /* clean up old scroll mark */
+        const $scroll_focus = $(`[${ATTR_SCROLL_FOCUS}=true]`);
+        if ($scroll_focus.length) {
+          $scroll_focus.attr(ATTR_SCROLL_FOCUS, 'false');
+        }
+
+        /* Clean :target links */
+        const $target_links = $(':target');
+        if ($target_links.length) {
+          /* element that visited by the URL with hash */
+          $target_links.attr(ATTR_SCROLL_FOCUS, 'false');
+        }
+
+        /* set scroll mark to footnotes */
+        if (toFootnote || toFootnoteRef) {
+          $target.attr(ATTR_SCROLL_FOCUS, 'true');
+        }
+
+        if ($target.is(':focus')) {
+          /* Checking if the target was focused */
+          return false;
+        } else {
+          $target.attr(
+            'tabindex',
+            '-1'
+          ); /* Adding tabindex for elements not focusable */
+          $target.trigger('focus'); /* Set focus again */
+        }
+
+        if (ScrollHelper.hasScrollUpTask()) {
+          ScrollHelper.popScrollUpTask();
+        }
+      }
+    );
+  }); /* click() */
+}

_javascript/modules/components/toc.js

@@ -0,0 +1,13 @@
+export function toc() {
+  if (document.querySelector('#core-wrapper h2,#core-wrapper h3')) {
+    // see: https://github.com/tscanlin/tocbot#usage
+    tocbot.init({
+      tocSelector: '#toc',
+      contentSelector: '.post-content',
+      ignoreSelector: '[data-toc-skip]',
+      headingSelector: 'h2, h3',
+      orderedList: false,
+      scrollSmooth: false
+    });
+  }
+}

_javascript/modules/components/tooltip-loader.js

@@ -0,0 +1,6 @@
+/**
+ * Initial Bootstrap Tooltip.
+ */
+export function loadTooptip() {
+  $('[data-toggle="tooltip"]').tooltip();
+}

_javascript/modules/components/topbar-switcher.js

@@ -0,0 +1,93 @@
+/**
+ * Hide Header on scroll down
+ */
+import ScrollHelper from './utils/scroll-helper';
+
+const $searchInput = $('#search-input');
+const delta = ScrollHelper.getTopbarHeight();
+
+let didScroll;
+let lastScrollTop = 0;
+
+function hasScrolled() {
+  let st = $(window).scrollTop();
+
+  /* Make sure they scroll more than delta */
+  if (Math.abs(lastScrollTop - st) <= delta) {
+    return;
+  }
+
+  if (st > lastScrollTop) {
+    /* Scroll down */
+    ScrollHelper.hideTopbar();
+
+    if ($searchInput.is(':focus')) {
+      $searchInput.trigger('blur'); /* remove focus */
+    }
+  } else {
+    /* Scroll up */
+
+    // has not yet scrolled to the bottom of the screen, that is, there is still space for scrolling
+    if (st + $(window).height() < $(document).height()) {
+      if (ScrollHelper.hasScrollUpTask()) {
+        return;
+      }
+
+      if (ScrollHelper.topbarLocked()) {
+        // avoid redundant scroll up event from smooth scrolling
+        ScrollHelper.unlockTopbar();
+      } else {
+        if (ScrollHelper.orientationLocked()) {
+          // avoid device auto scroll up on orientation change
+          ScrollHelper.unLockOrientation();
+        } else {
+          ScrollHelper.showTopbar();
+        }
+      }
+    }
+  }
+
+  lastScrollTop = st;
+} // hasScrolled()
+
+function handleLandscape() {
+  if ($(window).scrollTop() === 0) {
+    return;
+  }
+  ScrollHelper.lockOrientation();
+  ScrollHelper.hideTopbar();
+}
+
+export function switchTopbar() {
+  const orientation = screen.orientation;
+  if (orientation) {
+    orientation.onchange = () => {
+      const type = orientation.type;
+      if (type === 'landscape-primary' || type === 'landscape-secondary') {
+        handleLandscape();
+      }
+    };
+  } else {
+    // for the browsers that not support `window.screen.orientation` API
+    $(window).on('orientationchange', () => {
+      if ($(window).width() < $(window).height()) {
+        // before rotating, it is still in portrait mode.
+        handleLandscape();
+      }
+    });
+  }
+
+  $(window).on('scroll', () => {
+    if (didScroll) {
+      return;
+    }
+    didScroll = true;
+  });
+
+  setInterval(() => {
+    if (didScroll) {
+      hasScrolled();
+      didScroll = false;
+    }
+  }, 250);
+}

_javascript/modules/components/utils/scroll-helper.js

@@ -0,0 +1,64 @@
+/**
+ * A tool for smooth scrolling and topbar switcher
+ */
+
+const ATTR_TOPBAR_VISIBLE = 'data-topbar-visible';
+const $body = $('body');
+const $topbarWrapper = $('#topbar-wrapper');
+
+export default class ScrollHelper {
+  static scrollUpCount = 0; // the number of times the scroll up was triggered by ToC or anchor
+  static topbarIsLocked = false;
+  static orientationIsLocked = false;
+
+  static hideTopbar() {
+    $body.attr(ATTR_TOPBAR_VISIBLE, 'false');
+  }
+
+  static showTopbar() {
+    $body.attr(ATTR_TOPBAR_VISIBLE, 'true');
+  }
+
+  // scroll up
+
+  static addScrollUpTask() {
+    ScrollHelper.scrollUpCount += 1;
+    if (!ScrollHelper.topbarIsLocked) {
+      ScrollHelper.topbarIsLocked = true;
+    }
+  }
+
+  static popScrollUpTask() {
+    ScrollHelper.scrollUpCount -= 1;
+  }
+
+  static hasScrollUpTask() {
+    return ScrollHelper.scrollUpCount > 0;
+  }
+
+  static topbarLocked() {
+    return ScrollHelper.topbarIsLocked === true;
+  }
+
+  static unlockTopbar() {
+    ScrollHelper.topbarIsLocked = false;
+  }
+
+  static getTopbarHeight() {
+    return $topbarWrapper.outerHeight();
+  }
+
+  // orientation change
+
+  static orientationLocked() {
+    return ScrollHelper.orientationIsLocked === true;
+  }
+
+  static lockOrientation() {
+    ScrollHelper.orientationIsLocked = true;
+  }
+
+  static unLockOrientation() {
+    ScrollHelper.orientationIsLocked = false;
+  }
+}

_javascript/modules/layouts.js

@@ -0,0 +1,3 @@
+export { basic } from './layouts/basic';
+export { initSidebar } from './layouts/sidebar';
+export { initTopbar } from './layouts/topbar';

_javascript/modules/layouts/basic.js

@@ -0,0 +1,7 @@
+import { back2top } from '../components/back-to-top';
+import { loadTooptip } from '../components/tooltip-loader';
+
+export function basic() {
+  back2top();
+  loadTooptip();
+}

_javascript/modules/layouts/sidebar.js

@@ -0,0 +1,7 @@
+import { modeWatcher } from '../components/mode-watcher';
+import { sidebarExpand } from '../components/sidebar';
+
+export function initSidebar() {
+  modeWatcher();
+  sidebarExpand();
+}

_javascript/modules/layouts/topbar.js

@@ -0,0 +1,9 @@
+import { convertTitle } from '../components/convert-title';
+import { displaySearch } from '../components/search-display';
+import { switchTopbar } from '../components/topbar-switcher';
+
+export function initTopbar() {
+  convertTitle();
+  displaySearch();
+  switchTopbar();
+}

_javascript/modules/plugins.js

@@ -0,0 +1,7 @@
+export { categoryCollapse } from './components/category-collapse';
+export { initClipboard } from './components/clipboard';
+export { imgExtra } from './components/img-extra';
+export { initLocaleDatetime } from './components/locale-datetime';
+export { initPageviews } from './components/pageviews';
+export { smoothScroll } from './components/smooth-scroll';
+export { toc } from './components/toc';

_javascript/page.js

@@ -0,0 +1,9 @@
+import { basic, initSidebar, initTopbar } from './modules/layouts';
+import { imgExtra, initClipboard, smoothScroll } from './modules/plugins';
+
+basic();
+initSidebar();
+initTopbar();
+imgExtra();
+initClipboard();
+smoothScroll();