Fetching popperjs synchronously

Improved script tools.
Improved theme mode switching logic.
2025-12-20 06:33:25 +00:00 · 2020-04-04 01:03:00 +08:00 · 2020-04-04 01:03:00 +08:00 · 2020-04-04 01:03:00 +08:00 · 2020-04-04 01:03:00 +08:00 · 2020-04-04 01:03:00 +08:00
106 changed files with 4064 additions and 1834 deletions
--- a/.github/CONTRIBUTING.md
+++ b/.github/CONTRIBUTING.md
@@ -0,0 +1,22 @@
+# How to Contribute
+
+I want to thank you for sparing a time to improve this project! Here are some guidelines for contributing：
+
+## Bug Reporting
+
+If you found a bug, please ensure it doesn't appear in other existing [issues](https://github.com/cotes2020/jekyll-theme-chirpy/issues). After that, [create a new issues](https://github.com/cotes2020/jekyll-theme-chirpy/issues/new/choose) with template `Bug Report` and follow it's illustration to describe the situation.
+
+
+## Code Optimization
+
+If you are willing to improve some of the existing code, such as performance optimization, code simplification, or even correct spelling errors of variable names, please submit a new PR to help us.
+
+
+## Feature Request
+
+Basically, to ensure that the blog design is not confused, we do not accept suggestions for design changes, such as colors scheme, fonts, typography, etc. As long as your request is not a design issue, it is recommended to first submit a `Feature Request` issue to discuss whether your idea fits the project. Once the discussion is complete and the request is approved, fork this project, complete the development of new features, and submit a `Pull Request`. What's more, the PR should be merged into `master` branch without conflict.
+
+
+---
+
+:tada:Your volunteering will make the open source world more beautiful, thanks again!:tada:
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@@ -1 +1 @@
-custom: ['https://www.buymeacoffee.com/6wOkxTo', 'https://cotes.gitee.io/alipay-wechat-donation']
+custom: ['https://www.buymeacoffee.com/coteschung', 'https://cotes.gitee.io/alipay-wechat-donation']
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@@ -0,0 +1,39 @@
+---
+name: Bug Report
+about: Create a report to help us improve
+labels: bug
+---
+
+<!-- Please make sure you have read the README or Wiki, and your question does not appear in other existing issues (including closed ones). Thanks for your cooperation! Now let's start it. -->
+
+**Describe the bug**
+<!-- A clear and concise description of what the bug is. -->
+
+**To Reproduce**
+<!--
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+-->
+
+**Expected behavior**
+<!-- A clear and concise description of what you expected to happen. -->
+
+**Screenshots**
+<!-- If applicable, add screenshots to help explain your problem. -->
+
+**Desktop (please complete the following information):**
+ - OS: [e.g. iOS]
+ - Browser: [e.g. chrome, safari]
+ - Version: [e.g. 22]
+
+**Smartphone (please complete the following information):**
+ - Device: [e.g. iPhone6]
+ - OS: [e.g. iOS8.1]
+ - Browser: [e.g. stock browser, safari]
+ - Version: [e.g. 22]
+
+**Additional context**
+<!-- Add any other context about the problem here. -->
--- a/.github/ISSUE_TEMPLATE/feature_request.md
+++ b/.github/ISSUE_TEMPLATE/feature_request.md
@@ -0,0 +1,21 @@
+---
+name: Feature Request
+about: Suggest an idea for this project
+labels: enhancement
+---
+
+<!-- Please make sure your request does not appear in other existing issues (including closed ones). Thanks for your cooperation. Now, I can't wait to listen your idea! -->
+
+
+**Is your feature request related to a problem? Please describe.**
+<!-- A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] -->
+
+**Describe the solution you'd like**
+<!-- A clear and concise description of what you want to happen. -->
+
+**Describe alternatives you've considered**
+<!-- A clear and concise description of any alternative solutions or features you've considered. -->
+
+
+**Additional context**
+<!-- Add any other context or screenshots about the feature request here. -->
--- a/.github/ISSUE_TEMPLATE/question.md
+++ b/.github/ISSUE_TEMPLATE/question.md
@@ -0,0 +1,57 @@
+---
+name: Question
+about: Ask what ever you want
+labels: question
+---
+
+<!-- Please make sure you have read the README or Wiki, and your question does not appear in other existing issues (including closed ones). Thanks for your cooperation. Now, uncomment the relevant part to describe the situation. -->
+
+<!-- 
+**Don't understand what the README or Wiki says.**
+Point out the parts that are hard for you to understand. 
+-->
+
+<!-- 
+**Want to complain about my bad days.**
+Don't hesitate to share your story!
+-->
+
+<!--
+**Just wanted to say hi to the author.**
+Hi, I'm ..., have a nice day ! 
+-->
+
+
+<!-- 
+**Not sure if it's a bug**
+Please try to describe the problem
+
+**To Reproduce**
+
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Desktop (please complete the following information):**
+ - OS: [e.g. iOS]
+ - Browser: [e.g. chrome, safari]
+ - Version: [e.g. 22]
+
+**Smartphone (please complete the following information):**
+ - Device: [e.g. iPhone6]
+ - OS: [e.g. iOS8.1]
+ - Browser: [e.g. stock browser, safari]
+ - Version: [e.g. 22]
+
+**Additional context**
+Add any other context about the problem here. 
+-->
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -0,0 +1,91 @@
+name: build
+on:
+  push:
+    branches-ignore:
+      - stable
+    tags-ignore:
+      - '*'
+    paths-ignore:
+      - '.github/**'
+      - '!.github/workflows/**'
+      - '.travis.yml'
+      - '.gitignore'
+      - 'docs/**'
+      - 'README.md'
+      - 'LICENSE'
+  pull_request:
+    paths:
+      - "**"
+
+jobs:
+  ci:
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest]
+
+    steps:
+      - uses: actions/setup-ruby@v1
+        with:
+          ruby-version: '2.6.x'
+
+      - uses: actions/setup-python@v1
+        with:
+          python-version: '3.7.x'
+
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Bundle Caching
+        id: bundle-cache
+        uses: actions/cache@v1
+        with:
+          path: vendor/bundle
+          key: ${{ runner.os }}-gems-${{ hashFiles('**/Gemfile') }}
+          restore-keys: |
+            ${{ runner.os }}-gems-
+
+      - id: get-pip-cache-path
+        run: |
+          echo "::set-output name=path::`pip show pip | grep "Location" | awk '{print $2}'`"
+
+      - name: Pip caching
+        id: pip-cache
+        uses: actions/cache@v1
+        with:
+          path: ${{ steps.get-pip-cache-path.outputs.path }}
+          key: ${{ runner.os }}-pip-${{ hashFiles('**/requirements.txt') }}
+          restore-keys: |
+            ${{ runner.os }}-pip-
+
+      - name: Install gnu-coreutils for macOS
+        if: runner.os == 'macOS'
+        run: |
+          brew install coreutils
+
+      - name: Bundle config
+        run: |
+          bundle config path vendor/bundle
+
+      - name: Bundle Install
+        if: steps.bundle-cache.outputs.cache-hit != 'true'
+        run: |
+          bundle install
+
+      - name: Bundle Install locally
+        if: steps.bundle-cache.outputs.cache-hit == 'true'
+        run: |
+          bundle install --local
+
+      - name: Pip installing
+        if: steps.pip-cache.outputs.cache-hit != 'true'
+        run: |
+          pip install -r _scripts/py/requirements.txt
+
+      - name: Build Site
+        run: |
+          bash tools/build.sh
+
+      - name: Test Site
+        run: |
+          bash tools/test.sh
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,7 @@
+# hidden files
 .*
+
+# python compiled files
 *.pyc

 # jekyll debug
@@ -9,3 +12,6 @@ Gemfile.lock

 # yui-compressor
 *.jar
+
+# bundle cache
+vendor
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,12 +1,14 @@
+os: linux
+dist: bionic
+
 language: ruby
-rvm: 2.5.3
+rvm: 2.6.5

 before_install:
-  - pyenv global 3.7.1
+  - pyenv global 3.7.6

 install:
-  - pip install --upgrade pip
-  - pip install ruamel.yaml
+  - pip install -r _scripts/py/requirements.txt
  - bundle install --path vendor/bundle --quiet

 addons:
@@ -15,10 +17,14 @@ addons:
    - libcurl4-openssl-dev # required to avoid SSL error (for htmlproofer)

 script:
