diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md index bf7a5a3..bf8db4d 100644 --- a/.github/CODE_OF_CONDUCT.md +++ b/.github/CODE_OF_CONDUCT.md @@ -11,8 +11,7 @@ appearance, race, religion, or sexual identity and orientation. ## Our Standards -Examples of behavior that contributes to creating a positive environment -include: +Examples of behavior that contributes to creating a positive environment include: * Using welcoming and inclusive language * Being respectful of differing viewpoints and experiences @@ -22,12 +21,10 @@ include: Examples of unacceptable behavior by participants include: -* The use of sexualized language or imagery and unwelcome sexual attention or - advances +* The use of sexualized language or imagery and unwelcome sexual attention or advances * Trolling, insulting/derogatory comments, and personal or political attacks * Public or private harassment -* Publishing others' private information, such as a physical or electronic - address, without explicit permission +* Publishing others' private information, such as a physical or electronic address, without explicit permission * Other conduct which could reasonably be considered inappropriate in a professional setting @@ -55,7 +52,7 @@ further defined and clarified by project maintainers. ## Enforcement Instances of abusive, harassing, or otherwise unacceptable behavior may be -reported by contacting the project team at cotes.chung@gmail.com. All +reported by contacting the project team at `cotes.chung@gmail.com`. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. @@ -68,9 +65,9 @@ members of the project's leadership. ## Attribution This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, -available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html - -[homepage]: https://www.contributor-covenant.org +available at For answers to common questions about this code of conduct, see -https://www.contributor-covenant.org/faq \ No newline at end of file + + +[homepage]: https://www.contributor-covenant.org \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index c8d8379..3c4f292 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -12,11 +12,10 @@ labels: bug - [ ] There are no similar reports on existing issues (including closed ones). - [ ] I found the bug on the latest code of `master` branch. - ## Describe the bug -**To Reproduce** +### To Reproduce Steps to reproduce the behavior: @@ -25,25 +24,24 @@ Steps to reproduce the behavior: 3. Scroll down to '....' 4. See error - -**Expected behavior** +### Expected behavior -**Screenshots** +### Screenshots -**Desktop** +### Desktop - - OS: [e.g. iOS] - - Browser: [e.g. chrome, safari] - - Version: [e.g. 22] +- OS: [e.g. iOS] +- Browser: [e.g. chrome, safari] +- Version: [e.g. 22] -**Smartphone** +### Smartphone - - Device: [e.g. iPhone6] - - OS: [e.g. iOS8.1] - - Browser: [e.g. stock browser, safari] - - Version: [e.g. 22] +- Device: [e.g. iPhone6] +- OS: [e.g. iOS8.1] +- Browser: [e.g. stock browser, safari] +- Version: [e.g. 22] -**Additional context** +### Additional context diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index ddafb4e..4a9d106 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -16,7 +16,7 @@ Please select the desired item checkbox and change it to "[x]", then delete opti - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [ ] Documentation update -## How has this been tested? +## How has this been tested - [ ] My code follows the [Google style guidelines](https://google.github.io/styleguide/) - [ ] I have performed a self-review of my own code diff --git a/README.md b/README.md index 1210ab5..3f51a3f 100644 --- a/README.md +++ b/README.md @@ -48,7 +48,7 @@ $ git clone git@github.com:/jekyll-theme-chirpy -b master --single-bra ### Setting up the local envrionment -If you would like to run or build the project on your local machine, please follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems` and `Bundler`. +If you would like to run or build the project on your local machine, please follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems` and `Bundler`. Before running or building for the first time, please complete the installation of the Jekyll plugins. Go to the root directory of project and run: @@ -90,17 +90,18 @@ $ bash tools/init.sh What it does is: 1. Remove some files or directories from your repository: - - `.travis.yml` - - files under `_posts` - - folder `docs` + * `.travis.yml` + * files under `_posts` + * folder `docs` -2. If you use the `--no-gh` option, the directory `.github` will be deleted. Otherwise, setup the GitHub Action workflow by removing extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in folder `.github`. +2. If you use the `--no-gh` option, the directory `.github` will be deleted. Otherwise, setup the GitHub Action workflow by removing extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in folder `.github`. 3. Automatically create a commit to save the changes. ### Configuration Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options: + * `url` * `avatar` * `timezone` @@ -121,7 +122,7 @@ Few days later, you may find that the file changes does not refresh in real time ### Deployment -Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [_project site_](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`. +Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [*project site*](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`. Assuming you have already gone through the [initialization](#initialization), you can now choose any of the following methods to deploy your website. @@ -130,12 +131,8 @@ Assuming you have already gone through the [initialization](#initialization), yo For security reasons, GitHub Pages build runs on `safe` mode, which restricts us from using tool scripts to generate additional page files. Therefore, we can use GitHub Actions to build the site, store the built site files on a new branch, and use that branch as the source of the Pages service. 1. Push any commit to `origin/master` to trigger the GitHub Actions workflow. Once the build is complete, a new remote branch called `gh-pages` will appear, which is used to store the built site files. - 2. Unless you prefer to project sites, rename your repository to `.github.io` on GitHub. - 3. Choose branch `gh-pages` as the [publishing source](https://docs.github.com/en/github/working-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site) for your GitHub Pages site. - - 4. Visit your website at the address indicated by GitHub. #### Deploy on Other Platforms diff --git a/_posts/2019-08-08-text-and-typography.md b/_posts/2019-08-08-text-and-typography.md index c5dd293..f06580c 100644 --- a/_posts/2019-08-08-text-and-typography.md +++ b/_posts/2019-08-08-text-and-typography.md @@ -11,16 +11,17 @@ This Jekyll template totally compatible with Markdown syntax. Now, let's take a ## Titles -*** +--- + # H1

H2

H3

-#### H4 +

H4

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