Merge branch 'code-quality'

2020-08-21 00:46:48 +08:00 · 2020-08-21 00:46:48 +08:00 · 78e8ffd7ba
commit 78e8ffd7ba
parent a8f8bbaa1c 60a8a2fa41
37 changed files with 627 additions and 693 deletions
--- a/.github/CODE_OF_CONDUCT.md
+++ b/.github/CODE_OF_CONDUCT.md
@ -11,8 +11,7 @@ appearance, race, religion, or sexual identity and orientation.
 ## Our Standards
-Examples of behavior that contributes to creating a positive environment
+Examples of behavior that contributes to creating a positive environment include:
 include:
 * Using welcoming and inclusive language
 * Being respectful of differing viewpoints and experiences
@ -22,12 +21,10 @@ include:
 Examples of unacceptable behavior by participants include:
-* The use of sexualized language or imagery and unwelcome sexual attention or
+* The use of sexualized language or imagery and unwelcome sexual attention or advances
 advances
 * Trolling, insulting/derogatory comments, and personal or political attacks
 * Public or private harassment
-* Publishing others' private information, such as a physical or electronic
+* Publishing others' private information, such as a physical or electronic address, without explicit permission
 address, without explicit permission
 * Other conduct which could reasonably be considered inappropriate in a
 professional setting
@ -55,7 +52,7 @@ further defined and clarified by project maintainers.
 ## Enforcement
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
-reported by contacting the project team at cotes.chung@gmail.com. All
+reported by contacting the project team at `cotes.chung@gmail.com`. All
 complaints will be reviewed and investigated and will result in a response that
 is deemed necessary and appropriate to the circumstances. The project team is
 obligated to maintain confidentiality with regard to the reporter of an incident.
@ -68,9 +65,9 @@ members of the project's leadership.
 ## Attribution
 This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
-available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+available at <https://www.contributor-covenant.org/version/1/4/code-of-conduct.html>
 [homepage]: https://www.contributor-covenant.org
 For answers to common questions about this code of conduct, see
-https://www.contributor-covenant.org/faq
+<https://www.contributor-covenant.org/faq>
 [homepage]: https://www.contributor-covenant.org
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@ -12,11 +12,10 @@ labels: bug
 - [ ] There are no similar reports on existing issues (including closed ones).
 - [ ] I found the bug on the latest code of `master` branch.
 ## Describe the bug
 <!-- A clear and concise description of what the bug is. -->
-**To Reproduce**
+### To Reproduce
 Steps to reproduce the behavior:
@ -25,25 +24,24 @@ Steps to reproduce the behavior:
 3. Scroll down to '....'
 4. See error
-
+### Expected behavior
 **Expected behavior**
 <!-- A clear and concise description of what you expected to happen. -->
-**Screenshots**
+### Screenshots
 <!-- If applicable, add screenshots to help explain your problem. -->
-**Desktop**
+### Desktop
 <!-- Please complete the following information -->
- - OS: [e.g. iOS]
+- OS: [e.g. iOS]
- - Browser: [e.g. chrome, safari]
+- Browser: [e.g. chrome, safari]
- - Version: [e.g. 22]
+- Version: [e.g. 22]
-**Smartphone**
+### Smartphone
 <!-- please complete the following information -->
- - Device: [e.g. iPhone6]
+- Device: [e.g. iPhone6]
- - OS: [e.g. iOS8.1]
+- OS: [e.g. iOS8.1]
- - Browser: [e.g. stock browser, safari]
+- Browser: [e.g. stock browser, safari]
- - Version: [e.g. 22]
+- Version: [e.g. 22]
-**Additional context**
+### Additional context
 <!-- Add any other context about the problem here. -->
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@ -16,7 +16,7 @@ Please select the desired item checkbox and change it to "[x]", then delete opti
 - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
 - [ ] Documentation update
-## How has this been tested?
+## 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
@ -25,16 +25,15 @@ Please describe the tests that you ran to verify your changes. Provide instructi
 - [ ] I have run `bash ./tools/build.sh && bash ./tools/test.sh` (at the root of the project) locally and passed
 - [ ] I have tested this feature in the browser