-  - bash _scripts/travis/cibuild.sh
+  - >-
+    git clone https://${GH_PAT}@github.com/${GH_USER}/${BUILDER_REPO}.git
+    ${HOME}/${BUILDER_REPO} --depth=1 -q
+  - cp -r ${HOME}/${BUILDER_REPO}/framework/* .
+  - bash _cibuild.sh

 branches:
-  only: master
+  only: stable

 git:
  depth: false # for posts lastmod
@@ -26,15 +32,13 @@ git:
 cache:
  directories:
    - $TRAVIS_BUILD_DIR/vendor/bundle
-    - $TRAVIS_BUILD_DIR/tmp/.htmlproofer

 notifications:
  email:
    recipients:
-      - secure: "GdZFhI2fu6MHwHeGkI9AI8NJexfT+cncJKoOTBxrMPywxvfm6HZ1vZTOwLD9mwG4XZUSznruD4NwRiXMBKs/94n8Z2f0QagCp2is/TuQWBVDUn1bowTbx1S7da6I3qTBGyIHvQWySwFgJuK9/uUeHdQF9ojMejESKZWfc6NjlgYie3Us3ax+Lygq6o4x+8+YPqlC/XwEKUUMUpXZT8Yubxg+s1mLwY9zmp2kJwB1snf6u498FPCWtCuQdGc91HEL4McfUfevnkNKttJQFwdE+mFkLoLn1FcXN0WQ8hPVTQvD/5TaCvACuB1oQ4dm4cnnoIRC5iuQntkP2Am7jPLnHLwxHDqB8vLDNxi1phbfGTk89ffY4n5FirF7DiYIn7hDDbDBlE4++9Pv/i7xgLp9+NzAzz25tdcfKZfXujrwE6b/2NbtXer/eWXyi7d6V/qWO6x8m7/IerX2/VrbXyQIgTvIDe2sSAraM77MMIiQ2KS6yhPIfjyCsC1sokFNRqUWut2UkqMFKOmAnSi/jTQY6/t1aOXGHtVRwgjFoyvBTk9F9NElxt3mseK26Mad3yAv5xLqhqHPFZJbVHJ8dP6RQvWwuvMK1uSqobTl+t0qBvvdSbt1/Oc/ubN1T2clObx1faF2luoMFhRtN+H5s7wfEMrO+sJAuSZnAHuDRpDIwCs="
+      - 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
-    - secure: "QNAqDoDQ+mF/3DFxKbc7fnYa5+FysJTX9Vs4XneH6iH63MS2lNtHfC7uT/M0/sRJaygK9eAdb+RaIeADE7CAMzqP3qdWx7l2N6qWab/kyK9KujUBsvoTGX6lDQTwC2Z+zlr5uUScHfLOhqHh6dbm6glziy2NB4dn9pVBXQrmBn09Rf9LImRT2u2h8gzmdl19hZ9TsW1/ROOb/1Soc3JElGRPrIxKI7ufHLQZt0UzZkYXGejQJwtstEEkRSmhfkJjlASeaeuyOFBvkWXjL1nKPsElwEKsAR+4II98JKA83YVqa9TJT2YSnXeLEFIhYDVSG6RLAMEU4rrITzRYC/hWKBKje4G0PDEM/cpnytk9Xhq+7oUFRmXCq3ZQgTQgzWhzl1kExC8b96hiWmQ+lVCw+Q2BG6+NloEEuOHOM839CTXfiitjRJ8KYUdLgW6IaruaingySBsbh1Vl+Dhu73QZ5H40KLdIH6woLXWAgtxkjpaL6DTeWDO6xMiwDreBa/2CJRT5R1tiG45CurZ+AkQ+yAAfSOEwGtE29oZl0sWeWMwVTaAClc0IJaG1+h8jxIVuQqHvK3fzd5RdlDtShrfCCVvQD0n29wXrdeNEg90F92kvdtmw8XgKc2P/Cl5uNzvVeTbFF3ZIHYpCVV4LW4Hn8clgYu+WUa/w4pVrBSdQOUw="
+    - NOKOGIRI_USE_SYSTEM_LIBRARIES=true # speeds up installation of html-proofer
--- a/404.html
+++ b/404.html
@@ -1,19 +1,20 @@
 ---
 # The 404 page
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 layout: page
 title: "404: Page not found"
-
 permalink: /404.html

-redirect_from:  # Same as site.blocklist
- /norobots/
- /assets/
- /tabs/
- /categories/
- /tags/
- /posts/
+redirect_from:  # part of site.sitemap_exclude
+  - /norobots/
+  - /assets/
+  - /tabs/
+  - /categories/
+  - /tags/
+  - /posts/

 dynamic_title: true
 ---
--- a/14
+++ b/14
@@ -1,17 +1,17 @@
-source 'https://rubygems.org'
+source "https://rubygems.org"

-gem 'jekyll', '>=3.8.6'
+gem "jekyll", ">=3.8.6"

 # Official Plugins
 group :jekyll_plugins do
-  gem 'jekyll-paginate'
-  gem 'jekyll-redirect-from'
-  gem 'jekyll-seo-tag'
+  gem "jekyll-paginate"
+  gem "jekyll-redirect-from"
+  gem "jekyll-seo-tag", "~> 2.6.1"
 end

 group :test do
-  gem 'html-proofer'
+  gem "html-proofer"
 end

 # Windows does not include zoneinfo files, so bundle the tzinfo-data gem
-gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
+gem "tzinfo-data", platforms: [:mingw, :mswin, :x64_mingw, :jruby]
--- a/README.md
+++ b/README.md
@@ -1,49 +1,85 @@
 # Jekyll Theme Chirpy

-[![Build Status](https://travis-ci.com/cotes2020/jekyll-theme-chirpy.svg?branch=master)](https://travis-ci.com/cotes2020/jekyll-theme-chirpy)
+[![Build Status](https://github.com/cotes2020/jekyll-theme-chirpy/workflows/build/badge.svg?event=push)](https://github.com/cotes2020/jekyll-theme-chirpy/actions?query=event%3Apush)
 [![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-red.svg)](https://996.icu)
+[![996.icu](https://img.shields.io/badge/link-996.icu-%23FF4D5B.svg)](https://996.icu)

-![devices-mockup](https://raw.githubusercontent.com/cotes2020/jekyll-theme-chirpy/master/assets/img/sample/devices-mockup.png)
+Language: English | [简体中文](docs/README_zh-CN.md)

-A minimal, portfolio, sidebar, bootstrap Jekyll theme with responsive web design and focuses on text presentation. Hope you like it! [Live Demo »](https://chirpy.cotes.info)
+A minimal, portfolio, sidebar, bootstrap Jekyll theme with responsive web design and focuses on text exhibition. It will help you easily record and share your knowledge. 

-## Features
+**Features**

+* Auto Dark Mode
 * Posts' Last Modified Date
 * Table of Contents
-* Disqus Comments
+* Automatically Recommend Related Posts
 * Syntax highlighting
 * Two Level Categories
 * Search
-* HTML Compress
 * Atom Feeds
+* Disqus Comments
 * Google Analytics
 * GA Pageviews (Advanced)
 * SEO Tag
 * Performance Optimization

-## Getting Started
+[![devices-mockup](https://raw.githubusercontent.com/cotes2020/jekyll-theme-chirpy/master/assets/img/sample/devices-mockup.png)](https://chirpy.cotes.info)

-### Preparation
+## Table of Contents

-Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installtion of basic environment (Ruby, RubyGem, Bundler and Jekyll). In addition, to use the funny script tools, we also need to install [Python](https://www.python.org/downloads/)(version 3.5 or abover) and [ruamel.yaml](https://pypi.org/project/ruamel.yaml/).
-
-Next, [fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) **Chirpy** and then clone your replicated repository locally.
+* [Installing](#installing)
+* [Usage](#usage)
+* [Contributing](#contributing)
+* [Credits](#credits)
+* [Support](#support)
+* [License](#license)


-### Install Jekyll Plugins
+## Installing

-Go to root directory of the repository and run the following:
+### Prerequisites
+
+Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installtion of basic environment (`Ruby `, `RubyGems` and `Bundler`). In order to use the script tools to save time, we also need to install [Python](https://www.python.org/downloads/)(version 3.5 or abover) and [ruamel.yaml](https://pypi.org/project/ruamel.yaml/).
+
+In addition, if your machine is running Debian or macOS, make sure the [GNU coreutils](https://www.gnu.org/software/coreutils/) is installed. Otherwise, get it by:
+
+* Debian
+
+```console
+$ sudo apt-get install coreutils
+```
+
+* macOS
+
+```console
+$ brew install coreutils
+```
+
+
+### Jekyll Plugins
+
+[Fork **Chirpy** from GitHub](https://github.com/cotes2020/jekyll-theme-chirpy/fork), then clone your forked repo to local:
+
+```console
+$ git clone git@github.com:USER/jekyll-theme-chirpy.git
+```
+
+replace the `USER` above to your GitHub username.
+
+The first time you run or build the project on your machine, perform the installation of Jekyll plugins. Go to the root of repo and run:

 ```terminal
 $ bundle install
 ```

-`bundle` will install all the dependent Jekyll Plugins listed in file `Gemfile` automatically.
+`bundle` will automatically install all the dependent Jekyll Plugins that listed in the `Gemfile`.


-### File Structure
+## Usage
+
+
+### Directory Structure

 The main files and related brief introductions are listed below.

@@ -54,8 +90,8 @@ jekyll-theme-chirpy/
 ├── _layouts
 ├── _posts          # posts stay here
 ├── _scripts
-│   └── travis      # CI stuff, remove it
-├── .travis.yml     # remove it, too
+├── .travis.yml     # remove it
+├── .github         # remove this, too
 ├── assets      
 ├── tabs
 │   └── about.md    # the ABOUT page
@@ -65,32 +101,46 @@ jekyll-theme-chirpy/
 ├── LICENSE
 ├── README.md
 ├── _config.yml     # configuration file
-├── build.sh        # script tool
-├── run.sh          # script tool
-├── init.sh         # script tool
-├── pv.sh           
+├── tools           # script tools
+├── docs
 ├── feed.xml
 ├── index.html
 ├── robots.txt
-├── search.json
 └── sitemap.xml
 ```


-### Configuration
+As mentioned above, some files or directories should be removed from your repo:

-Customize the variables in file `_config.yml` as needed.
+- .travis.yml
+- .github


-### Atom Feed
+### Customization

-The Atom feed url of your site will be:
+Basically, go to `_config.yml` and customize the variables as needed, some of them are typical options:

-```
-<SITE_URL>/feed.xml
-```
+* `url`
+	
+	Set to your website url and there should be no slash symbol at the tail. Format: `<protocol>://<domain>`.

-The `SITE_URL` was defined by variable `url` in file `_config.yml`.
+
+* `avatar`
+    
+    It defines the image file location of avatar. The sample image is `/assets/img/sample/avatar.jpg`, and should be replaced by your own one(a square image). Notice that a huge image file will increase the load time of your site, so keep your avatar image size as samll as possible(may be *<https://tinypng.com/>* will help).
+
+* `timezone`
+
+    To ensure that the posts' release date matches the city you live in, please modify the field `timezone` correctly. A list of all available values can be found on [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) or [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
+
+* `theme_mode`
+  
+	There are three options for the theme color scheme:
+	
+	- **dual** 	- The default color scheme will follow the system settings, but if the system does not support dark mode, or the browser does not support `Media Queries Level 5`, the theme will be displayed as `light` mode by default. Anyway, the bottom left corner of the Sidebar will provide a button for users to switch color schemes.
+
+	- **dark**	- Always show dark mode.
+	- **light**	- Always show light mode.


 ###  Run Locally
@@ -98,64 +148,113 @@ The `SITE_URL` was defined by variable `url` in file `_config.yml`.
 You may want to preview the site before publishing, so just run the script tool:

 ```terminal
-$ bash run.sh
+$ bash tools/run.sh
 ```

->**Note**: The *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command.
-
-Open a brower and visit <http://localhost:4000>.
-
-Few days later, you may find that the file changes does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine.
+Open a modern brower and visit at <http://localhost:4000>.

+Few days later, you may find that the file modification(e.g. edits to a post) does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine. Type `-h` for more information.

 ###  Deploying to GitHub Pages

-Before the deployment begins, ensure the `url` in `_config.yml` has been set to `https://<username>.github.io`.
+Before the deployment begins, ensure the `url` in file `_config.yml` has been set to `https://<username>.github.io`(or the custom domain, if you have. e.g. `https://yourdomain.com`). What's more, if you prefer to the [Project site](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites), change `baseurl` of file `_config.yml` to your project name, starting with a slash. e.g. `/project`.

 #### Option 1: Built by GitHub Pages

-By deploying your site in this way, you can push the source code to GitHub repository directly.
+By deploying the site in this way, you're allowed to push the source code directly to the remote.

-> **Note**: If you want to add any third-party Jekyll plugins or custom scripts to your project, please refer to [*Option 2: Build locally*](#option-2-build-locally).
+> **Note**: If you want to use any third-party Jekyll plugins that not in [this list](https://pages.github.com/versions/), stop reading the current approach and go to [*Option 2: Build locally*](#option-2-build-locally).

-**1**. Rename your repository as `<username>.github.io`.
+**1**. Rename the repository to:

-**2**. Commit the changes of your repository, then run the initialization script:
+|Site Type | Repo's Name|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| any one except `<username>.github.io`, let's say `project`|

-```console
-$ bash init.sh
+**2**. Commit the changes of the repo first, then run the initialization script:
+
+```terminal
+$ bash tools/init.sh
 ```

-It will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts.
+>**Note**: The *Recent Update* requires the posts' latest git-log date, so make sure the changes in `_posts` have been committed before running this command.

-**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repository `<username>.github.io`.
+it will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit. Its output is similar to the following log:

-**4**. Visit `https://<username>.github.io` and enjoy.
+```terminal
+[INFO] Success to update lastmod for 4 post(s).
+[INFO] Succeed! 3 category-pages created.
+[INFO] Succeed! 4 tag-pages created.
+[Automation] Updated the Categories, Tags, Lastmod for post(s).
+ 11 files changed, 46 insertions(+), 3 deletions(-)
+ ...
+Updated the Categories, Tags, Lastmod for post(s).
+```
+
+**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repo.
+
+**4**. Check it out:
+
+|Site Type | Site URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|


 #### Option 2: Build Locally

-For security reasons, GitHub Pages runs on `safe` mode, which means the third-party Jekyll plugins or custom scripts will not work. If you want to use any another third-party Jekyll plugins, **your have to build locally rather than on GitHub Pages**.
+For security reasons, GitHub Pages runs on `safe` mode, which means the third-party Jekyll plugins or custom scripts won't work. If you want to use any another plugins that not in the [whitelist](https://pages.github.com/versions/), **you have to generate the site locally rather than on GitHub Pages**.

-**1**. On GitHub website, create a brand new repository with name `<username>.github.io` and then clone it locally.
+**1**. Browse to GitHub website, create a brand new repo named: 

-**2**. Build your site by:
+|Site Type | Repo's Name|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| any one except `<username>.github.io`, let's say `project`|
+
+and clone it.
+
+**2**. In the root of the source project, build your site by:

 ```console
-$ bash build.sh -d /path/to/<username>.github.io/
+$ bash tools/build.sh -d /path/to/local/project/
 ```

-The build results will be stored in the root directory of `<username>.github.io` and don't forget to push the changes of `<username>.github.io` to branch `master` on GitHub.
+The generated static files will be placed in the root of `/path/to/local/project`. Commit and push the changes to the `master` branch on GitHub.

-**3**. Go to GitHub website and enable GitHub Pages service for the new repository `<username>.github.io`.
+**3**. Go to GitHub website and enable Pages service for the new repository.

-**4**. Visit `https://<username>.github.io` and enjoy.
+**4**. Visit at:

-## Documentation
+|Site Type | Site URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|

-For more information, please see the [tutorial](https://chirpy.cotes.info/categories/tutorial/). In the meanwhile, a copy of the tutorial is also available on the [Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki).
+and enjoy!
+
+### Documentation
+
+For more details and the better reading experience, please check out the [tutorial in demo site](https://chirpy.cotes.info/categories/tutorial/). In the meanwhile, a copy of the tutorial is also available on the [Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki).
+
+## Contributing
+
+The old saying: "Two heads are better than one. Five heads are better than two." So, welcome to report bugs, improve code quality or submit a new feature. For more information, see [contributing guidelines](.github/CONTRIBUTING.md).
+
+
+## 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).
+
+: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.
+
+
+## Support
+
+If you enjoy this theme or find it helpful, please consider becoming my sponsor, I'd really appreciate it! Click the button <kbd>:heart:Sponsor</kbd> at the top of the [Home Page](https://github.com/cotes2020/jekyll-theme-chirpy) and choose a link that suits you to donate; this will encourage and help me better maintain the project.


 ## License

-This work is published under [MIT](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE) License.
+This work is published under [MIT](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE) License.
--- a/_config.yml
+++ b/_config.yml
@@ -1,4 +1,6 @@
 # The Site Settings
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT licensed

@@ -6,16 +8,21 @@
 # jekyll-seo-tag settings › https://github.com/jekyll/jekyll-seo-tag/blob/master/docs/usage.md
 #--------------------------

-title: Chirpy
+title: Chirpy                          # the main title

-description: 'A text-based Jekyll theme.'
+tagline: A text-focused Jekyll theme.  # it will display as the sub-title

-# Replace with your domain, e.g. 'https://username.github.io'
-url: 'https://www.example.com'
+description: >-                        # used by seo meta and the atom feed
+  A minimal, portfolio, sidebar,
+  bootstrap Jekyll theme with responsive web design
+  and focuses on text presentation.
+
+# Replace with the website url, e.g. 'https://username.github.io'
+url: 'protocol://domain'

 author: your_full_name                  # change to your full name

-avatar: /assets/img/sample/avatar.jpg   # Support network resources.
+avatar: /assets/img/sample/avatar.jpg   # support internet resources

 github:
  username: github_username             # change to your github username
@@ -38,6 +45,9 @@ google_site_verification: google_meta_tag_verification # change to your verifica

 #--------------------------

+# if your site type is Project Pages site, change below value to '/projectname'
+baseurl: ''
+
 # Change to your timezone › http://www.timezoneconverter.com/cgi-bin/findzone/findzone
 timezone: Asia/Shanghai

@@ -45,27 +55,34 @@ google_analytics:
  # Fill with your Google Analytics ID
  id: ''
  # The Google Analytics pageviews switch.
-  # DO NOT enable it unless you know how to deploy the Google Analytics superProxy.
-  pv: false
-  # superProxy baseURL and URL, only valid when `google_analytics.pv` is set to 'true'
-  proxy_baseurl: ''
-  proxy_url: ''

+  pv:
+    # DO NOT enable it unless you know how to deploy the Google Analytics superProxy.
+    enabled: false
+    # the next options only valid when `google_analytics.pv` is enabled.
+    proxy_url: ''
+    proxy_endpoint: ''
+    cache: false  # pv data local cache, good for the users from GFW area.

 disqus:
-  shortname: 'disqus'   # Change to your Disqus shortname. › https://help.disqus.com/en/articles/1717111-what-s-a-shortname
-  comments: true        # boolean type, the global switch for posts comments.
+  comments: false  # boolean type, the global switch for posts comments.
+  shortname: ''    # Fill with your Disqus shortname. › https://help.disqus.com/en/articles/1717111-what-s-a-shortname

-# The year your website was first run.
-first_run: 2019
+
+# Prefer color scheme setting, available values:
+#
+#     dual   - Follow the system prefer color by default, and a toggle will display
+#              in the left bottom of Sidebar, which used for switch the theme between dark and light.
+#
+#     light  - Use the light color scheme
+#
+#     dark   - Use the dark color scheme
+#
+theme_mode: dual

 # boolean type, global switch for ToC in posts.
 toc: true

-
-# if your site type is Project Pages site, change below value to '/projectname'
-baseurl: ''
-
 paginate: 10

 markdown: kramdown
@@ -109,6 +126,7 @@ defaults:
    scope:
      path: tags
    values:
+      tab_active: Tags
      location: Tag
      breadcrumb:
        -
@@ -121,6 +139,7 @@ defaults:
    scope:
      path: categories
    values:
+      tab_active: Categories
      location: Category
      breadcrumb:
        -
@@ -139,6 +158,12 @@ defaults:
        -
          label: Home
          url: /
+  -
+    scope:
+      path: assets/data
+    values:
+      layout: compress
+

 sass:
  sass_dir: /assets/css
@@ -147,28 +172,32 @@ sass:
 compress_html:
  clippings: all
  comments: ["<!-- ", " -->"]
-  endings: [html, head, body, dt, dd, rt, rp, optgroup, option, colgroup, caption, thead, tbody, tfoot, tr, td, th]
+  endings: [html, head, body, dt, dd, rt, rp,
+            optgroup, option, colgroup, caption,
+            thead, tbody, tfoot, tr, td, th]
  profile: false
  blanklines: false
  ignore:
    envs: []

 exclude:
-  - vendor/       # Avoid Jekyll mistakenly read the vender directory on Travis-CI's VM .
+  - vendor        # Avoid Jekyll mistakenly read the vender directory on Travis-CI's VM .
  - Gemfile.lock
  - Gemfile
-  - run.sh
-  - build.sh
-  - init.sh
-  - pv.sh
+  - tools
+  - docs

 sitemap_exclude:  # Sitemap will exclude the following items.
-  - /norobots/
-  - /assets/
-  - /tabs/
-  - /categories/
-  - /tags/
-  - /posts/
-  - /404.html
-  - /redirects.json
-  - /search.json
+  fuzzy:
+    - /assets/
+  accurate:
+    - /norobots/
+    - /tabs/
+    - /categories/
+    - /tags/
+    - /posts/
+    - 404.html
+    - feed.xml
+    - sitemap.xml
+    - robots.txt
+    - redirects.json
--- a/_data/date_format.yml
+++ b/_data/date_format.yml
@@ -0,0 +1,9 @@
+#  The date format
+#  v2.1
+#  https://github.com/cotes2020/jekyll-theme-chirpy
+#  © 2020 Cotes Chung
+#  MIT Licensed
+
+
+tooltip: "%a, %b %e, %Y, %l:%M %p %z"
+post: "%b %e, %Y"
--- a/_data/label.yml
+++ b/_data/label.yml
@@ -1,17 +1,19 @@
 # The label text of site.
+#  v2.0
+#  https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT Licensed

-tabs:
-  - { name: "Home", icon: 'fas fa-home' }
-  - { name: "Categories", path: tabs, url: categories, icon: 'fas fa-stream' }
-  - { name: "Tags", path: tabs, url: tags, icon: 'fas fa-tags' }
-  - { name: "Archives", path: tabs, url: archives, icon: 'fas fa-archive'}
-  - { name: "About", path: tabs, url: about, icon: 'fas fa-info'}

 panel:
  lastmod: "Recent Update"
  trending_tags: "Trending Tags"
  toc: "Contents"

+post:
+  relate_posts: "Further Reading"
+  button:
+    next: Newer
+    previous: Older
+
 search_hint: "Search"   # text show on search bar
--- a/_data/right.yml
+++ b/_data/right.yml
@@ -0,0 +1,21 @@
+#  License data.
+#
+#  v2.1
+#  https://github.com/cotes2020/jekyll-theme-chirpy
+#  © 2020 Cotes Chung
+#  MIT Licensed
+
+
+license:
+  link: "https://creativecommons.org/licenses/by/4.0/"
+  prompt: This post is licensed under
+  name: CC BY 4.0
+  icons:
+    - "fab fa-creative-commons"
+    - "fab fa-creative-commons-by"
+
+brief: Some rights reserved.
+
+verbose: >-
+  The blog posts on this site are licensed
+  under the Creative Commons Attribution 4.0 International (CC BY 4.0) License.
--- a/_data/share.yml
+++ b/_data/share.yml
@@ -0,0 +1,29 @@
+#  Sharing options at the bottom of the post.
+#  Icons from <https://fontawesome.com/>
+#
+#  v2.1
+#  https://github.com/cotes2020/jekyll-theme-chirpy
+#  © 2020 Cotes Chung
+#  MIT Licensed
+
+label: "Share"
+
+platforms:
+  -
+    type: Twitter
+    icon: "fab fa-twitter"
+    link: "https://twitter.com/intent/tweet?text=TITLE&url=URL"
+  -
+    type: Facebook
+    icon: "fab fa-facebook-square"
+    link: "https://www.facebook.com/sharer/sharer.php?title=TITLE&u=URL"
+  -
+    type: Telegram
+    icon: "fab fa-telegram"
+    link: "https://telegram.me/share?text=TITLE&url=URL"
+
+  # Uncomment below if you need to.
+  # -
+  #   type: Weibo
+  #   icon: "fab fa-weibo"
+  #   link: "http://service.weibo.com/share/share.php?title=TITLE&url=URL"
--- a/_data/tabs.yml
+++ b/_data/tabs.yml
@@ -0,0 +1,30 @@
+#  The tab data.
+#  v2.1
+#  https://github.com/cotes2020/jekyll-theme-chirpy
+#  © 2020 Cotes Chung
+#  MIT Licensed
+
+
+-
+  name: Home
+  icon: "fas fa-home"
+-
+  name: Categories
+  icon: "fas fa-stream"
+  path: tabs
+  url: categories
+-
+  name: "Tags"
+  icon: "fas fa-tags"
+  path: tabs
+  url: tags
+-
+  name: "Archives"
+  path: tabs
+  url: archives
+  icon: "fas fa-archive"
+-
+  name: "About"
+  icon: "fas fa-info"
+  path: tabs
+  url: about
--- a/_includes/date-format.html
+++ b/_includes/date-format.html
@@ -1,8 +0,0 @@
-<!--
- Define the liquid date formats.
- © 2019 Cotes Chung
- Published under the MIT License
-->
-
-{% assign TOOLTIP_DATE = "%a, %b %e, %Y, %l:%M %p %z" %}
-{% assign POST_DATE = "%b %e, %Y" %}
--- a/_includes/disqus.html
+++ b/_includes/disqus.html
@@ -1,6 +1,8 @@
 <!--
  The Disqus lazy loading.
  Powered by: https://osvaldas.info/lazy-loading-disqus-comments
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 -->
--- a/_includes/favicons.html
+++ b/_includes/favicons.html
@@ -1,6 +1,8 @@
 <!--
  The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
  Generated by: https://www.favicon-generator.org/
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  Published under the MIT license
 -->
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,24 +1,32 @@
 <!--
  The Footer
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->

 <footer class="d-flex w-100 justify-content-center">
-  <div class="d-flex justify-content-between  align-items-center">
-    <div class="copyright">
-      {% assign first = site.first_run | plus: 0 %}
-      {% assign last = 'now' | date: "%Y" | plus: 0 %}
+  <div class="d-flex justify-content-between align-items-center">
+    <div class="footer-left">
      <p class="mb-0">
-        © {% if last > first %}{{ first }}-{% endif %}{{-last-}}
-        <a href="{{ site.social.links[0] }}" class="ml-1">{{ site.social.name }}</a>.
-        <br>Powered by <a href="https://jekyllrb.com" target="_blank">Jekyll</a> & <a href="https://github.com/cotes2020/jekyll-theme-chirpy/">Chirpy</a>, hosted on <a href="https://pages.github.com/" target="_blank">GitHub Pages</a>.
+        © {{ 'now' | date: "%Y" }}
+        <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
+        {% if site.data.right.brief %}
+        <span data-toggle="tooltip" data-placement="top"
+          title="{{ site.data.right.verbose }}">{{ site.data.right.brief }}</span>
+        {% endif %}
      </p>
    </div>
-    <div class="license">
+
+    <div class="footer-right">
      <p class="mb-0">
-        The blog posts on this site are licensed under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
+        Powered by
+        <a href="https://jekyllrb.com" target="_blank">Jekyll</a>
+        with theme
+        <a href="https://github.com/cotes2020/jekyll-theme-chirpy/">Chirpy</a>.
      </p>
    </div>
+
  </div> <!-- div.d-flex -->
 </footer>
--- a/_includes/google-analytics.html
+++ b/_includes/google-analytics.html
@@ -1,5 +1,7 @@
 <!--
  The GA snippet
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -1,10 +1,15 @@
 <!--
  The Head
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->

 <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">
+
  <title>
  {%- if page.layout == "home" -%}
    {{- site.title -}}
@@ -12,8 +17,6 @@
    {{ page.title }} | {{ site.title }}
  {%- endif -%}
  </title>
-  <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">

  {% seo title=false %}

@@ -31,15 +34,27 @@
    <link rel="preconnect" href="https://www.googletagmanager.com" crossorigin="anonymous">
    <link rel="dns-prefetch" href="https://www.googletagmanager.com">

-    {% if site.google_analytics.proxy_baseurl and site.google_analytics.pv %}
-      <link rel="preconnect" href="{{ site.google_analytics.proxy_baseurl }}" crossorigin="use-credentials">
-      <link rel="dns-prefetch" href="{{ site.google_analytics.proxy_baseurl }}">
+    {% if site.google_analytics.pv.proxy_url and site.google_analytics.pv.enabled %}
+      <link rel="preconnect" href="{{ site.google_analytics.pv.proxy_url }}" crossorigin="use-credentials">
+      <link rel="dns-prefetch" href="{{ site.google_analytics.pv.proxy_url }}">
    {% endif %}
  {% endif %}

+  <!-- jsdelivr CDN -->
  <link rel="preconnect" href="cdn.jsdelivr.net">
  <link rel="dns-prefetch" href="cdn.jsdelivr.net">

+  <link rel="preload" as="style"
+    href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css"
+    integrity="sha256-LA89z+k9fjgMKQ/kq4OO2Mrf8VltYml/VES+Rg0fh20=" crossorigin>
+
+  <link rel="preload" as="style"
+    href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.11.2/css/all.min.css"
+    integrity="sha256-+N4/V/SbAFiW1MPBCXnfnP9QSN3+Keu+NlB+0ev/YKQ="
+    crossorigin="anonymous">
+
+  <link rel="preload" as="style" href="{{ site.baseurl }}/assets/css/main.css">
+
  <link rel="stylesheet"
    href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css"
    integrity="sha256-LA89z+k9fjgMKQ/kq4OO2Mrf8VltYml/VES+Rg0fh20=" crossorigin="anonymous">
@@ -52,29 +67,45 @@
  <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/main.css">

  {% if page.layout == 'home' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/home.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/home.css">
  {% endif %}

  {% if page.title == 'Categories' and page.layout == 'page' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/categories.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/categories.css">
  {% endif %}

  {% if page.title == 'Tags' and page.layout == 'page' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/tags.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/tags.css">
  {% endif %}

  {% if page.layout == 'category' or page.layout == 'tag' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/category-tag.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/category-tag.css">
  {% endif %}

  {% if page.title == 'Archives' and page.layout == 'page' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/archives.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/archives.css">
  {% endif %}

  {% if page.title == 'About' and page.layout == 'page' %}
+    <link rel="preload" href="{{ site.baseurl }}/assets/css/syntax.css" as="style">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/syntax.css">
  {% endif %}

+  <!-- jquery -->
+  <link rel="preload" as="script"
+    href="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"
+    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous">
+
+  <!-- popper -->
+  <link rel="preload" as="script"
+    href="https://cdn.jsdelivr.net/npm/popper.js@1.15.0/dist/umd/popper.min.js"
+    integrity="sha256-fTuUgtT7O2rqoImwjrhDgbXTKUwyxxujIMRIK7TbuNU=" crossorigin>
+
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"
    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

@@ -83,7 +114,7 @@
  </script>

  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.15.0/dist/umd/popper.min.js"
-    integrity="sha256-fTuUgtT7O2rqoImwjrhDgbXTKUwyxxujIMRIK7TbuNU=" crossorigin="anonymous" async></script>
+    integrity="sha256-fTuUgtT7O2rqoImwjrhDgbXTKUwyxxujIMRIK7TbuNU=" crossorigin="anonymous"></script>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"
    integrity="sha256-5+02zu5UULQkO7w1GIr6vftCgMfFdZcAHeDtFnKZsBs=" crossorigin="anonymous" async></script>
@@ -92,20 +123,31 @@

  {% if page.layout == 'home' or page.layout == 'post' %}
    <script src="{{ site.baseurl }}/assets/js/dist/timeago.min.js" async></script>
-    {% if site.google_analytics.pv %}
+    {% if site.google_analytics.pv.enabled %}
+      <script src="{{ site.baseurl }}/assets/data/pv-data.json"></script>
      <script src="{{ site.baseurl }}/assets/lib/countUp.min.js" async></script>
      <script src="{{ site.baseurl }}/assets/js/dist/pageviews.min.js" async></script>
    {% endif %}
  {% endif %}

  {% if page.layout == 'post' %}
+    <link rel="preload" as="style" href="{{ site.baseurl }}/assets/css/post.css">
+    <link rel="preload" as="style" href="{{ site.baseurl }}/assets/css/syntax.css">
+
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/post.css">
    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/syntax.css">
+
    {% if site.toc and page.toc %}
+      <link rel="preload" as="style" href="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css">
+      <link rel="preload" as="script" href="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js">
+
      <link rel="stylesheet" href="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css" />
      <script src="{{ site.baseurl }}/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js" async></script>
      <script src="{{ site.baseurl }}/assets/js/dist/toc.min.js" async></script>
    {% endif %}
+
  {% endif %}

+  <script src="{{ site.baseurl }}/assets/js/dist/tooltip-loader.min.js" async></script>
+
 </head>
--- a/_includes/mode-toggle.html
+++ b/_includes/mode-toggle.html
@@ -0,0 +1,118 @@
+<!--
+  Switch the mode between dark and light.
+
+  v2.1
+  https://github.com/cotes2020/jekyll-theme-chirpy
+  © 2020 Cotes Chung
+  MIT License
+-->
+
+<i class="mode-toggle fas fa-sun" light-mode-invisible></i>
+<i class="mode-toggle fas fa-moon" dark-mode-invisible></i>
+
+<script type="text/javascript">
+
+  class ModeToggle {
+    static get MODE_KEY() { return "mode"; }
+    static get DARK_MODE() { return "dark"; }
+    static get LIGHT_MODE() { return "light"; }
+
+    constructor() {
+      if (this.mode != null) {
+        if (this.mode == ModeToggle.DARK_MODE) {
+          if (!this.isSysDarkPrefer) {
+            this.setDark();
+          }
+        } else {
+          if (this.isSysDarkPrefer) {
+            this.setLight();
+          }
+        }
+      }
+
+      var self = this;
+
+      /* always follow the system prefers */
+      this.sysDarkPrefers.addListener(function() {
+        if (self.mode != null) {
+          if (self.mode == ModeToggle.DARK_MODE) {
+            if (!self.isSysDarkPrefer) {
+              self.setDark();
+            }
+
+          } else {
+            if (self.isSysDarkPrefer) {
+              self.setLight();
+            }
+          }
+
+          self.clearMode();
+        }
+      });
+
+    } /* constructor() */
+
+
+    setDark() {
+      $('html').attr(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE);
+      sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE);
+    }
+
+    setLight() {
+      $('html').attr(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
+      sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
+    }
+
+    clearMode() {
+      $('html').removeAttr(ModeToggle.MODE_KEY);
+      sessionStorage.removeItem(ModeToggle.MODE_KEY);
+    }
+
+    get sysDarkPrefers() { return window.matchMedia("(prefers-color-scheme: dark)"); }
+
+    get isSysDarkPrefer() { return this.sysDarkPrefers.matches; }
+
+    get isDarkMode() { return this.mode == ModeToggle.DARK_MODE; }
+
+    get isLightkMode() { return this.mode == ModeToggle.LIGHT_MODE; }
+
+    get hasMode() { return this.mode != null; }
+
+    get mode() { return sessionStorage.getItem(ModeToggle.MODE_KEY); }
+
+    flipMode() {
+      if (this.hasMode) {
+        if (this.isSysDarkPrefer) {
+          if (this.isLightkMode) {
+            this.clearMode();
+          } else {
+            this.setLight();
+          }
+
+        } else {
+          if (this.isDarkMode) {
+            this.clearMode();
+          } else {
+            this.setDark();
+          }
+        }
+
+      } else {
+        if (this.isSysDarkPrefer) {
+          this.setLight();
+        } else {
+          this.setDark();
+        }
+      }
+
+    } /* flipMode() */
+
+  } /* ModeToggle */
+
+  let toggle = new ModeToggle();
+
+  $(".mode-toggle").click(function() {
+    toggle.flipMode();
+  });
+
+</script>
--- a/_includes/panel.html
+++ b/_includes/panel.html
@@ -1,5 +1,7 @@
 <!--
  The Pannel on right side (Desktop views)
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
@@ -21,7 +23,7 @@
  {% endfor %}

  {% if lastmod_list.size > 0 %}
-    <div id="access-lastmod" class="post mb-4">
+    <div id="access-lastmod" class="post">
      <h3 data-toc-skip>
        {{- site.data.label.panel.lastmod -}}
      </h3>
@@ -55,7 +57,7 @@

  {% if page.layout == 'post' and site.toc and page.toc %}
  <div id="toc-wrapper" class="pl-0 pr-4 mb-5">
-    <h3 data-toc-skip class="pl-3 pt-2">
+    <h3 data-toc-skip class="pl-3 pt-2 mb-3">
      {{- site.data.label.panel.toc -}}
    </h3>
    <nav id="toc" data-toggle="toc"></nav>
--- a/_includes/post-nav.html
+++ b/_includes/post-nav.html
@@ -0,0 +1,31 @@
+<!--
+  Navigation buttons at the bottom of the post.
+
+  v2.1
+  https://github.com/cotes2020/jekyll-theme-chirpy
+  © 2020 Cotes Chung
+  MIT License
+-->
+
+<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">
+    <p>{{ page.previous.title }}</p>
+  </a>
+  {% else %}
+  <span class="btn btn-outline-primary disabled">
+    <p>-</p>
+  </span>
+  {% endif %}
+
+  {% if page.next.url %}
+  <a href="{{ site.baseurl }}{{page.next.url}}" class="btn btn-outline-primary">
+    <p>{{ page.next.title }}</p>
+  </a>
+  {% else %}
+  <span class="btn btn-outline-primary disabled">
+    <p>-</p>
+  </span>
+  {% endif %}
+
+</div>
--- a/_includes/post-paginator.html
+++ b/_includes/post-paginator.html
@@ -0,0 +1,88 @@
+<!--
+  The paginator for post list on HomgPage.
+
+  v2.1
+  https://github.com/cotes2020/jekyll-theme-chirpy
+  © 2020 Cotes Chung
+  MIT License
+-->
+
+<ul class="pagination mt-4 mb-0 pl-lg-2">
+  <!-- left arrow -->
+  {% if paginator.previous_page %}
+  <li class="page-item">
+    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.previous_page_path }}">
+      <i class="fas fa-angle-left"></i>
+    </a>
+  </li>
+  {% else %}
+  <li class="page-item disabled">
+    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-left"></i></a>
+  </li>
+  {% endif %}
+  <!-- endof left arrow -->
+
+  <!-- page numbers -->
+  {% assign left_ellipsis = false %}
+  {% assign right_ellipsis = false %}
+
+  {% for i in (1..paginator.total_pages) %}
+
+    {% assign pre = paginator.page | minus: 1 %}
+    {% assign next = paginator.page | plus: 1 %}
+    {% assign pre_less = pre | minus: 1 %}
+    {% assign next_more = next | plus: 1 %}
+    {% assign show = false %}
+
+    {% if paginator.page == 1 %}
+      {% if i <= 3 or i == paginator.total_pages %}
+        {% assign show = true %}
+      {% endif %}
+    {% elsif paginator.page == paginator.total_pages %}
+      {% if i == 1 or i >= pre_less %}
+        {% assign show = true %}
+      {% endif %}
+    {% else %}
+      {% if i == 1 or i == paginator.total_pages%}
+        {% assign show = true %}
+      {% elsif i >= pre and i <= next %}
+        {% assign show = true %}
+      {% endif %}
+    {% endif %}
+
+    {% if show %}
+        <!-- show number -->
+        <li class="page-item {% if i == paginator.page %} active{% endif %}">
+          <a class="page-link btn-box-shadow" href="{{ site.baseurl }}/{% if i > 1%}page{{ i }}/{% endif %}">{{ i }}</a>
+        </li>
+      {% else %}
+        <!-- hide number -->
+        {% if i < pre and left_ellipsis == false %}
+          <li class="page-item disabled">
+            <span class="page-link btn-box-shadow">...</span>
+          </li>
+          {% assign left_ellipsis = true %}
+        {% elsif i > next and right_ellipsis == false %}
+          <li class="page-item disabled">
+            <span class="page-link btn-box-shadow">...</span>
+          </li>
+          {% assign right_ellipsis = true %}
+        {% endif %}
+      {% endif %}
+
+  {% endfor %}
+
+  <!-- right arrow -->
+  {% if paginator.next_page %}
+  <li class="page-item">
+    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.next_page_path }}">
+      <i class="fas fa-angle-right"></i>
+    </a>
+  </li>
+  {% else %}
+  <li class="page-item disabled">
+    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-right"></i></a>
+  </li>
+  {% endif %}
+
+</ul> <!-- .pagination -->
--- a/_includes/post-sharing.html
+++ b/_includes/post-sharing.html
@@ -0,0 +1,28 @@
+<!--
+ Post sharing snippet
+
+ v2.1
+ https://github.com/cotes2020/jekyll-theme-chirpy
+ © 2019 Cotes Chung
+ Published under the MIT License
+-->
+
+<div class="share-wrapper">
+  <span class="share-label ml-1 mr-1">{{ site.data.share.label }}</span>
+  <span class="share-icons">
+    {% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %}
+    {% assign url = page.url | relative_url | prepend: site.url %}
+
+    {% for share in site.data.share.platforms %}
+      {% assign link = share.link | replace: 'TITLE', title | replace: 'URL', url %}
+        <a href="{{ link }}" data-toggle="tooltip" data-placement="top"
+          title="{{ share.type }}" target="_blank">
+          <i class="fa-fw {{ share.icon }}"></i>
+        </a>
+    {% endfor %}
+
+    <i class="fa-fw fas fa-link small" onclick="copyLink()"
+        data-toggle="tooltip" data-placement="top" title="Copy link"></i>
+
+  </span>
+</div>
--- a/_includes/related-posts.html
+++ b/_includes/related-posts.html
@@ -1,6 +1,8 @@
 <!--
 The related posts of current post.
 Placed in the bottom of every single post.
+ v2.0
+ https://github.com/cotes2020/jekyll-theme-chirpy
 © 2019 Cotes Chung
 Published under the MIT License
 -->
@@ -40,21 +42,21 @@
 {% if score_list.size > 0 %}
  {% assign score_list = score_list | sort | reverse %}
  {% assign count = 0 %}
-  <div id="related-posts" class="mt-4 mb-4 pb-3">
-    <h3 class="pt-2 mt-1 mb-4" data-toc-skip>Related Posts</h3>
+  <div id="related-posts" class="mt-4 mb-2 mb-sm-4 pb-2">
+    <h3 class="pt-2 mt-1 mb-4 ml-1" data-toc-skip>{{ site.data.label.post.relate_posts }}</h3>
    <div class="card-deck mb-4">
    {% for score_item in score_list %}
      {% assign data = score_item | split: ":" %}
      {% assign index = data[1] | plus: 0 %}
      {% assign post = site.posts[index] %}
      <div class="card">
-        <a href="{{ post.url }}">
+        <a href="{{ post.url | relative_url }}">
          <div class="card-body">
            <span class="timeago small">
-                {{ post.date | date: POST_DATE }}
+                {{ post.date | date: site.data.date_format.post }}
                <i class="unloaded">{{ post.date | date_to_xmlschema }}</i>
            </span>
-            <h3 class="pt-0 mt-2 mb-3" data-toc-skip>{{ post.title }}</h3>
+            <h3 class="pt-0 mt-1 mb-3" data-toc-skip>{{ post.title }}</h3>
            <div class="text-muted small">
              <p>{{ post.content | markdownify | strip_html | truncate: 200 | replace: '&', '&amp;' }}</p>
            </div>
--- a/_includes/search-loader.html
+++ b/_includes/search-loader.html
@@ -1,5 +1,7 @@
 <!--
  Jekyll Simple Search loader
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
@@ -22,8 +24,8 @@
 SimpleJekyllSearch({
  searchInput: document.getElementById('search-input'),
  resultsContainer: document.getElementById('search-results'),
-  json: '{{ site.baseurl }}/search.json',
-  searchResultTemplate: '{{ result_elem }}',
+  json: '{{ site.baseurl }}/assets/data/search.json',
+  searchResultTemplate: '{{ result_elem | strip_newlines }}',
  noResultsText: '{{ not_found }}'
 });
 </script>
--- a/_includes/search-results.html
+++ b/_includes/search-results.html
@@ -1,5 +1,7 @@
 <!--
  The Search results
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
--- a/_includes/sidebar.html
+++ b/_includes/sidebar.html
@@ -1,5 +1,7 @@
 <!--
  The Side Bar
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
@@ -8,11 +10,12 @@
  <div id="profile-wrapper" class="d-flex flex-column">
    <div id="avatar" class="d-flex justify-content-center">
      <a href="{{ site.baseurl }}/" alt="avatar">
-        {% assign avatar = site.avatar %}
-        {% if avatar | slice: 0 == '/' %}
-          {% assign avatar = avatar | prepend: site.baseurl %}
+        {% assign avatar_url = site.avatar %}
+        {% capture start %}{{ site.avatar | slice: 0 }}{% endcapture %}
+        {% if start == '/' %}
+          {% assign avatar_url = avatar_url | prepend: site.baseurl %}
        {% endif %}
-        <img src="{{ avatar }}">
+        <img src="{{ avatar_url }}" alt="avatar">
      </a>
    </div>

@@ -20,14 +23,14 @@
      <div id="site-title">
        <a href="{{ site.baseurl }}/">{{- site.title -}}</a>
      </div>
-      <div id="site-subtitle" class="font-italic">{{ site.description }}</div>
+      <div id="site-subtitle" class="font-italic">{{- site.tagline -}}</div>
    </div>
  </div>

  <ul class="nav flex-column">
  {% assign page_urls = page.url | split: "/" %}

-  {% for item in site.data.label.tabs %}
+  {% for item in site.data.tabs %}
    {% assign ref = site.baseurl | append: "/" %}

    {% if item.path %}
@@ -38,10 +41,11 @@
    {% endif %}

    <li class="nav-item d-flex justify-content-center
-      {% if item.url == page_urls.last or
-        item.name == "Home" and page.layout == "home" %}active{% endif %}">
+      {% if item.url == page_urls.last
+        or item.name == page.tab_active
+        or item.name == "Home" and page.layout == "home" %}active{% endif %}">
      <a href="{{ ref }}" class="nav-link d-flex justify-content-center align-items-center w-100">
-        <i class="fa-fw {{ item.icon }} ml-3 mr-4 unloaded"></i>
+        <i class="fa-fw {{ item.icon }} ml-3 mr-3 unloaded"></i>
        <span>{{ item.name | upcase }}</span>
      </a>
    </li> <!-- .nav-item -->
@@ -51,7 +55,15 @@

 </div><!-- #nav-wrapper -->

-<div class="contact d-flex justify-content-around mt-4">
+<div class="sidebar-bottom d-flex flex-wrap justify-content-around mt-4">
+
+  {% if site.theme_mode == "dual" %}
+  <span id="mode-toggle-wrapper">
+    {% include mode-toggle.html %}
+  </span>
+  <span class="icon-border"></span>
+  {% endif %}
+
  <a href="https://github.com/{{ site.github.username }}" target="_blank">
    <i class="fab fa-github-alt"></i>
  </a>
@@ -65,4 +77,5 @@
  <a href="{{ site.baseurl }}/feed.xml" target="_blank">
    <i class="fas fa-rss"></i>
  </a>
+
 </div>
--- a/_includes/topbar.html
+++ b/_includes/topbar.html
@@ -1,9 +1,11 @@
 <!--
  The Top Bar
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2017-2019 Cotes Chung
  MIT License
 -->
-<div id="topbar-wrapper" class="row justify-content-center bg-white topbar-down">
+<div id="topbar-wrapper" class="row justify-content-center topbar-down">
  <div id="topbar" class="col-11 d-flex h-100 align-items-center justify-content-between">
    <span id="breadcrumb">
      {% for item in page.breadcrumb %}
@@ -42,7 +44,7 @@
      <input class="form-control" id="search-input" type="search" placeholder="{{ site.data.label.search_hint }}...">
      <i class="fa fa-times-circle fa-fw" id="search-cleaner"></i>
    </span>
-    <a href="javascript:;">Cancel</a>
+    <span id="search-cancel" >Cancel</span>
  </div>

 </div>
--- a/_includes/trending-tags.html
+++ b/_includes/trending-tags.html
@@ -1,6 +1,7 @@
 <!--
  The trending tags list
-
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT Licensed
 -->
--- a/_layouts/category.html
+++ b/_layouts/category.html
@@ -1,12 +1,11 @@
 ---
 layout: page
 # The Category layout
-# © 2017-2019 Cotes Chung
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # MIT Licensed
 ---

-{% include date-format.html %}
-
 <div id="page-category">
  <h1 class="pl-lg-2">
    <i class="far fa-folder-open fa-fw text-muted"></i>
@@ -19,7 +18,7 @@ layout: page
    <li class="d-flex justify-content-between pl-md-3 pr-md-3">
      <a href="{{ post.url | absolute_url }}">{{ post.title }}</a>
      <span class="dash flex-grow-1"></span>
-      <span class="text-muted small">{{ post.date | date: POST_DATE }}</span>
+      <span class="text-muted small">{{ post.date | date: site.data.date_format.post }}</span>
    </li>
    {% endfor %}
  </ul>
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -1,12 +1,21 @@
 ---
 layout: compress
 # Default layout
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT Licensed
 ---

 <!DOCTYPE html>
-<html lang="en">
+
+{% capture prefer_mode %}
+  {% if site.theme_mode != "dual" %}
+    mode="{{ site.theme_mode }}"
+  {% endif %}
+{% endcapture %}
+
+<html lang="en" {{ prefer_mode }} >

  {% include head.html %}

@@ -14,7 +23,7 @@ layout: compress
    <div id="sidebar" class="d-flex flex-column">
      {% include sidebar.html %}
    </div>
-    <div id="main-wrapper" class="bg-white">
+    <div id="main-wrapper">
      {% include topbar.html %}
      <div id="main">

--- a/_layouts/home.html
+++ b/_layouts/home.html
@@ -1,12 +1,12 @@
 ---
 layout: page
 # The Home page layout
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT Licensed
 ---

-{% include date-format.html %}
-
 <div id="post-list">
  {% for post in paginator.posts %}
  <div class="post-preview">
@@ -22,12 +22,13 @@ layout: page
    <div class="post-meta text-muted pt-1">
      <!-- posted date -->
      <i class="far fa-clock fa-fw"></i>
-      <span class="timeago" data-toggle="tooltip" title="{{ post.date | date: TOOLTIP_DATE }}">
-      {{ post.date | date: POST_DATE }}
+      <span class="timeago" data-toggle="tooltip" data-placement="bottom"
+        title="{{ post.date | date: site.data.date_format.tooltip }}">
+      {{ post.date | date: site.data.date_format.post }}
      <i class="unloaded">{{ post.date | date_to_xmlschema }}</i>
      </span>
      <!-- page views -->
-      {% if site.google_analytics.pv %}
+      {% if site.google_analytics.pv.enabled %}
      <i class="far fa-eye fa-fw"></i>
      <span id="pv_{{-post.title-}}" class="pageviews">
        <i class="fas fa-spinner fa-spin fa-fw"></i>
@@ -39,83 +40,5 @@ layout: page
 </div> <!-- #post-list -->

 {% if paginator.total_pages > 0 %}
-<ul class="pagination mt-4 mb-0 pl-lg-2">
-  <!-- left arrow -->
-  {% if paginator.previous_page %}
-  <li class="page-item">
-    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.previous_page_path }}">
-      <i class="fas fa-angle-left"></i>
-    </a>
-  </li>
-  {% else %}
-  <li class="page-item disabled">
-    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-left"></i></a>
-  </li>
-  {% endif %}
-  <!-- endof left arrow -->
-
-  <!-- page numbers -->
-  {% assign left_ellipsis = false %}
-  {% assign right_ellipsis = false %}
-
-  {% for i in (1..paginator.total_pages) %}
-
-    {% assign pre = paginator.page | minus: 1 %}
-    {% assign next = paginator.page | plus: 1 %}
-    {% assign pre_less = pre | minus: 1 %}
-    {% assign next_more = next | plus: 1 %}
-    {% assign show = false %}
-
-    {% if paginator.page == 1 %}
-      {% if i <= 3 or i == paginator.total_pages %}
-        {% assign show = true %}
-      {% endif %}
-    {% elsif paginator.page == paginator.total_pages %}
-      {% if i == 1 or i >= pre_less %}
-        {% assign show = true %}
-      {% endif %}
-    {% else %}
-      {% if i == 1 or i == paginator.total_pages%}
-        {% assign show = true %}
-      {% elsif i >= pre and i <= next %}
-        {% assign show = true %}
-      {% endif %}
-    {% endif %}
-
-    {% if show %}
-        <!-- show number -->
-        <li class="page-item {% if i == paginator.page %} active{% endif %}">
-          <a class="page-link btn-box-shadow" href="{{ site.baseurl }}/{% if i > 1%}page{{ i }}/{% endif %}">{{ i }}</a>
-        </li>
-      {% else %}
-        <!-- hide number -->
-        {% if i < pre and left_ellipsis == false %}
-          <li class="page-item disabled">
-            <span class="page-link btn-box-shadow">...</span>
-          </li>
-          {% assign left_ellipsis = true %}
-        {% elsif i > next and right_ellipsis == false %}
-          <li class="page-item disabled">
-            <span class="page-link btn-box-shadow">...</span>
-          </li>
-          {% assign right_ellipsis = true %}
-        {% endif %}
-      {% endif %}
-
-  {% endfor %}
-
-  <!-- right arrow -->
-  {% if paginator.next_page %}
-  <li class="page-item">
-    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.next_page_path }}">
-      <i class="fas fa-angle-right"></i>
-    </a>
-  </li>
-  {% else %}
-  <li class="page-item disabled">
-    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-right"></i></a>
-  </li>
-  {% endif %}
-
-</ul> <!-- .pagination -->
+  {% include post-paginator.html %}
 {% endif %}
--- a/_layouts/page.html
+++ b/_layouts/page.html
@@ -1,13 +1,15 @@
 ---
 layout: default
 # The page layout
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---

-<div class="row bg-white">
+<div class="row">
  <div class="col-12 col-lg-11 col-xl-8">
-    <div id="page" class="post pb-5 pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4 pl-xl-3">
+    <div id="page" class="post pb-5 pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4 pl-xl-3 mb-md-4">
    {% if page.dynamic_title %}
      <h1 class="dynamic-title">{{ page.title }}</h1>
      <div class="post-content">
@@ -16,11 +18,21 @@ layout: default
    {% else %}
      {{ content }}
    {% endif %}
-
    </div> <!-- #page -->
-
  </div><!-- .col-12 -->

  {% include panel.html %}

 </div>
+
+{% if site.disqus.comments and page.comments %}
+<div class="row">
+  <div class="col-12 col-lg-11 col-xl-8">
+    <div class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4">
+
+    {% include disqus.html %}
+
+    </div> <!-- .pl-1 pr-1 -->
+  </div> <!-- .col-12 -->
+</div> <!-- .row -->
+{% endif %}
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -1,21 +1,26 @@
 ---
 layout: default
 # The posts' layout
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT Licensed
 ---

 <div class="row">
-  {% include date-format.html %}

  <div id="post-wrapper" class="col-12 col-lg-11 col-xl-8">
+
    <div class="post pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4">
+
      <h1 data-toc-skip>{{ page.title }}</h1>
+
      <div class="post-meta text-muted d-flex flex-column">
        <!-- Published Date and Categoreis -->
        <div>
-          <span class="timeago" data-toggle="tooltip" title="{{ page.date | date: TOOLTIP_DATE }}">
-            {{ page.date | date: POST_DATE }}
+          <span class="timeago" data-toggle="tooltip" data-placement="bottom"
+           title="{{ page.date | date: site.data.date_format.tooltip }}">
+            {{ page.date | date: site.data.date_format.post }}
            <i class="unloaded">{{ page.date | date_to_xmlschema }}</i>
          </span>
          {% if page.categories.size > 0 %}on{% endif %}
@@ -25,19 +30,8 @@ layout: default
          {% endfor %}
        </div>

-        <!-- lastmod -->
-        {% if page.seo.date_modified > page.date %}
-        <div>
-          Updated
-          <span class="timeago lastmod" data-toggle="tooltip" title="{{ page.seo.date_modified | date: TOOLTIP_DATE }}">
-            {{ page.seo.date_modified | date: POST_DATE }}
-            <i class="unloaded">{{ page.seo.date_modified | date_to_xmlschema}}</i>
-          </span>
-        </div>
-        {% endif %}
-
        <!-- page views -->
-        {% if site.google_analytics.pv %}
+        {% if site.google_analytics.pv.enabled %}
        <div>
          <span id="pv" class="pageviews"><i class="fas fa-spinner fa-spin fa-fw"></i></span> views
        </div>
@@ -51,16 +45,34 @@ layout: default
        {% endif %}
        <!-- Add lozad class into image tags. see: <https://github.com/ApoorvSaxena/lozad.js#usage> -->
        {% if content contains '<img src=' %}
-          {{ content | replace: '<img src=', '<img class="lozad" src="/assets/img/commons/loading.png" data-src=' }}
+          {% capture loading %}
+           {{ "/assets/img/commons/loading.png" | relative_url }}
+          {% endcapture %}
+          {% assign replacement = '<img class="lozad" src=' | append: loading | append: ' data-src=' %}
+          {{ content | replace: '<img src=', replacement }}
        {% else %}
          {{ content }}
        {% endif %}
      </div>

-      <div class="post-tail text-muted">
+      <div class="post-tail-wrapper text-muted">
+
+        <!-- lastmod -->
+        {% if page.seo.date_modified > page.date %}
+        <div>
+          Updated
+          <span class="timeago lastmod"
+            data-toggle="tooltip" data-placement="top"
+             title="{{ page.seo.date_modified | date: site.data.date_format.tooltip }}">
+            {{ page.seo.date_modified | date: site.data.date_format.post }}
+            <i class="unloaded">{{ page.seo.date_modified | date_to_xmlschema}}</i>
+          </span>
+        </div>
+        {% endif %}
+
        <!-- Tags -->
        {% if page.tags.size > 0 %}
-        <div class="mb-4">
+        <div class="pt-3">
          {% for tag in page.tags %}
          <a href="{{ site.baseurl }}/tags/{{ tag | replace: ' ', '-' | downcase | url_encode }}/"
            class="post-tag no-text-decoration" >
@@ -69,9 +81,32 @@ layout: default
          {% endfor %}
          </div>
        {% endif %}
+
+        <div class="post-tail-bottom
+          d-flex justify-content-between align-items-center pt-5 pb-2">
+
+          {% if site.data.right.license %}
+          <div class="license-wrapper">
+            <span class="license-text ml-1 mr-1">
+              {{ site.data.right.license.prompt }}
+              <a href="{{ site.data.right.license.link }}">
+                {{ site.data.right.license.name }}
+                {% for icon in site.data.right.license.icons %}
+                <i class="{{ icon }}"></i>
+                {% endfor %}
+              </a>
+            </span>
+          </div>
+          {% endif %}
+
+          {% include post-sharing.html %}
+
+        </div><!-- .post-tail-bottom -->
+
      </div><!-- div.post-tail -->

    </div> <!-- .post -->
+
  </div> <!-- #post-wrapper -->

  {% include panel.html %}
@@ -82,32 +117,15 @@ layout: default
  <div id="post-extend-wrapper" class="col-12 col-lg-11 col-xl-8">

    <div class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4">
+
+      {% include post-nav.html %}
+
+      {% if site.disqus.comments and page.comments %}
+        {% include disqus.html %}
+      {% endif %}
+
      {% include related-posts.html %}

-      <div class="post-pager d-flex justify-content-between">
-      {% if page.previous.url %}
-        <a href="{{ site.baseurl }}{{page.previous.url}}" class="btn btn-outline-primary">
-      {% else %}
-        <a href="javascript:;" class="btn btn-outline-primary disabled">
-      {% endif %}
-          <i class="fas fa-angle-left mr-1"></i>
-          OLDER POST
-        </a>
-
-      {% if page.next.url %}
-        <a href="{{ site.baseurl }}{{page.next.url}}" class="btn btn-outline-primary">
-      {% else %}
-        <a href="javascript:;" class="btn btn-outline-primary disabled">
-      {% endif %}
-        NEWER POST
-        <i class="fas fa-angle-right ml-1"></i>
-        </a>
-      </div> <!-- div.post-pager -->
-
-    {% if site.disqus.comments and page.comments %}
-      {% include disqus.html %}
-    {% endif %}
-
    </div> <!-- .pl-1 pr-1 -->

  </div> <!-- #post-extend-wrapper -->
--- a/_layouts/tag.html
+++ b/_layouts/tag.html
@@ -1,12 +1,12 @@
 ---
 layout: page
 # The layout for Tag page
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT Licensed
 ---

-{% include date-format.html %}
-
 <div id="page-tag">
  <h1 class="pl-lg-2">
    <i class="fa fa-tag fa-fw text-muted"></i>
@@ -18,7 +18,7 @@ layout: page
    <li class="d-flex justify-content-between pl-md-3 pr-md-3">
      <a href="{{ post.url | absolute_url }}">{{ post.title }}</a>
      <span class="dash flex-grow-1"></span>
-      <span class="text-muted small">{{ post.date | date: POST_DATE }}</span>
+      <span class="text-muted small">{{ post.date | date: site.data.date_format.post }}</span>
    </li>
    {% endfor %}
  </ul>