-**Test Configuration**
+### Test Configuration
-* Browerser type & version:
+- Browerser type & version:
-* Operating system:
+- Operating system:
-* Bundler version:
+- Bundler version:
-* Ruby version:
+- Ruby version:
-* Jekyll version:
+- Jekyll version:
-
+### Checklist
 ## Checklist:
 <!-- Select checkboxes by change the "[ ]" to "[x]" -->
 - [ ] My code follows the [Google style guidelines](https://google.github.io/styleguide/)
 - [ ] I have performed a self-review of my own code
--- a/README.md
+++ b/README.md
@ -90,9 +90,9 @@ $ bash tools/init.sh
 What it does is:
 1. Remove some files or directories from your repository:
-    - `.travis.yml`
+	* `.travis.yml`
-    - files under `_posts`
+	* files under `_posts`
-    - folder `docs` 
+	* folder `docs` 
 2. If you use the `--no-gh` option, the directory `.github` will be deleted. Otherwise, setup the GitHub Action workflow by removing extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in folder `.github`.
@ -101,6 +101,7 @@ What it does is:
 ### Configuration
 Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options:
 * `url`
 * `avatar`
 * `timezone`
@ -121,7 +122,7 @@ Few days later, you may find that the file changes does not refresh in real time
 ### Deployment
-Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [_project site_](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
+Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [*project site*](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
 Assuming you have already gone through the [initialization](#initialization), you can now choose any of the following methods to deploy your website.
@ -130,12 +131,8 @@ Assuming you have already gone through the [initialization](#initialization), yo
 For security reasons, GitHub Pages build runs on `safe` mode, which restricts us from using tool scripts to generate additional page files. Therefore, we can use GitHub Actions to build the site, store the built site files on a new branch, and use that branch as the source of the Pages service.
 1. Push any commit to `origin/master` to trigger the GitHub Actions workflow. Once the build is complete, a new remote branch called `gh-pages` will appear, which is used to store the built site files.
 2. Unless you prefer to project sites, rename your repository to `<username>.github.io` on GitHub.
 3. Choose branch `gh-pages` as the [publishing source](https://docs.github.com/en/github/working-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site) for your GitHub Pages site.
 4. Visit your website at the address indicated by GitHub.
 #### Deploy on Other Platforms
--- a/_posts/2019-08-08-text-and-typography.md
+++ b/_posts/2019-08-08-text-and-typography.md
@ -11,16 +11,17 @@ This Jekyll template totally compatible with Markdown syntax. Now, let's take a
 ## Titles
-***
+---
 # H1
 <h2 data-toc-skip>H2</h2>
 <h3 data-toc-skip>H3</h3>
-#### H4
+<h4>H4</h4>
-***
+---
 ## Paragraph
@ -42,11 +43,11 @@ Fluttering and dancing in the breeze.
 ## Tables
-|Company|Contact|Country|
+| Company                      | contact          | Country |
-|:---|:--|---:|
+|:-----------------------------|:-----------------|--------:|
-|Alfreds Futterkiste | Maria Anders | Germany
+| Alfreds Futterkiste          | Maria Anders     | Germany |
-|Island Trading | Helen Bennett | UK
+| Island Trading               | Helen Bennett    | UK      |
-|Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy
+| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy   |
 ## Link
@ -60,7 +61,7 @@ Click the hook will locate the footnote[^footnote].
 ## Image
-![Desktop View]({{ "/assets/img/sample/mockup.png" | relative_url }})
+![Desktop View](/assets/img/sample/mockup.png)
 ## Inline code
--- a/_posts/2019-08-08-write-a-new-post.md
+++ b/_posts/2019-08-08-write-a-new-post.md
@ -33,7 +33,7 @@ In order to accurately record the release date of a post, you should not only se
 The `categories` of each post is designed to contain up to two elements, and the number of elements in `tags` can be zero to infinity.
-The list of posts belonging to the same _category_/_tag_ is recorded on a separate page. At the same time, the number of these _category_/_tag_ type pages is equal to the number of `categories` / `tags` elements for all posts, which means that the two number must be exactly the same.
+The list of posts belonging to the same *category*/*tag* is recorded on a separate page. At the same time, the number of these *category*/*tag* type pages is equal to the number of `categories` / `tags` elements for all posts, which means that the two number must be exactly the same.
 For instance, let's say there is a post with front matter:
@ -42,7 +42,7 @@ categories: [Animal, Insect]
 tags: bee
 ```
-Then we should have two _category_ type pages placed in folder `categories` of root and one _tag_ type page placed in folder `tags`  of root:
+Then we should have two *category* type pages placed in folder `categories` of root and one *tag* type page placed in folder `tags`  of root:
 ```sh
 .
@ -54,7 +54,7 @@ Then we should have two _category_ type pages placed in folder `categories` of r
 ...
 ```
-and the content of a _category_ type page is
+and the content of a *category* type page is
 ```yaml
 ---
@ -64,7 +64,7 @@ category: CATEGORY_NAME     # e.g. Insect
 ---
 ```
-the content of a _tag_ type page is
+the content of a *tag* type page is
 ```yaml
 ---
@ -74,7 +74,7 @@ tag: TAG_NAME               # e.g. bee
 ---
 ```
-With the increasing number of posts, the number of categories and tags will increase several times!  If we still manually create these *category*/_tag_ type files, it will obviously be a super time-consuming job, and it is very likely to miss some of them, i.e., when you click on the missing `category` or `tag` link from a post or somewhere, the browser will complain to you "404 Not Found". The good news is we got a lovely script tool `_scripts/sh/create_pages.sh` to finish the boring tasks. Basically we will use it via `run.sh`, `build.sh`, `deploy.sh` or `publish.sh` that placed in `tools/` instead of running it separately. Check out its use case [here]({{ "/posts/getting-started/#deployment" | relative_url }}).
+With the increasing number of posts, the number of categories and tags will increase several times!  If we still manually create these *category*/*tag* type files, it will obviously be a super time-consuming job, and it is very likely to miss some of them, i.e., when you click on the missing `category` or `tag` link from a post or somewhere, the browser will complain to you "404 Not Found". The good news is we got a lovely script tool `_scripts/sh/create_pages.sh` to finish the boring tasks. Basically we will use it via `run.sh`, `build.sh`, `deploy.sh` or `publish.sh` that placed in `tools/` instead of running it separately. Check out its use case [here]({{ "/posts/getting-started/#deployment" | relative_url }}).
 ## Last modified date
--- a/_posts/2019-08-09-getting-started.md
+++ b/_posts/2019-08-09-getting-started.md
@ -42,7 +42,6 @@ What's more, in order to generate some extra files (*categories*, *tags* and *la
  $ brew install coreutils
  ```
 ## Usage
 Running [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) requires some extra files, which cannot be generated by Jekyll native commands, so please strictly follow the methods mentioned below to run or deploy your website.
@ -60,12 +59,10 @@ $ bash tools/init.sh
 What it does is:
 1. Remove some files or directories from your repository:
-    - `.travis.yml`
+* `.travis.yml`
-    - files under `_posts`
+* files under `_posts`
-    - folder `docs` 
+* folder `docs` 
 2. If you use the `--no-gh` option, the directory `.github` will be deleted. Otherwise, setup the GitHub Action workflow by removing extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in folder `.github`. 
 3. Automatically create a commit to save the changes.
 ### Configuration
@ -76,7 +73,6 @@ Generally, go to `_config.yml` and configure the variables as needed. Some of th
 * `timezone`
 * `theme_mode`
 ### Run Locally
 You may want to preview the site contents before publishing, so just run it by:
@ -91,7 +87,7 @@ Few days later, you may find that the file changes does not refresh in real time
 ### Deployment
-Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [_project site_](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
+Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [*project site*](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
 Assuming you have already gone through the [initialization](#initialization), you can now choose any of the following methods to deploy your website.
@ -100,11 +96,8 @@ Assuming you have already gone through the [initialization](#initialization), yo
 For security reasons, GitHub Pages build runs on `safe` mode, which restricts us from using tool scripts to generate additional page files. Therefore, we can use GitHub Actions to build the site, store the built site files on a new branch, and use that branch as the source of the Pages service.
 1. Push any commit to `origin/master` to trigger the GitHub Actions workflow. Once the build is complete, a new remote branch called `gh-pages` will appear, which is used to store the built site files.
 2. Unless you prefer to project sites, rename your repository to `<username>.github.io` on GitHub.
 3. Choose branch `gh-pages` as the [publishing source](https://docs.github.com/en/github/working-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site) for your GitHub Pages site.
 4. Visit your website at the address indicated by GitHub.
 #### Deploy on Other Platforms
--- a/_posts/2019-08-11-customize-the-favicon.md
+++ b/_posts/2019-08-11-customize-the-favicon.md
@ -11,11 +11,11 @@ In [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/), the image fi
 With a square image (PNG, JPG or GIF) in hand, open the site [*Favicon & App Icon Generator*](https://www.favicon-generator.org/) and upload your original image.
-![upload-image]({{ "/assets/img/sample/upload-image.png" | relative_url }})
+![upload-image](/assets/img/sample/upload-image.png)
 Click button <kbd>Create Favicon</kbd> and wait a moment for the website to generate the icons of various sizes automatically.
-![download-icons]({{ "/assets/img/sample/download-icons.png" | relative_url }})
+![download-icons](/assets/img/sample/download-icons.png)
 Download the generated package, unzip and delete the following two from the extracted files:
--- a/_scripts/sh/create_pages.sh
+++ b/_scripts/sh/create_pages.sh
@ -20,15 +20,15 @@ tag_count=0
 _read_yaml() {
-  local _endline=$(grep -n "\-\-\-" $1 | cut -d: -f 1 | sed -n '2p')
+  local _endline="$(grep -n "\-\-\-" "$1" | cut -d: -f 1 | sed -n '2p')"
-  head -$_endline $1
+  head -"$_endline" "$1"
 }
 read_categories() {
-  local _yaml=$(_read_yaml $1)
+  local _yaml="$(_read_yaml "$1")"
-  local _categories=$(echo "$_yaml" | grep "^categories:")
+  local _categories="$(echo "$_yaml" | grep "^categories:")"
-  local _category=$(echo "$_yaml" | grep "^category:")
+  local _category="$(echo "$_yaml" | grep "^category:")"
  if [[ ! -z "$_categories" ]]; then
    echo "$_categories" | sed "s/categories: *//;s/\[//;s/\].*//;s/, */,/g;s/\"//g;s/'//g"
@ -39,7 +39,7 @@ read_categories() {
 read_tags() {
-  local _yaml=$(_read_yaml $1)
+  local _yaml="$(_read_yaml "$1")"
  echo "$_yaml" | grep "^tags:" | sed "s/tags: *//;s/\[//;s/\].*//;s/, */,/g;s/\"//g;s/'//g"
 }
@ -65,14 +65,14 @@ init() {
 create_category() {
  if [[ ! -z $1 ]]; then
    local _name=$1
-    local _filepath="categories/$(echo $_name | sed 's/ /-/g' | awk '{print tolower($0)}').html"
+    local _filepath="categories/$(echo "$_name" | sed 's/ /-/g' | awk '{print tolower($0)}').html"
-    if [[ ! -f $_filepath ]]; then
+    if [[ ! -f "$_filepath" ]]; then
-      echo "---" > $_filepath
+      echo "---" > "$_filepath"
-      echo "layout: category" >> $_filepath
+      echo "layout: category" >> "$_filepath"
-      echo "title: $_name" >> $_filepath
+      echo "title: $_name" >> "$_filepath"
-      echo "category: $_name" >> $_filepath
+      echo "category: $_name" >> "$_filepath"
-      echo "---" >> $_filepath
+      echo "---" >> "$_filepath"
      ((category_count=category_count+1))
    fi
@ -83,15 +83,15 @@ create_category() {
 create_tag() {
  if [[ ! -z $1 ]]; then
    local _name=$1
-    local _filepath="tags/$( echo $_name | sed "s/ /-/g;s/'//g" | awk '{print tolower($0)}' ).html"
+    local _filepath="tags/$( echo "$_name" | sed "s/ /-/g;s/'//g" | awk '{print tolower($0)}' ).html"
-    if [[ ! -f $_filepath ]]; then
+    if [[ ! -f "$_filepath" ]]; then
-      echo "---" > $_filepath
+      echo "---" > "$_filepath"
-      echo "layout: tag" >> $_filepath
+      echo "layout: tag" >> "$_filepath"
-      echo "title: $_name" >> $_filepath
+      echo "title: $_name" >> "$_filepath"
-      echo "tag: $_name" >> $_filepath
+      echo "tag: $_name" >> "$_filepath"
-      echo "---" >> $_filepath
+      echo "---" >> "$_filepath"
      ((tag_count=tag_count+1))
    fi
@ -116,13 +116,13 @@ create_pages() {
      $TYPE_CATEGORY)
        for i in ${_string#,}; do
-          create_category $i
+          create_category "$i"
        done
        ;;
      $TYPE_TAG)
        for i in ${_string#,}; do
-          create_tag $i
+          create_tag "$i"
        done
        ;;
--- a/_scripts/sh/dump_lastmod.sh
+++ b/_scripts/sh/dump_lastmod.sh
@ -35,8 +35,8 @@ _init() {
 _has_changed() {
-  local _log_count=`git log --pretty=%ad $1 | wc -l | sed 's/ *//'`
+  local _log_count="$(git log --pretty=%ad "$1" | wc -l | sed 's/ *//')"
-  _log_count=$(($_log_count + 0))
+  _log_count=$((_log_count + 0))
  if [[ $_log_count > 1 ]]; then
    return 0 # true
@ -56,7 +56,7 @@ _has_changed() {
 #     the file '_data/updates.yml'
 ###################################
 _dump() {
-  local _lasmod="`git log -1 --pretty=%ad --date=iso $2`"
+  local _lasmod="$(git log -1 --pretty=%ad --date=iso "$2")"
  if [[ ! -f "$OUTPUT_DIR/$OUTPUT_FILE" ]]; then
    touch "$OUTPUT_DIR/$OUTPUT_FILE"
@ -76,7 +76,7 @@ main() {
  for _file in $(find ${POST_DIR} -type f \( -iname \*.md -o -iname \*.markdown \))
  do
-    _filename=$(basename $_file | sed 's/-\-\+/-/;s/[[:digit:]]\([[:digit:]]*-\)//g;s/\..*//' ) # remove date and extension
+    _filename="$(basename "$_file" | sed 's/-\-\+/-/;s/[[:digit:]]\([[:digit:]]*-\)//g;s/\..*//' )" # remove date and extension
    if _has_changed "$_file"; then
      _dump "$_filename" "$_file"
--- a/_scripts/sh/sync_monitor.sh
+++ b/_scripts/sh/sync_monitor.sh
@ -11,28 +11,28 @@
 # $3 -> the destination sync directory
 # Omit the system temp file
-if [[ ! -f $1 ]]; then
+if [[ ! -f "$1" ]]; then
  exit 0
 fi
-src_dir=`dirname $(realpath $1)`
+src_dir="$(dirname $(realpath "$1"))"
-dir_prefix="$(realpath $2)/"
+dir_prefix="$(realpath "$2")/"
 related_dir="${src_dir:${#dir_prefix}}"
-dest="$(realpath $3)/${related_dir}"
+dest="$(realpath "$3")/${related_dir}"
 if [[ ! -d "$dest" ]]; then
  mkdir -p "$dest"
 fi
 if [[ -f "$1" ]]; then
-  cp $1 $dest
+  cp "$1" "$dest"
 fi
-if [[ $related_dir == "_posts" ]]; then
+if [[ "$related_dir" == "_posts" ]]; then
-  bash $3/_scripts/sh/create_pages.sh
+  bash "$3"/_scripts/sh/create_pages.sh
-  bash $3/_scripts/sh/dump_lastmod.sh
+  bash "$3"/_scripts/sh/dump_lastmod.sh
 fi
--- a/assets/css/_addon/main.scss
+++ b/assets/css/_addon/main.scss
@ -106,7 +106,7 @@ $sidebar-display: "sidebar-display";
  }
  .sidebar-bottom {
-    .icon-border+a { // the icon behide mode-toggle
+    .icon-border + a { // the icon behide mode-toggle
      margin-left: .1rem;
    }
  }
@ -185,7 +185,7 @@ $sidebar-display: "sidebar-display";
      margin-bottom: .5rem; // icons may have multi lines
    }
-    a:hover, #mode-toggle-wrapper>i:hover {
+    a:hover, #mode-toggle-wrapper > i:hover {
      color: #fff;
    }
@ -211,7 +211,7 @@ $sidebar-display: "sidebar-display";
 } // #sidebar
@media (hover: hover) {
-  #sidebar ul>li:last-child::after {
+  #sidebar ul > li:last-child::after {
    -webkit-transition: top .5s ease;
    -moz-transition: top .5s ease;
    -o-transition: top .5s ease;
@ -242,7 +242,7 @@ $sidebar-display: "sidebar-display";
    transition: border-color 0.35s ease-in-out;
  }
-  &:hover>a {
+  &:hover > a {
    border-color: #fff;
  }
@ -448,7 +448,7 @@ $sidebar-display: "sidebar-display";
  @include pl-pr(0);
 }
-#main>div.row:first-child>div {
+#main > div.row:first-child > div {
  &:nth-child(1), &:nth-child(2) {
    margin-top: $topbar-height; /* same as the height of topbar */
  }
@ -544,7 +544,7 @@ footer {
 #access-tags {
-  >div.post-content>div {
+  >div.post-content > div {
    max-width: 80%;
  }
  .post-tag {
@ -676,7 +676,7 @@ sup {
    &:not(:last-child) {
      margin-bottom: -.8rem;
    }
-    &:target>p {
+    &:target > p {
      background-color: var(--footnote-target-bg);
      width: fit-content;
      -webkit-transition: background-color 1.5s ease-in-out;
@ -693,7 +693,7 @@ sup {
    -webkit-transition: background-color 1.5s ease-in-out; /* Safari prior 6.1 */
    transition: background-color 1.5s ease-in-out;
  }
-  @at-root sup:target>a#{&} {
+  @at-root sup:target > a#{&} {
    background-color: var(--footnote-target-bg);
    padding: 0 2px;
  }
@ -928,7 +928,7 @@ div.post-content .table-wrapper {
  $footer-height: 6rem; // overwrite
-  #main>div.row:first-child>div:first-child {
+  #main > div.row:first-child > div:first-child {
    min-height: calc(100vh - #{$topbar-height} - #{$footer-height});
  }
@ -941,7 +941,7 @@ div.post-content .table-wrapper {
    }
  }
-  #avatar>a {
+  #avatar > a {
    width: 5rem;
    height: 5rem;
  }
@ -951,7 +951,7 @@ div.post-content .table-wrapper {
  }
  /* table text in small screens */
-  div>table, p~table {
+  div > table, p ~ table {
    width: 100%;
    table-layout: fixed;
    word-wrap: break-word;
@ -1051,8 +1051,8 @@ div.post-content .table-wrapper {
    top: 0 !important;
  }
-  #main>div.row:first-child>div:nth-child(1),
+  #main > div.row:first-child > div:nth-child(1),
-  #main>div.row:first-child>div:nth-child(2) {
+  #main > div.row:first-child > div:nth-child(2) {
    margin-top: 0;
  }
@ -1063,7 +1063,7 @@ div.post-content .table-wrapper {
  }
  #search-wrapper {
-    &.loaded~a {
+    &.loaded ~ a {
      margin-right: 1rem;
    }
    .fa-times-circle {
@ -1095,7 +1095,7 @@ div.post-content .table-wrapper {
    padding-top: 3.4rem;
  }
-  .footnotes ol>li {
+  .footnotes ol > li {
    padding-top: 3.5rem;
    margin-top: -4.3rem;
    &:first-child {
@ -1106,7 +1106,7 @@ div.post-content .table-wrapper {
@media all and (min-width: 577px) and (max-width: 1199px) {
-  footer>.d-flex>div {
+  footer>.d-flex > div {
    width: 312px;
  }
 }
@ -1147,7 +1147,7 @@ div.post-content .table-wrapper {
    text-align: left;
  }
-  footer>div.d-flex {
+  footer > div.d-flex {
    width: 92%;
  }
@ -1184,7 +1184,7 @@ div.post-content .table-wrapper {
    width: calc(100% - 210px);
  }
-  #search-results>div {
+  #search-results > div {
    max-width: 700px;
  }
@ -1222,7 +1222,7 @@ div.post-content .table-wrapper {
    padding: 0;
  }
-  #main>div.row {
+  #main > div.row {
    -webkit-box-pack: center!important;
    -ms-flex-pack: center!important;
    justify-content: center!important;
@ -1234,7 +1234,7 @@ div.post-content .table-wrapper {
@media all and (min-width: 1200px) {
-  #main>div.row>div.col-xl-8 {
+  #main > div.row > div.col-xl-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
@ -1265,7 +1265,7 @@ div.post-content .table-wrapper {
    width: calc(100% - 260px);
  }
-  #search-results>div {
+  #search-results > div {
    max-width: 46%;
    &:nth-child(odd) {
      margin-right: 1.5rem;
@ -1283,7 +1283,7 @@ div.post-content .table-wrapper {
    font-size: 1.03rem;
  }
-  footer>div.d-felx {
+  footer > div.d-felx {
    width: 85%;
  }
@ -1291,7 +1291,7 @@ div.post-content .table-wrapper {
@media all and (min-width: 1400px) {
-  #main>div.row {
+  #main > div.row {
    padding-left: calc((100% - #{$main-content-max-width}) / 2);
    >div.col-xl-8 {
      max-width: 850px;
@ -1323,7 +1323,7 @@ div.post-content .table-wrapper {
    padding-left: 0;
  }
-  #main>div.row>div.col-xl-8 {
+  #main > div.row > div.col-xl-8 {
    padding-left: 0;
    >div:first-child {
      padding-left: .55rem !important;
@ -1400,7 +1400,7 @@ div.post-content .table-wrapper {
    ul {
      margin-left: 3%;
-      >li>a {
+      >li > a {
        padding-left: 2.5rem;
        -webkit-box-pack: start!important;
        -ms-flex-pack: start!important;
@ -1457,7 +1457,7 @@ div.post-content .table-wrapper {
      }
    } // .sidebar-bottom
  } // #sidebar
-  footer>div.d-flex {
+  footer > div.d-flex {
    width: 87%;
    max-width: 1140px;
  }
@ -1482,7 +1482,7 @@ div.post-content .table-wrapper {
    max-width: calc(#{$main-content-max-width} + 20px)
  }
-  #main>div.row {
+  #main > div.row {
    padding-left: calc((100% - #{$main-content-max-width} - 2%) / 2);
  }
@ -1502,7 +1502,7 @@ div.post-content .table-wrapper {
 }
@media (min-width: 1920px) {
-  #main>div.row {
+  #main > div.row {
    padding-left: 190px;
  }
--- a/assets/css/_addon/module.scss
+++ b/assets/css/_addon/module.scss
@ -7,7 +7,7 @@
 * MIT Licensed
 */
-/*---------- scss placeholder ---------*/
+/* ---------- scss placeholder --------- */
 %tag-hover {
  background: var(--tag-hover);
@ -15,12 +15,12 @@
 }
 %table-cell {
-  padding: .4rem 1rem;
+  padding: 0.4rem 1rem;
  font-size: 95%;
 }
 %link-hover {
-  color: #d2603a!important;
+  color: #d2603a !important;
  border-bottom: 1px solid #d2603a;
  text-decoration: none;
 }
@ -54,7 +54,7 @@
  margin-top: -2.5rem;
 }
-/*---------- scss mixin ---------*/
+/* ---------- scss mixin --------- */
@mixin no-text-decoration {
  text-decoration: none;
@ -64,7 +64,7 @@
  color: $color;
  transition: color 0.35s ease-in-out;
  user-select: none;
-  margin: 0 .25rem;
+  margin: 0 0.25rem;
 }
@mixin icon-round($diameter) {
--- a/assets/css/_addon/syntax.scss
+++ b/assets/css/_addon/syntax.scss
@ -9,8 +9,8 @@
@import "_colors/light-syntax";
@import "_colors/dark-syntax";
-
+html:not([mode]),
-html:not([mode]), html[mode=light] {
+html[mode=light] {
  @include light-syntax;
 }
@ -19,7 +19,8 @@ html[mode=dark] {
 }
@media (prefers-color-scheme: dark) {
-  html:not([mode]), html[mode=dark] {
+  html:not([mode]),
  html[mode=dark] {
    @include dark-syntax;
  }
@ -28,7 +29,7 @@ html[mode=dark] {
  }
 }
-/*-- Codes Snippet --*/
+/* -- Codes Snippet -- */
 %code-snippet-bg {
  background: var(--highlight-bg-color);
@ -39,12 +40,19 @@ html[mode=dark] {
 }
 %code-snippet-padding {
-  padding: .8rem 1rem;
+  padding: 0.8rem 1rem;
 }
 div > pre {
  @extend %code-snippet-bg;
  @extend %code-snippet-radius;
  @extend %code-snippet-padding;
 }
 .highlighter-rouge {
  @extend %code-snippet-bg;
  @extend %code-snippet-radius;
  color: var(--highlighter-rouge-color);
  margin-bottom: 1.2em; /* Override BS Inline-code style */
 }
@ -52,13 +60,15 @@ html[mode=dark] {
 .highlight {
  @extend %code-snippet-radius;
  @extend %code-snippet-bg;
  @at-root figure#{&} {
    @extend %code-snippet-bg;
  }
  overflow: auto;
  .lineno {
-    margin: .8rem 0rem;
+    margin: 0.8rem 0;
-    padding: 0 .5rem;
+    padding: 0 0.5rem;
    min-width: 2.2rem;
    text-align: right;
    color: var(--highlight-lineno-color);
@ -70,6 +80,12 @@ html[mode=dark] {
    -o-user-select: none;
    user-select: none;
  }
  pre {
    margin-bottom: 0;
    font-size: 0.85rem;
    line-height: 1.4rem;
    word-wrap: normal; /* Fixed Safari overflow-x */
  }
  table {
    padding: 0;
    border: 0;
@ -82,14 +98,6 @@ html[mode=dark] {
    padding: 0;
    border: 0;
  }
  pre {
    margin-bottom: 0;
    font-size: .85rem;
    line-height: 1.4rem;
    word-wrap: normal;
    /* Fixed Safari overflow-x */
  }
 } //.highlight
 code {
@ -97,19 +105,23 @@ code {
  -ms-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
  &.highlighter-rouge {
    padding: 3px 5px;
-    margin: 0 .15rem;
+    margin: 0 0.15rem;
    border-radius: 4px;
    background-color: var(--inline-code-bg);
  }
-  @at-root a>&.highlighter-rouge {
+
  @at-root a > &.highlighter-rouge {
    padding-bottom: 0; // show link's underlinke
    color: inherit;
  }
-  @at-root a:hover>&.highlighter-rouge {
+
  @at-root a:hover > &.highlighter-rouge {
    border-bottom: none;
  }
  blockquote &.highlighter-rouge {
    color: inherit;
  }
@ -120,12 +132,6 @@ td.rouge-code {
  padding-right: 1rem;
 }
 div>pre {
  @extend %code-snippet-bg;
  @extend %code-snippet-radius;
  @extend %code-snippet-padding;
 }
 /* Hide line numbers for default, console, and terminal code snippets */
 div {
  &[class^='highlighter-rouge'],
--- a/assets/css/_addon/variables.scss
+++ b/assets/css/_addon/variables.scss
@ -7,7 +7,7 @@
 * MIT Licensed
 */
-/*--- ↓ width and height ----*/
+/* --- ↓ width and height ---- */
 $tab-height: 3.3rem;
 $tab-cursor-height: 1.6rem;
--- a/assets/css/_colors/dark-syntax.scss
+++ b/assets/css/_colors/dark-syntax.scss
@ -7,87 +7,82 @@
 */
@mixin dark-syntax {
-  /* syntax highlight colors from https://raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css */
+  /* -----  My styles ------ */
  .highlight pre { background-color: #272822; }
  .highlight .hll { background-color: #272822; }
  .highlight .c { color: #75715e } /* Comment */
  .highlight .err { color: #960050; background-color: #1e0010 } /* Error */
  .highlight .k { color: #66d9ef } /* Keyword */
  .highlight .l { color: #ae81ff } /* Literal */
  .highlight .n { color: #f8f8f2 } /* Name */
  .highlight .o { color: #f92672 } /* Operator */
  .highlight .p { color: #f8f8f2 } /* Punctuation */
  .highlight .cm { color: #75715e } /* Comment.Multiline */
  .highlight .cp { color: #75715e } /* Comment.Preproc */
  .highlight .c1 { color: #75715e } /* Comment.Single */
  .highlight .cs { color: #75715e } /* Comment.Special */
  .highlight .ge { font-style: italic } /* Generic.Emph */
  .highlight .gs { font-weight: bold } /* Generic.Strong */
  .highlight .kc { color: #66d9ef } /* Keyword.Constant */
  .highlight .kd { color: #66d9ef } /* Keyword.Declaration */
  .highlight .kn { color: #f92672 } /* Keyword.Namespace */
  .highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
  .highlight .kr { color: #66d9ef } /* Keyword.Reserved */
  .highlight .kt { color: #66d9ef } /* Keyword.Type */
  .highlight .ld { color: #e6db74 } /* Literal.Date */
  .highlight .m { color: #ae81ff } /* Literal.Number */
  .highlight .s { color: #e6db74 } /* Literal.String */
  .highlight .na { color: #a6e22e } /* Name.Attribute */
  .highlight .nb { color: #f8f8f2 } /* Name.Builtin */
  .highlight .nc { color: #a6e22e } /* Name.Class */
  .highlight .no { color: #66d9ef } /* Name.Constant */
  .highlight .nd { color: #a6e22e } /* Name.Decorator */
  .highlight .ni { color: #f8f8f2 } /* Name.Entity */
  .highlight .ne { color: #a6e22e } /* Name.Exception */
  .highlight .nf { color: #a6e22e } /* Name.Function */
  .highlight .nl { color: #f8f8f2 } /* Name.Label */
  .highlight .nn { color: #f8f8f2 } /* Name.Namespace */
  .highlight .nx { color: #a6e22e } /* Name.Other */
  .highlight .py { color: #f8f8f2 } /* Name.Property */
  .highlight .nt { color: #f92672 } /* Name.Tag */
  .highlight .nv { color: #f8f8f2 } /* Name.Variable */
  .highlight .ow { color: #f92672 } /* Operator.Word */
  .highlight .w { color: #f8f8f2 } /* Text.Whitespace */
  .highlight .mf { color: #ae81ff } /* Literal.Number.Float */
  .highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
  .highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
  .highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
  .highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
  .highlight .sc { color: #e6db74 } /* Literal.String.Char */
  .highlight .sd { color: #e6db74 } /* Literal.String.Doc */
  .highlight .s2 { color: #e6db74 } /* Literal.String.Double */
  .highlight .se { color: #ae81ff } /* Literal.String.Escape */
  .highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
  .highlight .si { color: #e6db74 } /* Literal.String.Interpol */
  .highlight .sx { color: #e6db74 } /* Literal.String.Other */
  .highlight .sr { color: #e6db74 } /* Literal.String.Regex */
  .highlight .s1 { color: #e6db74 } /* Literal.String.Single */
  .highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
  .highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
  .highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
  .highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
  .highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
  .highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
  .highlight .gh { } /* Generic Heading & Diff Header */
  .highlight .gu { color: #75715e; } /* Generic.Subheading & Diff Unified/Comment? */
  .highlight .gd { color: #f92672; background-color: #561c08 } /* Generic.Deleted & Diff Deleted */
  .highlight .gi { color: #a6e22e; background-color: #0b5858 } /* Generic.Inserted & Diff Inserted */
  /*-----  My styles ------*/
  --highlight-bg-color: #272822;
  --highlighter-rouge-color: #de6b18;
  --highlight-lineno-color: #6c6c6d;
  --highlight-lineno-border-color: #3c4042;
  --inline-code-bg: var(--highlight-bg-color);
  .highlight {
    .gp { color: #818c96; }
  }
-  pre { color: #818c96 } /* override Bootstrap */
+
  pre { color: #818c96; } /* override Bootstrap */
  kbd { background-color: black; }
  /* syntax highlight colors from https://raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css */
  .highlight pre { background-color: #272822; }
  .highlight .hll { background-color: #272822; }
  .highlight .c { color: #75715e; } /* Comment */
  .highlight .err { color: #960050; background-color: #1e0010; } /* Error */
  .highlight .k { color: #66d9ef; } /* Keyword */
  .highlight .l { color: #ae81ff; } /* Literal */
  .highlight .n { color: #f8f8f2; } /* Name */
  .highlight .o { color: #f92672; } /* Operator */
  .highlight .p { color: #f8f8f2; } /* Punctuation */
  .highlight .cm { color: #75715e; } /* Comment.Multiline */
  .highlight .cp { color: #75715e; } /* Comment.Preproc */
  .highlight .c1 { color: #75715e; } /* Comment.Single */
  .highlight .cs { color: #75715e; } /* Comment.Special */
  .highlight .ge { font-style: italic; } /* Generic.Emph */
  .highlight .gs { font-weight: bold; } /* Generic.Strong */
  .highlight .kc { color: #66d9ef; } /* Keyword.Constant */
  .highlight .kd { color: #66d9ef; } /* Keyword.Declaration */
  .highlight .kn { color: #f92672; } /* Keyword.Namespace */
  .highlight .kp { color: #66d9ef; } /* Keyword.Pseudo */
  .highlight .kr { color: #66d9ef; } /* Keyword.Reserved */
  .highlight .kt { color: #66d9ef; } /* Keyword.Type */
  .highlight .ld { color: #e6db74; } /* Literal.Date */
  .highlight .m { color: #ae81ff; } /* Literal.Number */
  .highlight .s { color: #e6db74; } /* Literal.String */
  .highlight .na { color: #a6e22e; } /* Name.Attribute */
  .highlight .nb { color: #f8f8f2; } /* Name.Builtin */
  .highlight .nc { color: #a6e22e; } /* Name.Class */
  .highlight .no { color: #66d9ef; } /* Name.Constant */
  .highlight .nd { color: #a6e22e; } /* Name.Decorator */
  .highlight .ni { color: #f8f8f2; } /* Name.Entity */
  .highlight .ne { color: #a6e22e; } /* Name.Exception */
  .highlight .nf { color: #a6e22e; } /* Name.Function */
  .highlight .nl { color: #f8f8f2; } /* Name.Label */
  .highlight .nn { color: #f8f8f2; } /* Name.Namespace */
  .highlight .nx { color: #a6e22e; } /* Name.Other */
  .highlight .py { color: #f8f8f2; } /* Name.Property */
  .highlight .nt { color: #f92672; } /* Name.Tag */
  .highlight .nv { color: #f8f8f2; } /* Name.Variable */
  .highlight .ow { color: #f92672; } /* Operator.Word */
  .highlight .w { color: #f8f8f2; } /* Text.Whitespace */
  .highlight .mf { color: #ae81ff; } /* Literal.Number.Float */
  .highlight .mh { color: #ae81ff; } /* Literal.Number.Hex */
  .highlight .mi { color: #ae81ff; } /* Literal.Number.Integer */
  .highlight .mo { color: #ae81ff; } /* Literal.Number.Oct */
  .highlight .sb { color: #e6db74; } /* Literal.String.Backtick */
  .highlight .sc { color: #e6db74; } /* Literal.String.Char */
  .highlight .sd { color: #e6db74; } /* Literal.String.Doc */
  .highlight .s2 { color: #e6db74; } /* Literal.String.Double */
  .highlight .se { color: #ae81ff; } /* Literal.String.Escape */
  .highlight .sh { color: #e6db74; } /* Literal.String.Heredoc */
  .highlight .si { color: #e6db74; } /* Literal.String.Interpol */
  .highlight .sx { color: #e6db74; } /* Literal.String.Other */
  .highlight .sr { color: #e6db74; } /* Literal.String.Regex */
  .highlight .s1 { color: #e6db74; } /* Literal.String.Single */
  .highlight .ss { color: #e6db74; } /* Literal.String.Symbol */
  .highlight .bp { color: #f8f8f2; } /* Name.Builtin.Pseudo */
  .highlight .vc { color: #f8f8f2; } /* Name.Variable.Class */
  .highlight .vg { color: #f8f8f2; } /* Name.Variable.Global */
  .highlight .vi { color: #f8f8f2; } /* Name.Variable.Instance */
  .highlight .il { color: #ae81ff; } /* Literal.Number.Integer.Long */
  .highlight .gu { color: #75715e; } /* Generic.Subheading & Diff Unified/Comment? */
  .highlight .gd { color: #f92672; background-color: #561c08; } /* Generic.Deleted & Diff Deleted */
  .highlight .gi { color: #a6e22e; background-color: #0b5858; } /* Generic.Inserted & Diff Inserted */
 }
--- a/assets/css/_colors/dark-typography.scss
+++ b/assets/css/_colors/dark-typography.scss
@ -26,12 +26,10 @@
  --button-bg: rgb(39, 40, 43);
  --blockquote-border-color: rgb(66, 66, 66);
  --blockquote-text-color: rgb(117, 117, 117);
  --btn-border-color: rgb(63, 65, 68);
  --btn-backtotop-color: var(--text-color);
  --btn-backtotop-border-color: var(--btn-border-color);
  --btn-box-shadow: var(--main-wrapper-bg);
  --card-header-bg: rgb(51, 50, 50);
  --label-color: rgb(108, 117, 125);
@ -71,7 +69,6 @@
  --tag-border: rgb(59, 79, 88);
  --tag-shadow: rgb(32, 33, 33);
  --search-tag-bg: var(--tag-bg);
  --dash-color: rgb(63, 65, 68);
  /* categories */
@ -98,10 +95,10 @@
  nav[data-toggle=toc] .nav-link.active,
  nav[data-toggle=toc] .nav-link.active:focus,
  nav[data-toggle=toc] .nav-link.active:hover,
-  nav[data-toggle=toc] .nav>li>a:focus,
+  nav[data-toggle=toc] .nav > li > a:focus,
-  nav[data-toggle=toc] .nav>li>a:hover {
+  nav[data-toggle=toc] .nav > li > a:hover {
-    color: var(--toc-highlight)!important;
+    color: var(--toc-highlight) !important;
-    border-left-color: var(--toc-highlight)!important;
+    border-left-color: var(--toc-highlight) !important;
  }
  /* categories */
@ -126,8 +123,13 @@
  }
  #archives li:nth-child(odd) {
-    background-image: linear-gradient(to left,
+    background-image: linear-gradient(
-      rgb(26, 26, 30), rgb(39, 39, 45), rgb(39, 39, 45), rgb(39, 39, 45), rgb(26, 26, 30));
+      to left,
      rgb(26, 26, 30),
      rgb(39, 39, 45),
      rgb(39, 39, 45),
      rgb(39, 39, 45),
      rgb(26, 26, 30));
  }
 } // dark-scheme
--- a/assets/css/_colors/light-syntax.scss
+++ b/assets/css/_colors/light-syntax.scss
@ -8,73 +8,72 @@
@mixin light-syntax {
  /* see: <https://raw.githubusercontent.com/jwarby/pygments-css/master/github.css> */
-  .highlight .hll { background-color: #ffffcc }
+  .highlight .hll { background-color: #ffffcc; }
-  .highlight .c { color: #999988; font-style: italic } /* Comment */
+  .highlight .c { color: #999988; font-style: italic; } /* Comment */
-  .highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+  .highlight .err { color: #a61717; background-color: #e3d2d2; } /* Error */
-  .highlight .k { color: #000000; font-weight: bold } /* Keyword */
+  .highlight .k { color: #000000; font-weight: bold; } /* Keyword */
-  .highlight .o { color: #000000; font-weight: bold } /* Operator */
+  .highlight .o { color: #000000; font-weight: bold; } /* Operator */
-  .highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+  .highlight .cm { color: #999988; font-style: italic; } /* Comment.Multiline */
-  .highlight .cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
+  .highlight .cp { color: #999999; font-weight: bold; font-style: italic; } /* Comment.Preproc */
-  .highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+  .highlight .c1 { color: #999988; font-style: italic; } /* Comment.Single */
-  .highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+  .highlight .cs { color: #999999; font-weight: bold; font-style: italic; } /* Comment.Special */
-  .highlight .gd { color: #d01040; background-color: #ffdddd } /* Generic.Deleted */
+  .highlight .gd { color: #d01040; background-color: #ffdddd; } /* Generic.Deleted */
-  .highlight .ge { color: #000000; font-style: italic } /* Generic.Emph */
+  .highlight .ge { color: #000000; font-style: italic; } /* Generic.Emph */
-  .highlight .gr { color: #aa0000 } /* Generic.Error */
+  .highlight .gr { color: #aa0000; } /* Generic.Error */
-  .highlight .gh { color: #999999 } /* Generic.Heading */
+  .highlight .gh { color: #999999; } /* Generic.Heading */
-  .highlight .gi { color: #008080; background-color: #ddffdd } /* Generic.Inserted */
+  .highlight .gi { color: #008080; background-color: #ddffdd; } /* Generic.Inserted */
-  .highlight .go { color: #888888 } /* Generic.Output */
+  .highlight .go { color: #888888; } /* Generic.Output */
-  .highlight .gp { color: #555555 } /* Generic.Prompt */
+  .highlight .gp { color: #555555; } /* Generic.Prompt */
-  .highlight .gs { font-weight: bold } /* Generic.Strong */
+  .highlight .gs { font-weight: bold; } /* Generic.Strong */
-  .highlight .gu { color: #aaaaaa } /* Generic.Subheading */
+  .highlight .gu { color: #aaaaaa; } /* Generic.Subheading */
-  .highlight .gt { color: #aa0000 } /* Generic.Traceback */
+  .highlight .gt { color: #aa0000; } /* Generic.Traceback */
-  .highlight .kc { color: #000000; font-weight: bold } /* Keyword.Constant */
+  .highlight .kc { color: #000000; font-weight: bold; } /* Keyword.Constant */
-  .highlight .kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
+  .highlight .kd { color: #000000; font-weight: bold; } /* Keyword.Declaration */
-  .highlight .kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
+  .highlight .kn { color: #000000; font-weight: bold; } /* Keyword.Namespace */
-  .highlight .kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
+  .highlight .kp { color: #000000; font-weight: bold; } /* Keyword.Pseudo */
-  .highlight .kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
+  .highlight .kr { color: #000000; font-weight: bold; } /* Keyword.Reserved */
-  .highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+  .highlight .kt { color: #445588; font-weight: bold; } /* Keyword.Type */
-  .highlight .m { color: #009999 } /* Literal.Number */
+  .highlight .m { color: #009999; } /* Literal.Number */
-  .highlight .s { color: #d01040 } /* Literal.String */
+  .highlight .s { color: #d01040; } /* Literal.String */
-  .highlight .na { color: #008080 } /* Name.Attribute */
+  .highlight .na { color: #008080; } /* Name.Attribute */
-  .highlight .nb { color: #0086B3 } /* Name.Builtin */
+  .highlight .nb { color: #0086b3; } /* Name.Builtin */
-  .highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+  .highlight .nc { color: #445588; font-weight: bold; } /* Name.Class */
-  .highlight .no { color: #008080 } /* Name.Constant */
+  .highlight .no { color: #008080; } /* Name.Constant */
-  .highlight .nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
+  .highlight .nd { color: #3c5d5d; font-weight: bold; } /* Name.Decorator */
-  .highlight .ni { color: #800080 } /* Name.Entity */
+  .highlight .ni { color: #800080; } /* Name.Entity */
-  .highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+  .highlight .ne { color: #990000; font-weight: bold; } /* Name.Exception */
-  .highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+  .highlight .nf { color: #990000; font-weight: bold; } /* Name.Function */
-  .highlight .nl { color: #990000; font-weight: bold } /* Name.Label */
+  .highlight .nl { color: #990000; font-weight: bold; } /* Name.Label */
-  .highlight .nn { color: #555555 } /* Name.Namespace */
+  .highlight .nn { color: #555555; } /* Name.Namespace */
-  .highlight .nt { color: #000080 } /* Name.Tag */
+  .highlight .nt { color: #000080; } /* Name.Tag */
-  .highlight .nv { color: #008080 } /* Name.Variable */
+  .highlight .nv { color: #008080; } /* Name.Variable */
-  .highlight .ow { color: #000000; font-weight: bold } /* Operator.Word */
+  .highlight .ow { color: #000000; font-weight: bold; } /* Operator.Word */
-  .highlight .w { color: #bbbbbb } /* Text.Whitespace */
+  .highlight .w { color: #bbbbbb; } /* Text.Whitespace */
-  .highlight .mf { color: #009999 } /* Literal.Number.Float */
+  .highlight .mf { color: #009999; } /* Literal.Number.Float */
-  .highlight .mh { color: #009999 } /* Literal.Number.Hex */
+  .highlight .mh { color: #009999; } /* Literal.Number.Hex */
-  .highlight .mi { color: #009999 } /* Literal.Number.Integer */
+  .highlight .mi { color: #009999; } /* Literal.Number.Integer */
-  .highlight .mo { color: #009999 } /* Literal.Number.Oct */
+  .highlight .mo { color: #009999; } /* Literal.Number.Oct */
-  .highlight .sb { color: #d01040 } /* Literal.String.Backtick */
+  .highlight .sb { color: #d01040; } /* Literal.String.Backtick */
-  .highlight .sc { color: #d01040 } /* Literal.String.Char */
+  .highlight .sc { color: #d01040; } /* Literal.String.Char */
-  .highlight .sd { color: #d01040 } /* Literal.String.Doc */
+  .highlight .sd { color: #d01040; } /* Literal.String.Doc */
-  .highlight .s2 { color: #d01040 } /* Literal.String.Double */
+  .highlight .s2 { color: #d01040; } /* Literal.String.Double */
-  .highlight .se { color: #d01040 } /* Literal.String.Escape */
+  .highlight .se { color: #d01040; } /* Literal.String.Escape */
-  .highlight .sh { color: #d01040 } /* Literal.String.Heredoc */
+  .highlight .sh { color: #d01040; } /* Literal.String.Heredoc */
-  .highlight .si { color: #d01040 } /* Literal.String.Interpol */
+  .highlight .si { color: #d01040; } /* Literal.String.Interpol */
-  .highlight .sx { color: #d01040 } /* Literal.String.Other */
+  .highlight .sx { color: #d01040; } /* Literal.String.Other */
-  .highlight .sr { color: #009926 } /* Literal.String.Regex */
+  .highlight .sr { color: #009926; } /* Literal.String.Regex */
-  .highlight .s1 { color: #d01040 } /* Literal.String.Single */
+  .highlight .s1 { color: #d01040; } /* Literal.String.Single */
-  .highlight .ss { color: #990073 } /* Literal.String.Symbol */
+  .highlight .ss { color: #990073; } /* Literal.String.Symbol */
-  .highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+  .highlight .bp { color: #999999; } /* Name.Builtin.Pseudo */
-  .highlight .vc { color: #008080 } /* Name.Variable.Class */
+  .highlight .vc { color: #008080; } /* Name.Variable.Class */
-  .highlight .vg { color: #008080 } /* Name.Variable.Global */
+  .highlight .vg { color: #008080; } /* Name.Variable.Global */
-  .highlight .vi { color: #008080 } /* Name.Variable.Instance */
+  .highlight .vi { color: #008080; } /* Name.Variable.Instance */
-  .highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
+  .highlight .il { color: #009999; } /* Literal.Number.Integer.Long */
-  /*--- custom light colors ---*/
+  /* --- custom light colors --- */
  --highlight-bg-color: #f7f7f7;
  --highlighter-rouge-color: #353a3d;
  --highlight-lineno-color: #c2c6cc;
  --highlight-lineno-border-color: #e9ecef;
  --inline-code-bg: #f3f3f3;
 } // light-syntax
--- a/assets/css/_colors/light-typography.scss
+++ b/assets/css/_colors/light-typography.scss
@ -7,118 +7,70 @@
 */
@mixin light-scheme {
-
+  /* Common */
  --body-bg: #fafafa;
  --mask-bg: #c1c3c5;
  --main-wrapper-bg: white;
  --main-border-color: #f3f3f3;
  --btn-border-color: #e9ecef;
  --text-color: #333333;
  --blockquote-border-color: #eee;
  --blockquote-text-color: #9a9a9a;
  --link-color: #2a408e;
  --link-underline-color: #dee2e6;
  --text-muted-color: gray;
  --tb-odd-bg: #fbfcfd;
  --tb-border-color: #eaeaea;
  --button-bg: #fff;
  --btn-backtotop-color: #686868;
  --btn-backtotop-border-color: #f1f1f1; //--main-border-color,
  --btn-box-shadow: #eaeaea;
  /* Sidebar */
  --sidebar-bg: radial-gradient(
-    circle, rgba(42, 30, 107, 1) 0%, rgba(35, 37, 46, 1) 100%);
+    circle,
-
+    rgba(42, 30, 107, 1) 0%,
    rgba(35, 37, 46, 1) 100%);
  --nav-cursor-color: #fcfcfc;
  /* Topbar */
  --topbar-wrapper-bg: white;
  --topbar-text-color: rgb(78, 78, 78);
  --search-wrapper-bg: #f5f5f5;
  --search-tag-bg: #f8f9fa;
  --search-icon-color: #c2c6cc;
  --input-focus-border-color: var(--btn-border-color);
  /* Home page */
  --post-list-text-color: dimgray;
  --btn-patinator-text-color: #555555;
  --btn-paginator-hover-color: #e9ecef;
  --btn-active-bg: #2a408e;
  --btn-active-border-color: #007bff;
  --btn-text-color: #f8f8f8;
  --btn-paginator-border-color: #f1f1f1;
  --btn-paginator-shadow: #4b92d2;
  /* Posts */
  --btn-share-hover-color: var(--link-color);
  --card-border-color: #f1f1f1;
  --card-box-shadow: rgba(234, 234, 234, 0.7686274509803922);
  --label-color: #808080;
-
+  --relate-post-date: rgba(30, 55, 70, 0.4);
  --relate-post-date: rgba(30, 55, 70, .4);
  --tag-bg: rgba(0, 0, 0, 0.075);
  --tag-border: #dee2e6;
  --tag-shadow: var(--btn-border-color);
  --tag-hover: rgb(222, 226, 230);
  --categories-hover-bg: var(--btn-border-color);
  --dash-color: silver;
  /* Archive */
  --timeline-color: rgba(0, 0, 0, 0.075);
  --timeline-node-bg: #c2c6cc;
  --timeline-year-dot-color: #ffffff;
  /* Footer */
  --footer-bg-color: #ffffff;
  --footnote-target-bg: lightcyan;
  --footer-link: #424242;
-}
+} // light-scheme
--- a/assets/js/_commons/back-to-top.js
+++ b/assets/js/_commons/back-to-top.js
@ -3,16 +3,16 @@ Reference: https://bootsnipp.com/snippets/featured/link-to-top-page
 */
 $(window).scroll(function() {
  if ($(this).scrollTop() > 50
-      && $('#sidebar-trigger').css('display') == 'none') {
+      && $("#sidebar-trigger").css("display") === "none") {
-    $('#back-to-top').fadeIn();
+    $("#back-to-top").fadeIn();
  } else {
-    $('#back-to-top').fadeOut();
+    $("#back-to-top").fadeOut();
  }
 });
 $(function() {
-  $('#back-to-top').click(function() {
+  $("#back-to-top").click(function() {
-    $('body,html').animate({scrollTop: 0}, 800);
+    $("body,html").animate({scrollTop: 0}, 800);
    return false;
  });
 });
--- a/assets/js/_commons/copy-link.js
+++ b/assets/js/_commons/copy-link.js
@ -1,13 +1,16 @@
 /*
-* Copy current page url to clipboard.
+ * Copy current page url to clipboard.
-* v2.1
+ * v2.1
-* https://github.com/cotes2020/jekyll-theme-chirpy
+ * https://github.com/cotes2020/jekyll-theme-chirpy
-* © 2020 Cotes Chung
+ * © 2020 Cotes Chung
-* MIT License
+ * MIT License
-*/
+ */
 function copyLink(url) {
-  if (!url || 0 === url.length)
+  if (!url || 0 === url.length) {
    return;
  }
  url = window.location.href;
  var $temp = $("<input>");
@ -17,4 +20,5 @@ function copyLink(url) {
  $temp.remove();
  alert("Link copied successfully!");
 }
--- a/assets/js/_commons/search-display.js
+++ b/assets/js/_commons/search-display.js
@ -8,18 +8,18 @@
 $(function() {
-  var btnSbTrigger = $('#sidebar-trigger');
+  var btnSbTrigger = $("#sidebar-trigger");
-  var btnSearchTrigger = $('#search-trigger');
+  var btnSearchTrigger = $("#search-trigger");
-  var btnCancel = $('#search-cancel');
+  var btnCancel = $("#search-cancel");
-  var btnClear = $('#search-cleaner');
+  var btnClear = $("#search-cleaner");
-  var main = $('#main');
+  var main = $("#main");
-  var topbarTitle = $('#topbar-title');
+  var topbarTitle = $("#topbar-title");
-  var searchWrapper = $('#search-wrapper');
+  var searchWrapper = $("#search-wrapper");
-  var resultWrapper = $('#search-result-wrapper');
+  var resultWrapper = $("#search-result-wrapper");
-  var results = $('#search-results');
+  var results = $("#search-results");
-  var input = $('#search-input');
+  var input = $("#search-input");
-  var hints = $('#search-hints');
+  var hints = $("#search-hints");
  /*--- Actions in small screens (Sidebar unloaded) ---*/
@ -27,75 +27,76 @@ $(function() {
  var scrollBlocker = (function() {
    var offset = 0;
    return {
-      block: function() {
+      block() {
        offset = $(window).scrollTop();
      },
-      release: function() {
+      release() {
-        $('html,body').scrollTop(offset);
+        $("html,body").scrollTop(offset);
      },
-      getOffset: function() {
+      getOffset() {
        return offset;
      }
-    }
+    };
-  })();
+  }());
  var mobileSearchBar = (function() {
    return {
-      on: function() {
+      on() {
-        btnSbTrigger.addClass('unloaded');
+        btnSbTrigger.addClass("unloaded");
-        topbarTitle.addClass('unloaded');
+        topbarTitle.addClass("unloaded");
-        btnSearchTrigger.addClass('unloaded');
+        btnSearchTrigger.addClass("unloaded");
-        searchWrapper.addClass('d-flex');
+        searchWrapper.addClass("d-flex");
-        btnCancel.addClass('loaded');
+        btnCancel.addClass("loaded");
      },
-      off: function() {
+      off() {
-        btnCancel.removeClass('loaded');
+        btnCancel.removeClass("loaded");
-        searchWrapper.removeClass('d-flex');
+        searchWrapper.removeClass("d-flex");
-        btnSbTrigger.removeClass('unloaded');
+        btnSbTrigger.removeClass("unloaded");
-        topbarTitle.removeClass('unloaded');
+        topbarTitle.removeClass("unloaded");
-        btnSearchTrigger.removeClass('unloaded');
+        btnSearchTrigger.removeClass("unloaded");
      }
-    }
+    };
-  })();
+  }());
  var resultSwitch = (function() {
    var visable = false;
    return {
-      on: function() {
+      on() {
        if (!visable) {
-          resultWrapper.removeClass('unloaded');
+          resultWrapper.removeClass("unloaded");
-          main.addClass('hidden');
+          main.addClass("hidden");
          visable = true;
          scrollBlocker.block();
        }
      },
-      off: function() {
+      off() {
        if (visable) {
          results.empty();
-          if (hints.hasClass('unloaded')) {
+          if (hints.hasClass("unloaded")) {
-            hints.removeClass('unloaded');
+            hints.removeClass("unloaded");
          }
-          resultWrapper.addClass('unloaded');
+          resultWrapper.addClass("unloaded");
-          btnClear.removeClass('visable');
+          btnClear.removeClass("visable");
-          main.removeClass('hidden');
+          main.removeClass("hidden");
-          input.val('');
+          input.val("");
          visable = false;
          scrollBlocker.release();
        }
      },
-      isVisable: function() {
+      isVisable() {
        return visable;
      }
-    }
+    };
-  })();
+
  }());
  function isMobileView() {
-    return btnCancel.hasClass('loaded');
+    return btnCancel.hasClass("loaded");
  }
  btnSearchTrigger.click(function() {
@ -110,45 +111,45 @@ $(function() {
  });
  input.focus(function() {
-    searchWrapper.addClass('input-focus');
+    searchWrapper.addClass("input-focus");
  });
  input.focusout(function() {
-    searchWrapper.removeClass('input-focus');
+    searchWrapper.removeClass("input-focus");
  });
-  input.on('keyup', function(e) {
+  input.on("keyup", function(e) {
-    if (e.keyCode == 8 && input.val() == '') {
+    if (e.keyCode === 8 && input.val() === "") {
      if (!isMobileView()) {
        resultSwitch.off();
      } else {
-        hints.removeClass('unloaded');
+        hints.removeClass("unloaded");
      }
    } else {
-      if (input.val() != '') {
+      if (input.val() !== "") {
        resultSwitch.on();
-        if (!btnClear.hasClass('visible')) {
+        if (!btnClear.hasClass("visible")) {
-          btnClear.addClass('visable');
+          btnClear.addClass("visable");
        }
        if (isMobileView()) {
-          hints.addClass('unloaded');
+          hints.addClass("unloaded");
        }
      }
    }
  });
-  btnClear.on('click', function() {
+  btnClear.on("click", function() {
-    input.val('');
+    input.val("");
    if (isMobileView()) {
-      hints.removeClass('unloaded');
+      hints.removeClass("unloaded");
      results.empty();
    } else {
      resultSwitch.off();
    }
    input.focus();
-    btnClear.removeClass('visable');
+    btnClear.removeClass("visable");
  });
 });
--- a/assets/js/_commons/sidebar.js
+++ b/assets/js/_commons/sidebar.js
@ -11,24 +11,24 @@ $(function() {
  var sidebarUtil = (function() {
    const ATTR_DISPLAY = "sidebar-display";
    var isExpanded = false;
-    var body = $('body');
+    var body = $("body");
    return {
-      toggle: function() {
+      toggle() {
-        if (isExpanded == false) {
+        if (isExpanded === false) {
-          body.attr(ATTR_DISPLAY, '');
+          body.attr(ATTR_DISPLAY, "");
        } else {
          body.removeAttr(ATTR_DISPLAY);
        }
        isExpanded = !isExpanded;
      }
-    }
+    };
-  })();
+  }());
  $("#sidebar-trigger").click(sidebarUtil.toggle);
-  $('#mask').click(sidebarUtil.toggle);
+  $("#mask").click(sidebarUtil.toggle);
 });
--- a/assets/js/_commons/topbar-switch.js
+++ b/assets/js/_commons/topbar-switch.js
@ -11,7 +11,47 @@ $(function() {
  var didScroll;
  var lastScrollTop = 0;
  var delta = 5;
-  var topbarHeight = $('#topbar-wrapper').outerHeight();
+  var topbarHeight = $("#topbar-wrapper").outerHeight();
  function hasScrolled() {
    var st = $(this).scrollTop();
    /* Make sure they scroll more than delta */
    if (Math.abs(lastScrollTop - st) <= delta) {
      return;
    }
    if (st > lastScrollTop && st > topbarHeight) {
      /* Scroll Down */
      $("#topbar-wrapper").removeClass("topbar-down").addClass("topbar-up");
      if ($("#toc-wrapper").length > 0) {
        $("#toc-wrapper").removeClass("topbar-down");
      }
      if ($(".access").length > 0) {
        $(".access").removeClass("topbar-down");
      }
      if ($("#search-input").is(":focus")) {
        $("#search-input").blur(); /* remove focus */
      }
    } else {
      /* Scroll Up */
      if (st + $(window).height() < $(document).height()) {
        $("#topbar-wrapper").removeClass("topbar-up").addClass("topbar-down");
        if ($("#toc-wrapper").length > 0) {
          $("#toc-wrapper").addClass("topbar-down");
        }
        if ($(".access").length > 0) {
          $(".access").addClass("topbar-down");
        }
      }
    }
    lastScrollTop = st;
  }
  $(window).scroll(function(event) {
    if ($("#topbar-title").is(":hidden")) { /* Not in small screens */
@ -26,42 +66,4 @@ $(function() {
    }
  }, 250);
  function hasScrolled() {
    var st = $(this).scrollTop();
    /* Make sure they scroll more than delta */
    if (Math.abs(lastScrollTop - st) <= delta)
      return;
    if (st > lastScrollTop && st > topbarHeight) {
      /* Scroll Down */
      $('#topbar-wrapper').removeClass('topbar-down').addClass('topbar-up');
      if ( $('#toc-wrapper').length > 0) {
        $('#toc-wrapper').removeClass('topbar-down');
      }
      if ( $('.access').length > 0) {
        $('.access').removeClass('topbar-down');
      }
      if ($('#search-input').is(':focus')) {
        $('#search-input').blur(); /* remove focus */
      }
    } else {
      /* Scroll Up */
      if (st + $(window).height() < $(document).height()) {
        $('#topbar-wrapper').removeClass('topbar-up').addClass('topbar-down');
        if ( $('#toc-wrapper').length > 0) {
          $('#toc-wrapper').addClass('topbar-down');
        }
        if ( $('.access').length > 0) {
          $('.access').addClass('topbar-down');
        }
      }
    }
    lastScrollTop = st;
  }
 });
--- a/assets/js/_commons/topbar-title.js
+++ b/assets/js/_commons/topbar-title.js
@ -13,9 +13,9 @@ $(function() {
          $("div.post>h1").text().trim() : $("h1").text().trim();
  if ($("#page-category").length || $("#page-tag").length) {
-    /* The title in Category or Tag page will be '<title> <count_of_posts>' */
+    /* The title in Category or Tag page will be "<title> <count_of_posts>" */
    if (/\s/.test(title)) {
-      title = title.replace(/[0-9]/g, '').trim();
+      title = title.replace(/[0-9]/g, "").trim();
    }
  }
@ -29,19 +29,19 @@ $(function() {
    }
    if ($(this).scrollTop() >= 95) {
-      if ($("#topbar-title").text() != title) {
+      if ($("#topbar-title").text() !== title) {
        $("#topbar-title").text(title);
      }
    } else {
-      if ($("#topbar-title").text() != DEFAULT) {
+      if ($("#topbar-title").text() !== DEFAULT) {
        $("#topbar-title").text(DEFAULT);
      }
    }
  });
  /* Click title remove hover effect. */
-  $('#topbar-title').click(function() {
+  $("#topbar-title").click(function() {
-    $('body,html').animate({scrollTop: 0}, 800);
+    $("body,html").animate({scrollTop: 0}, 800);
  });
 });
--- a/assets/js/_utils/category-collapse.js
+++ b/assets/js/_utils/category-collapse.js
@ -7,26 +7,26 @@
 */
 $(function() {
-  var child_prefix = "l_";
+  var childPrefix = "l_";
-  var parent_prefix = "h_";
+  var parentPrefix = "h_";
  /* close up top-category */
  $(".collapse").on("hide.bs.collapse", function() { /* Bootstrap collapse events. */
-    var parent_id = parent_prefix + $(this).attr('id').substring(child_prefix.length);
+    var parentId = parentPrefix + $(this).attr("id").substring(childPrefix.length);
-    if (parent_id) {
+    if (parentId) {
-      $("#" + parent_id + " .far.fa-folder-open").attr("class", "far fa-folder fa-fw");
+      $("#" + parentId + " .far.fa-folder-open").attr("class", "far fa-folder fa-fw");
-      $("#" + parent_id + " i.fas").addClass("rotate");
+      $("#" + parentId + " i.fas").addClass("rotate");
-      $("#" + parent_id).removeClass("hide-border-bottom");
+      $("#" + parentId).removeClass("hide-border-bottom");
    }
  });
  /* expand the top category */
  $(".collapse").on("show.bs.collapse", function() {
-    var parent_id = parent_prefix + $(this).attr('id').substring(child_prefix.length);
+    var parentId = parentPrefix + $(this).attr("id").substring(childPrefix.length);
-    if (parent_id) {
+    if (parentId) {
-      $("#" + parent_id + " .far.fa-folder").attr("class", "far fa-folder-open fa-fw");
+      $("#" + parentId + " .far.fa-folder").attr("class", "far fa-folder-open fa-fw");
-      $("#" + parent_id + " i.fas").removeClass("rotate");
+      $("#" + parentId + " i.fas").removeClass("rotate");
-      $("#" + parent_id).addClass("hide-border-bottom");
+      $("#" + parentId).addClass("hide-border-bottom");
    }
  });
--- a/assets/js/_utils/pageviews.js
+++ b/assets/js/_utils/pageviews.js
@ -11,84 +11,19 @@
 * MIT License
 */
-function countUp(min, max, destId) {
+var getInitStatus = (function () {
  if (min < max) {
    var numAnim = new CountUp(destId, min, max);
    if (!numAnim.error) {
      numAnim.start();
    } else {
      console.error(numAnim.error);
    }
  }
 }
 function countPV(path, rows) {
  var count = 0;
  if (rows !== undefined ) {
    for (var i = 0; i < rows.length; ++i) {
      var gaPath = rows[i][0];
      if (gaPath == path) { /* path format see: site.permalink */
        count += parseInt(rows[i][1]);
        break;
      }
    }
  }
  return count;
 }
 function tacklePV(rows, path, elem, hasInit) {
  var count = countPV(path, rows);
  count = (count == 0 ? 1 : count);
  if (!hasInit) {
    elem.text(new Intl.NumberFormat().format(count));
  } else {
    var initCount = parseInt(elem.text().replace(/,/g, ''));
    if (count > initCount) {
      countUp(initCount, count, elem.attr('id'));
    }
  }
 }
 function displayPageviews(data) {
  if (data === undefined) {
    return;
  }
  var hasInit = getInitStatus();
  var rows = data.rows; /* could be undefined */
  if ($("#post-list").length > 0) { /* the Home page */
    $(".post-preview").each(function() {
      var path = $(this).children("div").children("h1").children("a").attr("href");
      tacklePV(rows, path, $(this).find('.pageviews'), hasInit);
    });
  } else if ($(".post").length > 0) { /* the post */
    var path = window.location.pathname;
    tacklePV(rows, path, $('#pv'), hasInit);
  }
 }
 var getInitStatus = (function() {
  var hasInit = false;
-  return function() {
+  return () => {
    let ret = hasInit;
    if (!hasInit) {
      hasInit = true;
    }
    return ret;
-  }
+  };
-})();
+}());
-var PvCache = (function() {
+var PvCache = (function () {
  const KEY_PV = "pv";
  const KEY_CREATION = "pv_created_date";
  const KEY_PV_SRC = "pv_source";
@ -107,26 +42,26 @@ var PvCache = (function() {
  }
  return {
-    getData: function() {
+    getData() {
      return JSON.parse(localStorage.getItem(KEY_PV) );
    },
-    saveOriginCache: function(pv) {
+    saveOriginCache(pv) {
      set(KEY_PV, pv);
      set(KEY_PV_SRC, Source.ORIGIN );
      set(KEY_CREATION, new Date().toJSON() );
    },
-    saveProxyCache: function(pv) {
+    saveProxyCache(pv) {
      set(KEY_PV, pv);
      set(KEY_PV_SRC, Source.PROXY );
      set(KEY_CREATION, new Date().toJSON() );
    },
-    isFromOrigin: function() {
+    isFromOrigin() {
-      return get(KEY_PV_SRC) == Source.ORIGIN;
+      return get(KEY_PV_SRC) === Source.ORIGIN;
    },
-    isFromProxy: function() {
+    isFromProxy() {
-      return get(KEY_PV_SRC) == Source.PROXY;
+      return get(KEY_PV_SRC) === Source.PROXY;
    },
-    isExpired: function() {
+    isExpired() {
      if (PvCache.isFromOrigin() ) {
        let date = new Date(get(KEY_CREATION));
        date.setDate(date.getDate() + 1); /* update origin records every day */
@ -139,30 +74,110 @@ var PvCache = (function() {
      }
      return false;
    },
-    getAllPagevies: function() {
+    getAllPagevies() {
      return PvCache.getData().totalsForAllResults["ga:pageviews"];
    },
-    newerThan: function(pv) {
+    newerThan(pv) {
      return PvCache.getAllPagevies() > pv.totalsForAllResults["ga:pageviews"];
    },
-    inspectKeys: function() {
+    inspectKeys() {
-      if (localStorage.getItem(KEY_PV) == null
+      if (localStorage.getItem(KEY_PV) === null
-        || localStorage.getItem(KEY_PV_SRC) == null
+        || localStorage.getItem(KEY_PV_SRC) === null
-        || localStorage.getItem(KEY_CREATION) == null) {
+        || localStorage.getItem(KEY_CREATION) === null) {
        localStorage.clear();
      }
    }
  };
-})(); /* PvCache */
+}()); /* PvCache */
 function countUp(min, max, destId) {
  if (min < max) {
    var numAnim = new CountUp(destId, min, max);
    if (!numAnim.error) {
      numAnim.start();
    } else {
      console.error(numAnim.error);
    }
  }
 }
 function countPV(path, rows) {
  var count = 0;
  if (typeof rows !== "undefined" ) {
    for (var i = 0; i < rows.length; ++i) {
      var gaPath = rows[parseInt(i, 10)][0];
      if (gaPath === path) { /* path format see: site.permalink */
        count += parseInt(rows[parseInt(i, 10)][1], 10);
        break;
      }
    }
  }
  return count;
 }
 function tacklePV(rows, path, elem, hasInit) {
  var count = countPV(path, rows);
  count = (count === 0 ? 1 : count);
  if (!hasInit) {
    elem.text(new Intl.NumberFormat().format(count));
  } else {
    var initCount = parseInt(elem.text().replace(/,/g, ""), 10);
    if (count > initCount) {
      countUp(initCount, count, elem.attr("id"));
    }
  }
 }
 function displayPageviews(data) {
  if (typeof data === "undefined") {
    return;
  }
  var hasInit = getInitStatus();
  var rows = data.rows; /* could be undefined */
  if ($("#post-list").length > 0) { /* the Home page */
    $(".post-preview").each(function() {
      var path = $(this).children("div").children("h1").children("a").attr("href");
      tacklePV(rows, path, $(this).find(".pageviews"), hasInit);
    });
  } else if ($(".post").length > 0) { /* the post */
    var path = window.location.pathname;
    tacklePV(rows, path, $("#pv"), hasInit);
  }
 }
 function fetchProxyPageviews() {
  $.ajax({
    type: "GET",
    url: proxyEndpoint, /* see: /assets/js/_pv-config.js */
    dataType: "jsonp",
    jsonpCallback: "displayPageviews",
    success: (data, textStatus, jqXHR) => {
      PvCache.saveProxyCache(JSON.stringify(data));
    },
    error: (jqXHR, textStatus, errorThrown) => {
      console.log("Failed to load pageviews from proxy server: " + errorThrown);
    }
  });
 }
 function fetchPageviews(fetchOrigin = true, filterOrigin = false) {
  /* pvCacheEnabled › see: /assets/js/_pv-config.js */
  if (pvCacheEnabled && fetchOrigin) {
-    fetch('/assets/js/data/pageviews.json')
+    fetch("/assets/js/data/pageviews.json")
-      .then(response => response.json())
+      .then((response) => response.json())
-      .then(data => {
+      .then((data) => {
        if (filterOrigin) {
          if (PvCache.newerThan(data)) {
            return;
@ -180,25 +195,9 @@ function fetchPageviews(fetchOrigin = true, filterOrigin = false) {
 }
 function fetchProxyPageviews() {
  $.ajax({
    type: 'GET',
    url: proxyEndpoint, /* see: /assets/js/_pv-config.js */
    dataType: 'jsonp',
    jsonpCallback: "displayPageviews",
    success: function(data, textStatus, jqXHR) {
      PvCache.saveProxyCache(JSON.stringify(data));
    },
    error: function(jqXHR, textStatus, errorThrown) {
      console.log("Failed to load pageviews from proxy server: " + errorThrown);
    }
  });
 }
 $(function() {
-  if ($('.pageviews').length > 0) {
+  if ($(".pageviews").length > 0) {
    PvCache.inspectKeys();
    let cache = PvCache.getData();
--- a/assets/js/_utils/timeago.js
+++ b/assets/js/_utils/timeago.js
@ -8,24 +8,28 @@
 $(function() {
  var toRefresh = $(".timeago").length;
  var intervalId = void 0;
  function timeago(iso, isLastmod) {
    let now = new Date();
    let past = new Date(iso);
-    if (past.getFullYear() != now.getFullYear()) {
+    if (past.getFullYear() !== now.getFullYear()) {
      toRefresh -= 1;
      return past.toLocaleString("en-US", {
-         year: 'numeric',
+        year: "numeric",
-         month: 'short',
+        month: "short",
-         day: 'numeric'
+        day: "numeric"
      });
    }
-    if (past.getMonth() != now.getMonth()) {
+    if (past.getMonth() !== now.getMonth()) {
      toRefresh -= 1;
      return past.toLocaleString("en-US", {
-         month: 'short',
+        month: "short",
-         day: 'numeric'
+        day: "numeric"
      });
    }
@ -47,37 +51,33 @@ $(function() {
      return minute + " minute" + (minute > 1 ? "s" : "") + " ago";
    }
-    return (isLastmod? "just" : "Just") + " now";
+    return (isLastmod ? "just" : "Just") + " now";
  }
  function updateTimeago() {
    $(".timeago").each(function() {
      if ($(this).children("i").length > 0) {
        var basic = $(this).text();
-        var isLastmod = $(this).hasClass('lastmod');
+        var isLastmod = $(this).hasClass("lastmod");
        var node = $(this).children("i");
-        var date = node.text();   /* ISO Date: 'YYYY-MM-DDTHH:MM:SSZ' */
+        var date = node.text(); /* ISO Date: "YYYY-MM-DDTHH:MM:SSZ" */
        $(this).text(timeago(date, isLastmod));
        $(this).append(node);
      }
    });
-    if (toRefresh == 0 && intervalId != undefined) {
+    if (toRefresh === 0 && typeof intervalId !== "undefined") {
-      clearInterval(intervalId);  /* stop interval */
+      clearInterval(intervalId); /* stop interval */
    }
    return toRefresh;
  }
-
+  if (toRefresh === 0) {
  var toRefresh = $(".timeago").length;
  if (toRefresh == 0) {
    return;
  }
  if (updateTimeago() > 0) { /* run immediately */
-    var intervalId = setInterval(updateTimeago, 60000); /* run every minute */
+    intervalId = setInterval(updateTimeago, 60000); /* run every minute */
  }
 });
--- a/assets/js/_utils/toc-filter.js
+++ b/assets/js/_utils/toc-filter.js
@ -7,8 +7,8 @@
 */
 $(function() {
-  if ($("#post-wrapper .post-content h1").length == 0
+  if ($("#post-wrapper .post-content h1").length === 0
-      && $("#post-wrapper .post-content h2").length == 0) {
+      && $("#post-wrapper .post-content h2").length === 0) {
    $("#toc-wrapper").addClass("unloaded");
  }
 });
--- a/assets/js/_utils/tooltip-loader.js
+++ b/assets/js/_utils/tooltip-loader.js
@ -6,5 +6,5 @@
 * MIT License
 */
 $(function () {
-  $('[data-toggle="tooltip"]').tooltip();
+  $("[data-toggle=\"tooltip\"]").tooltip();
 });
--- a/docs/README_zh-CN.md
+++ b/docs/README_zh-CN.md
@ -40,7 +40,6 @@
 * SEO 优化
 * 网站性能优化
 ## 安装
 [Fork **Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/fork)，然后克隆到本地：
@ -53,7 +52,6 @@ $ git clone git@github.com:<username>/jekyll-theme-chirpy -b master --single-bra
 如果你想在本地运行或构建, 参考 [Jekyll Docs](https://jekyllrb.com/docs/installation/)安装 `Ruby`， `RubyGems` 和 `Bundler`。
 首次运行或构建时, 请先安装 Jekyll plugins。在项目根目录运行：
 ```terminal
@ -76,7 +74,6 @@ $ bundle install
  $ brew install coreutils
  ```
 ## 使用
 运行 [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) 需要一些额外的文件, 它们不能通过 Jekyll 原生的命令生成，所以请严格依照下列说明去运行或部署此项目。
@ -94,12 +91,10 @@ $ bash tools/init.sh
 上述脚本完成了以下工作:
 1. 从你的仓库中删除了:
-    - `.travis.yml`
+	* `.travis.yml`
-    - `_posts` 下的文件
+	* `_posts` 下的文件
-    - `docs` 目录
+	* `docs` 目录
 2. 如果使用了参数 `--no-gh`，则会怒删 `.github`。否则，将会配置 GitHub Actions：把 `.github/workflows/pages-deploy.yml.hook` 的后缀 `.hook` 去除，然后删除 `.github` 里的其他目录和文件。
 3. 自动提交一个 Commit 以保存上述文件的更改。
 ### 配置文件
@ -123,7 +118,6 @@ $ bash tools/run.sh
 如果你想在本地服务运行后，把修改源文件的更改实时刷新，可使用选项 `-r` (或 `--realtime`)，不过要先安装依赖 [**fswatch**](http://emcrisostomo.github.io/fswatch/) 。
 ### 部署
 部署开始前，把  `_config.yml` 的 `url` 改为 `https://<username>.github.io`(或者你的私有域名，如：`https://yourdomain.com`)。另外，如果你想使用 [Project 类型网站](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites)，修改配置文件的 `baseurl` 为项目名称，以斜杠开头，如：`/project`。
@ -135,11 +129,8 @@ $ bash tools/run.sh
 由于安全原因，GitHub Pages 的构建强制加了 `safe`参数，这导致了我们不能使用脚本工具去创建所需的附加页面。因此，我们可以使用 GitHub Actions 去构建站点，把站点文件存储在一个新分支上，再指定该分支作为 Pages 服务的源。
 1. 推送任意一个 commit 到 `origin/master` 以触发 GitHub Actions workflow。一旦 build 完毕，远端将会自动出现一个新分支 `gh-pages` 用来存储构建的站点文件。
 2. 除非你是使用 project 站点, 否则重命名你的仓库为 `<username>.github.io`。
 3. 选择分支 `gh-pages` 作为 GitHub Pages 站点的[发布源](https://docs.github.com/en/github/working-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site).
 4. 按照 GitHub 指示的地址去访问你的网站。
 #### 部署到其他 Pages 平台
@ -179,7 +170,6 @@ $ bash tools/build.sh -d /path/to/site/
 若想要更多细节以及更佳的阅读体验，请参阅 [线上教程](https://chirpy.cotes.info/categories/tutorial/)。 与此同时，[Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki) 也有一份教程的拷贝。
 ## 参与贡献
 三人行必有我师，欢迎提报告 bug, 帮助改进代码质量，或者提交新功能。具体操作规则请参考 [贡献指南](../.github/CONTRIBUTING.md)，谢谢 🙏。
@ -190,12 +180,10 @@ $ bash tools/build.sh -d /path/to/site/
 :tada: 感谢所有参与代码贡献的小伙伴, 他们的 GayHub ID 在这个[列表](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors)。 另外, 提交过 issues(或者未被合并 PR) 的高富帅和白富美也不会被遗忘,他/她们帮助报告 bug、分享新点子或者启发了我写出更通俗易懂的文档。
 ## 赞助
 如果您喜欢这个主题或者它对您有帮助，请考虑打赏作者：在 [项目主页](https://github.com/cotes2020/jekyll-theme-chirpy) 点击按钮 <kbd>:heart: Sponsor</kbd> 选择适合的链接即可完成（国内一般选第二个链接，支付宝/微信赞助），您的打赏将会极大地鼓励作者，并帮助作者更好地维护项目！
 ## 许可证书
 本项目开源，基于 [MIT](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE) 许可。
--- a/tools/build.sh
+++ b/tools/build.sh
@ -10,11 +10,11 @@ set -eu
 CMD="JEKYLL_ENV=production bundle exec jekyll b"
-WORK_DIR=$(dirname $(dirname $(realpath "$0")))
+WORK_DIR="$(dirname $(dirname $(realpath "$0")))"
-CONTAINER=${WORK_DIR}/.container
+CONTAINER="${WORK_DIR}/.container"
-DEST=${WORK_DIR}/_site
+DEST="${WORK_DIR}/_site"
 _help() {
@ -30,44 +30,44 @@ _help() {
 _init() {
-  cd $WORK_DIR
+  cd "$WORK_DIR"
-  if [[ -d $CONTAINER ]]; then
+  if [[ -d "$CONTAINER" ]]; then
-    rm -rf $CONTAINER
+    rm -rf "$CONTAINER"
  fi
-  if [[ -d _site ]]; then
+  if [[ -d "_site" ]]; then
    jekyll clean
  fi
-  local _temp=$(mktemp -d)
+  local _temp="$(mktemp -d)"
-  cp -r * $_temp
+  cp -r ./* "$_temp"
-  cp -r .git $_temp
+  cp -r ./.git "$_temp"
-  mv $_temp $CONTAINER
+  mv "$_temp" "$CONTAINER"
 }
 _build() {
-  cd $CONTAINER
+  cd "$CONTAINER"
  echo "$ cd $(pwd)"
-  bash _scripts/sh/create_pages.sh
+  bash "_scripts/sh/create_pages.sh"
-  bash _scripts/sh/dump_lastmod.sh
+  bash "_scripts/sh/dump_lastmod.sh"
-  CMD+=" -d ${DEST}"
+  CMD+=" -d $DEST"
  echo "\$ $CMD"
-  eval $CMD
+  eval "$CMD"
  echo -e "\nBuild success, the site files have been placed in '${DEST}'."
-  if [[ -d ${DEST}/.git ]]; then
+  if [[ -d "${DEST}/.git" ]]; then
-    if [[ ! -z $(git -C $DEST status -s) ]]; then
+    if [[ ! -z $(git -C "$DEST" status -s) ]]; then
-      git -C $DEST add .
+      git -C "$DEST" add .
-      git -C $DEST commit -m "[Automation] Update site files." -q
+      git -C "$DEST" commit -m "[Automation] Update site files." -q
      echo -e "\nPlease push the changes of $DEST to remote master branch.\n"
    fi
  fi
-  cd .. && rm -rf $CONTAINER
+  cd .. && rm -rf "$CONTAINER"
 }
@ -95,8 +95,8 @@ main() {
        shift
        ;;
      -d|--destination)
-        _check_unset $2
+        _check_unset "$2"
-        DEST=$(realpath $2)
+        DEST="$(realpath "$2")"
        shift;
        shift;
        ;;
--- a/tools/deploy.sh
+++ b/tools/deploy.sh
@ -14,17 +14,18 @@ PAGES_BRANCH="gh-pages"
 _no_branch=false
-if [[ -z `git branch -av | grep $PAGES_BRANCH` ]]; then
+if [[ -z $(git branch -av | grep "$PAGES_BRANCH") ]]; then
  _no_branch=true
-  git checkout -b $PAGES_BRANCH
+  git checkout -b "$PAGES_BRANCH"
 else
-  git checkout $PAGES_BRANCH
+  git checkout "$PAGES_BRANCH"
 fi
 mv _site ../
 mv .git ../
-rm -rf * && rm -rf .[^.] .??*
+rm -rf ./*
 rm -rf .[^.] .??*
 mv ../_site/* .
 mv ../.git .
--- a/tools/publish.sh
+++ b/tools/publish.sh
@ -13,12 +13,12 @@ CATEGORIES=false
 TAGS=false
 LASTMOD=false
-WORK_DIR=$(dirname $(dirname $(realpath "$0")))
+WORK_DIR="$(dirname $(dirname $(realpath "$0")))"
 check_status() {
  local _change=$(git status . -s)
-  if [[ ! -z ${_change} ]]; then
+  if [[ ! -z $_change ]]; then
    echo "Warning: Commit the following changes first:"
    echo "$_change"
    exit 1
@ -81,7 +81,7 @@ push() {
 main() {
-  cd $WORK_DIR
+  cd "$WORK_DIR"
  check_status
--- a/tools/pv.sh
+++ b/tools/pv.sh
@ -15,12 +15,12 @@
 set -eu
-WORK_DIR=$(dirname $(dirname $(realpath "$0")))
+WORK_DIR="$(dirname $(dirname $(realpath "$0")))"
-URL_FILE=${WORK_DIR}/_config.yml
+URL_FILE="${WORK_DIR}/_config.yml"
-PV_CACHE=${WORK_DIR}/assets/js/data/pageviews.json
+PV_CACHE="${WORK_DIR}/assets/js/data/pageviews.json"
-PROXY_URL=$(grep "proxy_endpoint:" $URL_FILE | sed "s/.*: '//g;s/'.*//")
+PROXY_URL="$(grep "proxy_endpoint:" "$URL_FILE" | sed "s/.*: '//g;s/'.*//")"
-wget $PROXY_URL -O $PV_CACHE
+wget "$PROXY_URL" -O "$PV_CACHE"
 echo "ls $PV_CACHE"
--- a/tools/run.sh
+++ b/tools/run.sh
@ -41,21 +41,21 @@ _cleanup() {
    jekyll clean
  fi
-  rm -rf ${WORK_DIR}/${CONTAINER}
+  rm -rf "${WORK_DIR}/${CONTAINER}"
  ps aux | grep fswatch | awk '{print $2}' | xargs kill -9 > /dev/null 2>&1
 }
 _init() {
-  if [[ -d ${WORK_DIR}/${CONTAINER} ]]; then
+  if [[ -d "${WORK_DIR}/${CONTAINER}" ]]; then
-    rm -rf ${WORK_DIR}/${CONTAINER}
+    rm -rf "${WORK_DIR}/${CONTAINER}"
  fi
-  temp=$(mktemp -d)
+  temp="$(mktemp -d)"
-  cp -r ${WORK_DIR}/* $temp
+  cp -r "$WORK_DIR"/* "$temp"
-  cp -r ${WORK_DIR}/.git $temp
+  cp -r "${WORK_DIR}/.git" "$temp"
-  mv $temp ${WORK_DIR}/${CONTAINER}
+  mv "$temp" "${WORK_DIR}/${CONTAINER}"
  trap _cleanup INT
 }
@ -70,7 +70,7 @@ _check_unset() {
 _check_command() {
-  if [[ -z $(command -v $1) ]]; then
+  if [[ -z $(command -v "$1") ]]; then
    echo "Error: command '$1' not found !"
    echo "Hint: Get '$1' on <$2>"
    exit 1
@ -81,16 +81,16 @@ _check_command() {
 main() {
  _init
-  cd ${WORK_DIR}/${CONTAINER}
+  cd "${WORK_DIR}/${CONTAINER}"
  bash _scripts/sh/create_pages.sh
  bash _scripts/sh/dump_lastmod.sh
  if [[ $realtime = true ]]; then
-    fswatch -0 -e "\\$CONTAINER" -e "\.git" ${WORK_DIR} | xargs -0 -I {} bash ./${SYNC_TOOL} {} $WORK_DIR . &
+    fswatch -0 -e "\\$CONTAINER" -e "\.git" "$WORK_DIR" | xargs -0 -I {} bash "./${SYNC_TOOL}" {} "$WORK_DIR" . &
  fi
  echo "\$ $cmd"
-  eval $cmd
+  eval "$cmd"
 }
@ -99,20 +99,20 @@ do
  opt="$1"
  case $opt in
    -H|--host)
-      _check_unset $2
+      _check_unset "$2"
      cmd+=" -H $2"
      shift # past argument
      shift # past value
      ;;
    -P|--port)
-      _check_unset $2
+      _check_unset "$2"
      cmd+=" -P $2"
      shift
      shift
      ;;
    -b|--baseurl)
-      _check_unset $2
+      _check_unset "$2"
-      if [[ $2 == \/* ]]
+      if [[ "$2" == \/* ]]
      then
        cmd+=" -b $2"
      else
@ -127,7 +127,7 @@ do
      shift
      ;;
    -r|--realtime)
-      _check_command fswatch 'http://emcrisostomo.github.io/fswatch/'
+      _check_command fswatch "http://emcrisostomo.github.io/fswatch/"
      realtime=true
      shift
      ;;