--- a/_posts/2019-08-08-text-and-typography.md
+++ b/_posts/2019-08-08-text-and-typography.md
@@ -58,7 +58,7 @@ Click the hook will locate the footnote[^footnote].

 ## Image

-![Desktop View](/assets/img/sample/mockup.png)
+![Desktop View]({{ "/assets/img/sample/mockup.png" | relative_url }})


 ## Inline code
--- a/_posts/2019-08-08-write-a-new-post.md
+++ b/_posts/2019-08-08-write-a-new-post.md
@@ -7,7 +7,7 @@ tags: [writing]

 ## Naming and Path

-Create a new file name with the format `YYYY-MM-DD-title.md` then put it into `_post` of the root directory.
+Create a new file named with the format `YYYY-MM-DD-title.md` then put it into `_post` of the root directory.

 ## Front Matter

@@ -18,19 +18,70 @@ Basically, you need to fill the [Front Matter](https://jekyllrb.com/docs/front-m
 title: TITLE
 date: YYYY-MM-DD HH:MM:SS +/-TTTT
 categories: [TOP_CATEGORIE, SUB_CATEGORIE]
-tags: [TAG]
+tags: [TAG]     # TAG names should always be lowercase
 ---
 ```

 > **Note**: The posts' ***layout*** has been set to `post` by default, so there is no need to add the variable ***layout*** in Front Matter block.

- **The TimeZone of Date**
+- **Timezone of date**

-    To ensure that the posts' release date matches the city you live in, please modify the value of `timezone` in the file `_config.yml`. A list of all available values can be found on [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) or [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
+    In order to accurately record the release date of a post, you should not only setup the `timezone` of `_config.yml` but also provide the the post's timezone in field `date` of its Front Matter block. Format: `+/-TTTT`, e.g. `+0800`.

 - **Categories and Tags**

-    The `categories` of each post is designed to contain up to two elements, and the number of elements in `tag` can be zero or infinite.
+    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. The number of such *category*/*tag* type pages is equal to the number of `categories`/`tags` for all posts, they must match perfectly. 
+
+    let's say there is a post with front matter:
+```yaml
+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:
+```terminal
+jekyll-theme-chirpy
+├── categories
+│   ├── animal.html
+│   └── tutorial.html
+└── tags
+    └── bee.html
+```
+    
+    and the content of a *category* type page is
+```yaml
+---
+layout: category
+title: CATEGORY_NAME        # e.g. Insect
+category: CATEGORY_NAME     # e.g. Insect
+---
+```
+
+    the content of a *tag* type page is
+```yaml
+---
+layout: tag
+title: TAG_NAME             # e.g. bee
+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, it will complain to you '404'). The good news is that we got a lovely script tool `_scripts/py/pages_generator.py` to finish the boring task. Basically we will use it via `tools/init.sh` instead of running it separately. Check out its use case [here]({{ "/posts/getting-started/#option-1-built-by-github-pages" | relative_url }}).
+
+- **Last modified date**
+    
+    The last modified date of the posts is recorded as `seo.date_modified`, for example:
+```yaml
+---
+seo:
+    date_modified: 2020-01-04 17:05:41 +0800
+---
+```
+
+    This date is equal to the lastest git-commit date of the post file and can be automatically generated by the tool script `_scripts/py/update_posts_lastmod.py`. Similar to the other script `pages_generator.py` mentioned above, it is also be called from `tools/init.sh`, so it doesn't have to be used separately.
+    

 ## Table of Contents

--- a/_posts/2019-08-09-getting-started.md
+++ b/_posts/2019-08-09-getting-started.md
@@ -7,14 +7,26 @@ tags: [getting started]

 ## Preparation

-Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installtion of basic environment (Ruby, RubyGem, Bundler and Jekyll). In addition, to use the funny script tools, we also need to install [Python](https://www.python.org/downloads/)(version 3.5 or abover) and [ruamel.yaml](https://pypi.org/project/ruamel.yaml/).
+Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installtion of basic environment (Ruby, RubyGem, Bundler and Jekyll). In order to use the script tools to save time, we also need to install [Python](https://www.python.org/downloads/)(version 3.5 or abover) and [ruamel.yaml](https://pypi.org/project/ruamel.yaml/).

-Next, [fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) **Chirpy** and then clone your replicated repository locally.
+In addition, if your machine is running Debian or macOS, make sure you have the [GNU coreutils](https://www.gnu.org/software/coreutils/) installed. Otherwise, get it by:
+
+* Debian
+
+```console
+$ sudo apt-get install coreutils
+```
+
+* macOS
+
+```console
+$ brew install coreutils
+```


 ## Install Jekyll Plugins

-Go to root directory of the repository and run the following:
+Go to the root of repo and run:

 ```terminal
 $ bundle install
@@ -34,8 +46,8 @@ jekyll-theme-chirpy/
 ├── _layouts
 ├── _posts          # posts stay here
 ├── _scripts
-│   └── travis      # CI stuff, remove it
-├── .travis.yml     # remove it, too
+├── .travis.yml     # remove it
+├── .github         # remove this, too
 ├── assets      
 ├── tabs
 │   └── about.md    # the ABOUT page
@@ -45,32 +57,45 @@ jekyll-theme-chirpy/
 ├── LICENSE
 ├── README.md
 ├── _config.yml     # configuration file
-├── build.sh        # script tool
-├── run.sh          # script tool
-├── init.sh         # script tool
-├── pv.sh           
+├── tools           # script tools
 ├── feed.xml
 ├── index.html
 ├── robots.txt
-├── search.json
 └── sitemap.xml
 ```


+As mentioned above, some files or directories should be removed from your repo:
+
+- .travis.yml
+- .github
+
+
 ## Configuration

-Customize the variables in file `_config.yml` as needed.
+Basically, go to `_config.yml` and customize the variables as needed, some of them are typical options:
+
+* `url`
+    
+    Set to your website url and there should be no slash symbol at the tail. Format: `<protocol>://<domain>`.


-## Atom Feed
+* `avatar`
+    
+    It defines the image file location of avatar. The sample image is `/assets/img/sample/avatar.jpg`, and should be replaced by your own one(a square image). Notice that a huge image file will increase the load time of your site, so keep your avatar image size as samll as possible(may be *<https://tinypng.com/>* will help).

-The Atom feed url of your site will be:
+* `timezone`

-```
-<SITE_URL>/feed.xml
-```
+    To ensure that the posts' release date matches the city you live in, please modify the field `timezone` correctly. A list of all available values can be found on [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) or [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).

-The `SITE_URL` was defined by variable `url` in file `_config.yml`.
+* `theme_mode`
+  
+    There are three options for the theme color scheme:
+    
+    - **dual**  - The default color scheme will follow the system settings, but if the system does not support dark mode, or the browser does not support `Media Queries Level 5`, the theme will be displayed as `light` mode by default. Anyway, the bottom left corner of the Sidebar will provide a button for users to switch color schemes.
+
+    - **dark**  - Always show dark mode.
+    - **light** - Always show light mode.


 ##  Run Locally
@@ -78,54 +103,90 @@ The `SITE_URL` was defined by variable `url` in file `_config.yml`.
 You may want to preview the site before publishing, so just run the script tool:

 ```terminal
-$ bash run.sh
+$ bash tools/run.sh
 ```

->**Note**: The *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command.
-
 Open a brower and visit <http://localhost:4000>.

 Few days later, you may find that the file changes does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine.

 ##  Deploying to GitHub Pages

-Before the deployment begins, ensure the `url` in `_config.yml` has been set to `https://<username>.github.io`.
+Before the deployment begins, ensure the `url` in file `_config.yml` has been set to `https://<username>.github.io`(or the custom domain, if you have. e.g. `https://yourdomain.com`). What's more, if you prefer to the [Project site](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites), change `baseurl` of file `_config.yml` to your project name, starting with a slash. e.g. `/project`.
+

 ### Option 1: Built by GitHub Pages

-By deploying your site in this way, you can push the source code to GitHub repository directly.
+By deploying the site in this way, you're allowed to push the source code directly to the remote.

-> **Note**: If you want to add any third-party Jekyll plugins or custom scripts to your project, please refer to [*Option 2: Build locally*](#option-2-build-locally).
+> **Note**: If you want to use any third-party Jekyll plugins that not in [this list](https://pages.github.com/versions/), stop reading the current approach and go to [*Option 2: Build locally*](#option-2-build-locally).

-**1**. Rename your repository as `<username>.github.io`.
+**1**. Rename the repository to:

-**2**. Commit the changes of your repository, then run the initialization script:
+|Site Type | Repo's Name|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| any one except `<username>.github.io`, let's say `project`|
+
+**2**. Commit the changes of the repo first, then run the initialization script:

 ```console
-$ bash init.sh
+$ bash tools/init.sh
 ```

-It will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts.
+> Please note that the *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command.

-**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repository `<username>.github.io`.
+it will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit. Its output is similar to the following log:

-**4**. Visit `https://<username>.github.io` and enjoy.
+```terminal
+[INFO] Success to update lastmod for 4 post(s).
+[INFO] Succeed! 3 category-pages created.
+[INFO] Succeed! 4 tag-pages created.
+[Automation] Updated the Categories, Tags, Lastmod for post(s).
+ 11 files changed, 46 insertions(+), 3 deletions(-)
+ ...
+Updated the Categories, Tags, Lastmod for post(s).
+```
+
+
+**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repo.
+
+**4**. Check it out:
+
+|Site Type | Site URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|


 ### Option 2: Build Locally

-For security reasons, GitHub Pages runs on `safe` mode, which means the third-party Jekyll plugins or custom scripts will not work. If you want to use any another third-party Jekyll plugins, **your have to build locally rather than on GitHub Pages**.
+For security reasons, GitHub Pages runs on `safe` mode, which means the third-party Jekyll plugins or custom scripts won't work. If you want to use any another plugins that not in the [whitelist](https://pages.github.com/versions/), **you have to generate the site locally rather than on GitHub Pages**.

-**1**. On GitHub website, create a brand new repository with name `<username>.github.io` and then clone it locally.
+**1**. Browse to GitHub website, create a brand new repo named: 

-**2**. Build your site by:
+|Site Type | Repo's Name|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| any one except `<username>.github.io`, let's say `project`|
+
+and clone it.
+
+**2**. In the root of the source project, build your site by:

 ```console
-$ bash build.sh -d /path/to/<username>.github.io/
+$ bash tools/build.sh -d /path/to/local/project/
 ```

-The build results will be stored in the root directory of `<username>.github.io` and don't forget to push the changes of `<username>.github.io` to branch `master` on GitHub.
+The generated static files will be placed in the root of `/path/to/local/project`. Commit and push the changes to the `master` branch on GitHub.

-**3**. Go to GitHub website and enable GitHub Pages service for the new repository `<username>.github.io`.
+**3**. Go to GitHub website and enable Pages service for the new repository.

-**4**. Visit `https://<username>.github.io` and enjoy.
+**4**. Visit at:
+
+|Site Type | Site URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|
+
+and enjoy!
--- a/_posts/2019-08-11-customize-the-favicon.md
+++ b/_posts/2019-08-11-customize-the-favicon.md
@@ -10,11 +10,11 @@ In [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/), the image fi

 Whit 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)
+![upload-image]({{ "/assets/img/sample/upload-image.png" | relative_url }})

 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)
+![download-icons]({{ "/assets/img/sample/download-icons.png" | relative_url }})

 Download the generated package, unzip and delete the following two from the extracted files:

@@ -23,4 +23,4 @@ Download the generated package, unzip and delete the following two from the extr
 
 Now, copy the rest image files (`.PNG` and `.ICO`) to cover the original one in folder `assets/img/favicons/`.

-At last, don't forget to rebuild your site so that the icon becomes your custom edition.
+Lastly, don't forget to rebuild your site so that the icon becomes your custom edition.
--- a/_scripts/py/init_all.py
+++ b/_scripts/py/init_all.py
@@ -3,6 +3,8 @@

 """
 Automatic invokes all initial scripts for project.
+v2.0
+https://github.com/cotes2020/jekyll-theme-chirpy
 © 2018-2019 Cotes Chung
 Licensed under MIT
 """
--- a/_scripts/py/pages_generator.py
+++ b/_scripts/py/pages_generator.py
@@ -8,19 +8,21 @@ Dependencies:
  - git
  - ruamel.yaml

+v2.0
+https://github.com/cotes2020/jekyll-theme-chirpy
 © 2018-2019 Cotes Chung
 MIT License
 '''


 import os
-import glob
 import shutil
 import sys
 import subprocess

 from ruamel.yaml import YAML
 from utils.common import get_yaml
+from utils.common import get_makrdown_files
 from utils.common import check_py_version


@@ -62,7 +64,10 @@ def get_categories():

    for dir in POSTS_DIR:
        path = get_path(dir)
-        for file in glob.glob(os.path.join(path, '*.md')):
+        posts = get_makrdown_files(path)
+
+        for file in posts:
+
            meta = yaml.load(get_yaml(file)[0])

            if 'category' in meta:
@@ -96,6 +101,10 @@ def get_categories():

 def generate_category_pages(is_verbose):
    categories = get_categories()
+
+    if len(categories) <= 0:
+        return
+
    path = get_path(CATEGORIES_DIR)

    if os.path.exists(path):
@@ -127,7 +136,9 @@ def get_all_tags():

    for dir in POSTS_DIR:
        path = get_path(dir)
-        for file in glob.glob(os.path.join(path, '*.md')):
+        posts = get_makrdown_files(path)
+
+        for file in posts:
            meta = yaml.load(get_yaml(file)[0])

            if 'tags' in meta:
@@ -143,6 +154,10 @@ def get_all_tags():

 def generate_tag_pages(is_verbose):
    all_tags = get_all_tags()
+
+    if len(all_tags) <= 0:
+        return
+
    tag_path = get_path(TAG_DIR)

    if os.path.exists(tag_path):
--- a/_scripts/py/requirements.txt
+++ b/_scripts/py/requirements.txt
@@ -0,0 +1,2 @@
+ruamel.yaml==0.16.5
+ruamel.yaml.clib==0.1.2
--- a/_scripts/py/update_posts_lastmod.py
+++ b/_scripts/py/update_posts_lastmod.py
@@ -9,12 +9,13 @@ Dependencies:
  - git
  - ruamel.yaml

+v2.0
+https://github.com/cotes2020/jekyll-theme-chirpy
 © 2018-2019 Cotes Chung
 Licensed under MIT
 """

 import sys
-import glob
 import os
 import getopt
 import subprocess
@@ -26,6 +27,7 @@ from enum import Enum
 from ruamel.yaml import YAML

 from utils.common import get_yaml
+from utils.common import get_makrdown_files
 from utils.common import check_py_version


@@ -46,11 +48,11 @@ def help():
          "'git' for git-log, 'fs' for filesystem, default to 'git'.\n")


-def update_lastmod(path, verbose, date):
+def update_lastmod(posts, verbose, date):
    count = 0
    yaml = YAML()

-    for post in glob.glob(path):
+    for post in posts:

        lastmod = ''

@@ -125,7 +127,8 @@ def update_lastmod(path, verbose, date):
 def main(argv):
    check_py_version()

-    path = os.path.join(POSTS_PATH, "*.md")
+    specific = False
+    posts = []
    verbose = False
    date = Date.GIT

@@ -143,10 +146,12 @@ def main(argv):
            sys.exit()

        elif opt == '-f' or opt == '--file':
-            path = arg
+            posts.append(arg)
+            specific = True

        elif opt == '-d' or opt == '--dir':
-            path = os.path.join(arg, "*.md")
+            posts = get_makrdown_files(arg)
+            specific = True

        elif opt == '-v' or opt == '--verbose':
            verbose = True
@@ -160,7 +165,10 @@ def main(argv):
                help()
                sys.exit(2)

-    update_lastmod(path, verbose, date)
+    if not specific:
+        posts = get_makrdown_files(POSTS_PATH)
+
+    update_lastmod(posts, verbose, date)


 main(sys.argv[1:])
--- a/_scripts/py/utils/common.py
+++ b/_scripts/py/utils/common.py
@@ -4,11 +4,15 @@
 '''
 Common functions to other scripts.

+v2.0
+https://github.com/cotes2020/jekyll-theme-chirpy
 © 2018-2019 Cotes Chung
 MIT License
 '''

 import sys
+import os
+import glob


 def get_yaml(path):
@@ -35,6 +39,16 @@ def get_yaml(path):
    return yaml, num


+def get_makrdown_files(path):
+    MD_EXTENSIONS = ["md", "markdown", "markdn", "mdown"]
+    ret_files = []
+
+    for extension in MD_EXTENSIONS:
+        ret_files.extend(glob.glob(os.path.join(path, "*." + extension)))
+
+    return ret_files
+
+
 def check_py_version():
    if not sys.version_info.major == 3 and sys.version_info.minor >= 5:
        print("WARNING: This script requires Python 3.5 or higher, "
--- a/_scripts/sh/sync_monitor.sh
+++ b/_scripts/sh/sync_monitor.sh
@@ -1,7 +1,8 @@
 #!/bin/bash

 # Files sync monitoer
-#
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2019 Cotes Chung
 # MIT Licensed

--- a/_scripts/travis/cibuild.sh
+++ b/_scripts/travis/cibuild.sh
@@ -1,36 +0,0 @@
-#!/bin/bash
-
-# Travis CI build jobs.
-#
-# © 2019 Cotes Chung
-# Published under MIT License
-
-if [[ $TRAVIS_PULL_REQUEST = "false" ]]; then # triggered by author
-
-  BUILDER=../blog-builder
-
-  git clone https://${GH_TOKEN}@github.com/cotes2020/blog-builder.git \
-    $BUILDER --depth=1 -q
-
-  cp -r $BUILDER/framework/* .
-  bash _cibuild.sh
-
-else # triggered by Pull Request
-
-  SAFE_DOMAIN="cdn.jsdelivr.net"
-
-  python _scripts/py/init_all.py
-
-  build_cmd="bundle exec jekyll build"
-
-  echo "\$ $build_cmd"
-  eval $build_cmd
-
-  bundle exec htmlproofer _site/ \
-            --disable-external \
-            --check-html \
-            --empty_alt_ignore \
-            --allow_hash_href \
-            --url_ignore $SAFE_DOMAIN
-
-fi
--- a/assets/css/_addon/fonts.scss
+++ b/assets/css/_addon/fonts.scss
--- a/assets/css/_addon/module.scss
+++ b/assets/css/_addon/module.scss
@@ -0,0 +1,93 @@
+/*
+* Mainly scss modules, only imported to `assets/css/main.scss`
+*
+* v2.1
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2020 Cotes Chung
+* MIT Licensed
+*/
+
+/*---------- scss placeholder ---------*/
+
+%tag-hover {
+  background: var(--tag-hover);
+  transition: background 0.35s ease-in-out;
+}
+
+%table-cell {
+  padding: .35rem .8rem;
+  font-size: 95%;
+}
+
+%link-hover {
+  color: #d2603a!important;
+  border-bottom: 1px solid #d2603a;
+  text-decoration: none;
+}
+
+%link-color {
+  color: var(--link-color);
+}
+
+%link-underline {
+  border-bottom: 1px solid var(--link-underline-color);
+}
+
+%no-bottom-border {
+  border-bottom: none;
+}
+
+%section {
+  #post-wrapper & {
+    line-height: 1.2;
+    margin-bottom: 1rem;
+  }
+}
+
+%anchor {
+  #post-wrapper &,
+  #page & {
+    padding-top: 3.5rem;
+    margin-top: -2.5rem;
+  }
+}
+
+%footer-content {
+  font-weight: 600;
+  color: var(---footer-link);
+}
+
+
+/*---------- scss mixin ---------*/
+
+@mixin no-text-decoration {
+  text-decoration: none;
+}
+
+@mixin sidebar-icon {
+  color: rgba(255, 255, 255, 0.5);
+  transition: color 0.35s ease-in-out;
+  user-select: none;
+  margin: 0 .25rem;
+}
+
+@mixin icon-round($diameter) {
+  border: 1px solid;
+  border-radius: 50%;
+  width: $diameter;
+  height: $diameter;
+}
+
+@mixin ml-mr($value) {
+  margin-left: $value;
+  margin-right: $value;
+}
+
+@mixin pl-pr($val) {
+  padding-left: $val;
+  padding-right: $val;
+}
+
+@mixin input-placeholder {
+  opacity: 0.6;
+}
--- a/assets/css/_addon/variables.scss
+++ b/assets/css/_addon/variables.scss
@@ -0,0 +1,24 @@
+/*
+* Mainly scss variables
+*
+* v2.1
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2020 Cotes Chung
+* MIT Licensed
+*/
+
+/*--- ↓ width and height ----*/
+
+$sidebar-width-small: 210px;
+$sidebar-width-medium: 260px;
+$sidebar-width-large: 350px;
+
+$topbar-height: 3rem;
+
+$footer-height: 5rem;
+
+$main-content-max-width: 1150px;
+
+$panel-max-width: 300px;
+
+$post-extend-min-height: 35rem;
--- a/assets/css/_colors/dark-syntax.scss
+++ b/assets/css/_colors/dark-syntax.scss
@@ -0,0 +1,93 @@
+/*!
+* The syntax dark mode styles.
+* v2.0
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2018-2019 Cotes Chung
+* MIT Licensed
+*/
+
+@mixin dark-syntax {
+  /* 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 .gh { } /* Generic Heading & Diff Header */
+  .highlight .gu { color: #75715e; } /* Generic.Subheading & Diff Unified/Comment? */
+  .highlight .gd { color: #f92672; } /* Generic.Deleted & Diff Deleted */
+  .highlight .gi { color: #a6e22e; } /* Generic.Inserted & Diff Inserted */
+
+
+  /*-----  My styles ------*/
+
+  --code-highlighter-rouge: #272822;
+  --highlight-bg-color: #272822;
+  --highlighter-rouge-color: #de6b18;
+
+  --highlight-lineno-color: #6c6c6d;
+  --highlight-lineno-border-color: #3c4042;
+
+  .highlight {
+    @include highlight-box-shadow(none);
+    .gp { color: #818c96; }
+  }
+  pre { color: #818c96 } /* override Bootstrap */
+  kbd { background-color: black; }
+}
--- a/assets/css/_colors/dark-typography.scss
+++ b/assets/css/_colors/dark-typography.scss
@@ -0,0 +1,130 @@
+/*!
+* The main dark mode styles
+* v2.0
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2018-2019 Cotes Chung
+* MIT Licensed
+*/
+
+@mixin dark-scheme {
+  /* framework */
+  --main-wrapper-bg: rgb(27, 27, 30);
+  --body-bg: var(--main-wrapper-bg);
+  --topbar-wrapper-bg: rgb(39, 40, 43);
+  --search-wrapper-bg: rgb(34, 34, 39);
+  --search-icon-color: rgb(100, 102, 105);
+  --input-focus-border-color: rgb(112, 114, 115);
+  --mask-bg: rgb(68, 69, 70);
+  --footer-bg-color: var(--main-wrapper-bg);
+
+  /* common color */
+  --text-color: rgb(175, 176, 177);
+  --text-muted-color: rgb(107, 116, 124);
+  --link-color: rgb(138, 180, 248);
+  --link-underline-color: rgb(82, 108, 150);
+  --main-border-color: rgb(44, 45, 45);
+  --button-bg: rgb(39, 40, 33);
+  --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-bg: rgb(39, 40, 33);
+  --card-header-bg: rgb(51, 50, 50);
+  --label-relate-post: rgb(164, 175, 181);
+
+  /* Sidebar */
+  --nav-cursor-color: rgb(183, 182, 182);
+  --sidebar-bg: radial-gradient(circle, #242424 0%, #1d1f27 100%);
+
+  /* Top Bar */
+  --topbar-text-color: var(--text-color);
+
+  /* Home page */
+  --post-list-text-color: rgb(175, 176, 177);
+  --btn-patinator-text-color: var(--text-color);
+  --btn-active-bg: rgba(28, 52, 94, 1);
+  --btn-active-border-color: rgb(66, 94, 138);
+  --btn-text-color: var(--text-color);
+  --btn-paginator-border-color: var(--btn-border-color);
+  --btn-paginator-shadow: var(--main-wrapper-bg);
+
+  /* Posts */
+  --toc-highlight: rgb(116, 178, 243);
+  --tag-bg: rgb(41, 40, 40);
+  --tag-hover: rgb(43, 56, 62);
+  --tb-odd-bg: rgba(52, 53, 42, 0.52); /* odd rows of the posts' table */
+  --tb-even-bg: rgb(31, 31, 34); /* even rows of the posts' table */
+  --tb-even-border-color: var(--tb-odd-bg);
+  --tb-even-border-color: var(--tb-odd-bg);
+  --footnote-target-bg: rgb(63, 81, 181);
+  --btn-share-color: #6c757d;
+  --btn-share-hover-color: #bfc1ca;
+  --relate-post-date: var(--text-muted-color);
+  --card-border-color: var(--main-wrapper-bg);
+  --card-box-shadow: var(--main-wrapper-bg);
+
+  /* tags */
+  --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 */
+  --categories-border: rgb(64, 66, 69);
+  --categories-hover-bg: rgb(73, 75, 76);
+
+  /* archives */
+  --timeline-node-bg: rgb(150, 152, 156);
+  --timeline-color: rgb(63, 65, 68);
+  --timeline-year-dot-color: var(--timeline-color);
+
+  /* Footer */
+  ---footer-link: rgb(146, 146, 146);
+
+
+  hr {
+    border-color: var(--main-border-color);
+  }
+
+  /* posts' toc, override BS */
+  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:hover {
+    color: var(--toc-highlight)!important;
+    border-left-color: var(--toc-highlight)!important;
+  }
+
+  /* categories */
+  .categories.card,
+  .list-group-item {
+    background-color: var(--card-bg);
+  }
+
+  .categories {
+    .card-header {
+      background-color: var(--card-header-bg);
+    }
+    .list-group-item {
+      border-left: none;
+      border-right: none;
+      padding-left: 2rem;
+      border-color: var(--categories-border);
+      &:last-child {
+        border-bottom-color: var(--card-bg);
+      }
+    }
+  }
+
+  #archives li:nth-child(odd) {
+    background-image: linear-gradient(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
@@ -0,0 +1,80 @@
+/*!
+* The syntax light mode code snippet colors.
+* v2.1
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2020 Cotes Chung
+* MIT Licensed
+*/
+
+@mixin light-syntax {
+  /* see: <https://raw.githubusercontent.com/jwarby/pygments-css/master/github.css> */
+  .highlight .hll { background-color: #ffffcc }
+  .highlight .c { color: #999988; font-style: italic } /* Comment */
+  .highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+  .highlight .k { color: #000000; font-weight: bold } /* Keyword */
+  .highlight .o { color: #000000; font-weight: bold } /* Operator */
+  .highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+  .highlight .cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
+  .highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+  .highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+  .highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+  .highlight .ge { color: #000000; font-style: italic } /* Generic.Emph */
+  .highlight .gr { color: #aa0000 } /* Generic.Error */
+  .highlight .gh { color: #999999 } /* Generic.Heading */
+  .highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+  .highlight .go { color: #888888 } /* Generic.Output */
+  .highlight .gp { color: #555555 } /* Generic.Prompt */
+  .highlight .gs { font-weight: bold } /* Generic.Strong */
+  .highlight .gu { color: #aaaaaa } /* Generic.Subheading */
+  .highlight .gt { color: #aa0000 } /* Generic.Traceback */
+  .highlight .kc { color: #000000; font-weight: bold } /* Keyword.Constant */
+  .highlight .kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
+  .highlight .kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
+  .highlight .kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
+  .highlight .kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
+  .highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+  .highlight .m { color: #009999 } /* Literal.Number */
+  .highlight .s { color: #d01040 } /* Literal.String */
+  .highlight .na { color: #008080 } /* Name.Attribute */
+  .highlight .nb { color: #0086B3 } /* Name.Builtin */
+  .highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+  .highlight .no { color: #008080 } /* Name.Constant */
+  .highlight .nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
+  .highlight .ni { color: #800080 } /* Name.Entity */
+  .highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+  .highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+  .highlight .nl { color: #990000; font-weight: bold } /* Name.Label */
+  .highlight .nn { color: #555555 } /* Name.Namespace */
+  .highlight .nt { color: #000080 } /* Name.Tag */
+  .highlight .nv { color: #008080 } /* Name.Variable */
+  .highlight .ow { color: #000000; font-weight: bold } /* Operator.Word */
+  .highlight .w { color: #bbbbbb } /* Text.Whitespace */
+  .highlight .mf { color: #009999 } /* Literal.Number.Float */
+  .highlight .mh { color: #009999 } /* Literal.Number.Hex */
+  .highlight .mi { color: #009999 } /* Literal.Number.Integer */
+  .highlight .mo { color: #009999 } /* Literal.Number.Oct */
+  .highlight .sb { color: #d01040 } /* Literal.String.Backtick */
+  .highlight .sc { color: #d01040 } /* Literal.String.Char */
+  .highlight .sd { color: #d01040 } /* Literal.String.Doc */
+  .highlight .s2 { color: #d01040 } /* Literal.String.Double */
+  .highlight .se { color: #d01040 } /* Literal.String.Escape */
+  .highlight .sh { color: #d01040 } /* Literal.String.Heredoc */
+  .highlight .si { color: #d01040 } /* Literal.String.Interpol */
+  .highlight .sx { color: #d01040 } /* Literal.String.Other */
+  .highlight .sr { color: #009926 } /* Literal.String.Regex */
+  .highlight .s1 { color: #d01040 } /* Literal.String.Single */
+  .highlight .ss { color: #990073 } /* Literal.String.Symbol */
+  .highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+  .highlight .vc { color: #008080 } /* Name.Variable.Class */
+  .highlight .vg { color: #008080 } /* Name.Variable.Global */
+  .highlight .vi { color: #008080 } /* Name.Variable.Instance */
+  .highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
+
+  /*--- custom light colors ---*/
+  --code-highlighter-rouge: #e9ecef;
+  --highlight-bg-color: #f7f7f7;
+  --highlighter-rouge-color: #353a3d;
+  --highlight-lineno-color: #c2c6cc;
+  --highlight-lineno-border-color: #e9ecef;
+
+} // light-syntax
--- a/assets/css/_colors/light-typography.scss
+++ b/assets/css/_colors/light-typography.scss
@@ -0,0 +1,124 @@
+/*!
+* The syntax light mode typography colors
+* v2.1
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2020 Cotes Chung
+* MIT Licensed
+*/
+
+@mixin light-scheme {
+
+  --body-bg: #fafafa;
+
+  --mask-bg: #c1c3c5;
+
+  --main-wrapper-bg: white;
+
+  --main-border-color: #f3f3f3;
+
+  --btn-border-color: #e9ecef;
+
+  --text-color: #343a40;
+
+  --blockquote-border-color: #eee;
+
+  --blockquote-text-color: #9a9a9a;
+
+  --link-color: #2a408e;
+
+  --link-underline-color: #dee2e6;
+
+  --text-muted-color: gray;
+
+  --tb-odd-bg: #f8f9fa;
+
+  --tb-even-border-color: rgba(210, 215, 217, 0.75);
+
+  --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%);
+
+  --nav-cursor-color: #fcfcfc;
+
+  /* Topbar */
+
+  --topbar-wrapper-bg: white;
+
+  --topbar-text-color: rgb(78, 78, 78);
+
+  --search-wrapper-bg: #fff;
+
+  --search-wrapper-bg: #f5f5f5;
+
+  --search-tag-bg: #f8f9fa;
+
+  --search-icon-color: #c2c6cc;
+
+  --input-focus-border-color: var(--btn-border-color);
+
+  /* Home */
+
+  --post-list-text-color: dimgray;
+
+  --btn-patinator-text-color: #555555;
+
+  --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-relate-post: #353a3d;
+
+  --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: inherit;
+}
--- a/assets/css/archives.scss
+++ b/assets/css/archives.scss
@@ -2,147 +2,144 @@
 ---
 /*!
  Style for Archives
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 */

-#archives {
-  letter-spacing: 0.03rem;
-}
-
-#archives li {
-  font-size: 1.1rem;
-  line-height: 3rem;
-}
-
-#archives li:nth-child(odd) {
-  background-color: #fff;
-  background-image: linear-gradient(to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff);
-}
-
-#archives li>div {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-#archives span.lead {
-  font-size: 1.5rem;
-  font-family: 'Oswald', sans-serif;
-  position: relative;
-  left: 8px;
-}
-
-#archives span.lead:not(:first-child) {
-  position: relative;
-  left: 4px;
-}
-
-#archives span.lead:not(:first-child)::after {
-  left: 67px;
-}
-
-#archives span.lead::after { /* Year dot */
-  content: "";
-  display: block;
-  position: relative;
-  -webkit-border-radius: 50%;
-  -moz-border-radius: 50%;
-  border-radius: 50%;
-  width: 12px;
-  height: 12px;
-  top: -26px;
-  left: 63px;
-  border: 3px solid;
-  background-color: #ffffff;
-  border-color: #c2c6cc;
-  box-shadow: 0 0 2px 0 #c2c6cc;
-  z-index: 1;
-}
-
-#archives .date {
-  white-space: nowrap;
-  display: inline-block;
-}
-
-#archives .date.month {
-  width: 1.4rem;
-  text-align: center;
-  font-family: 'Oswald', sans-serif;
-}
-
-#archives .date.day {
-  font-size: 85%;
-  font-family: sans-serif;
-  text-align: center;
-  margin-right: -2px;
-  width: 1.2rem;
-  position: relative;
-  left: -.15rem;
-}
-
-#archives ul>li>div>a {
-/* post title in Archvies */
-  margin-left: 2.5rem;
-  position: relative;
-  top: .1rem;
-}
-
-#archives .date.month ~ a::before {
-  /* A dot for Month and Day */
-  content: "";
-  display: inline-block;
-  position: relative;
-  -webkit-border-radius: 50%;
-  -moz-border-radius: 50%;
-  border-radius: 50%;
-  width: 8px;
-  height: 8px;
-  float: left;
-  top: 1.35rem;
-  left: 69px;
-  background-color: #c2c6cc;
-  box-shadow: 0 0 3px 0 #c2c6cc;
-  z-index: 1;
-}
-
-/* timeline for date */
-#archives ul>li::after,
-#archives ul>li:first-child::before {
+%date-timeline {
  content: "";
  width: 4px;
  left: 75px;
  display: inline-block;
  float: left;
  position: relative;
-  background-color: rgba(0, 0, 0, 0.075);
+  background-color: var(--timeline-color);
 }

-#archives ul>li::after {
-  height: 2.8rem;
-  top: -1.3rem;
-}
+#archives {
+  letter-spacing: 0.03rem;
+  li {
+    font-size: 1.1rem;
+    line-height: 3rem;
+    &:nth-child(odd) {
+      background-color: var(--main-wrapper-bg, #fff);
+      background-image: linear-gradient(
+        to left, #fff, #fbfbfb, #fbfbfb, #fbfbfb, #fff);
+    }
+    >div {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }

-#archives ul>li:first-child::before {
-  height: 3.06rem;
-  top: -1.61rem;
-}
+  span.lead {
+    font-size: 1.5rem;
+    font-family: 'Oswald', sans-serif;
+    position: relative;
+    left: 8px;

-#archives ul:not(:last-child)>li:last-child::after {
-  height: 3.4rem;
-}
+    &:not(:first-child) {
+      position: relative;
+      left: 4px;
+      &::after {
+        left: 67px;
+      }
+    }
+
+    &::after {
+      /* Year dot */
+      content: "";
+      display: block;
+      position: relative;
+      -webkit-border-radius: 50%;
+      -moz-border-radius: 50%;
+      border-radius: 50%;
+      width: 12px;
+      height: 12px;
+      top: -26px;
+      left: 63px;
+      border: 3px solid;
+      background-color: var(--timeline-year-dot-color);
+      border-color: var(--timeline-node-bg);
+      box-shadow: 0 0 2px 0 #c2c6cc;
+      z-index: 1;
+    }
+  } // #archives span.lead
+
+  .date {
+    white-space: nowrap;
+    display: inline-block;
+    &.month {
+      width: 1.4rem;
+      text-align: center;
+      font-family: 'Oswald', sans-serif;
+      ~a::before {
+        /* A dot for Month and Day */
+        content: "";
+        display: inline-block;
+        position: relative;
+        -webkit-border-radius: 50%;
+        -moz-border-radius: 50%;
+        border-radius: 50%;
+        width: 8px;
+        height: 8px;
+        float: left;
+        top: 1.35rem;
+        left: 69px;
+        background-color: var(--timeline-node-bg);
+        box-shadow: 0 0 3px 0 #c2c6cc;
+        z-index: 1;
+      }
+    }
+    &.day {
+      font-size: 85%;
+      font-family: sans-serif;
+      text-align: center;
+      margin-right: -2px;
+      width: 1.2rem;
+      position: relative;
+      left: -.15rem;
+    }
+  } // #archives .date
+
+  ul {
+    >li {
+      >div>a {
+        /* post title in Archvies */
+        margin-left: 2.5rem;
+        position: relative;
+        top: .1rem;
+      }
+      &::after {
+        @extend %date-timeline;
+        height: 2.8rem;
+        top: -1.3rem;
+      }
+      &:first-child::before {
+        @extend %date-timeline;
+        height: 3.06rem;
+        top: -1.61rem;
+      }
+    }
+    &:not(:last-child)>li:last-child::after {
+      height: 3.4rem;
+    }
+    &:last-child>li:last-child::after {
+      display: none;
+    }
+  } // #archives ul
+
+} // #archives

-#archives ul:last-child>li:last-child::after {
-  display: none;
-}

@media all and (max-width: 576px) {
-
  #archives {
    margin-top: -1rem;
-  }
-
-  #archives ul {
-    letter-spacing: 0;
+    ul {
+      letter-spacing: 0;
+    }
  }
 }
--- a/assets/css/categories.scss
+++ b/assets/css/categories.scss
@@ -2,39 +2,46 @@
 ---
 /*!
  Style for Tab Categories
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 */

-.categories {
-  margin-bottom: 2rem;
-}
-
-.categories .card-header {
-  padding-right: 12px;
-}
-
-.categories .card-header>span>i:first-child,
-.categories .list-group-item>i {
+%category-icon-color {
  color: gray;
 }

-.categories .list-group-item {
-  border-left: none;
-  border-right: none;
-  padding-left: 2rem;
-}
+.categories {
+  margin-bottom: 2rem;
+  .card-header {
+    padding-right: 12px;
+  }
+  .list-group-item {
+    border-left: none;
+    border-right: none;
+    padding-left: 2rem;
+    >i {
+      @extend %category-icon-color;
+    }
+    &:first-child {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+    }

-.categories .collapsing .list-group-item:first-child,
-.categories .collapse .list-group-item:first-child {
-  border-top-left-radius: 0;
-  border-top-right-radius: 0;
-}
+  }

-.categories i.far,
-.categories i.fas { // fontawesome icons
-  font-size: 86%;
-}
+  .card-header>span>i:first-child {
+    @extend %category-icon-color;
+  }
+
+  i {
+    &.far, &.fas {
+      font-size: 86%; // fontawesome icons
+    }
+  }
+
+} // .categories

 .category-trigger {
  width: 1.7rem;
@@ -42,23 +49,22 @@
  border-radius: 50%;
  text-align: center;
  color: #6c757d!important;
+  >i.fas {
+    position: relative;
+    height: .7rem;
+    width: 1rem;
+    transition: 300ms ease all;
+  }
 }

@media (hover: hover) { // only works on desktop
  .category-trigger:hover {
-    background-color: #e9ecef;
+    background-color: var(--categories-hover-bg);
  }
 }

-.category-trigger>i.fas {
-  position: relative;
-  height: .7rem;
-  width: 1rem;
-  transition: 300ms ease all;
-}
-
 .rotate {
  -ms-transform: rotate(-90deg); /* IE 9 */
  -webkit-transform: rotate(-90deg); /* Safari 3-8 */
  transform: rotate(-90deg);
-}
+}
--- a/assets/css/category-tag.scss
+++ b/assets/css/category-tag.scss
@@ -2,37 +2,37 @@
 ---
 /*!
  Style for page Category and Tag
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 */
+@import "_addon/module";

-#page-category ul>li,
-#page-tag ul>li {
-  line-height: 1.5rem;
-  padding: .6rem 0;
-}
-
-#page-category ul>li::before,
-#page-tag ul>li::before {
-  background: #999;
-  width: 5px;
-  height: 5px;
-  border-radius: 50%;
-  display: block;
-  content: "";
-  position: relative;
-  top: .6rem;
-  margin-right: .5rem;
-}
-
-#page-tag ul>li>a,
-#page-category ul>li>a, { /* post's title */
-  font-size: 1.1rem;
-}
-
-#page-category ul>li>span:last-child,
-#page-tag ul>li>span:last-child { /* post's date */
-  white-space: nowrap;
+#page-category, #page-tag {
+  ul>li {
+    line-height: 1.5rem;
+    padding: .6rem 0;
+    &::before { // dot
+      background: #999;
+      width: 5px;
+      height: 5px;
+      border-radius: 50%;
+      display: block;
+      content: "";
+      position: relative;
+      top: .6rem;
+      margin-right: .5rem;
+    }
+    >a { /* post's title */
+      font-size: 1.1rem;
+      @extend %no-bottom-border;
+    }
+    >span:last-child {
+      white-space: nowrap;
+    }
+    /* post's date */
+  }
 }

 #page-tag h1>i { // tag icon
@@ -43,29 +43,31 @@
  font-size: 1.25rem;
 }

-#page-category a:hover,
-#page-tag a:hover,
-#access-lastmod a:hover {
-  margin-bottom: -1px;  // Avoid jumping
+a:hover {
+  #page-category &,
+  #page-tag &,
+  #access-lastmod & {
+    @extend %link-hover;
+    margin-bottom: -1px; // Avoid jumping
+  }
 }

 .dash {
  margin: 0 .5rem .6rem .5rem;
-  border-bottom: 2px dotted silver;
+  border-bottom: 2px dotted var(--dash-color);
 }

@media all and (max-width: 576px) {
-
-  #page-category ul>li::before,
-  #page-tag ul>li::before {
-    margin: 0 .5rem;
+  #page-category, #page-tag {
+    ul>li {
+      &::before {
+        margin: 0 .5rem;
+      }
+      >a {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
  }
-
-  #page-tag ul>li>a,
-  #page-category ul>li>a {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
 }
--- a/assets/css/home.scss
+++ b/assets/css/home.scss
@@ -1,101 +1,101 @@
 ---
 ---
-
 /*!
  Style for Homepage
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 */

+
 #post-list {
  margin-top: 1rem;
  padding-right: .5rem;
+  .post-meta {
+    i:not(:first-child) { // post-meta icons on HOME
+      margin-left: 1.5rem;
+    }
+  }
 }

 .pagination {
  font-size: 1rem;
-}
-
-.pagination a:hover {
-  text-decoration: none;
+  a:hover {
+    text-decoration: none;
+  }
 }

 .post-preview {
  padding-top: 1.5rem;
  padding-bottom: 1rem;
-  border-bottom: 1px solid rgba(158, 158, 158, 0.17);
+  border-bottom: 1px solid var(--main-border-color);
+  >h1 {
+    font-size: 1.4rem;
+    margin: 0;
+  }
+  i.far { /* fontawesome icons */
+    font-size: 86%;
+  }
+  .post-content {
+    margin-top: .6rem;
+    margin-bottom: .6rem;
+    color: var(--post-list-text-color);
+    >p { /* Make preview shorter in Home page*/
+      margin: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+    }
+  }
 }

-.post-preview>h1 {
-  font-size: 1.4rem;
-  margin: 0;
-}
+.page-item {
+  .page-link {
+    color: var(--btn-patinator-text-color);
+    width: 2.5rem;
+    height: 2.5rem;
+    padding: 0;
+    text-align: center;
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-pack: center;
+    justify-content: center;
+    -webkit-box-align: center;
+    align-items: center;
+    border-radius: 50%;
+    border: 1px solid var(--btn-paginator-border-color);
+    font-family: 'Lato', sans-serif;
+    background-color: var(--button-bg);
+  }
+  &.active {
+    .page-link {
+      background-color: var(--btn-active-bg);
+      border-color: var(--btn-active-border-color);
+      box-shadow: 0 0 8px 0 var(--btn-paginator-shadow) !important;
+      color: var(--btn-text-color);
+    }
+  }
+  &.disabled {
+    cursor: not-allowed;
+    .page-link {
+      color: rgba(108, 117, 125, 0.57);
+      border-color: var(--btn-paginator-border-color);
+      background-color: var(--button-bg);
+    }
+  }
+  &:first-child .page-link,
+  &:last-child .page-link {
+    border-radius: 50%;
+  }
+  &:not(:last-child) {
+    margin-right: 0.6rem;
+  }

-.post-preview i.far {
-  /* fontawesome icons */
-  font-size: 86%;
-}
+} // .page-item

-.post-preview .post-content {
-  margin-top: .6rem;
-  margin-bottom: .6rem;
-  color: dimgray;
-}
-
-/* Make preview shorter in Home page*/
-.post-preview .post-content>p {
-  margin: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-}
-
-.page-item .page-link {
-  color: #555555;
-  width: 2.5rem;
-  height: 2.5rem;
-  padding: 0;
-  text-align: center;
-  display: -webkit-box;
-  display: flex;
-  -webkit-box-pack: center;
-  justify-content: center;
-  -webkit-box-align: center;
-  align-items: center;
-  border-radius: 50%;
-  border: 1px solid #f1f1f1;
-  font-family: 'Lato', sans-serif;
-}
-
-.page-item.active .page-link {
-  background-color: #2a408e;
-  box-shadow: 0 0 8px 0 #4b92d2 !important;
-  color: #f8f8f8;
-}
-
-.page-item.disabled .page-link {
-  color: rgba(108, 117, 125, 0.57);
-  border-color: #f1f1f1;
-}
-
-.page-item.disabled {
-  cursor: not-allowed;
-}
-
-.page-item:first-child .page-link,
-.page-item:last-child .page-link {
-  border-radius: 50%;
-}
-
-.page-item:not(:last-child) {
-  margin-right: 0.6rem;
-}
-
-#post-list .post-meta i:not(:first-child) { // post-meta icons on HOME
-  margin-left: 1.5rem;
-}

@media all and (max-width: 576px) {
  #post-list .post-meta>span i:not(:first-child) {
--- a/assets/css/main.scss
+++ b/assets/css/main.scss
--- a/assets/css/post.scss
+++ b/assets/css/post.scss
@@ -1,47 +1,108 @@
 ---
 ---
 /*!
-  Individual styles for Post
+  Post-specific style
+  v2.0
+  https://github.com/cotes2020/jekyll-theme-chirpy
  © 2019 Cotes Chung
  MIT License
 */
+@import "_addon/variables";
+
+$prompt-older: "{{ site.data.label.post.button.previous }}";
+$prompt-newer: "{{ site.data.label.post.button.next }}";
+
+@mixin btn-sharing-color($light-color, $important: false) {
+  @if $important {
+    color: var(--btn-share-color, $light-color)!important;
+  } @else {
+    color: var(--btn-share-color, $light-color);
+  }
+}
+
+@mixin btn-post-nav {
+  width: 50%;
+  position: relative;
+  border-color: var(--btn-border-color);
+}

 .post img {
  margin-top: .5rem;
  margin-bottom: 1.5rem;
  max-width: 100%;
  height: auto;
-  filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.08));
+  // filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.08));
+  position: relative;
+  left: 50%;
+  -webkit-transform: translateX(-50%);
+  -ms-transform: translateX(-50%);
+  transform: translateX(-50%);
 }

-.post-tail {
-  margin-top: 3.5rem;
-  border-bottom: 1px double #e9ecef;
+.post-tail-wrapper {
+  margin-top: 5rem;
+  border-bottom: 1px double var(--main-border-color);
  font-size: 0.85rem;
 }

-.post-pager {
-  margin: 1rem 0 2rem;
-}
+.post-navigation {
+  padding-top: 3rem;
+  padding-bottom: 2rem;

-.post-pager .btn,
-.post-pager .btn.disabled {
-  color: #2a408e;
-  border-color: #2a408e;
-}
+  .btn {
+    @include btn-post-nav;
+    color: var(--link-color);
+    &:hover {
+      background: #2a408e;
+      color: #fff;
+      border-color: #2a408e;
+    }
+    &.disabled {
+      @include btn-post-nav;
+      pointer-events: auto;
+      cursor: not-allowed;
+      background: none;
+      color: gray;
+      &:hover {
+        border-color: none;
+      }
+    }
+    &.btn-outline-primary.disabled:focus {
+      box-shadow: none;
+    }
+  }

-.post-pager .btn:hover {
-  background: #2a408e;
-  color: #fff;
-}
+  p {
+    font-size: 1.1rem;
+    line-height: 1.5rem;
+    margin-top: .3rem;
+    white-space: normal;
+  }

-.post-pager a.btn.disabled {
-  pointer-events: auto;
-  cursor: not-allowed;
-  background: none;
-  color: gray;
-  border-color: gray;
-}
+  a, span {
+    &::before {
+      color: var(--text-muted-color);
+      font-size: .65rem;
+      text-transform: uppercase;
+    }
+    &:first-child {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+      left: .5px;
+      &::before {
+        content: $prompt-older
+      }
+    }
+    &:last-child {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+      right: .5px;
+      &::before {
+        content: $prompt-newer
+      }
+    }
+  }
+} // .post-navigation

@keyframes fade-up {
  from {
@@ -60,94 +121,174 @@
  border-left: 1px solid rgba(158, 158, 158, 0.17);
  position: -webkit-sticky;
  position: sticky;
-  top: 2rem;
+  top: 4rem;
  transition: top 0.2s ease-in-out;
  animation: fade-up .8s;
-}
-
-#toc-wrapper.topbar-down {
-  top: 6rem;
-}
-
-#toc-wrapper>h3 {
-  font-size: 1rem;
-  font-family: 'Oswald', sans-serif;
-  color: gray;
+  &.topbar-down {
+    top: 6rem;
+  }
+  >h3 {
+    font-size: 1rem;
+    font-family: 'Oswald', sans-serif;
+    color: gray;
+  }
 }

 #toc li>a {
-  padding-top: 0;
+  line-height: 1rem;
+  padding-top: .5rem;
+  padding-bottom: .5rem;
 }


 /*--- Related Posts ---*/

 #related-posts {
-  border-bottom: 1px double #e9ecef;
-}
+  >h3 {
+    color: gray;
+    font-size: 1.1rem;
+    font-family: 'Oswald', sans-serif;
+  }
+  .card {
+    border: 1px solid var(--card-border-color);
+    background-color: var(--card-bg);
+    box-shadow: 0 0 5px 0 var(--card-box-shadow);
+    -webkit-transition: all .3s ease-in-out;
+    -moz-transition: all .3s ease-in-out;
+    transition: all .3s ease-in-out;
+    h3 {
+      color: var(--label-relate-post);
+    }
+    &:hover {
+      -webkit-transform: translate3d(0, -3px, 0);
+      transform: translate3d(0, -3px, 0);
+      filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.08));
+    }
+  }

-#related-posts>h3 {
-  color: gray;
-  font-size: 1.1rem;
-  font-family: 'Oswald', sans-serif;
-}
+  .timeago {
+    color: var(--relate-post-date);
+  }

-#related-posts .card {
-  border: 1px solid #f1f1f1;
-  box-shadow: 0 0 5px 0 rgba(234, 234, 234, 0.7686274509803922);
-  -webkit-transition: all .3s ease-in-out;;
-  -moz-transition: all .3s ease-in-out;;
-  transition: all .3s ease-in-out;
-}
+  p {
+    font-size: .9rem;
+    margin-bottom: .5rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+  }

-#related-posts .card:hover {
-  -webkit-transform: translate3d(0, -8px, 0);
-  transform: translate3d(0, -8px, 0);
-}
+  a:hover {
+    text-decoration: none;
+  }

-#related-posts .card h3 {
-  color: #353a3d;
-}
-
-#related-posts .timeago {
-  color: rgba(30,55,70,.4);
-}
-
-#related-posts p {
-  font-size: .9rem;
-  margin-bottom: .5rem;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-}
-
-#related-posts a:hover {
-  text-decoration: none;
-}
-
-#related-posts ul {
-  list-style-type: none;
-  padding-inline-start: 1.5rem;
-}
-
-#related-posts ul>li::before {
-  background: #c2c9d4;
-  width: 5px;
-  height: 5px;
-  border-radius: 1px;
-  display: block;
-  content: "";
-  position: relative;
-  top: 1rem;
-  right: 1rem;
+  ul {
+    list-style-type: none;
+    padding-inline-start: 1.5rem;
+    >li::before {
+      background: #c2c9d4;
+      width: 5px;
+      height: 5px;
+      border-radius: 1px;
+      display: block;
+      content: "";
+      position: relative;
+      top: 1rem;
+      right: 1rem;
+    }
+  }
 }

 #post-extend-wrapper {
  min-height: 2rem;
 }

+.post-tail-bottom a {
+  color: inherit;
+}
+
+%btn-share-hovor {
+  color: var(--btn-share-hover-color)!important;
+}
+
+.share-wrapper {
+  vertical-align: middle;
+  user-select: none;
+  .share-icons {
+    font-size: 1.2rem;
+    a {
+      &:not(:last-child) {
+        margin-right: .25rem;
+      }
+      &:hover {
+        text-decoration: none;
+        >i {
+          @extend %btn-share-hovor;
+        }
+      }
+    }
+    >i {
+      padding-top: .35rem;
+      &:hover {
+        @extend %btn-share-hovor;
+      }
+    }
+    .fab {
+      &.fa-twitter {
+        @include btn-sharing-color(rgba(29, 161, 242, 1.00));
+      }
+      &.fa-facebook-square {
+        @include btn-sharing-color(rgb(66, 95, 156));
+      }
+      &.fa-telegram {
+        @include btn-sharing-color(rgb(39, 159, 217));
+      }
+      &.fa-weibo {
+        @include btn-sharing-color(rgb(229, 20, 43));
+      }
+    }
+
+  } // .share-icons
+
+  .fas.fa-link {
+    @include btn-sharing-color(rgb(171, 171, 171));
+  }
+
+} // .share-wrapper
+
+
+.share-label {
+  font-family: 'Oswald', sans-serif;
+  &::after {
+    content: ":";
+  }
+}
+
+.license-wrapper {
+  line-height: 1.2rem;
+  .license-text>a {
+    font-weight: 600;
+  }
+  i {
+    font-weight: 400;
+  }
+  span:last-child {
+    font-size: .85rem;
+  }
+} // .license-wrapper
+
+
+@media all and (max-width: 576px) {
+  .post-tail-bottom {
+    -ms-flex-wrap: wrap!important;
+    flex-wrap: wrap!important;
+    >div:first-child {
+      margin-bottom: 1rem;
+    }
+  }
+}

@media all and (max-width: 768px) {
  .post img {
@@ -156,20 +297,23 @@
 }

@media all and (min-width: 768px) {
-  .post .post-meta>div:not(:first-child)::before {
-    content: "\2022";
-    color: rgba(158, 158, 158, 0.8);
-    font-weight: bold;
-    padding-left: .5rem;
-    padding-right: .3rem;
-  }
-
-  .post .post-meta.flex-column {
-    -webkit-box-orient: horizontal!important;
-    -webkit-box-direction: normal!important;
-    -ms-flex-direction: row!important;
-    flex-direction: row!important;
-  }
+  .post {
+    .post-meta {
+      >div:not(:first-child)::before {
+        content: "\2022";
+        color: rgba(158, 158, 158, 0.8);
+        font-weight: bold;
+        padding-left: .5rem;
+        padding-right: .3rem;
+      }
+      &.flex-column {
+        -webkit-box-orient: horizontal!important;
+        -webkit-box-direction: normal!important;
+        -ms-flex-direction: row!important;
+        flex-direction: row!important;
+      }
+    }
+  } // .post
 }

@media all and (min-width: 768px) and (max-width: 830px) {
@@ -187,10 +331,19 @@
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
+
+  .post-navigation {
+    padding-left: 0;
+    padding-right: 0;
+    margin-left: -.5rem;
+    margin-right: -.5rem;
+  }
+
 }

 /*
-  The following resposive design aim to make #post-extend-wrapper margin-right same as pannel's width
+  The following resposive design aim to
+  make #post-extend-wrapper margin-right same as pannel's width
 */
@media all and (min-width: 1200px) {
  #post-extend-wrapper {
@@ -214,4 +367,4 @@
  #post-extend-wrapper {
    margin-right: calc((100% - 1150px) / 8 + 300px);
  }
-}
+}
--- a/assets/css/syntax.scss
+++ b/assets/css/syntax.scss
@@ -2,141 +2,119 @@
 ---
 /*
 * The syntax highlight.
+* v2.0
+* https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT Licensed
 */

-.highlight .hll { background-color: #ffc; }
-.highlight .c { color: #999; } /* Comment */
-.highlight .err { color: #a00; background-color: #faa } /* Error */
-.highlight .k { color: #069; } /* Keyword */
-.highlight .o { color: #555 } /* Operator */
-.highlight .cm { color: #09f; font-style: italic } /* Comment.Multiline */
-.highlight .cp { color: #099 } /* Comment.Preproc */
-.highlight .c1 { color: #999; } /* Comment.Single */
-.highlight .cs { color: #999; } /* Comment.Special */
-.highlight .gd { background-color: #fcc; border: 1px solid #c00 } /* Generic.Deleted */
-.highlight .ge { font-style: italic } /* Generic.Emph */
-.highlight .gr { color: #f00 } /* Generic.Error */
-.highlight .gh { color: #030; } /* Generic.Heading */
-.highlight .gi { background-color: #cfc; border: 1px solid #0c0 } /* Generic.Inserted */
-.highlight .go { color: #aaa } /* Generic.Output */
-.highlight .gp { color: #009; } /* Generic.Prompt */
-.highlight .gs { } /* Generic.Strong */
-.highlight .gu { color: #030; } /* Generic.Subheading */
-.highlight .gt { color: #9c6 } /* Generic.Traceback */
-.highlight .kc { color: #069; } /* Keyword.Constant */
-.highlight .kd { color: #069; } /* Keyword.Declaration */
-.highlight .kn { color: #069; } /* Keyword.Namespace */
-.highlight .kp { color: #069 } /* Keyword.Pseudo */
-.highlight .kr { color: #069; } /* Keyword.Reserved */
-.highlight .kt { color: #078; } /* Keyword.Type */
-.highlight .m { color: #f60 } /* Literal.Number */
-.highlight .s { color: #d44950 } /* Literal.String */
-.highlight .na { color: #4f9fcf } /* Name.Attribute */
-.highlight .nb { color: #366 } /* Name.Builtin */
-.highlight .nc { color: #0a8; } /* Name.Class */
-.highlight .no { color: #360 } /* Name.Constant */
-.highlight .nd { color: #99f } /* Name.Decorator */
-.highlight .ni { color: #999; } /* Name.Entity */
-.highlight .ne { color: #c00; } /* Name.Exception */
-.highlight .nf { color: #c0f } /* Name.Function */
-.highlight .nl { color: #99f } /* Name.Label */
-.highlight .nn { color: #0cf; } /* Name.Namespace */
-.highlight .nt { color: #2f6f9f; } /* Name.Tag */
-.highlight .nv { color: #033 } /* Name.Variable */
-.highlight .ow { color: #000; } /* Operator.Word */
-.highlight .w { color: #bbb } /* Text.Whitespace */
-.highlight .mf { color: #f60 } /* Literal.Number.Float */
-.highlight .mh { color: #f60 } /* Literal.Number.Hex */
-.highlight .mi { color: #f60 } /* Literal.Number.Integer */
-.highlight .mo { color: #f60 } /* Literal.Number.Oct */
-.highlight .sb { color: #c30 } /* Literal.String.Backtick */
-.highlight .sc { color: #c30 } /* Literal.String.Char */
-.highlight .sd { color: #c30; font-style: italic } /* Literal.String.Doc */
-.highlight .s2 { color: #c30 } /* Literal.String.Double */
-.highlight .se { color: #c30; } /* Literal.String.Escape */
-.highlight .sh { color: #c30 } /* Literal.String.Heredoc */
-.highlight .si { color: #a00 } /* Literal.String.Interpol */
-.highlight .sx { color: #c30 } /* Literal.String.Other */
-.highlight .sr { color: #3aa } /* Literal.String.Regex */
-.highlight .s1 { color: #c30 } /* Literal.String.Single */
-.highlight .ss { color: #fc3 } /* Literal.String.Symbol */
-.highlight .bp { color: #366 } /* Name.Builtin.Pseudo */
-.highlight .vc { color: #033 } /* Name.Variable.Class */
-.highlight .vg { color: #033 } /* Name.Variable.Global */
-.highlight .vi { color: #033 } /* Name.Variable.Instance */
-.highlight .il { color: #f60 } /* Literal.Number.Integer.Long */
+@import "_colors/light-syntax";
+@import "_colors/dark-syntax";
+
+
+@mixin highlight-box-shadow($val) {
+  -moz-box-shadow: $val;
+  -webkit-box-shadow: $val;
+  box-shadow: $val;
+}
+
+html:not([mode]), html[mode=light] {
+  @include light-syntax;
+}
+
+html[mode=dark] {
+  @include dark-syntax;
+}
+
+@media (prefers-color-scheme: dark) {
+  html:not([mode]), html[mode=dark] {
+    @include dark-syntax;
+  }
+
+  html[mode=light] {
+    @include light-syntax;
+  }
+}

 /*-- Codes Snippet --*/

-div.highlight,
-figure.highlight,
+%highlight-pre-bg {
+  background: var(--highlight-bg-color);
+}
+
+%code-snippet-radius {
+  border-radius: 5px;
+}
+
 .highlighter-rouge {
-  background: #f7f7f7;
+  background: var(--highlight-bg-color);
+  @extend %code-snippet-radius;
+  color: var(--highlighter-rouge-color);
+  margin-bottom: 1.2em; /* Override BS Inline-code style */
 }

 .highlight {
+  @extend %code-snippet-radius;
+  background: var(--highlight-bg-color);
+
+  @at-root figure#{&} {
+    background: var(--highlight-bg-color);
+  }
  overflow: auto;
-  -moz-box-shadow: inset 0 0 2px #c2c6cc;
-  -webkit-box-shadow: inset 0 0 2px #c2c6cc;
-  box-shadow: inset 0 0 2px #c2c6cc;
-}
+  @include highlight-box-shadow(inset 0 0 2px #c2c6cc);
+  .lineno {
+    margin: .8rem 0rem;
+    padding: 0 .5rem;
+    min-width: 2.2rem;
+    text-align: right;
+    color: var(--highlight-lineno-color);
+    border-right: 1px solid var(--highlight-lineno-border-color);
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    -o-user-select: none;
+    user-select: none;
+  }
+  table {
+    padding: 0;
+    border: 0;
+    td pre {
+      overflow: visible;  /* Fixed iOS safari overflow-x */
+      word-break: normal; /* Fixed iOS safari linenos code break */
+    }
+  }
+  td {
+    padding: 0;
+    border: 0;
+  }
+  pre {
+    margin-bottom: 0;
+    font-size: .85rem;
+    line-height: 1.4rem;
+    word-wrap: normal;
+    /* Fixed Safari overflow-x */
+  }

-.highlight .lineno {
-  margin: .8rem 0rem;
-  padding: 0 .5rem;
-  min-width: 2.2rem;
-  text-align: right;
-  color: #c2c6cc;
-  border-right: 1px solid #e9ecef;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  -o-user-select: none;
-  user-select: none;
-}
-.highlight table {
-  padding: 0;
-  border: 0;
-}
-
-.highlight td {
-  padding: 0;
-  border: 0;
-}
-
-.highlight pre {
-  margin-bottom: 0;
-  font-size: .85rem;
-  line-height: 1.4rem;
-  word-wrap: normal;  /* Fixed Safari overflow-x */
-}
-
-.highlight table td pre {
-  overflow: visible;  /* Fixed iOS safari overflow-x */
-  word-break: normal; /* Fixed iOS safari linenos code break */
-}
-
-/* Override BS Inline-code style */
-.highlighter-rouge {
-  color: black;
-  margin-bottom: 1.2em;
-}
+} //.highlight

 code {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
-}
-
-code.highlighter-rouge {
-  padding: 2px 4px;
-  margin: 0 .3rem;
-  border-radius: 4px;
-  border: 1px solid #e9ecef;
+  &.highlighter-rouge {
+    padding: 2px 4px;
+    margin: 0 .3rem;
+    border-radius: 4px;
+    border: 1px solid var(--code-highlighter-rouge);
+  }
+  @at-root a>&.highlighter-rouge {
+    padding-bottom: 0; // show link's underlinke
+  }
+  @at-root a:hover>&.highlighter-rouge {
+    border-bottom: none;
+  }
 }

 td.rouge-code {
@@ -144,21 +122,16 @@ td.rouge-code {
  padding-right: 1rem;
 }

-/* code snippet radius */
-.highlighter-rouge,
-.highlight {
-  border-radius: 5px;
-}
-
 /* Hide line numbers for defualt, console, and terminal code snippets */
-div[class^='highlighter-rouge'] pre.lineno,
-div.language-console.highlighter-rouge pre.lineno,
-div.language-terminal.highlighter-rouge pre.lineno {
-  display: none;
-}
-
-div[class^='highlighter-rouge'] td.rouge-code,
-div.language-console.highlighter-rouge td.rouge-code,
-div.language-terminal.highlighter-rouge td.rouge-code {
-  padding: .8rem 1rem;
+div {
+  &[class^='highlighter-rouge'],
+  &.language-console.highlighter-rouge,
+  &.language-terminal.highlighter-rouge {
+    pre.lineno {
+      display: none;
+    }
+    td.rouge-code {
+      padding: .8rem 1rem;
+    }
+  }
 }
--- a/assets/css/tags.scss
+++ b/assets/css/tags.scss
@@ -2,9 +2,11 @@
 ---

 /*!
-  Styles for Tab Tags
-  © 2019 Cotes Chung
-  MIT License
+* Styles for Tab Tags
+* v2.0
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2019 Cotes Chung
+* MIT License
 */

 .tag {
@@ -13,16 +15,11 @@
  margin-right: .8rem;
  line-height: 3rem;
  letter-spacing: 0;
-  border: 1px solid #dee2e6 !important;
-  box-shadow: 0 0 3px 0 #e9ecef;
-}
-
-.tag span {
-  margin-left: 0.6em;
-  font-size: 0.7em;
-  font-family: 'Oswald', sans-serif;
-}
-
-a.tag:hover {
-  text-decoration: none;
+  border: 1px solid var(--tag-border) !important;
+  box-shadow: 0 0 3px 0 var(--tag-shadow);
+  span {
+    margin-left: 0.6em;
+    font-size: 0.7em;
+    font-family: 'Oswald', sans-serif;
+  }
 }
--- a/assets/data/proxy.json
+++ b/assets/data/proxy.json
@@ -1,4 +0,0 @@
---
---
-
-{"proxyUrl":"{{ site.google_analytics.proxy_url }}"}
--- a/assets/data/pv-data.json
+++ b/assets/data/pv-data.json
@@ -0,0 +1,13 @@
+---
+layout: compress
+---
+
+const proxyData = '{"url": "{{ site.google_analytics.pv.proxy_endpoint }}"}';
+
+{%- capture pv_data -%}
+  {%- if site.google_analytics.pv.cache and site.google_analytics.pv.enabled -%}
+    {% include_relative pageviews.json %}
+  {%- endif -%}
+{%- endcapture -%}
+
+const pageviews = '{{ pv_data }}';
--- a/assets/data/search.json
+++ b/assets/data/search.json
--- a/assets/img/favicons/browserconfig.xml
+++ b/assets/img/favicons/browserconfig.xml
@@ -1,8 +1,11 @@
 ---
+layout: compress
+
 # A part of the Favicons
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2019 Cotes Chung
 # MIT License
-layout: compress
 ---
 <?xml version="1.0" encoding="utf-8"?>
 <browserconfig>
--- a/assets/img/favicons/manifest.json
+++ b/assets/img/favicons/manifest.json
@@ -1,8 +1,11 @@
 ---
+layout: compress
+
 # A part of the Favicons
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2019 Cotes Chung
 # MIT License
-layout: compress
 ---

 {
--- a/assets/img/sample/devices-mockup.png
+++ b/assets/img/sample/devices-mockup.png
--- a/assets/js/_src/_commons/copy-link.js
+++ b/assets/js/_src/_commons/copy-link.js
@@ -0,0 +1,20 @@
+/*
+* Copy current page url to clipboard.
+* v2.1
+* https://github.com/cotes2020/jekyll-theme-chirpy
+* © 2020 Cotes Chung
+* MIT License
+*/
+
+function copyLink(url) {
+  if (!url || 0 === url.length)
+  url = window.location.href;
+  var $temp = $("<input>");
+
+  $("body").append($temp);
+  $temp.val(url).select();
+  document.execCommand("copy");
+  $temp.remove();
+
+  alert("Link copied successfully!");
+}
--- a/assets/js/_src/_commons/search-display.js
+++ b/assets/js/_src/_commons/search-display.js
@@ -1,5 +1,7 @@
 /*
 * This script make #search-result-wrapper switch to unloaded or shown automatically.
+* v2.0
+* https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT License
 */
@@ -8,7 +10,7 @@ $(function() {

  var btnSbTrigger = $('#sidebar-trigger');
  var btnSearchTrigger = $('#search-trigger');
-  var btnCancel = $('#search-wrapper + a');
+  var btnCancel = $('#search-cancel');
  var btnClear = $('#search-cleaner');

  var main = $('#main');
--- a/assets/js/_src/_commons/sidebar.js
+++ b/assets/js/_src/_commons/sidebar.js
@@ -1,5 +1,7 @@
 /**
 * Expand or close the sidebar in mobile screens.
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT License
 */
--- a/assets/js/_src/_commons/tooltip.js
+++ b/assets/js/_src/_commons/tooltip.js
@@ -1,8 +0,0 @@
-/**
-* Initial Bootstrap Tooltip.
-* © 2019 Cotes Chung
-* MIT License
-*/
-$(function () {
-  $('[data-toggle="tooltip"]').tooltip({placement: "auto"});
-})
--- a/assets/js/_src/_commons/topbar-switch.js
+++ b/assets/js/_src/_commons/topbar-switch.js
@@ -1,5 +1,7 @@
 /*
 * Hide Header on scroll down
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT License
 */
--- a/assets/js/_src/_commons/topbar-title.js
+++ b/assets/js/_src/_commons/topbar-title.js
@@ -1,7 +1,9 @@
 /*
-* Topbar title auto change while scrolling in mobile screens.
-* © 2018-2019 Cotes Chung
-* MIT License
+ * Topbar title auto change while scrolling in mobile screens.
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
+ * © 2018-2019 Cotes Chung
+ * MIT License
 */
 $(function(){

--- a/assets/js/_src/category-collapse.js
+++ b/assets/js/_src/category-collapse.js
@@ -1,5 +1,7 @@
 /*
 * Tab 'Categories' expand/close effect.
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT License
 */
--- a/assets/js/_src/pageviews.js
+++ b/assets/js/_src/pageviews.js
@@ -3,15 +3,17 @@
 *
 * Dependences:
 *   - jQuery
- *   - countUp.js(https://github.com/inorganik/countUp.js)
+ *   - countUp.js <https://github.com/inorganik/countUp.js>
 *
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2018-2019 Cotes Chung
 * MIT License
 */

-function countUp(min, max, dest) {
+function countUp(min, max, destId) {
  if (min < max) {
-    var numAnim = new CountUp(dest, min, max);
+    var numAnim = new CountUp(destId, min, max);
    if (!numAnim.error) {
      numAnim.start();
    } else {
@@ -20,6 +22,7 @@ function countUp(min, max, dest) {
  }
 }

+
 function countPV(path, rows) {
  /* path permalink looks like: '/posts/post-title/' */
  var fileName = path.replace(/\/posts\//g, '').replace(/\//g, '.html'); /* e.g. post-title.html */
@@ -41,6 +44,21 @@ function countPV(path, rows) {
 }


+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;
@@ -52,70 +70,155 @@ function displayPageviews(data) {
  if ($("#post-list").length > 0) { // the Home page
    $(".post-preview").each(function() {
      var path = $(this).children("h1").children("a").attr("href");
-      var count = countPV(path, rows);
-      count = (count == 0 ? 1 : count);
-
-      if (!hasInit) {
-        $(this).find('.pageviews').text(count);
-      } else {
-        var initCount = parseInt($(this).find('.pageviews').text());
-        if (count > initCount) {
-          countUp(initCount, count, $(this).find('.pageviews').attr('id'));
-        }
-      }
+      tacklePV(rows, path, $(this).find('.pageviews'), hasInit);
    });

  } else if ($(".post").length > 0) { // the post
    var path = window.location.pathname;
-    var count = countPV(path, rows);
-    count = (count == 0 ? 1 : count);
-
-    if (!hasInit) {
-      $('#pv').text(count);
-    } else {
-      var initCount = parseInt($('#pv').text());
-      if (count > initCount) {
-        countUp(initCount, count, 'pv');
-      }
-    }
+    tacklePV(rows, path, $('#pv'), hasInit);
  }
-
 }


 var getInitStatus = (function() {
  var hasInit = false;
  return function() {
-    if (hasInit) {
-      return true;
-    } else {
+    let ret = hasInit;
+    if (!hasInit) {
      hasInit = true;
-      return false;
    }
+    return ret;
  }
 })();


+var PvCache = (function() {
+  const KEY_PV = "pv";
+  const KEY_CREATION = "pv-created-date";
+  const KEY_PV_TYPE = "pv-type";
+
+  var PvType = {
+    ORIGIN: "origin",
+    PROXY: "proxy"
+  };
+
+  function get(key) {
+    return localStorage.getItem(key);
+  }
+
+  function set(key, val) {
+    localStorage.setItem(key, val);
+  }
+
+  return {
+    getData: function() {
+      return JSON.parse(localStorage.getItem(KEY_PV) );
+    },
+    saveOriginCache: function(pv) {
+      set(KEY_PV, pv);
+      set(KEY_PV_TYPE, PvType.ORIGIN );
+      set(KEY_CREATION, new Date().toJSON() );
+    },
+    saveProxyCache: function(pv) {
+      set(KEY_PV, pv);
+      set(KEY_PV_TYPE, PvType.PROXY );
+      set(KEY_CREATION, new Date().toJSON() );
+    },
+    isOriginCache: function() {
+      return get(KEY_PV_TYPE) == PvType.ORIGIN;
+    },
+    isProxyCache: function() {
+      return get(KEY_PV_TYPE) == PvType.PROXY;
+    },
+    isExpired: function() {
+      if (PvCache.isOriginCache() ) {
+        let date = new Date(get(KEY_CREATION));
+        date.setDate(date.getDate() + 1); // fetch origin-data every day
+        return Date.now() >= date.getTime();
+
+      } else if (PvCache.isProxyCache() ) {
+        let date = new Date(get(KEY_CREATION) );
+        date.setHours(date.getHours() + 1); // proxy-data is updated every hour
+        return Date.now() >= date.getTime();
+      }
+      return false;
+    },
+    getAllPagevies: function() {
+      return PvCache.getData().totalsForAllResults["ga:pageviews"];
+    },
+    newerThan: function(pv) {
+      return PvCache.getAllPagevies() > pv.totalsForAllResults["ga:pageviews"];
+    }
+  };
+
+})(); // PvCache
+
+
+function fetchOriginPageviews(pvData) {
+  if (pvData === undefined) {
+    return;
+  }
+  displayPageviews(pvData);
+  PvCache.saveOriginCache(JSON.stringify(pvData));
+}
+
+
+function fetchProxyPageviews() {
+  let proxy = JSON.parse(proxyData); // see file '/assets/data/pv-data.json'
+  $.ajax({
+    type: 'GET',
+    url: proxy.url,
+    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() {
-  // load pageview if this page has .pageviews
+
  if ($('.pageviews').length > 0) {

-    // Get data from daily cache.
-    $.getJSON('/assets/data/pageviews.json', displayPageviews);
+    let originPvData = pageviews ? JSON.parse(pageviews) : undefined;
+    let cache = PvCache.getData();

-    $.getJSON('/assets/data/proxy.json', function(meta) {
-      $.ajax({
-        type: 'GET',
-        url: meta.proxyUrl,
-        dataType: 'jsonp',
-        jsonpCallback: "displayPageviews",
-        error: function(jqXHR, textStatus, errorThrown) {
-          console.log("Failed to load pageviews from proxy server: " + errorThrown);
+    if (cache) {
+      if (PvCache.isExpired()) {
+        if (PvCache.isProxyCache() ) {
+          if (originPvData) {
+            if (PvCache.newerThan(originPvData)) {
+              displayPageviews(cache);
+            } else {
+              fetchOriginPageviews(originPvData);
+            }
+          }
+
+          fetchProxyPageviews();
+
+        } else if (PvCache.isOriginCache() ) {
+          fetchOriginPageviews(originPvData);
+          fetchProxyPageviews();
        }
-      });

-    });
+      } else { // still valid
+        displayPageviews(cache);

-  } // endif
+        if (PvCache.isOriginCache() ) {
+          fetchProxyPageviews();
+        }

-});
+      }
+
+    } else {
+      fetchOriginPageviews(originPvData);
+      fetchProxyPageviews();
+    }
+
+  }
+
+});
--- a/assets/js/_src/timeago.js
+++ b/assets/js/_src/timeago.js
@@ -1,6 +1,7 @@
 /*
 * Caculate the Timeago
- *
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2019 Cotes Chung
 * MIT Licensed
 */
--- a/assets/js/_src/toc.js
+++ b/assets/js/_src/toc.js
@@ -1,6 +1,7 @@
 /*
 * Hide the empty ToC in posts.
- *
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
 * © 2019 Cotes Chung
 * MIT Licensed
 */
--- a/assets/js/_src/tooltip-loader.js
+++ b/assets/js/_src/tooltip-loader.js
@@ -0,0 +1,10 @@
+/**
+ * Initial Bootstrap Tooltip.
+ * v2.0
+ * https://github.com/cotes2020/jekyll-theme-chirpy
+ * © 2019 Cotes Chung
+ * MIT License
+*/
+$(function () {
+  $('[data-toggle="tooltip"]').tooltip();
+})
--- a/assets/js/dist/_commons/copy-link.min.js
+++ b/assets/js/dist/_commons/copy-link.min.js
@@ -0,0 +1 @@
+function copyLink(a){if(!a||0===a.length){a=window.location.href}var b=$("<input>");$("body").append(b);b.val(a).select();document.execCommand("copy");b.remove();alert("Link copied successfully!")};
--- a/assets/js/dist/_commons/search-display.min.js
+++ b/assets/js/dist/_commons/search-display.min.js
@@ -1 +1 @@
-$(function(){var j=$("#sidebar-trigger");var o=$("#search-trigger");var h=$("#search-wrapper + a");var b=$("#search-cleaner");var e=$("#main");var c=$("#topbar-title");var k=$("#search-wrapper");var i=$("#search-result-wrapper");var g=$("#search-results");var l=$("#search-input");var a=$("#search-hints");var d=(function(){var p=0;return{block:function(){p=$(window).scrollTop();$("body").addClass("no-scroll")},release:function(){$("body").removeClass("no-scroll");$("html,body").scrollTop(p)},getOffset:function(){return p}}})();var m=(function(){return{on:function(){j.addClass("unloaded");c.addClass("unloaded");o.addClass("unloaded");k.addClass("d-flex");h.addClass("loaded")},off:function(){h.removeClass("loaded");k.removeClass("d-flex");j.removeClass("unloaded");c.removeClass("unloaded");o.removeClass("unloaded")}}})();var n=(function(){var p=false;return{on:function(){if(!p){i.removeClass("unloaded");e.addClass("hidden");p=true;d.block()}},off:function(){if(p){g.empty();if(a.hasClass("unloaded")){a.removeClass("unloaded")}i.addClass("unloaded");b.removeClass("visable");e.removeClass("hidden");l.val("");p=false;d.release()}},isVisable:function(){return p}}})();function f(){return h.hasClass("loaded")}o.click(function(){m.on();n.on();l.focus()});h.click(function(){m.off();n.off()});l.focus(function(){k.addClass("input-focus")});l.focusout(function(){k.removeClass("input-focus")});l.on("keyup",function(p){if(p.keyCode==8&&l.val()==""){if(!f()){n.off()}else{a.removeClass("unloaded")}}else{if(l.val()!=""){n.on();if(!b.hasClass("visible")){b.addClass("visable")}if(f()){a.addClass("unloaded")}}}});b.on("click",function(){l.val("");if(f()){a.removeClass("unloaded");g.empty()}else{n.off()}l.focus();b.removeClass("visable")})});
+$(function(){var j=$("#sidebar-trigger");var o=$("#search-trigger");var h=$("#search-cancel");var b=$("#search-cleaner");var e=$("#main");var c=$("#topbar-title");var k=$("#search-wrapper");var i=$("#search-result-wrapper");var g=$("#search-results");var l=$("#search-input");var a=$("#search-hints");var d=(function(){var p=0;return{block:function(){p=$(window).scrollTop();$("body").addClass("no-scroll")},release:function(){$("body").removeClass("no-scroll");$("html,body").scrollTop(p)},getOffset:function(){return p}}})();var m=(function(){return{on:function(){j.addClass("unloaded");c.addClass("unloaded");o.addClass("unloaded");k.addClass("d-flex");h.addClass("loaded")},off:function(){h.removeClass("loaded");k.removeClass("d-flex");j.removeClass("unloaded");c.removeClass("unloaded");o.removeClass("unloaded")}}})();var n=(function(){var p=false;return{on:function(){if(!p){i.removeClass("unloaded");e.addClass("hidden");p=true;d.block()}},off:function(){if(p){g.empty();if(a.hasClass("unloaded")){a.removeClass("unloaded")}i.addClass("unloaded");b.removeClass("visable");e.removeClass("hidden");l.val("");p=false;d.release()}},isVisable:function(){return p}}})();function f(){return h.hasClass("loaded")}o.click(function(){m.on();n.on();l.focus()});h.click(function(){m.off();n.off()});l.focus(function(){k.addClass("input-focus")});l.focusout(function(){k.removeClass("input-focus")});l.on("keyup",function(p){if(p.keyCode==8&&l.val()==""){if(!f()){n.off()}else{a.removeClass("unloaded")}}else{if(l.val()!=""){n.on();if(!b.hasClass("visible")){b.addClass("visable")}if(f()){a.addClass("unloaded")}}}});b.on("click",function(){l.val("");if(f()){a.removeClass("unloaded");g.empty()}else{n.off()}l.focus();b.removeClass("visable")})});
--- a/assets/js/dist/_commons/tooltip.min.js
+++ b/assets/js/dist/_commons/tooltip.min.js
@@ -1 +0,0 @@
-$(function(){$('[data-toggle="tooltip"]').tooltip({placement:"auto"})});
--- a/assets/js/dist/commons.js
+++ b/assets/js/dist/commons.js
@@ -9,4 +9,4 @@
 {% include_relative _commons/sidebar.min.js %}
 {% include_relative _commons/topbar-switch.min.js %}
 {% include_relative _commons/topbar-title.min.js %}
-{% include_relative _commons/tooltip.min.js %}
+{% include_relative _commons/copy-link.min.js %}
--- a/assets/js/dist/pageviews.min.js
+++ b/assets/js/dist/pageviews.min.js
@@ -1 +1 @@
-function countUp(c,a,b){if(c<a){var d=new CountUp(b,c,a);if(!d.error){d.start()}else{console.error(d.error)}}}function countPV(f,e){var g=f.replace(/\/posts\//g,"").replace(/\//g,".html");var d=0;var c=f.replace(/posts\//g,"");for(var b=0;b<e.length;++b){var a=e[b][0];if(a==f||a==c||a.concat("/")==c||a.slice(a.lastIndexOf("/")+1)===g){d+=parseInt(e[b][1])}}return d}function displayPageviews(e){if(e===undefined){return}var b=getInitStatus();var d=e.rows;if($("#post-list").length>0){$(".post-preview").each(function(){var i=$(this).children("h1").children("a").attr("href");var h=countPV(i,d);h=(h==0?1:h);if(!b){$(this).find(".pageviews").text(h)}else{var g=parseInt($(this).find(".pageviews").text());if(h>g){countUp(g,h,$(this).find(".pageviews").attr("id"))}}})}else{if($(".post").length>0){var f=window.location.pathname;var c=countPV(f,d);c=(c==0?1:c);if(!b){$("#pv").text(c)}else{var a=parseInt($("#pv").text());if(c>a){countUp(a,c,"pv")}}}}}var getInitStatus=(function(){var a=false;return function(){if(a){return true}else{a=true;return false}}})();$(function(){if($(".pageviews").length>0){$.getJSON("/assets/data/pageviews.json",displayPageviews);$.getJSON("/assets/data/proxy.json",function(a){$.ajax({type:"GET",url:a.proxyUrl,dataType:"jsonp",jsonpCallback:"displayPageviews",error:function(b,d,c){console.log("Failed to load pageviews from proxy server: "+c)}})})}});
+function countUp(b,a,d){if(b<a){var c=new CountUp(d,b,a);if(!c.error){c.start()}else{console.error(c.error)}}}function countPV(f,e){var g=f.replace(/\/posts\//g,"").replace(/\//g,".html");var d=0;var c=f.replace(/posts\//g,"");for(var b=0;b<e.length;++b){var a=e[b][0];if(a==f||a==c||a.concat("/")==c||a.slice(a.lastIndexOf("/")+1)===g){d+=parseInt(e[b][1])}}return d}function tacklePV(e,f,d,b){var c=countPV(f,e);c=(c==0?1:c);if(!b){d.text(new Intl.NumberFormat().format(c))}else{var a=parseInt(d.text().replace(/,/g,""));if(c>a){countUp(a,c,d.attr("id"))}}}function displayPageviews(c){if(c===undefined){return}var a=getInitStatus();var b=c.rows;if($("#post-list").length>0){$(".post-preview").each(function(){var e=$(this).children("h1").children("a").attr("href");tacklePV(b,e,$(this).find(".pageviews"),a)})}else{if($(".post").length>0){var d=window.location.pathname;tacklePV(b,d,$("#pv"),a)}}}var getInitStatus=(function(){var a=false;return function(){let ret=a;if(!a){a=true}return ret}})();var PvCache=(function(){const e="pv";const b="pv-created-date";const d="pv-type";var c={ORIGIN:"origin",PROXY:"proxy"};function a(g){return localStorage.getItem(g)}function f(g,h){localStorage.setItem(g,h)}return{getData:function(){return JSON.parse(localStorage.getItem(e))},saveOriginCache:function(g){f(e,g);f(d,c.ORIGIN);f(b,new Date().toJSON())},saveProxyCache:function(g){f(e,g);f(d,c.PROXY);f(b,new Date().toJSON())},isOriginCache:function(){return a(d)==c.ORIGIN},isProxyCache:function(){return a(d)==c.PROXY},isExpired:function(){if(PvCache.isOriginCache()){let date=new Date(a(b));date.setDate(date.getDate()+1);return Date.now()>=date.getTime()}else{if(PvCache.isProxyCache()){let date=new Date(a(b));date.setHours(date.getHours()+1);return Date.now()>=date.getTime()}}return false},getAllPagevies:function(){return PvCache.getData().totalsForAllResults["ga:pageviews"]},newerThan:function(g){return PvCache.getAllPagevies()>g.totalsForAllResults["ga:pageviews"]}}})();function fetchOriginPageviews(a){if(a===undefined){return}displayPageviews(a);PvCache.saveOriginCache(JSON.stringify(a))}function fetchProxyPageviews(){let proxy=JSON.parse(proxyData);$.ajax({type:"GET",url:proxy.url,dataType:"jsonp",jsonpCallback:"displayPageviews",success:function(b,c,a){PvCache.saveProxyCache(JSON.stringify(b))},error:function(a,c,b){console.log("Failed to load pageviews from proxy server: "+b)}})}$(function(){if($(".pageviews").length>0){let originPvData=pageviews?JSON.parse(pageviews):undefined;let cache=PvCache.getData();if(cache){if(PvCache.isExpired()){if(PvCache.isProxyCache()){if(originPvData){if(PvCache.newerThan(originPvData)){displayPageviews(cache)}else{fetchOriginPageviews(originPvData)}}fetchProxyPageviews()}else{if(PvCache.isOriginCache()){fetchOriginPageviews(originPvData);fetchProxyPageviews()}}}else{displayPageviews(cache);if(PvCache.isOriginCache()){fetchProxyPageviews()}}}else{fetchOriginPageviews(originPvData);fetchProxyPageviews()}}});
--- a/assets/js/dist/tooltip-loader.min.js
+++ b/assets/js/dist/tooltip-loader.min.js
@@ -0,0 +1 @@
+$(function(){$('[data-toggle="tooltip"]').tooltip()});
--- a/build.sh
+++ b/build.sh
@@ -1,109 +0,0 @@
-#!/bin/bash
-#
-# Build jekyll site and store site files in ./_site
-# © 2019 Cotes Chung
-# Published under MIT License
-
-
-CMD="JEKYLL_ENV=production bundle exec jekyll b"
-DEST=$(realpath '_site')
-
-help() {
-   echo "Usage:"
-   echo
-   echo "   bash build.sh [options]"
-   echo
-   echo "Options:"
-   echo "   -b, --baseurl <URL>      The site relative url that start with slash, e.g. '/project'"
-   echo "   -h, --help               Print the help information"
-   echo "   -d, --destination <DIR>  Destination directory (defaults to ./_site)"
-}
-
-
-init() {
-  set -eu
-
-  if [[ -d .container ]]; then
-    rm -rf .container
-  fi
-
-  if [[ -d _site ]]; then
-    jekyll clean
-  fi
-
-  temp=$(mktemp -d)
-  cp -r * $temp
-  cp -r .git $temp
-  mv $temp .container
-
-}
-
-
-check_unset() {
-  if [[ -z ${1:+unset} ]]
-  then
-    help
-    exit 1
-  fi
-}
-
-
-while [[ $# -gt 0 ]]
-do
-  opt="$1"
-  case $opt in
-    -b|--baseurl)
-      check_unset $2
-
-      if [[ $2 == \/* ]]
-      then
-        CMD+=" -b $2"
-      else
-        help
-        exit 1
-      fi
-
-      shift
-      shift
-      ;;
-    -d|--destination)
-      check_unset $2
-      DEST=$(realpath $2)
-      shift;
-      shift;
-      ;;
-    -h|--help)
-      help
-      exit 0
-      ;;
-    *) # unknown option
-      help
-      exit 1
-      ;;
-  esac
-done
-
-
-init
-
-cd .container
-
-echo "$ cd $(pwd)"
-python _scripts/py/init_all.py
-
-CMD+=" -d ${DEST}"
-echo "\$ $CMD"
-eval $CMD
-echo -e "\nBuild success, the site files placed in '${DEST}'."
-
-if [[ -d ${DEST}/.git ]]; then
-
-  if [[ ! -z $(git -C $DEST status -s) ]]; then
-    git -C $DEST add .
-    git -C $DEST commit -m "[Automation] Update site files." -q
-    echo -e "\nPlease push the changes of '$(realpath $DEST)' to remote master branch.\n"
-  fi
-
-fi
-
-cd .. && rm -rf .container
--- a/docs/README_zh-CN.md
+++ b/docs/README_zh-CN.md
@@ -0,0 +1,237 @@
+# Jekyll Theme Chirpy
+
+[![Build Status](https://github.com/cotes2020/jekyll-theme-chirpy/workflows/build/badge.svg?event=push)](https://github.com/cotes2020/jekyll-theme-chirpy/actions?query=event%3Apush)
+[![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)
+
+选择语言: [English](../README.md) | 简体中文
+
+一个不一样的 Jekyll 主题（内附神秘工具），采用响应式设计，方便记录、管理、分享你的知识和经验。
+
+**功能一览**
+
+* 自动暗夜模式
+* 文章最后修改日期
+* 文章目录
+* 自动推荐相关文章
+* 语法高亮
+* 二级目录
+* 搜索
+* Atom 订阅
+*  Disqus 评论
+* Google 分析
+* GA 浏览报告（高级功能）
+* SEO 优化
+* 网站性能优化
+
+
+[![devices-mockup](https://raw.githubusercontent.com/cotes2020/jekyll-theme-chirpy/master/assets/img/sample/devices-mockup.png)](https://chirpy.cotes.info)
+
+## 目录
+
+* [安装](#安装)
+* [运行指南](#运行指南)
+* [参与贡献](#参与贡献)
+* [感谢](#感谢)
+* [赞助](#赞助)
+* [许可证书](#许可证书)
+
+## 安装
+
+### 准备工作
+
+按照 [Jekyll 官方文档](https://jekyllrb.com/docs/installation/) 完成基础环境的安装 (Ruby，RubyGem，Bundler 和 Jekyll)。为了使用项目内免费提供的脚本工具，你还需要安装 [Python](https://www.python.org/downloads/)( >= 3.5) 和 [ruamel.yaml](https://pypi.org/project/ruamel.yaml/)。
+
+如果你的机器系统是 Debian 或者 macOS，则需要确保安装了 [GNU coreutils](https://www.gnu.org/software/coreutils/)。否则，通过以下方式获得：
+
+* Debian
+
+ ```console
+ $ sudo apt-get install coreutils
+ ```
+
+* macOS
+
+ ```console
+ $ brew install coreutils
+ ```
+
+接着，[fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) 一份代码，然后克隆你 Fork 的仓库到本地机器上。
+
+```console
+$ git clone git@github.com:USER/jekyll-theme-chirpy.git
+```
+
+`USER` 替换为你的 GitHub username。
+
+
+
+### 安装 Jekyll 插件
+
+在根目录下运行:
+
+```terminal
+$ bundle install
+```
+`bundle` 命令会自动安装 `Gemfile` 内声明的依赖插件.
+
+
+
+## 运行指南
+
+### 文件目录
+
+下面是主要的文件目录：
+
+```sh
+jekyll-theme-chirpy/
+├── _data
+├── _includes      
+├── _layouts
+├── _posts          # posts stay here
+├── _scripts
+├── .travis.yml     # remove it
+├── .github         # remove this, too
+├── assets      
+├── tabs
+│   └── about.md    # the ABOUT page
+├── .gitignore
+├── 404.html
+├── Gemfile
+├── LICENSE
+├── README.md
+├── _config.yml     # configuration file
+├── tools           # script tools
+├── docs
+├── feed.xml
+├── index.html
+├── robots.txt
+└── sitemap.xml
+```
+
+
+你需要将以下文件或目录删除:
+
+- .travis.yml
+- .github
+
+
+### 配置文件
+
+根据个人需要去修改 `_config.yml` 的变量，大部分都有注释介绍用法。
+
+* 头像
+    
+    示例的头像文件放置在：`/assets/img/sample/avatar.jpg`. 把它换成你自己的头像，路径不限定，越小越好。(压缩图像体积可上这个网站：*<https://tinypng.com/>* ).
+
+* 时区
+
+    时区由 `timezone` 定义，默认为 `亚洲/上海`，如果肉身翻墙要换城市可在此列表找到： [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) 或者 [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
+
+
+###  本地运行
+
+使用以下工具可轻松运行:
+
+```terminal
+$ bash tools/run.sh
+```
+
+访问本地服务： <http://localhost:4000>
+
+如果你想在本地服务运行后，把修改源文件的更改实时刷新，可使用选项 `-r` (或 `--realtime`)，不过要先安装依赖 [**fswatch**](http://emcrisostomo.github.io/fswatch/) 。
+
+###  部署到 GitHub Pages
+
+部署开始前，把  `_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`。
+
+#### 方法 1: 由 GitHub Pages 生成站点
+
+依照本方法，你可以直接把源码推送到远端仓库。
+
+> **注**: 如果你想使用任何不在这个[列表](https://pages.github.com/versions/)上的插件，越过此方法，直接看 [*方法 2: 本地构建*](#方法-2-本地构建).
+
+**1**. 仓库改名为:
+
+|站点类型 | 仓库名称|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| `<username>.github.io` 以外的名字，譬如 `project`|
+
+**2**. 提交本地更改，然后运行:
+
+```console
+$ bash tools/init.sh
+```
+
+>**注**: *最后更新* 列表根据文章的 git 修改记录生成，所以运行前先把 `_posts` 目录的修改提交。
+
+它会自动生成文章的 *最后修改日期* 和 *分类 / 标签* 页面.
+
+**3**. 推送到 `origin/master` 然后到 GitHub 网页为该项目开启 Pages 服务。
+
+**4**. 网站将运行在：
+
+|站点类型 | 网站 URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|
+
+
+#### 方法 2: 本地构建
+
+由于安全原因，GitHub Pages 不允许第三方插件运行，如果你想突破规则，就要本地构建站点内容。
+
+**1**. 到 GitHub 网页，创建一个新的仓库，根据以下规则命名: 
+
+|站点类型 | 仓库名称|
+|:---|:---|
+|User or Organization | `<username>.github.io`|
+|Project| `<username>.github.io` 以外的名字， 例如 `project`|
+
+然后 Clone 新仓库到本地。
+
+**2**. 构建站点:
+
+```console
+$ bash tools/build.sh -d /path/to/local/project/
+```
+> `project` 为新仓库名称。
+
+生成的静态文件将会在 `/path/to/local/project`. 把新仓库的修改提交并推送到远端 `master` 分支.
+
+**3**. 回到 GithHub 网页，为该仓库开启 Pages 服务。
+
+**4**. 网站将运行在:
+
+|站点类型 | 站点 URL |
+|:---|:---|
+|User or Organization | `https://<username>.github.io/`|
+|Project| `https://<username>.github.io/project/`|
+
+
+### 文档
+
+更多细节及更佳的阅读体验，请参阅 [线上教程](https://chirpy.cotes.info/categories/tutorial/)。 与此同时，[Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki) 也有一份教程的拷贝。
+
+
+## 参与贡献
+
+三人行必有我师，欢迎提报告 bug, 帮助改进代码质量，或者提交新功能。具体操作规则请参考[此文](.github/CONTRIBUTING.md)，谢谢🙏。
+
+## 感谢
+
+这个主题的开发主要基于 [Jekyll](https://jekyllrb.com/) 生态、[Bootstrap](https://getbootstrap.com/)、[Font Awesome](https://fontawesome.com/) 和其他一些出色的工具 (相关文件中可以找到这些工具的版权信息).
+
+: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/feed.xml
+++ b/feed.xml
@@ -1,6 +1,8 @@
 ---
 layout: compress
 # Atom Feed, reference: https://validator.w3.org/feed/docs/atom.html
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2019 Cotes Chung
 # MIT License
 ---
@@ -28,8 +30,8 @@ layout: compress
    <title>{{ post.title }}</title>
    <link href="{{ post_absolute_url }}" rel="alternate" type="text/html" title="{{ post.title }}" />
    <published>{{ post.date | date_to_xmlschema }}</published>
-  {% if post.lastmod %}
-    <updated>{{ post.lastmod | date_to_xmlschema }}</updated>
+  {% if post.seo.date_modified %}
+    <updated>{{ post.seo.date_modified | date_to_xmlschema }}</updated>
  {% else %}
    <updated>{{ site.time | date_to_xmlschema }}</updated>
  {% endif %}
--- a/index.html
+++ b/index.html
@@ -1,11 +1,12 @@
 ---
 layout: home
-title: Home
 breadcrumb:
  -
    label: Posts

 # Index page
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---
--- a/init.sh
+++ b/init.sh
@@ -1,62 +0,0 @@
-#!/bin/bash
-#
-# Initial the Categories/Tags pages and Lastmod for posts.
-# © 2019 Cotes Chung
-# Published under MIT License
-
-
-CATEGORIES=false
-TAGS=false
-LASTMOD=false
-
-set -eu
-
-if [[ ! -z $(git status -s) ]]; then
-  echo "Warning: Commit the changes of the repository first."
-  git status -s
-  exit 1
-fi
-
-python _scripts/py/init_all.py
-
-find . | grep -E "(__pycache__|\.pyc|\.pyo$)" | xargs rm -rf
-
-msg="Updated"
-
-if [[ ! -z $(git status categories -s) ]]; then
-  git add categories/
-  msg+=" the Categories"
-  CATEGORIES=true
-fi
-
-
-if [[ ! -z $(git status tags -s) ]]; then
-  git add tags/
-  if [[ $CATEGORIES = true ]]; then
-    msg+=","
-  else
-    msg+=" the"
-  fi
-  msg+=" Tags"
-  TAGS=true
-fi
-
-if [[ ! -z $(git status _posts -s) ]]; then
-  git add _posts/
-  if [[ $CATEGORIES = true || $TAGS = true ]]; then
-    msg+=","
-  else
-    msg+=" the"
-  fi
-  msg+=" Lastmod"
-  LASTMOD=true
-fi
-
-if [[ $CATEGORIES = true || $TAGS = true || $LASTMOD = true ]]; then
-  msg+=" for post(s)."
-  git commit -m "[Automation] $msg"
-else
-  msg="Nothing changed."
-fi
-
-echo $msg
--- a/robots.txt
+++ b/robots.txt
@@ -1,5 +1,7 @@
 ---
 # The robots rules
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 layout: null
--- a/sitemap.xml
+++ b/sitemap.xml
@@ -1,28 +1,20 @@
 ---
 layout: compress
+
 # The Sitemap template
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---

 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+
 {% for post in site.posts %}
-  {% unless post.published == false %}
-
-    {% capture lastmod %}
-      {% if post.lastmod %}
-        {{ post.lastmod }}
-      {% elsif post.date %}
-          {{ post.date }}
-        {% else %}
-          {{ site.time }}
-        {% endif %}
-      {% endcapture %}
-
  <url>
    <loc>{{ site.url | append: site.baseurl | append: post.url }}</loc>
-    <lastmod>{{ lastmod | date_to_xmlschema }}</lastmod>
+    <lastmod>{{ site.time | date_to_xmlschema }}</lastmod>

    {% if post.sitemap.changefreq %}
      <changefreq>{{ post.sitemap.changefreq }}</changefreq>
@@ -36,12 +28,34 @@ layout: compress
      <priority>0.5</priority>
    {% endif %}
  </url>
-  {% endunless %}
 {% endfor %}

 {% for page in site.pages %}

-  {% if site.sitemap_exclude contains page.url %}
+  {% assign pass = false %}
+
+  {% for fuzzy in site.sitemap_exclude.fuzzy %}
+    {% if page.url contains fuzzy %}
+      {% assign pass = true %}
+      {% break %}
+    {% endif %}
+  {% endfor %}
+
+  {% unless pass %}
+    {% for accurate in site.sitemap_exclude.accurate %}
+      {% assign len = accurate | size %}
+      {% capture beg %}{{ 0 | minus: len }}{% endcapture %}
+      {% capture tail %}{{ page.url | slice: beg, len }}{% endcapture %}
+
+      {% if tail == accurate %}
+        {% assign pass = true %}
+        {% break %}
+      {% endif %}
+
+    {% endfor %}
+  {% endunless %}
+
+  {% if pass %}
    {% continue %}
  {% endif %}

--- a/tabs/about.md
+++ b/tabs/about.md
@@ -2,6 +2,8 @@
 title: About

 # The About page
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---
--- a/tabs/archives.md
+++ b/tabs/archives.md
@@ -2,6 +2,8 @@
 title: Archives

 # The Archives of posts.
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---
--- a/tabs/categories.md
+++ b/tabs/categories.md
@@ -2,6 +2,8 @@
 title: Categories

 # All the Categories of posts
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---
--- a/tabs/tags.md
+++ b/tabs/tags.md
@@ -2,6 +2,8 @@
 title: Tags

 # All the Tags of posts.
+# v2.0
+# https://github.com/cotes2020/jekyll-theme-chirpy
 # © 2017-2019 Cotes Chung
 # MIT License
 ---
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Cotes Chung	230a4f55a4	Fetching popperjs synchronously	2020-04-04 01:03:00 +08:00
Cotes Chung	214480613e	Improved script tools.	2020-04-04 01:03:00 +08:00
Cotes Chung	ad992db75f	Improved theme mode switching logic.	2020-04-04 01:03:00 +08:00
Cotes Chung	a9245494c9	Fixed the template of Sitemap and Feed.	2020-04-04 01:03:00 +08:00
Cotes Chung	1ce1455ce2	Improved the PV fetching experience.	2020-04-04 01:03:00 +08:00
Cotes Chung	9f6173231b	Fixed the Docs.	2020-04-03 03:00:51 +08:00
Cotes Chung	8f0c3659d6	Resume hover effect for links on Category/Tag pages.	2020-04-01 20:45:41 +08:00
Cotes Chung	da55d34d9b	Optimized some colors in light-mode.	2020-04-01 20:45:41 +08:00
Cotes Chung	91bb726216	Format the pv number.	2020-03-19 20:34:13 +08:00
Cotes Chung	b4daef2f59	Remove redundant DOM structure.	2020-03-07 01:25:27 +08:00
Cotes Chung	d5460c90c5	Update tutorial on demo site.	2020-03-04 20:15:21 +08:00
Cotes Chung	d1e3b7b5ae	Recover categories style. missing on SCSS rewrite.	2020-03-04 07:29:31 +08:00
Cotes Chung	6fa8bbe922	Optimized the position of TOC.	2020-03-03 20:17:51 +08:00
Cotes Chung	e383f80e5e	Updated contribution guidelines.	2020-03-03 19:18:01 +08:00
Cotes Chung	78658e9838	Update README.	2020-03-03 19:18:01 +08:00
Cotes Chung	7fb2988d99	Update tutorial.	2020-03-03 19:18:01 +08:00
Cotes Chung	073c6a2f61	Update github action config.	2020-03-02 01:32:20 +08:00
Cotes Chung	8dde202c3e	Update travis specific branch.	2020-03-01 23:22:26 +08:00
Cotes Chung	01fe877ebb	Optimize the tooltip position of sharing icons.	2020-03-01 05:03:40 +08:00
Cotes Chung	0425b1058f	Optimize the typography.	2020-03-01 05:03:40 +08:00
Cotes Chung	3b4ea05cd3	Move files.	2020-02-28 06:19:38 +08:00
Cotes Chung	259a6624ed	Improve the way of using color schemes. - Gracefully switch code color scheme in the future. - Also uniform border color.	2020-02-28 06:03:20 +08:00
Cotes Chung	4f903b3041	Separate the major variables.	2020-02-27 20:17:37 +08:00
Cotes Chung	f3280bc136	Import comment to papes.	2020-02-27 17:37:21 +08:00
Cotes Chung	bc8f8cb132	More friendly to sidebar personalization.	2020-02-27 15:29:40 +08:00
Cotes Chung	d1371fbb98	Fix sitemap.	2020-02-27 04:04:00 +08:00
Cotes Chung	ec15ec4d8b	Move elements' position. for button ‘back-to-top’ and mode-toggle placeholder.	2020-02-27 04:04:00 +08:00
Cotes Chung	e4875b6318	Increase the footer border width. in mobile views.	2020-02-26 03:13:09 +08:00
Cotes Chung	8ec22ddda0	Update python version on travis. https://docs.travis-ci.com/user/reference/bionic/#python-support	2020-02-26 03:13:09 +08:00
Cotes Chung	d6586ec2e6	Fixed dark mode compatibility for old browsers. refer to issue #30	2020-02-26 03:13:09 +08:00
Cotes Chung	73d1027acc	Rewrite styles with SCSS.	2020-02-26 00:49:51 +08:00
Cotes Chung	f353c7a97b	Update issues template. [skip travis]	2020-02-23 23:28:21 +08:00
Cotes Chung	d587ba5d23	Update workflow config. [skip travis]	2020-02-23 23:27:58 +08:00
Cotes Chung	ce7c576c3a	Update README.	2020-02-23 21:38:10 +08:00
Cotes Chung	b3c493a6de	Improve the way to define and use date-format.	2020-02-22 07:23:37 +08:00
Cotes Chung	4661ec95b9	Split paginator from Home layout.	2020-02-22 07:09:09 +08:00
Cotes Chung	b7ffc43d8d	Rewrite post’s style as sass.	2020-02-22 04:57:53 +08:00
Cotes Chung	6102d79e6e	Add configurable label to post-nav button.	2020-02-22 03:15:26 +08:00
Cotes Chung	021311974f	Replace the non-link elements. Good for CSP.	2020-02-22 03:15:26 +08:00
Cotes Chung	ed15a81300	Footer responsive improvement.	2020-02-21 19:01:51 +08:00
Cotes Chung	232c956b81	Optimized icon position.	2020-02-21 04:48:07 +08:00
Cotes Chung	8e01d90018	Prettified the border.	2020-02-21 04:48:07 +08:00
Cotes Chung	8b059432d3	Improved the responsive of sidebar bottom.	2020-02-21 04:48:07 +08:00
Cotes Chung	1d61608c71	More tooltip placement specified.	2020-02-21 04:48:07 +08:00
Cotes Chung	4c631f6839	Enhanced JS function.	2020-02-21 04:48:07 +08:00
Cotes Chung	9935f76530	Added more config for license.	2020-02-21 04:48:07 +08:00
Cotes Chung	64125e6e42	Optimized the JS import sequence.	2020-02-21 04:48:07 +08:00
Cotes Chung	16bb4e4544	Changed the position of lastmod and related posts.	2020-02-21 04:48:07 +08:00
Cotes Chung	fd56f5b600	Optimized the runner script.	2020-02-21 04:48:06 +08:00
Cotes Chung	a82d3647da	Splited the data of navigation tabs.	2020-02-21 04:48:06 +08:00
Cotes Chung	32d838fede	Prettified the mode toggle switch.	2020-02-21 04:48:06 +08:00
Cotes Chung	840eab9566	Feature: Added post sharing options. Also added a license statement at the bottom of the posts.	2020-02-21 04:48:06 +08:00
Cotes Chung	2ad56cf249	Redesigned Footer.	2020-02-21 04:48:06 +08:00
Cotes Chung	f302f798aa	Change the tooltips placement. Also modified code indentation.	2020-02-17 02:51:12 +08:00
Cotes Chung	79c7a5101f	Feature: Make theme colors configurable.	2020-02-15 16:36:19 +08:00
Cotes Chung	b43c162903	Updated the footer text.	2020-02-15 16:36:19 +08:00
Cotes Chung	65040ddd90	Optimized the dark-mode toggle	2020-02-15 16:36:19 +08:00
Cotes Chung	a53afb912f	Image SEO optimization.	2020-02-15 16:36:19 +08:00
Cotes Chung	cdab915bd9	Optimized the footer responsive design.	2020-02-15 16:36:19 +08:00
Cotes Chung	44aba76849	Added footnote's dark-mode color.	2020-02-13 22:55:15 +08:00
Cotes Chung	f3a9b4b293	Rename CSS class.	2020-02-13 22:31:28 +08:00
Cotes Chung	a4435a45ec	Imported the dark-mode toggle.	2020-02-13 22:31:28 +08:00
Cotes Chung	4390a00604	Set the dark-mode color of <hr>.	2020-02-13 22:24:31 +08:00
Cotes Chung	58af2fefce	Finished the rest dark mode toggle job.	2020-02-13 22:24:31 +08:00
Cotes Chung	7e92a32243	Code style merge and resume some colors.	2020-02-12 00:27:35 +08:00
Miloslav Pavelka	7728cc4d3e	Adding visibility classes for light and dark theme.	2020-02-09 18:11:58 +01:00
Miloslav Pavelka	3f11cef46f	Allow toggling of dark scheme with a body class.	2020-02-09 15:23:39 +01:00
Cotes Chung	8e67f69297	Added new button style.	2020-02-09 03:06:27 +08:00
Cotes Chung	0953cf123c	Improved tab highlighting experience.	2020-02-09 02:57:45 +08:00
Cotes Chung	a0179b2efe	Fixed the link of posts' nav-button.	2020-02-04 04:55:09 +08:00
Cotes Chung	b27ae2e436	Beautified the dark-mode color of blockquote.	2020-02-04 04:55:09 +08:00
Cotes Chung	df288e38b9	Beautified the nav-button of Posts.	2020-02-04 04:55:09 +08:00
Cotes Chung	2746c9d96f	Optimize workflow.	2020-02-04 04:55:09 +08:00
Cotes Chung	ae98334edd	Updated the Docs.	2020-02-04 04:55:09 +08:00
Cotes Chung	c30bfd5649	Move the CI to Github Actions.	2020-02-04 04:55:09 +08:00
Cotes Chung	47a32fcce3	Updated the CI config.	2020-02-04 04:55:09 +08:00
Cotes Chung	1f8b81965d	Add Python requirements file.	2020-02-04 04:55:09 +08:00
Cotes Chung	c53f23df5c	Beautified the ToC.	2020-02-04 04:55:09 +08:00
Cotes Chung	e67a74c4ec	Fixed tutorial.	2020-02-04 04:55:09 +08:00
Cotes Chung	c258bbc8d9	Update label in posts.	2020-02-04 04:55:09 +08:00
Cotes Chung	9bd0b1bdf8	Optimized the position of avatar.	2020-02-04 04:55:09 +08:00
Cotes Chung	e09fd4d6c8	Beautified the table's in dark mode.	2020-02-04 04:55:09 +08:00
Cotes Chung	b09f5127ad	Optimized the resource prioritization.	2020-02-04 04:55:09 +08:00
Cotes Chung	3458b9ad82	Added a new script tool to compress JS.	2020-02-04 04:55:09 +08:00
Cotes Chung	b0d6513b7c	Updated README and tutorial. Formatted README.	2020-01-14 02:57:31 +08:00
Cotes Chung	12bacea674	Create issue templates	2020-01-14 02:57:31 +08:00
Cotes Chung	26cd681802	Fixed the build tool.	2020-01-14 02:57:31 +08:00
Cotes Chung	6cef0829a8	Updated seo-tag settings. Although `tagline` hasn't been released yet.	2020-01-14 02:57:31 +08:00
Cotes Chung	53e01c1778	Code optimization.	2020-01-14 02:57:31 +08:00
Cotes Chung	501036cafa	Updated footer.	2020-01-14 02:57:31 +08:00
Cotes Chung	335b956e13	Reduce font weight of post nav-button.	2020-01-14 02:57:31 +08:00
Cotes Chung	8fcf1e35fc	Dark mode color optimization.	2020-01-14 02:57:31 +08:00
Cotes Chung	ff9663f376	Fixed related URL.	2020-01-14 02:57:31 +08:00
Cotes Chung	b534ab74de	Optimized the dark mode color of Categories.	2020-01-14 02:57:31 +08:00
Cotes Chung	a22d510b1d	Ignore bundle cache from Git commits.	2020-01-14 02:57:31 +08:00
Cotes Chung	a812ded9cd	Updated Docs.	2020-01-14 02:57:31 +08:00
Cotes Chung	34836f7703	Beautified sidebar in x-large screens. screen width >= 1650px	2020-01-14 02:57:31 +08:00
Cotes Chung	2386fe5bd8	Another super feature: auto dark mode!	2020-01-14 02:57:31 +08:00
Cotes Chung	1c2be0c243	Updated syntax highlighter.	2020-01-14 02:57:31 +08:00
Cotes Chung	9495596f49	Changed images location and effects.	2020-01-14 02:57:31 +08:00
Cotes Chung	a42a5bfab4	Beautified the navigation button in post.	2020-01-14 02:57:31 +08:00
Cotes Chung	2ad4dc1b4e	Display title in post's page button.	2020-01-14 02:57:31 +08:00
Cotes Chung	6ba47c931a	Shutdown Disqus by default.	2020-01-14 02:57:31 +08:00
Cotes Chung	8591e921e4	Added more project info in files.	2020-01-14 02:57:31 +08:00
Cotes Chung	fa43f92370	Beautified the hover of related post.	2020-01-14 02:57:31 +08:00
Cotes Chung	6aac3f95fe	Important: Fixed sitemap template.	2020-01-14 02:57:31 +08:00
Cotes Chung	3e004d1bf3	Moved the script tools.	2020-01-02 09:13:05 +08:00
Cotes Chung	5bb810875b	Moved search cache.	2020-01-02 08:45:51 +08:00
				`@@ -0,0 +1 @@`
				`function copyLink(a){if(!a\|\|0===a.length){a=window.location.href}var b=$("<input>");$("body").append(b);b.val(a).select();document.execCommand("copy");b.remove();alert("Link copied successfully!")};`
				`@@ -1 +0,0 @@`
				`$(function(){$('[data-toggle="tooltip"]').tooltip({placement:"auto"})});`