1
0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 13:44:15 +00:00

Compare commits

..

7 Commits

Author SHA1 Message Date
Cotes Chung
0b0e493ff0 Bump version to 3.3.2 2021-04-11 01:39:27 +08:00
Cotes Chung
4672973f3a Fix links color in search results 2021-04-11 01:39:25 +08:00
Cotes Chung
f0e3883812 Stop tracking Gemfile.lock in deployment tool (#306) 2021-04-11 01:31:26 +08:00
Cotes Chung
e6d79249a8 Fix the PV fetching failed when local cache is disabled
also improve the PV report logic
2021-04-11 01:30:55 +08:00
Cotes Chung
0b043daa34 Bump version to 3.3.1 2021-04-02 21:15:50 +08:00
Cotes Chung
51930b9bcf Fix the MathJax config was lost in jekyll-compress-html 2021-04-02 21:15:47 +08:00
Cotes Chung
41741dc336 Bump version to 3.3.0 2021-04-02 16:17:39 +08:00
124 changed files with 1081 additions and 1565 deletions

View File

@@ -16,4 +16,4 @@ labels: question
- [ ] My question is based on the latest code of `master` branch.
## Description
<!-- Please describe your question in detail. -->
<!-- Please describe your question in detial. -->

View File

@@ -27,7 +27,7 @@ Please describe the tests that you ran to verify your changes. Provide instructi
### Test Configuration
- Browser type & version:
- Browerser type & version:
- Operating system:
- Bundler version:
- Ruby version:

View File

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

View File

@@ -0,0 +1,20 @@
name: "Intercept bad issue/PRs"
on:
issues:
types: [opened]
pull_request:
types: [opened]
jobs:
autoclose:
runs-on: ubuntu-latest
steps:
- name: Auto close issues/pr that did not follow template
uses: roots/issue-closer@v1.1
with:
repo-token: ${{ secrets.GITHUB_TOKEN }}
issue-pattern: "(\\[x\\]|\\[X\\]) I have read"
issue-close-message: ":wave: Hi @${issue.user.login},\n\nThis issue is being automatically closed because it does not follow the issue template."
pr-pattern: "(\\[x\\]|\\[X\\]) (Bug fix|New feature|Breaking change|Documentation update)|@dependabot"
pr-close-message: ":wave: Hi @${pull_request.user.login},\n\nThis PR is being automatically closed because it does not follow the PR template."

5
.gitignore vendored
View File

@@ -1,9 +1,6 @@
# hidden files
.*
!.git*
!.editorconfig
!.nojekyll
!.travis.yml
!.github
# bundler cache
_site

21
404.html Normal file
View File

@@ -0,0 +1,21 @@
---
layout: page
title: "404: Page not found"
permalink: /404.html
redirect_from:
- /norobots/
- /assets/
- /posts/
dynamic_title: true
---
<div class="lead">
<p>Sorry, we've misplaced that URL or it's pointing to something that doesn't exist. </p>
<p>
<a href="{{ '/' | relative_url }}">Head back Home</a>
to try finding it again, or search for it on the
<a href="{{ 'archives' | relative_url }}">Archives page</a>.
</p>
</div>

105
README.md
View File

@@ -1,70 +1,47 @@
<div align="right">
<a href="https://github.com/cotes2020/jekyll-theme-chirpy#readme">EN</a> |
<a href="https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/README.zh-CN.md">中文 (简体)</a>
</div>
# Chirpy
<div align="center">
<h1>Chirpy Jekyll Theme</h1>
<p>
<a href="https://rubygems.org/gems/jekyll-theme-chirpy">
<img alt="Gem Version" src="https://img.shields.io/gem/v/jekyll-theme-chirpy?color=brightgreen"></img>
</a>
<a href="https://github.com/cotes2020/jekyll-theme-chirpy/actions?query=branch%3Amaster+event%3Apush">
<img alt="Build Status" src="https://github.com/cotes2020/jekyll-theme-chirpy/workflows/build/badge.svg?branch=master&event=push"></img>
</a>
<a href="https://app.codacy.com/manual/cotes2020/jekyll-theme-chirpy?utm_source=github.com&utm_medium=referral&utm_content=cotes2020/jekyll-theme-chirpy&utm_campaign=Badge_Grade_Dashboard">
<img alt="Codacy Badge" src="https://api.codacy.com/project/badge/Grade/8220b926db514f13afc3f02b7f884f4b"></img>
</a>
<a href="https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE">
<img alt="GitHub license" src="https://img.shields.io/github/license/cotes2020/jekyll-theme-chirpy.svg"></img>
</a>
<a href="https://996.icu">
<img alt="996.icu" src="https://img.shields.io/badge/link-996.icu-%23FF4D5B.svg"></img>
</a>
</p>
</div>
Language: English | [简体中文](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/README.zh-CN.md)
A minimal, sidebar, responsive web design Jekyll theme that focuses on text presentation. Designed to help you easily record and share your knowledge.
[![Gem Version](https://img.shields.io/gem/v/jekyll-theme-chirpy?color=brightgreen)](https://rubygems.org/gems/jekyll-theme-chirpy)
[![Build Status](https://github.com/cotes2020/jekyll-theme-chirpy/workflows/build/badge.svg?branch=master&event=push)](https://github.com/cotes2020/jekyll-theme-chirpy/actions?query=branch%3Amaster+event%3Apush)
[![Codacy Badge](https://api.codacy.com/project/badge/Grade/8220b926db514f13afc3f02b7f884f4b)](https://app.codacy.com/manual/cotes2020/jekyll-theme-chirpy?utm_source=github.com&utm_medium=referral&utm_content=cotes2020/jekyll-theme-chirpy&utm_campaign=Badge_Grade_Dashboard)
[![GitHub license](https://img.shields.io/github/license/cotes2020/jekyll-theme-chirpy.svg)](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/LICENSE)
[![996.icu](https://img.shields.io/badge/link-996.icu-%23FF4D5B.svg)](https://996.icu)
[Live Demo »](https://chirpy.cotes.info)
A minimal, sidebar, responsive web design Jekyll theme that focuses on text presentation. Designed to help you record and share your knowledge easily. [Live Demo »](https://chirpy.cotes.info)
<p align="center">
<a href="https://chirpy.cotes.info">
<img alt="Devices Mockup" src="https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/commons/devices-mockup.png"></img>
</a>
</p>
[![Devices Mockup](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/commons/devices-mockup.png)](https://chirpy.cotes.info)
## Features
- Localized Layout
- Configurable Theme Mode
- Pinned Posts
- Hierarchical Categories
- Last Modified Date for Posts
- Configurable theme mode
- Double-level Categories
- Last modified date for posts
- Table of Contents
- Automatically Recommend Related Posts
- Syntax Highlighting
- Mathematical Expressions
- Mermaid Diagram & Flowchart
- Automatically recommend related posts
- Syntax highlighting
- Mathematical expressions
- Mermaid diagram & flowchart
- Search
- Atom Feeds
- Disqus Comments
- Google Analytics
- GA Pageviews Reporting (Advanced)
- SEO & Performance Optimization
- GA Pageviews reporting (Advanced)
- SEO and Performance Optimization
## Prerequisites
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems`, `Jekyll` and `Bundler`. Please note that the version of `Ruby` must meet the requirements of the theme on [RubyGems.org](https://rubygems.org/gems/jekyll-theme-chirpy).
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems`, `Jekyll` and `Bundler`.
## Installation
There are two ways to get the theme:
- **[Install from RubyGems](#install-from-rubygems)** - Easy to update, isolate irrelevant project files so you can focus on writing.
- **[Fork on GitHub](#fork-on-github)** - Convenient for custom development, but difficult to update, only suitable for web developers.
- **Install from RubyGems** - Easy to update, isolate irrelevant project files so you can focus on writing.
- **Fork on GitHub** - Convenient for custom development, but difficult to update, only suitable for web developers.
### Install from RubyGems
### Installing the Theme Gem
Add this line to your Jekyll site's `Gemfile`:
@@ -84,19 +61,15 @@ And then execute:
$ bundle
```
Next, go to the installed local theme path:
Finally, copy the required files from the theme's gem (for detailed files, see [starter project][starter]) to your Jekyll site.
```console
$ cd "$(bundle info --path jekyll-theme-chirpy)"
```
And then copy the critical files (for details, see [starter project][starter]) from the theme's gem to your Jekyll site.
> ⚠️ **Watch out for duplicate files!**
> **Hint**: To locate the installed themes gem, execute:
>
If your Jekyll site is created by the `jekyll new` command, there will be `index.markdown` and `about.markdown` in the root directory of your site. Please be sure to remove them, otherwise they will overwrite the `index.html` and `_tabs/about.html` from this project, resulting in blank or messy pages.
> ```console
> $ bundle info --path jekyll-theme-chirpy
> ```
As an alternative, which we recommend, you can create a Jekyll site [**using the starter template**][use-starter] to save time copying files from the theme's gem. We've prepared everything you need there!
Or you can [**use the starter template**][use-starter] to create a Jekyll site to save time copying files from theme's gem. We have prepared everything for you there!
### Fork on GitHub
@@ -123,7 +96,7 @@ What it does is:
- 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 the extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in the 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.
@@ -138,12 +111,6 @@ Update the variables of `_config.yml` as needed. Some of them are typical option
- `timezone`
- `lang`
### Customing Stylesheet
If you need to customize stylesheet, copy the theme's `assets/css/style.scss` to the same path on your Jekyll site, and then add the custom style at the end of the style file.
Starting from `v4.1.0`, if you want to overwrite the SASS variables defined in `_sass/addon/variables.scss`, create a new file `_sass/variables-hook.scss` and assign new values to the target variable in it.
### Running Local Server
You may want to preview the site contents before publishing, so just run it by:
@@ -165,7 +132,7 @@ Open a browser and visit to _<http://localhost:4000>_.
### 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, e.g, `/project-name`.
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, e.g, `/project-name`.
Now you can choose ONE of the following methods to deploy your Jekyll site.
@@ -178,13 +145,13 @@ Quickly check the files needed for GitHub Actions build:
- Ensure your Jekyll site has the file `.github/workflows/pages-deploy.yml`. Otherwise, create a new one and fill in the contents of the [workflow file][workflow], and the value of the `on.push.branches` should be the same as your repo's default branch name.
- Ensure your Jekyll site has file `tools/test.sh` and `tools/deploy.sh`. Otherwise, copy them from this repo to your Jekyll site.
And then rename your repository to `<GH-USERNAME>.github.io` on GitHub.
And then rename your repoistory to `<GH-USERNAME>.github.io` on GitHub.
Now publish your Jekyll site by:
1. Push any commit to remote to trigger the GitHub Actions workflow. Once the build is complete and successful, a new remote branch named `gh-pages` will appear to store the built site files.
2. Browse to your repo's landing page on GitHub and select the 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) through _Settings__Options__GitHub Pages_:
2. Browse to your repo's landing page on GitHub and select the 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) throught _Settings__Options__GitHub Pages_:
![gh-pages-sources](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190809/gh-pages-sources.png)
@@ -214,7 +181,7 @@ Unless you specified the output path, the generated site files will be placed in
## Documentation
For more details and a better reading experience, please check out the [tutorials on the 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). Please note that the tutorials on the demo website or Wiki are based on the latest release, and the features of `master` branch usually ahead of the documentation.
For more details and the better reading experience, please check out the [tutorials on 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
@@ -222,11 +189,11 @@ The old saying, "Two heads are better than one." Consequently, welcome to report
## Credits
This theme is mainly built with [Jekyll](https://jekyllrb.com/) ecosystem, [Bootstrap](https://getbootstrap.com/), [Font Awesome](https://fontawesome.com/) and some other wonderful tools (their copyright information can be found in the relevant files). The avatar and favicon design comes from [Clipart Max](https://www.clipartmax.com/middle/m2i8b1m2K9Z5m2K9_ant-clipart-childrens-ant-cute/).
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.
: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.
Last but not least, thank [JetBrains][jb] for providing the open source license.
Also, thank [JetBrains][jb] for providing the open source license.
## Sponsoring

View File

@@ -7,21 +7,14 @@ theme: jekyll-theme-chirpy
# change below value to '/projectname'.
baseurl: ''
# The language of the site layout http://www.lingoes.net/en/translator/langcode.htm
# Go to folder '_data/locales' to check the available language options
lang: en
# The lang attribute of HTML http://www.lingoes.net/en/translator/langcode.htm
# We can specify a language different from the layout of the content.
# If it is not assigned, the site will use the value of 'lang' instead.
content_lang: ''
# the HTML language tag https://www.w3.org/International/questions/qa-choosing-language-tags
lang: en-US
# Change to your timezone http://www.timezoneconverter.com/cgi-bin/findzone/findzone
timezone: Asia/Shanghai
# jekyll-seo-tag settings https://github.com/jekyll/jekyll-seo-tag/blob/master/docs/usage.md
# --------------------------
# --------------------------
title: Chirpy # the main title
tagline: A text-focused Jekyll theme # it will display as the sub-title
@@ -54,16 +47,18 @@ social:
# - https://www.linkedin.com/in/username
google_site_verification: google_meta_tag_verification # change to your verification string
# ↑ --------------------------
# --------------------------
google_analytics:
id: '' # fill in your Google Analytics ID
# Google Analytics pageviews report settings
id: '' # Fill with your Google Analytics ID
pv:
proxy_endpoint: # fill in the Google Analytics superProxy endpoint of Google App Engine
cache_path: # the local PV cache data, friendly to visitors from GFW region
# The Google Analytics pageviews switch.
# 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.
# Prefer color scheme setting.
#
@@ -110,6 +105,10 @@ kramdown:
line_numbers: true
start_line: 1
# DO NOT change this unless you're a Pro user on Jekyll and Web development,
# Or you think you're smart enough to change other relevant URLs within this template.
permalink: /posts/:title/
collections:
tabs:
output: true
@@ -125,9 +124,6 @@ defaults:
layout: post
comments: true # Enable comments in posts.
toc: true # Display TOC column in posts.
# DO NOT modify the following parameter unless you are confident enough
# to update the code of all other post links in this project.
permalink: /posts/:title/
-
scope:
path: _drafts
@@ -155,6 +151,9 @@ compress_html:
envs: [development]
exclude:
- vendor
- Gemfile
- Gemfile.lock
- '*.gem'
- '*.gemspec'
- tools
@@ -163,7 +162,8 @@ exclude:
- LICENSE
- gulpfile.js
- node_modules
- '*.json'
- package.json
- package-lock.json
jekyll-archives:
enabled: [categories, tags]
@@ -173,6 +173,3 @@ jekyll-archives:
permalinks:
tag: /tags/:name/
category: /categories/:name/
# Outdated configuration warning
outdated: '-- Missing configuration options! --'

7
_data/date_format.yml Normal file
View File

@@ -0,0 +1,7 @@
# The date format
tooltip: "%a, %b %e, %Y, %l:%M %p %z"
post:
long: "%b %e, %Y"
short: "%b %e"

19
_data/label.yml Normal file
View File

@@ -0,0 +1,19 @@
# The label text of site.
panel:
lastmod: Recent Update
trending_tags: Trending Tags
toc: Contents
post:
relate_posts: Further Reading
share: Share
button:
next: Newer
previous: Older
search_hint: Search # text show on search bar
pin_prompt: Pinned # pinned prompt
read_time_unit: min # see posts' time to read

View File

@@ -1,87 +0,0 @@
# The layout text of site
# ----- Commons label -----
layout:
post: Post
category: Category
tag: Tag
# The tabs of sidebar
tabs:
# format: <filename_without_extension>: <value>
home: Home
categories: Categories
tags: Tags
archives: Archives
about: About
# text displayed in the search bar
search:
hint: search
cancel: Cancel
panel:
lastmod: Recent Update
trending_tags: Trending Tags
toc: Contents
# The liquid date format http://strftime.net/
date_format:
tooltip: '%a, %b %e, %Y, %l:%M %p %z'
post:
long: '%b %e, %Y'
short: '%b %e'
archive_month: '%b'
copyright:
# Shown at the bottom of the post
license:
template: This post is licensed under :LICENSE_NAME by the author.
name: CC BY 4.0
link: https://creativecommons.org/licenses/by/4.0/
# Displayed in the footer
brief: Some rights reserved.
verbose: >-
Except where otherwise noted, the blog posts on this site are licensed
under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.
meta: Powered by :PLATFORM with :THEME theme.
not_found:
statment: Sorry, we've misplaced that URL or it's pointing to something that doesn't exist.
hint_template: :HEAD_BAK to try finding it again, or search for it on the :ARCHIVES_PAGE.
head_back: Head back Home
archives_page: Archives page
# ----- Posts related labels -----
post:
published: 'on'
updated: Updated
timeago:
day: d ago
hour: hr ago
minute: min ago
just_now: just now
words: words
pageview_measure: views
read_time:
unit: min
prompt: read
relate_posts: Further Reading
share: Share
button:
next: Newer
previous: Older
copy:
title: Copy link
succeed: Link copied successfully!
# pinned prompt of posts list on homepage
pin_prompt: Pinned
# categories page
categories:
category_measure: categories
post_measure: posts

View File

@@ -1,86 +0,0 @@
# The layout text of site
# ----- Commons label -----
layout:
post: 文章
category: 分类
tag: 标签
# The tabs of sidebar
tabs:
# format: <filename_without_extension>: <value>
home: 首页
categories: 分类
tags: 标签
archives: 归档
about: 关于
# text displayed in the search bar
search:
hint: 搜索
cancel: 取消
panel:
lastmod: 最近更新
trending_tags: 热门标签
toc: 目录
# The liquid date format http://strftime.net/
date_format:
tooltip: '%a, %F, %R %z'
post:
long: '%F'
short: '%m-%d'
archive_month: '%m月'
copyright:
# Shown at the bottom of the post
license:
template: 本文由作者按照 :LICENSE_NAME 进行授权
name: CC BY 4.0
link: https://creativecommons.org/licenses/by/4.0/
# Displayed in the footer
brief: 保留部分权利。
verbose: >-
除非另有说明,本网站上的博客文章均由作者按照知识共享署名 4.0 国际 (CC BY 4.0) 许可协议进行授权。
meta: 本站由 :PLATFORM 生成,采用 :THEME 主题。
not_found:
statment: 抱歉,我们放错了该 URL或者它指向了不存在的内容。
hint_template: :HEAD_BAK尝试再次查找它或在:ARCHIVES_PAGE上搜索它。
head_back: 返回主页
archives_page: 归档页面
# ----- Posts related labels -----
post:
published: 发表于
updated: 更新于
timeago:
day: 天前
hour: 小时前
minute: 分钟前
just_now: 刚刚
words:
pageview_measure: 次浏览
read_time:
unit: 分钟
prompt: 阅读
relate_posts: 相关文章
share: 分享
button:
next: 下一篇
previous: 上一篇
copy:
title: 分享链接
succeed: 链接已复制!
# pinned prompt of posts list on homepage
pin_prompt: 顶置
# categories page
categories:
category_measure: 个分类
post_measure: 篇文章

11
_data/rights.yml Normal file
View File

@@ -0,0 +1,11 @@
# License data
license:
name: CC BY 4.0
link: "https://creativecommons.org/licenses/by/4.0/"
brief: Some rights reserved.
verbose: >-
Except where otherwise noted, the blog posts on this site are licensed
under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.

View File

@@ -8,8 +8,3 @@
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.css">
{% endif %}
{% if page.layout == 'page' or page.layout == 'post' %}
<!-- Manific Popup -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/magnific-popup@1.1.0/dist/magnific-popup.min.css">
{% endif %}

View File

@@ -1,17 +1,32 @@
<!--
The Favicons for Web, Android, Microsoft, and iOS (iPhone and iPad) Apps
Generated by: https://realfavicongenerator.net/
Generated by: https://www.favicon-generator.org/
-->
{% capture favicon_path %}{{ '/assets/img/favicons' | relative_url }}{% endcapture %}
{% capture icon_url %}{{ site.baseurl }}/assets/img/favicons{% endcapture %}
<link rel="apple-touch-icon" sizes="180x180" href="{{ favicon_path }}/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="{{ favicon_path }}/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="{{ favicon_path }}/favicon-16x16.png">
<link rel="manifest" href="{{ favicon_path }}/site.webmanifest">
<link rel="shortcut icon" href="{{ favicon_path }}/favicon.ico">
<meta name="apple-mobile-web-app-title" content="{{ site.title }}">
<meta name="application-name" content="{{ site.title }}">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="{{ favicon_path }}/browserconfig.xml">
<link rel="shortcut icon" href="{{ icon_url }}/favicon.ico" type="image/x-icon">
<link rel="icon" href="{{ icon_url }}/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="{{ icon_url }}/apple-icon.png">
<link rel="apple-touch-icon" href="{{ icon_url }}/apple-icon-precomposed.png">
<link rel="apple-touch-icon" sizes="57x57" href="{{ icon_url }}/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="{{ icon_url }}/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="{{ icon_url }}/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="{{ icon_url }}/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="{{ icon_url }}/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="{{ icon_url }}/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="{{ icon_url }}/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="{{ icon_url }}/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="{{ icon_url }}/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="{{ icon_url }}/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="{{ icon_url }}/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="{{ icon_url }}/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="{{ icon_url }}/favicon-16x16.png">
<link rel="manifest" href="{{ icon_url }}/manifest.json">
<meta name='msapplication-config' content='{{ icon_url }}/browserconfig.xml'>
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="{{ icon_url }}/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

View File

@@ -8,30 +8,21 @@
<p class="mb-0">
© {{ 'now' | date: "%Y" }}
<a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
{% if site.data.locales[site.lang].copyright.brief %}
{% if site.data.rights.brief %}
<span data-toggle="tooltip" data-placement="top"
title="{{ site.data.locales[site.lang].copyright.verbose }}">{{ site.data.locales[site.lang].copyright.brief }}</span>
{% else %}
<span class="text-muted">{{ site.outdated }}</span>
title="{{ site.data.rights.verbose }}">{{ site.data.rights.brief }}</span>
{% endif %}
</p>
</div>
<div class="footer-right">
<p class="mb-0">
{% capture _platform %}
<a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>
{% endcapture %}
{% capture _theme %}
<a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a>
{% endcapture %}
{{ site.data.locales[site.lang].meta
| default: 'Powered by :PLATFORM with :THEME theme.'
| replace: ':PLATFORM', _platform | replace: ':THEME', _theme
}}
Powered by
<a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a>
with
<a href="https://github.com/cotes2020/jekyll-theme-chirpy"
target="_blank" rel="noopener">Chirpy</a>
theme.
</p>
</div>

View File

@@ -8,19 +8,17 @@
{% if page.layout == 'home' or page.layout == 'post' %}
<!-- i18n for timeago.js -->
<meta name="layout-lang" content="{{ site.lang | default: "en" }}">
<meta name="day-prompt" content="{{ site.data.locales[site.lang].post.timeago.day | default: "d ago" }}">
<meta name="hour-prompt" content="{{ site.data.locales[site.lang].post.timeago.hour | default: "hr ago" }}">
<meta name="minute-prompt" content="{{ site.data.locales[site.lang].post.timeago.minute | default: "min ago" }}">
<meta name="justnow-prompt" content="{{ site.data.locales[site.lang].post.timeago.just_now | default: "just now" }}">
{% if site.google_analytics.pv.enabled %}
{% if site.google_analytics.pv.proxy_endpoint %}
<meta name="pv-proxy-endpoint" content="{{ site.google_analytics.pv.proxy_endpoint }}">
{% endif %}
{% if site.google_analytics.pv.proxy_endpoint != ''
and site.google_analytics.pv.proxy_endpoint %}
<meta name="pv-proxy-endpoint" content="{{ site.google_analytics.pv.proxy_endpoint }}">
{% endif %}
{% if site.google_analytics.pv.cache %}
<meta name="pv-cache-path" content="{{ '/assets/js/data/pageviews.json' | relative_url }}">
{% endif %}
{% if site.google_analytics.pv.cache_path %}
<meta name="pv-cache-path" content="{{ site.google_analytics.pv.cache_path | relative_url }}">
{% endif %}
{% endif %}
@@ -48,29 +46,36 @@
<link rel="preconnect" href="https://www.googletagmanager.com" crossorigin="anonymous">
<link rel="dns-prefetch" href="https://www.googletagmanager.com">
{% if site.google_analytics.pv.proxy_endpoint %}
{% assign proxy_url = site.google_analytics.pv.proxy_endpoint
| replace: "https://", "" | split: "/" | first | prepend: "https://" %}
<link rel="preconnect" href="{{ proxy_url }}" crossorigin="use-credentials">
<link rel="dns-prefetch" href="{{ proxy_url }}">
{% 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="https://cdn.jsdelivr.net">
<link rel="dns-prefetch" href="https://cdn.jsdelivr.net">
<link rel="preconnect" href="cdn.jsdelivr.net">
<link rel="dns-prefetch" href="cdn.jsdelivr.net">
<!-- Bootstrap -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.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">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.11.2/css/all.min.css">
<link rel="stylesheet"
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">
{% include css-selector.html %}
<!-- JavaScript -->
<!-- JavaScripts -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js"></script>
<script defer
src="https://cdn.jsdelivr.net/combine/npm/popper.js@1.15.0,npm/bootstrap@4/dist/js/bootstrap.min.js"></script>
{% include js-selector.html %}
</head>

View File

@@ -2,28 +2,20 @@
JS selector for site.
-->
<!-- layout specified -->
{% if page.layout == 'home' or page.layout == 'post' %}
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
{% if site.google_analytics.pv.enabled %}
<!-- pv-report needs countup.js -->
<script async src="https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js"></script>
<script defer src="{{ '/assets/js/dist/pvreport.min.js' | relative_url }}"></script>
<script async src="{{ '/assets/js/dist/pvreport.min.js' | relative_url }}"></script>
{% endif %}
{% endif %}
{% if page.layout == 'post' or page.layout == 'page' %}
<!-- image lazy-loading & popup -->
<script src="https://cdn.jsdelivr.net/combine/npm/lozad/dist/lozad.min.js,npm/magnific-popup@1/dist/jquery.magnific-popup.min.js"></script>
{% endif %}
{% if page.layout == 'home'
or page.layout == 'categories'
or page.layout == 'post'
or page.layout == 'page' %}
or page.layout == 'categories' %}
{% assign type = page.layout %}
{% else %}
{% assign type = "commons" %}
{% assign type = "page" %}
{% endif %}
{% assign js = type | prepend: '/assets/js/dist/' | append: '.min.js' %}
@@ -52,10 +44,6 @@
</script>
{% endif %}
<!-- commons -->
<script src="https://cdn.jsdelivr.net/combine/npm/popper.js@1.16.1,npm/bootstrap@4/dist/js/bootstrap.min.js"></script>
{% if jekyll.environment == 'production' %}
<!-- PWA -->
<script defer src="{{ '/app.js' | relative_url }}"></script>

10
_includes/lozad.html Normal file
View File

@@ -0,0 +1,10 @@
<!--
image lazy load: https://github.com/ApoorvSaxena/lozad.js
-->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js"></script>
<script type="text/javascript">
const imgs = document.querySelectorAll('.post-content img');
const observer = lozad(imgs);
observer.observe();
</script>

View File

@@ -1,13 +0,0 @@
{% comment %}
Remove the zero padding from a month/day string
{% endcomment %}
{% assign ret = include.date_str %}
{% assign _first_chat = ret | slice: 0 %}
{% if _first_chat == '0' %}
{% assign _last_idx = ret.size | minus: 1 %}
{% assign ret = ret | slice: 1, _last_idx %}
{% endif %}
{{ ret | replace: ' 0', ' ' }}

View File

@@ -11,7 +11,7 @@
{% if update_list.size > 0 %}
<div id="access-lastmod" class="post">
<span>{{- site.data.locales[site.lang].panel.lastmod | default: 'Recent Update' -}}</span>
<span>{{- site.data.label.panel.lastmod | default: 'Recent Update' -}}</span>
<ul class="post-content pl-0 pb-1 ml-1 mt-2">
{% for item in update_list %}
@@ -30,7 +30,7 @@
{% if trending_tags.size > 0 %}
<div id="access-tags">
<span>{{- site.data.locales[site.lang].panel.trending_tags | default: 'Trending Tags' -}}</span>
<span>{{- site.data.label.panel.trending_tags | default: 'Trending Tags' -}}</span>
<div class="d-flex flex-wrap mt-3 mb-1 mr-3">
{% for tag_name in trending_tags %}
@@ -48,7 +48,7 @@
<script src="https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.js"></script>
<div id="toc-wrapper" class="pl-0 pr-4 mb-5">
<span class="pl-3 pt-2 mb-2">
{{- site.data.locales[site.lang].panel.toc | default: 'Contents' -}}
{{- site.data.label.panel.toc | default: 'Contents' -}}
</span>
<nav id="toc" data-toggle="toc"></nav>
</div>

View File

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

View File

@@ -2,14 +2,13 @@
The paginator for post list on HomgPage.
-->
<ul class="pagination align-items-center mt-4 mb-0 pl-lg-2">
<ul class="pagination mt-4 mb-0 pl-lg-2">
<!-- left arrow -->
{% if paginator.previous_page %}
{% assign prev_url = paginator.previous_page_path | relative_url %}
{% else %}
{% assign prev_url = "#" %}
{% endif %}
<li class="page-item {% unless paginator.previous_page %}disabled{% endunless %}">
<a class="page-link btn-box-shadow" href="{{ prev_url }}" aria-label="previous-page">
<i class="fas fa-angle-left"></i>
@@ -66,19 +65,12 @@
{% endfor %}
<!-- mobile pagination -->
<li class="page-index align-middle">
<span>{{ paginator.page }}</span>
<span class="text-muted">/ {{ paginator.total_pages }}</span>
</li>
<!-- right arrow -->
{% if paginator.next_page_path %}
{% assign next_url = paginator.next_page_path | relative_url %}
{% else %}
{% assign next_url = "#" %}
{% endif %}
<li class="page-item {% unless paginator.next_page_path %}disabled{% endunless %}">
<a class="page-link btn-box-shadow" href="{{ next_url }}" aria-label="next-page">
<i class="fas fa-angle-right"></i>

View File

@@ -3,7 +3,7 @@
-->
<div class="share-wrapper">
<span class="share-label text-muted mr-1">{{ site.data.locales[site.lang].post.share | default: 'Share' }}</span>
<span class="share-label text-muted mr-1">{{ site.data.label.post.share | default: 'Share' }}</span>
<span class="share-icons">
{% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %}
{% assign url = page.url | absolute_url %}
@@ -16,10 +16,8 @@
</a>
{% endfor %}
<i class="fa-fw fas fa-link small" onclick="copyLink('', '{{ site.data.locales[site.lang].post.button.copy.succeed }}')"
data-toggle="tooltip" data-placement="top"
title="{{ site.data.locales[site.lang].post.button.copy.title }}">
</i>
<i class="fa-fw fas fa-link small" onclick="copyLink()"
data-toggle="tooltip" data-placement="top" title="Copy link"></i>
</span>
</div>

View File

@@ -1,11 +1,9 @@
<!--
Calculate the post's reading time, and display the word count in tooltip
-->
{% assign words = include.content | strip_html | number_of_words: "auto" %}
<!-- words per minute -->
{% assign wpm = 180 %}
{% assign min_time = 1 %}
@@ -15,15 +13,7 @@
{% assign read_time = min_time %}
{% endunless %}
{% capture read_prompt %}
{{- site.data.locales[site.lang].post.read_time.prompt | default: "read" -}}
{% endcapture %}
<!-- return element -->
<span class="readtime" data-toggle="tooltip" data-placement="bottom"
title="{{ words }} {{ site.data.locales[site.lang].post.words | default: "words" }}">
{{- read_time -}}{{" "}}{{- site.data.locales[site.lang].post.read_time.unit | default: "min" -}}
{%- if include.prompt -%}
{% unless site.lang contains 'zh' %}{{" "}}{% endunless %}{{ read_prompt }}
{%- endif -%}
<span class="readtime" data-toggle="tooltip" data-placement="bottom" title="{{ words }} words">
{{- read_time -}}{{" "}}{{- site.data.label.read_time_unit | default: "min" -}}
</span>

View File

@@ -8,7 +8,6 @@
In order to allow a wide table to scroll horizontally,
we suround the markdown table with `<div class="table-wrapper">` and `</div>`
-->
{% if _content contains '<table>' %}
{% assign _content = _content
| replace: '<table>', '<div class="table-wrapper"><table>'
@@ -22,7 +21,6 @@
https://github.com/penibelst/jekyll-compress-html/issues/101
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
-->
{% if _content contains '<pre class="highlight">' %}
{% assign _content = _content
| replace: '<div class="highlight"><pre class="highlight"><code', '<div class="highlight"><code'
@@ -31,20 +29,14 @@
{% endif %}
<!-- Add attribute 'hide-bullet' to the checkbox list -->
{% if _content contains '<li class="task-list-item"><' %}
{% assign _content = _content
| replace: '"task-list-item"><', '"task-list-item" hide-bullet><'
%}
{% endif %}
<!-- images -->
{% if _content contains '<img src="' %}
<!-- add CDN prefix if it exists -->
{% if site.img_cdn != '' %}
{% assign img_path_replacement = '<img src="' | append: site.img_cdn | append: '/' %}
{% else %}
@@ -54,77 +46,21 @@
{% assign _content = _content | replace: '<img src="/', img_path_replacement %}
<!-- lazy-load images <https://github.com/ApoorvSaxena/lozad.js#usage> -->
{% assign lozad = true %}
{% assign img_placehodler
= 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' %}
{% assign _content = _content | replace: '<img src="', '<img data-proofer-ignore data-src="' %}
{% assign lozad_replacement = '<img src="'
| append: img_placehodler
| append: '" data-src="' %}
<!-- add image placehoder to prevent layout reflow -->
{% assign _img_content = nil %}
{% assign _images = _content | split: '<img ' %}
{% for _img in _images %}
{% if forloop.first %}
{% assign _img_content = _img %}
{% continue %}
{% endif %}
{% assign _width = nil %}
{% assign _height = nil %}
{% assign _attrs = _img | split: '>' | first | split: ' ' %}
{% for _attr in _attrs %}
{% capture _key %}{{ _attr | split: '=' | first }}{% endcapture %}
{% capture _value %}{{ _attr | split: '=' | last | replace: '"', '' }}{% endcapture %}
{% case _key %}
{% when 'width' %}
{% assign _width = _value %}
{% when 'height' %}
{% assign _height = _value %}
{% endcase %}
{% if _width and _height %}
{% capture _svg %}data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 {{_width}} {{_height}}'%3E%3C/svg%3E{% endcapture %}
{% assign _img_content = _img_content | append: '<img src="' | append: _svg | append: '" ' | append: _img %}
{% break %}
{% endif %}
{% endfor %}
{% unless _width and _height %}
{% assign _img_content = _img_content | append: '<img ' | append: _img %}
{% endunless %}
{% endfor %}
{% assign _content = _img_content %}
{% assign _content = _content | replace: '<img src="', lozad_replacement %}
{% endif %}
<!-- Add lang-badge for code snippets -->
{% if _content contains '<div class="language-' %}
{% assign _code_splits = _content | split: '<div class="language-' %}
{% assign _new_content = nil %}
{% for _snippet in _code_splits %}
{% if forloop.first %}
{% assign _new_content = _snippet %}
{% else %}
{% assign _lang = _snippet | split: ' ' | first %}
{% capture _tag_head %}<div lang="{{_lang}}" class="language-{% endcapture %}
{% assign _new_content = _new_content | append: _tag_head | append: _snippet %}
{% endif %}
{% endfor %}
{% if _new_content %}
{% assign _content = _new_content %}
{% endif %}
{% endif %}
<!-- return -->
{{ _content }}
{% if lozad %}
{% include lozad.html %}
{% endif %}

View File

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

View File

@@ -4,7 +4,7 @@
<div id="search-result-wrapper" class="d-flex justify-content-center unloaded">
<div class="col-12 col-sm-11 post-content">
<div id="search-hints">
<h4 class="text-muted mb-4">{{ site.data.locales[site.lang].panel.trending_tags | default: 'Trending Tags' }}</h4>
<h4 class="text-muted mb-4">{{ site.data.label.panel.trending_tags | default: 'Trending Tags' }}</h4>
{% include trending-tags.html %}

View File

@@ -2,7 +2,8 @@
The Side Bar
-->
<div id="sidebar" class="d-flex flex-column align-items-end" lang="{{lang}}">
<div id="sidebar" class="d-flex flex-column align-items-end">
<div class="profile-wrapper text-center">
<div id="avatar">
<a href="{{ '/' | relative_url }}" alt="avatar" class="mx-auto">
@@ -20,19 +21,19 @@
</div>
<div class="site-title mt-3">
<a href="{{ '/' | relative_url }}">{{ site.title }}</a>
<a href="{{ '/' | relative_url }}">{{- site.title -}}</a>
</div>
<div class="site-subtitle font-italic">{{ site.tagline }}</div>
<div class="site-subtitle font-italic">{{- site.tagline -}}</div>
</div><!-- .profile-wrapper -->
<ul class="w-100">
<!-- home -->
<li class="nav-item{% if page.layout == 'home' %}{{ " active" }}{% endif %}">
<a href="{{ '/' | relative_url }}" class="nav-link">
<i class="fa-fw fas fa-home ml-xl-3 mr-xl-3 unloaded"></i>
<span>{{ site.data.locales[site.lang].tabs.home | default: "home" | upcase }}</span>
<span>{{ "HOME" }}</span>
</a>
</li>
<!-- the real tabs -->
@@ -40,9 +41,7 @@
<li class="nav-item{% if tab.url == page.url %}{{ " active" }}{% endif %}">
<a href="{{ tab.url | relative_url }}" class="nav-link">
<i class="fa-fw {{ tab.icon }} ml-xl-3 mr-xl-3 unloaded"></i>
{% capture tab_name %}{{ tab.url | split: '/' }}{% endcapture %}
<span>{{ site.data.locales[site.lang].tabs.[tab_name] | default: tab_name | upcase }}</span>
<span>{{ tab.title | upcase }}</span>
</a>
</li> <!-- .nav-item -->
{% endfor %}

View File

@@ -3,25 +3,29 @@
See: /assets/js/_utils/timeage.js
-->
{% assign tooltip_df = site.data.locales[site.lang].date_format.tooltip | default: '%a, %b %e, %Y, %l:%M %p %z' %}
{% assign post_long_df = site.data.locales[site.lang].date_format.post.long | default: '%b %e, %Y' %}
{% assign post_short_df = site.data.locales[site.lang].date_format.post.short | default: '%b %e' %}
{% assign tooltip_df = site.data.date_format.tooltip | default: '%a, %b %e, %Y, %l:%M %p %z' %}
{% assign post_long_df = site.data.date_format.post.long | default: '%b %e, %Y' %}
{% assign post_short_df = site.data.date_format.post.short | default: '%b %e' %}
{% if include.preposition %}
{{ include.preposition }}
{% endif %}
<span class="timeago {% if include.class %}{{ include.class }}{% endif %}"
{% if include.tooltip %}
data-toggle="tooltip"
data-placement="bottom"
title="{{ include.date | date: tooltip_df }}"
{% endif %}>
{%- assign this_year = site.time | date: "%Y" -%}
{%- assign post_year = include.date | date: "%Y" -%}
{%- if post_year == this_year -%}
{% endif %}
{% if include.prefix %}prefix="{{ include.prefix }} "{% endif%}
{% if include.prep %}prep="{{ include.prep }}"{% endif %} >
{% assign this_year = site.time | date: "%Y" %}
{% assign post_year = include.date | date: "%Y" %}
{% if post_year == this_year %}
{{ include.date | date: post_short_df }}
{%- else -%}
{% else %}
{{ include.date | date: post_long_df }}
{%- endif -%}
{% endif %}
<i class="unloaded">{{ include.date | date_to_xmlschema }}</i>
</span>

View File

@@ -8,38 +8,33 @@
{% assign paths = page.url | split: '/' %}
{% if paths.size == 0 or page.layout == 'home' %}
{% if paths.size == 0 %}
<!-- index page -->
<span>{{ site.data.locales[site.lang].tabs.home | default: 'home' | capitalize }}</span>
<span>{{ 'Posts' }}</span>
{% else %}
{% for item in paths %}
{% if forloop.first %}
{% unless page.layout == 'post' %}
<span>
<a href="{{ '/' | relative_url }}">
{{ site.data.locales[site.lang].tabs.home | default: 'home' | capitalize }}
</a>
<a href="{{ '/' | relative_url }}">{{ 'Home' }}</a>
</span>
{% endunless %}
{% elsif forloop.last %}
{% if page.collection == 'tabs' %}
<span>{{ site.data.locales[site.lang].tabs[item] | default: page.title }}</span>
{% else %}
<span>{{ page.title }}</span>
{% endif %}
<span>{{ page.title }}</span>
{% else %}
{% unless page.layout == 'post' %}
<span>
<a href="{{ item | relative_url }}">
{{ site.data.locales[site.lang].tabs[item] | default: page.title }}
</a>
</span>
{% endunless %}
<span>
{% assign url = item %}
{% if item == 'posts' and page.layout == 'post' %}
{% assign url = '/' %}
{% endif %}
<a href="{{ url | relative_url }}">
{{ item | capitalize }}
</a>
</span>
{% endif %}
@@ -53,12 +48,11 @@
<div id="topbar-title">
{% if page.layout == 'home' %}
{{- site.data.locales[site.lang].title | default: site.title -}}
{% elsif page.collection == 'tabs' %}
{%- capture tab_key -%}{{ page.url | split: '/' }}{%- endcapture -%}
{{- site.data.locales[site.lang].tabs[tab_key] | default: page.title -}}
{{- site.title -}}
{% elsif page.dynamic_title %}
{{- page.title -}}
{% else %}
{{- site.data.locales[site.lang].layout[page.layout] | default: page.layout | capitalize -}}
{{- page.layout | capitalize -}}
{% endif %}
</div>
@@ -66,10 +60,10 @@
<span id="search-wrapper" class="align-items-center">
<i class="fas fa-search fa-fw"></i>
<input class="form-control" id="search-input" type="search"
aria-label="search" autocomplete="off" placeholder="{{ site.data.locales[site.lang].search.hint | default: 'Search' | capitalize }}...">
aria-label="search" placeholder="{{ site.data.label.search_hint | default: 'Search' }}...">
<i class="fa fa-times-circle fa-fw" id="search-cleaner"></i>
</span>
<span id="search-cancel" >{{ site.data.locales[site.lang].search.cancel | default: 'Cancel' }}</span>
<span id="search-cancel" >Cancel</span>
</div>
</div>

View File

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

View File

@@ -1,47 +0,0 @@
/**
Lazy load images (https://github.com/ApoorvSaxena/lozad.js)
and popup when clicked (https://github.com/dimsemenov/Magnific-Popup)
*/
$(function() {
const IMG_SCOPE = '#main > div.row:first-child > div:first-child';
if ($(`${IMG_SCOPE} img`).length <= 0 ) {
return;
}
/* lazy loading */
const imgList = document.querySelectorAll(`${IMG_SCOPE} img[data-src]`);
const observer = lozad(imgList);
observer.observe();
/* popup */
$(`${IMG_SCOPE} p > img[data-src],${IMG_SCOPE} img[data-src].preview-img`).each(
function() {
let nextTag = $(this).next();
const title = nextTag.prop('tagName') === 'EM' ? nextTag.text() : '';
const src = $(this).attr('data-src'); // created by lozad.js
$(this).wrap(`<a href="${src}" title="${title}" class="popup"></a>`);
}
);
$('.popup').magnificPopup({
type: 'image',
closeOnContentClick: true,
showCloseBtn: false,
zoom: {
enabled: true,
duration: 300,
easing: 'ease-in-out'
}
});
/* markup the image links */
$(`${IMG_SCOPE} a`).has('img').addClass('img-link');
});

View File

@@ -1,250 +0,0 @@
/*
* Count page views form GA or local cache file.
*
* Dependencies:
* - jQuery
* - countUp.js <https://github.com/inorganik/countUp.js>
*/
const getInitStatus = (function () {
let hasInit = false;
return () => {
let ret = hasInit;
if (!hasInit) {
hasInit = true;
}
return ret;
};
}());
const PvOpts = (function () {
function getContent(selector) {
return $(selector).attr("content");
}
function hasContent(selector) {
let content = getContent(selector);
return (typeof content !== "undefined" && content !== false);
}
return {
getProxyMeta() {
return getContent("meta[name=pv-proxy-endpoint]");
},
getLocalMeta() {
return getContent("meta[name=pv-cache-path]");
},
hasProxyMeta() {
return hasContent("meta[name=pv-proxy-endpoint]");
},
hasLocalMeta() {
return hasContent("meta[name=pv-cache-path]");
}
};
}());
const PvStorage = (function () {
const Keys = {
KEY_PV: "pv",
KEY_PV_SRC: "pv_src",
KEY_CREATION: "pv_created_date"
};
const Source = {
LOCAL: "same-origin",
PROXY: "cors"
};
function get(key) {
return localStorage.getItem(key);
}
function set(key, val) {
localStorage.setItem(key, val);
}
function saveCache(pv, src) {
set(Keys.KEY_PV, pv);
set(Keys.KEY_PV_SRC, src);
set(Keys.KEY_CREATION, new Date().toJSON());
}
return {
keysCount() {
return Object.keys(Keys).length;
},
hasCache() {
return (localStorage.getItem(Keys.KEY_PV) !== null);
},
getCache() {
return JSON.parse(localStorage.getItem(Keys.KEY_PV));
},
saveLocalCache(pv) {
saveCache(pv, Source.LOCAL);
},
saveProxyCache(pv) {
saveCache(pv, Source.PROXY);
},
isExpired() {
let date = new Date(get(Keys.KEY_CREATION));
date.setHours(date.getHours() + 1); // per hour
return Date.now() >= date.getTime();
},
isFromLocal() {
return get(Keys.KEY_PV_SRC) === Source.LOCAL;
},
isFromProxy() {
return get(Keys.KEY_PV_SRC) === Source.PROXY;
},
newerThan(pv) {
return PvStorage.getCache().totalsForAllResults["ga:pageviews"] > pv.totalsForAllResults["ga:pageviews"];
},
inspectKeys() {
if (localStorage.length !== PvStorage.keysCount()) {
localStorage.clear();
return;
}
for(let i = 0; i < localStorage.length; i++){
const key = localStorage.key(i);
switch (key) {
case Keys.KEY_PV:
case Keys.KEY_PV_SRC:
case Keys.KEY_CREATION:
break;
default:
localStorage.clear();
return;
}
}
}
};
}()); /* PvStorage */
function countUp(min, max, destId) {
if (min < max) {
let numAnim = new CountUp(destId, min, max);
if (!numAnim.error) {
numAnim.start();
} else {
console.error(numAnim.error);
}
}
}
function countPV(path, rows) {
let count = 0;
if (typeof rows !== "undefined" ) {
for (let i = 0; i < rows.length; ++i) {
const gaPath = rows[parseInt(i, 10)][0];
if (gaPath === path) { /* path format see: site.permalink */
count += parseInt(rows[parseInt(i, 10)][1], 10);
break;
}
}
}
return count;
}
function tacklePV(rows, path, elem, hasInit) {
let count = countPV(path, rows);
count = (count === 0 ? 1 : count);
if (!hasInit) {
elem.text(new Intl.NumberFormat().format(count));
} else {
const initCount = parseInt(elem.text().replace(/,/g, ""), 10);
if (count > initCount) {
countUp(initCount, count, elem.attr("id"));
}
}
}
function displayPageviews(data) {
if (typeof data === "undefined") {
return;
}
let hasInit = getInitStatus();
const rows = data.rows; /* could be undefined */
if ($("#post-list").length > 0) { /* the Home page */
$(".post-preview").each(function() {
const path = $(this).find("a").attr("href");
tacklePV(rows, path, $(this).find(".pageviews"), hasInit);
});
} else if ($(".post").length > 0) { /* the post */
const path = window.location.pathname;
tacklePV(rows, path, $("#pv"), hasInit);
}
}
function fetchProxyPageviews() {
if (PvOpts.hasProxyMeta()) {
$.ajax({
type: "GET",
url: PvOpts.getProxyMeta(),
dataType: "jsonp",
jsonpCallback: "displayPageviews",
success: (data) => {
PvStorage.saveProxyCache(JSON.stringify(data));
},
error: (jqXHR, textStatus, errorThrown) => {
console.log("Failed to load pageviews from proxy server: " + errorThrown);
}
});
}
}
function fetchLocalPageviews(hasCache = false) {
return fetch(PvOpts.getLocalMeta())
.then(response => response.json())
.then(data => {
if (hasCache) {
// The cache from the proxy will sometimes be more recent than the local one
if (PvStorage.isFromProxy() && PvStorage.newerThan(data)) {
return;
}
}
displayPageviews(data);
PvStorage.saveLocalCache(JSON.stringify(data));
});
}
$(function() {
if ($(".pageviews").length <= 0) {
return;
}
PvStorage.inspectKeys();
if (PvStorage.hasCache()) {
displayPageviews(PvStorage.getCache());
if (PvStorage.isExpired()) {
if (PvOpts.hasLocalMeta()) {
fetchLocalPageviews(true).then(fetchProxyPageviews);
} else {
fetchProxyPageviews();
}
} else {
if (PvStorage.isFromLocal()) {
fetchProxyPageviews();
}
}
} else { // no cached
if (PvOpts.hasLocalMeta()) {
fetchLocalPageviews().then(fetchProxyPageviews);
} else {
fetchProxyPageviews();
}
}
});

View File

@@ -3,8 +3,8 @@ layout: page
# The Archives of posts.
---
<div id="archives" class="pl-xl-2">
<div id="archives" class="pl-xl-2">
{% for post in site.posts %}
{% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %}
{% capture pre_year %}{{ post.previous.date | date: "%Y" }}{% endcapture %}
@@ -17,10 +17,9 @@ layout: page
<li>
<div>
{% capture this_day %}{{ post.date | date: "%d" }}{% endcapture %}
{% capture _mth_df %}{{ site.data.locales[site.lang].date_format.post.archive_month | default: "%b" }}{% endcapture %}
{% capture this_month %}{{ post.date | date: _mth_df }}{% endcapture %}
{% capture this_month %}{{ post.date | date: "%b" }}{% endcapture %}
<span class="date day">{{ this_day }}</span>
<span class="date month small text-muted">{% include no-zero-date.html date_str=this_month %}</span>
<span class="date month small text-muted">{{ this_month }}</span>
<a href="{{ post.url | relative_url }}">{{ post.title }}</a>
</div>
</li>

View File

@@ -3,6 +3,7 @@ layout: page
# All the Categories of posts
---
{% assign HEAD_PREFIX = "h_" %}
{% assign LIST_PREFIX = "l_" %}
@@ -32,23 +33,28 @@ layout: page
<div class="card categories">
<!-- top-category -->
<div id="{{ HEAD_PREFIX }}{{ group_index }}"
class="card-header d-flex justify-content-between hide-border-bottom">
<div class="card-header d-flex justify-content-between hide-border-bottom"
id="{{ HEAD_PREFIX }}{{ group_index }}">
<span>
<i class="far fa-folder{% if sub_categories_size > 0 %}-open{% endif %} fa-fw"></i>
{% capture _category_url %}/categories/{{ category_name | slugify | url_encode }}/{% endcapture %}
<a href="{{ _category_url | relative_url }}" class="ml-1 mr-2">{{ category_name }}</a>
{% if sub_categories_size > 0 %}
<i class="far fa-folder-open fa-fw"></i>
{% else %}
<i class="far fa-folder fa-fw"></i>
{% endif %}
<a href="{{ site.baseurl }}/categories/{{ category_name | slugify | url_encode }}/"
class="ml-1 mr-2">
{{ category_name }}
</a>
<!-- content count -->
{% assign top_posts_size = site.categories[category_name] | size %}
<span class="text-muted small font-weight-light">
{% if sub_categories_size > 0 %}
{{ sub_categories_size }}
{{ site.data.locales[site.lang].categories.category_measure | default: 'categories' }},
{% if sub_categories_size > 1 %}categories{% else %}category{% endif %},
{% endif %}
{{ top_posts_size }}
{{ site.data.locales[site.lang].categories.post_measure | default: 'posts' }}
post{% if top_posts_size > 1 %}s{% endif %}
</span>
</span>
@@ -74,14 +80,11 @@ layout: page
{% for sub_category in sub_categories %}
<li class="list-group-item">
<i class="far fa-folder fa-fw"></i>
{% capture _sub_ctg_url %}/categories/{{ sub_category | slugify | url_encode }}/{% endcapture %}
<a href="{{ _sub_ctg_url | relative_url }}" class="ml-1 mr-2">{{ sub_category }}</a>
<a href="{{ site.baseurl }}/categories/{{ sub_category | slugify | url_encode }}/"
class="ml-1 mr-2">{{ sub_category }}</a>
{% assign posts_size = site.categories[sub_category] | size %}
<span class="text-muted small font-weight-light">
{{ posts_size }}
{{ site.data.locales[site.lang].categories.post_measure | default: 'posts' }}
<span class="text-muted small font-weight-light">{{ posts_size }}
post{% if posts_size > 1 %}s{% endif %}
</span>
</li>
{% endfor %}

View File

@@ -11,13 +11,13 @@ layout: page
</h1>
<ul class="post-content pl-0">
{% assign post_df = site.data.locales[site.lang].date_format.post.long | default: '%b %e, %Y' %}
{% assign post_long_df = site.data.date_format.post.long | default: '%b %e, %Y' %}
{% for post in page.posts %}
<li class="d-flex justify-content-between pl-md-3 pr-md-3">
<a href="{{ post.url | relative_url }}">{{ post.title }}</a>
<span class="dash flex-grow-1"></span>
<span class="text-muted small">{{ post.date | date: post_df }}</span>
<span class="text-muted small">{{ post.date | date: post_long_df }}</span>
</li>
{% endfor %}
</ul>

View File

@@ -11,7 +11,7 @@ layout: compress
{% endif %}
{% endcapture %}
<html lang="{{ site.content_lang | default: site.lang }}" {{ prefer_mode }}>
<html lang="{{ site.lang | default: "en-US" }}" {{ prefer_mode }}>
{% include head.html %}
@@ -46,8 +46,6 @@ layout: compress
{% include search-loader.html %}
{% include js-selector.html %}
</body>
</html>

View File

@@ -3,9 +3,9 @@ layout: page
# The Home page layout
---
{% assign pinned = site.posts | where: "pin", "true" %}
{% assign default = site.posts | where_exp: "item", "item.pin != true" %}
{% assign pinned = site.posts | where_exp: "item", "item.pin == true" %}
{% assign default = site.posts | where_exp: "item", "item.pin != true" %}
{% assign posts = "" | split: "" %}
<!-- Get pinned posts -->
@@ -39,6 +39,7 @@ layout: page
{% endfor %}
{% endif %}
<div id="post-list">
{% for post in posts %}
@@ -67,7 +68,7 @@ layout: page
{% include read-time.html content=post.content %}
<!-- page views -->
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
{% 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>
@@ -78,7 +79,7 @@ layout: page
{% if post.pin %}
<div class="pin">
<i class="fas fa-thumbtack fa-fw"></i>
<span>{{ site.data.locales[site.lang].post.pin_prompt | default: 'Pinned' }}</span>
<span>{{ site.data.label.pin_prompt | default: 'Pinned' }}</span>
</div>
{% endif %}

View File

@@ -7,14 +7,7 @@ layout: default
<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 mb-md-4">
{% if page.dynamic_title %}
<h1 class="dynamic-title">
{% if page.collection == 'tabs' %}
{%- capture tab_key -%}{{ page.url | split: '/' }}{%- endcapture -%}
{{- site.data.locales[site.lang].tabs[tab_key] | default: page.title -}}
{% else %}
{{- page.title -}}
{% endif %}
</h1>
<h1 class="dynamic-title">{{ page.title }}</h1>
<div class="post-content">
{{ content }}
</div>

View File

@@ -17,28 +17,24 @@ layout: default
<span class="semi-bold">
{{ page.author | default: site.social.name }}
</span>
{% capture _preposition %}{{ site.data.locales[site.lang].post.published | default: 'on' }}{% endcapture %}
{% include timeago.html date=page.date tooltip=true preposition=_preposition %}
{% include timeago.html date=page.date prep="on" tooltip=true %}
</div>
<div>
<!-- lastmod -->
{% if page.last_modified_at %}
<span>
{{ site.data.locales[site.lang].post.updated | default: 'Updated' }}
{% include timeago.html date=page.last_modified_at class="lastmod" tooltip=true %}
{% include timeago.html date=page.last_modified_at
class="lastmod" prefix="Updated" tooltip=true %}
</span>
{% endif %}
<!-- read time -->
{% include read-time.html content=content prompt=true %}
{% include read-time.html content=content %}
<!-- page views -->
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
<span id="pv" class="pageviews">
<i class="fas fa-spinner fa-spin fa-fw"></i>
</span>
{{ site.data.locales[site.lang].post.pageview_measure | default: "views" }}
{% if site.google_analytics.pv.enabled %}
<span id="pv" class="pageviews"><i class="fas fa-spinner fa-spin fa-fw"></i></span>
{% endif %}
</div>
@@ -48,11 +44,7 @@ layout: default
<div class="post-content">
{% if page.image.src %}
<img src="{{ page.image.src }}"
class="preview-img"
alt="{{ page.image.alt | default: "Preview Image" }}"
{% if page.image.width %}width="{{ page.image.width }}"{% endif %}
{% if page.image.height %}height="{{ page.image.height }}"{% endif %}>
<img src="{{ page.image.src }}" class="preview-img" alt="{{ page.image.alt | default: "Preview Image" }}">
{% endif %}
{{ content }}
@@ -63,7 +55,6 @@ layout: default
<!-- categories -->
{% if page.categories.size > 0 %}
<div class="post-meta mb-3">
<i class="far fa-folder-open fa-fw mr-1"></i>
{% for category in page.categories %}
@@ -88,18 +79,13 @@ layout: default
<div class="post-tail-bottom
d-flex justify-content-between align-items-center mt-3 pt-5 pb-2">
{% if site.data.rights.license %}
<div class="license-wrapper">
{% if site.data.locales[site.lang].copyright.license.template %}
{% capture _replacement %}
<a href="{{ site.data.locales[site.lang].copyright.license.link }}">
{{ site.data.locales[site.lang].copyright.license.name }}
</a>
{% endcapture %}
{{ site.data.locales[site.lang].copyright.license.template | replace: ':LICENSE_NAME', _replacement }}
{% else %}
<span class="text-muted small">{{ site.outdated }}</span>
{% endif %}
This post is licensed under
<a href="{{ site.data.rights.license.link }}">{{ site.data.rights.license.name }}</a>
by the author.
</div>
{% endif %}
{% include post-sharing.html %}

View File

@@ -3,6 +3,7 @@ layout: page
# The layout for Tag page
---
<div id="page-tag">
<h1 class="pl-lg-2">
<i class="fa fa-tag fa-fw text-muted"></i>
@@ -10,13 +11,13 @@ layout: page
<span class="lead text-muted pl-2">{{ page.posts | size }}</span>
</h1>
<ul class="post-content pl-0">
{% assign post_df = site.data.locales[site.lang].date_format.post.long | default: '%b %e, %Y' %}
{% assign post_long_df = site.data.date_format.post.long | default: '%b %e, %Y' %}
{% for post in page.posts %}
<li class="d-flex justify-content-between pl-md-3 pr-md-3">
<a href="{{ post.url | relative_url }}">{{ post.title }}</a>
<span class="dash flex-grow-1"></span>
<span class="text-muted small">{{ post.date | date: post_df }}</span>
<span class="text-muted small">{{ post.date | date: post_long_df }}</span>
</li>
{% endfor %}
</ul>

View File

@@ -8,8 +8,6 @@ math: true
mermaid: true
image:
src: https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/commons/devices-mockup.png
width: 850
height: 585
---
This post is to show Markdown syntax rendering on [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/fork), you can also use it as an example of writing. Now, let's start looking at text and typography.
@@ -52,13 +50,14 @@ Fluttering and dancing in the breeze.
### Unordered list
- Chapter
- Section
- Setcion
- Paragraph
### Task list
- [ ] TODO
- [x] Completed
- Hold on
- [ ] Defeat COVID-19
- [x] Vaccine production
- [ ] Economic recovery
@@ -99,34 +98,34 @@ Click the hook will locate the footnote[^footnote], and here is another footnote
- Default (with caption)
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="972" height="589" }
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png)
_Full screen width and center alignment_
<br>
- Shadow
- Specify width
![Window shadow](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/window.png){: .shadow width="1548" height="864" style="max-width: 90%" }
_shadow effect (visible in light mode)_
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="400"}
_400px image width_
<br>
- Left aligned
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="972" height="589" style="max-width: 70%" .normal}
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="350" .normal}
<br>
- Float to left
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="972" height="589" style="max-width: 200px" .left}
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="240" .left}
"A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space."
<br>
- Float to right
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="972" height="589" style="max-width: 200px" .right}
![Desktop View](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190808/mockup.png){: width="240" .right}
"A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space. A repetitive and meaningless text is used to fill the space."
<br>

View File

@@ -84,21 +84,16 @@ Then you can use it like other markdown language: surround the graph code with `
### Preview image
If you want to add an image to the top of the post contents, specify the attribute `src`, `width`, `height` and `alt` for the image:
If you want to add an image to the top of the post contents, specify the url and alt attribute for the image:
```yaml
---
image:
src: /path/to/image/file
width: 1000 # in pixels
height: 400 # in pixels
alt: image alternative text
---
```
Except for `alt`, all other options are necessary, especially the `width` and `height`, which are related to user experience and web page loading performance. Later section ["Image size"](#image-size) will also mention this.
### Image caption
Add italics to the next line of an imagethen it will become the caption and appear at the bottom of the image:
@@ -110,10 +105,10 @@ _Image Caption_
### Image size
In order to prevent the page content layout from shifting when the image is loaded, we should set the width and height for each image:
You can specify the width (and height) of a image with `width`:
```markdown
![Desktop View](/assets/img/sample/mockup.png){: width="700" height="400" }
![Desktop View](/assets/img/sample/mockup.png){: width="400"}
```
### Image position
@@ -125,30 +120,22 @@ By default, the image is centered, but you can specify the position by using one
Image will be left aligned in below sample:
```markdown
![Desktop View](/assets/img/sample/mockup.png){: .normal }
![Desktop View](/assets/img/sample/mockup.png){: .normal}
```
- **Float to the left**
```markdown
![Desktop View](/assets/img/sample/mockup.png){: .left }
![Desktop View](/assets/img/sample/mockup.png){: .left}
```
- **Float to the right**
```markdown
![Desktop View](/assets/img/sample/mockup.png){: .right }
![Desktop View](/assets/img/sample/mockup.png){: .right}
```
> **Limitation**: Once you specify the position of an image, it is forbidden to add the image caption.
### Image shadow
The screenshots of the program window can be considered to show the shadow effect, and the shadow will be visible in the `light` mode:
```markdown
![Desktop View](/assets/img/sample/mockup.png){: .shadow }
```
**Limitation**: Once you specify the position of an image, it is forbidden to add the image caption.
### CDN URL

View File

@@ -9,16 +9,16 @@ pin: true
## Prerequisites
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems`, `Jekyll` and `Bundler`. Please note that the version of `Ruby` must meet the requirements of the theme on [RubyGems.org](https://rubygems.org/gems/jekyll-theme-chirpy).
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems`, `Jekyll` and `Bundler`.
## Installation
There are two ways to get the theme:
- **[Install from RubyGems](#install-from-rubygems)** - Easy to update, isolate irrelevant project files so you can focus on writing.
- **[Fork on GitHub](#fork-on-github)** - Convenient for custom development, but difficult to update, only suitable for web developers.
- **Install from RubyGems** - Easy to update, isolate irrelevant project files so you can focus on writing.
- **Fork on GitHub** - Convenient for custom development, but difficult to update, only suitable for web developers.
### Install from RubyGems
### Installing the Theme Gem
Add this line to your Jekyll site's `Gemfile`:
@@ -38,19 +38,15 @@ And then execute:
$ bundle
```
Next, go to the installed local theme path:
Finally, copy the required files from the theme's gem (for detailed files, see [starter project][starter]) to your Jekyll site.
```console
$ cd "$(bundle info --path jekyll-theme-chirpy)"
```
And then copy the critical files (for details, see [starter project][starter]) from the theme's gem to your Jekyll site.
> ⚠️ **Watch out for duplicate files!**
> **Hint**: To locate the installed themes gem, execute:
>
If your Jekyll site is created by the `jekyll new` command, there will be `index.markdown` and `about.markdown` in the root directory of your site. Please be sure to remove them, otherwise they will overwrite the `index.html` and `_tabs/about.html` from this project, resulting in blank or messy pages.
> ```console
> $ bundle info --path jekyll-theme-chirpy
> ```
As an alternative, which we recommend, you can create a Jekyll site [**using the starter template**][use-starter] to save time copying files from the theme's gem. We've prepared everything you need there!
Or you can [**use the starter template**][use-starter] to create a Jekyll site to save time copying files from theme's gem. We have prepared everything for you there!
### Fork on GitHub
@@ -77,7 +73,7 @@ What it does is:
- 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 the extension `.hook` of `.github/workflows/pages-deploy.yml.hook`, and then remove the other files and directories in the 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.
@@ -92,12 +88,6 @@ Update the variables of `_config.yml` as needed. Some of them are typical option
- `timezone`
- `lang`
### Customing Stylesheet
If you need to customize stylesheet, copy the theme's `assets/css/style.scss` to the same path on your Jekyll site, and then add the custom style at the end of the style file.
Starting from `v4.1.0`, if you want to overwrite the SASS variables defined in `_sass/addon/variables.scss`, create a new file `_sass/variables-hook.scss` and assign new values to the target variable in it.
### Running Local Server
You may want to preview the site contents before publishing, so just run it by:
@@ -119,7 +109,7 @@ Open a browser and visit to _<http://localhost:4000>_.
### 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, e.g, `/project-name`.
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, e.g, `/project-name`.
Now you can choose ONE of the following methods to deploy your Jekyll site.
@@ -132,15 +122,15 @@ Quickly check the files needed for GitHub Actions build:
- Ensure your Jekyll site has the file `.github/workflows/pages-deploy.yml`. Otherwise, create a new one and fill in the contents of the [workflow file][workflow], and the value of the `on.push.branches` should be the same as your repo's default branch name.
- Ensure your Jekyll site has file `tools/test.sh` and `tools/deploy.sh`. Otherwise, copy them from this repo to your Jekyll site.
And then rename your repository to `<GH-USERNAME>.github.io` on GitHub.
And then rename your repoistory to `<GH-USERNAME>.github.io` on GitHub.
Now publish your Jekyll site by:
1. Push any commit to remote to trigger the GitHub Actions workflow. Once the build is complete and successful, a new remote branch named `gh-pages` will appear to store the built site files.
2. Browse to your repo's landing page on GitHub and select the 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) through _Settings__Options__GitHub Pages_:
2. Browse to your repo's landing page on GitHub and select the 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) throught _Settings__Options__GitHub Pages_:
![gh-pages-sources](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190809/gh-pages-sources.png){: width="850" height="153" }
![gh-pages-sources](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190809/gh-pages-sources.png)
3. Visit your website at the address indicated by GitHub.

View File

@@ -4,34 +4,36 @@ author: Cotes Chung
date: 2019-08-11 00:34:00 +0800
categories: [Blogging, Tutorial]
tags: [favicon]
toc: false
---
The [favicons](https://www.favicon-generator.org/about/) of [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) are placed in the directory `assets/img/favicons/`. You may need to replace them with your own. The following sections will guide you how to create and replace the default favicons.
In [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/), the image files of [Favicons](https://www.favicon-generator.org/about/) are placed in `assets/img/favicons/`. You may need to replace them with your own. So let's see how to customize these Favicons.
## Generate the favicon
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.
Prepare a square image (PNG, JPG, or SVG) with a size of 512x512 or more, and then go to the online tool [**Real Favicon Generator**](https://realfavicongenerator.net/) and click button <kbd>Select your Favicon image</kbd> to upload your image file.
![upload-image](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190811/upload-image.png)
In the next step, the webpage will show all usage scenarios. You can keep the default options, scroll to the bottom of the page, and click the button <kbd>Generate your Favicons and HTML code</kbd> to generate the favicon.
Click button <kbd>Create Favicon</kbd> and wait a moment for the website to generate the icons of various sizes automatically.
## Download & Replace
![download-icons](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20190811/download-icons.png){: width="600"}
Download the generated package, unzip and delete the following two from the extracted files:
- `browserconfig.xml`
- `site.webmanifest`
- browserconfig.xml
- manifest.json
Now, copy the remaining image files (`PNG` and `ICO`) to cover the original files in the folder `assets/img/favicons/` of your Jekyll site.
Now, copy the remaining image files (`.PNG` and `.ICO`) from the extracted `.zip` file to cover the original files in the folder `assets/img/favicons/`.
The following table will helps you understand the changes to the favicon files:
The following table helps you understand the changes to the icon file:
| File(s) | From Online Tool | From Chirpy |
> ✓ means keep, ✗ means delete.
| File(s) | From Favicon & App Icon Generator | From Chirpy |
|---------------------|:---------------------------------:|:-----------:|
| `*.PNG` | ✓ | ✗ |
| `*.ICO` | ✓ | ✗ |
| `browserconfig.xml` | ✗ | ✓ |
| `site.webmanifest` | ✗ | ✓ |
| `manifest.json` | ✗ | ✓ |
> Note: ✓ means keep, ✗ means delete.
The next time you build the site, the favicon will be replaced with a customized edition.
The next time you build the site, the icon will be replaced with a customized edition.

View File

@@ -7,7 +7,7 @@ tags: [google analytics, pageviews]
---
This post is to enable Page Views on the [**Chirpy**][chirpy-homepage] theme based blog that you just built. This requires technical knowledge and it's recommended to keep the `google_analytics.pv.*` empty unless you have a good reason. If your website has low traffic, the page views count would discourage you to write more blogs. With that said, let's start with the setup.
This post is to enable Page Views on the [**Chirpy**][chirpy-homepage] theme based blog that you just built. This requires technical knowledge and it's recommended to keep the `google_analytics.pv` disabled unless you have a good reason. If your website has low traffic, the page views count would discourage you to write more blogs. With that said, let's start with the setup.
## Set up Google Analytics
@@ -33,22 +33,25 @@ With your property created, you now need to set up Data Stream to track your blo
It should look like this:
![google-analytics-data-stream](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/01-google-analytics-data-stream.png){: width="1086" height="542"}
![google-analytics-data-stream](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/01-google-analytics-data-stream.png)
Now, click on the new data stream and grab the **Measurement ID**. It should look something like `G-V6XXXXXXXX`. Copy this to your `_config.yml` file
```yaml
google_analytics:
id: 'G-V6XXXXXXX' # fill in your Google Analytics ID
# Google Analytics pageviews report settings
id: 'G-V6XXXXXXX' # Fill with your Google Analytics ID
pv:
proxy_endpoint: # fill in the Google Analytics superProxy endpoint of Google App Engine
cache_path: # the local PV cache data, friendly to visitors from GFW region
# The Google Analytics pageviews switch.
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.
```
When you push these changes to your blog, you should start seeing the traffic on your Google Analytics. Play around with Google Analytics dashboard to get familiar with the options available as it takes like 5 mins to pickup your changes. You should now be able to monitor your traffic in realtime.
![google-analytics-realtime](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/02-google-analytics-realtime.png){: width="616" height="557"}
![google-analytics-realtime](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/02-google-analytics-realtime.png)
## Setup Page Views
@@ -183,7 +186,7 @@ There is a detailed [tutorial](https://developers.google.com/analytics/solutions
If everything went good, you'll get this screen:
![superProxy-deployed](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/03-superProxy-deployed.png){: width="1366" height="354"}
![superProxy-deployed](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/03-superProxy-deployed.png)
### Create Google Analytics Query
@@ -208,23 +211,28 @@ After <kbd>Run Query</kbd>, copy the generated contents of **API Query URI** at
After the query is saved on GAE, a **Public Endpoint** (public access address) will be generated, and we will get the query result in JSON format when accessing it. Finally, click <kbd>Enable Endpoint</kbd> in **Public Request Endpoint** to make the query effective, and click <kbd>Start Scheduling</kbd> in **Scheduling** to start the scheduled task.
![superproxy-query](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/04-superproxy-query.png){: width="1100" height="126"}
![superproxy-query](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/04-superproxy-query.png)
## Configure Chirpy to Display Page View
Once all the hard part is done, it is very easy to enable the Page View on Chirpy theme. Your superProxy dashboard should look something like below and you can grab the required values.
![superproxy-dashboard](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/05-superproxy-dashboard.png){: width="1210" height="694"}
![superproxy-dashboard](https://cdn.jsdelivr.net/gh/cotes2020/chirpy-images/posts/20210103/05-superproxy-dashboard.png)
Update the `_config.yml` file of [**Chirpy**][chirpy-homepage] project with the values from your dashboard, to look similar to the following:
```yaml
google_analytics:
id: 'G-V6XXXXXXX' # fill in your Google Analytics ID
id: 'G-XXXXXXXXXX' # Fill with your Google Analytics ID
pv:
# The Google Analytics pageviews switch.
enabled: true
# the next options only valid when `google_analytics.pv` is enabled.
proxy_url: 'https://PROJECT_ID.REGION_ID.r.appspot.com'
proxy_endpoint: 'https://PROJECT_ID.REGION_ID.r.appspot.com/query?id=<ID FROM SUPER PROXY>'
cache_path: # the local PV cache data, friendly to visitors from GFW region
cache: false # pv data local cache, good for the users from GFW area.
```
Now, you should see the Page View enabled on your blog.

View File

@@ -107,7 +107,6 @@ a {
img {
max-width: 100%;
height: auto;
}
blockquote {
@@ -230,7 +229,7 @@ footer {
@extend %no-bottom-border;
color: inherit;
color: #6c757d;
}
}
@@ -358,13 +357,16 @@ footer {
}
.post-content {
font-size: 1.08rem;
line-height: 1.8;
margin-top: 2rem;
overflow-wrap: break-word;
word-wrap: break-word;
@mixin caption {
img[data-src] {
margin: 0.5rem 0;
}
@mixin img-caption {
+ em {
display: block;
text-align: center;
@@ -375,34 +377,24 @@ footer {
}
}
@keyframes fade-in {
from { opacity: 0; }
to { opacity: 1; }
}
@mixin img($caption: false) {
img[data-src] {
margin: 0.5rem 0;
> img[data-src] {
@if $caption {
@include img-caption;
}
&.left {
float: left;
margin: 0.75rem 1rem 1rem 0;
}
&.right {
float: right;
margin: 0.75rem 0 1rem 1rem;
}
&[data-loaded=true] {
animation: fade-in linear .5s;
}
&.left {
float: left;
margin: 0.75rem 1rem 1rem 0;
}
&.right {
float: right;
margin: 0.75rem 0 1rem 1rem;
}
&.shadow {
filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.08));
}
@include caption;
}
a {
@@ -410,7 +402,7 @@ footer {
color: var(--link-color);
}
&:not(.img-link) {
&:not(.img-hyperlink) {
@extend %link-color;
@extend %link-underline;
&:hover {
@@ -418,19 +410,23 @@ footer {
}
}
&.popup { // created by `_includes/img-extra.html`
cursor: zoom-in;
> img[data-src]:not(.normal):not(.left):not(.right) {
@include align-center;
}
&.img-hyperlink {
@include img;
@include img-caption;
}
}
&.img-link {
@include caption;
> p {
> img[data-src]:not(.normal):not(.left):not(.right) {
@include align-center;
}
}
} // a
p {
@include img(true);
font-size: 1.08rem;
}
ul {
// attribute 'hide-bullet' was added by liquid
@@ -589,22 +585,10 @@ footer {
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
/* --- Overriding --- */
// magnific-popup
figure .mfp-title {
text-align: center;
padding-right: 0;
margin-top: 0.5rem;
}
// mermaid
.mermaid {
text-align: center;
}
/* --- sidebar layout --- */
$tab-count: 5 !default;
$sidebar-display: "sidebar-display";
#sidebar {
@@ -615,19 +599,10 @@ $sidebar-display: "sidebar-display";
left: 0;
height: 100%;
overflow-y: auto;
width: $sidebar-width;
width: $sidebar-width-medium;
z-index: 99;
background: var(--sidebar-bg);
/* Hide scrollbar for Chrome, Safari and Opera */
&::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
a {
@include sidebar-links;
@@ -724,6 +699,7 @@ $sidebar-display: "sidebar-display";
width: 100%;
&:last-child {
$cursor-width: 3px;
a {
position: relative;
@@ -753,12 +729,12 @@ $sidebar-display: "sidebar-display";
@for $i from 1 through $tab-count {
$offset: $tab-count - $i;
$top: -$offset * $tab-height + ($tab-height - $tab-cursor-height) / 2;
$top: -$offset * $tab-height + $tab-cursor-height / 2;
@if $i < $tab-count {
> li.active:nth-child(#{$i}),
> li.nav-item:nth-child(#{$i}):hover {
~ li:last-child::after {
~li:last-child::after {
@include fix-cursor($top);
}
}
@@ -852,7 +828,7 @@ $sidebar-display: "sidebar-display";
height: $topbar-height;
position: fixed;
top: 0;
left: $sidebar-width; /* same as sidebar width */
left: 260px; /* same as sidebar width */
right: 0;
transition: top 0.2s ease-in-out;
z-index: 50;
@@ -893,7 +869,7 @@ $sidebar-display: "sidebar-display";
#search-wrapper {
display: flex;
width: 85%;
width: 95%;
border-radius: 1rem;
border: 1px solid var(--search-wrapper-bg);
background: var(--search-wrapper-bg);
@@ -920,6 +896,7 @@ $sidebar-display: "sidebar-display";
border-radius: 0;
padding: 0.18rem 0.3rem;
color: var(--text-color);
font-size: 95%;
&:focus {
box-shadow: none;
@@ -1085,18 +1062,11 @@ $sidebar-display: "sidebar-display";
-webkit-transform: translate3d(0, -5px, 0);
}
/*
Responsive Design:
{sidebar, content, panel} >= 1120px screen width
{sidebar, content} >= 850px screen width
{content} <= 849px screen width
*/
/* --- Responsive Design --- */
@media all and (max-width: 576px) {
$footer-height: $footer-height-mobile; // overwrite
$footer-height: 6rem; // overwrite
#main > div.row:first-child > div:first-child {
min-height: calc(100vh - #{$topbar-height} - #{$footer-height});
@@ -1142,8 +1112,8 @@ $sidebar-display: "sidebar-display";
}
/* hide sidebar and panel */
@media all and (max-width: 849px) {
/* Hide Sidebar and TOC */
@media all and (max-width: 830px) {
%slide {
-webkit-transition: transform 0.4s ease;
transition: transform 0.4s ease;
@@ -1170,7 +1140,7 @@ $sidebar-display: "sidebar-display";
#topbar-wrapper,
#main-wrapper {
transform: translateX(#{$sidebar-width});
transform: translateX(#{$sidebar-width-medium});
}
}
@@ -1178,8 +1148,8 @@ $sidebar-display: "sidebar-display";
#sidebar {
@extend %slide;
transform: translateX(-#{$sidebar-width}); // hide
-webkit-transform: translateX(-#{$sidebar-width});
transform: translateX(-#{$sidebar-width-medium}); // hide
-webkit-transform: translateX(-#{$sidebar-width-medium});
.cursor {
-webkit-transition: none;
@@ -1260,24 +1230,23 @@ $sidebar-display: "sidebar-display";
}
}
} // max-width: 849px
}
/* Phone & Pad */
@media all and (min-width: 577px) and (max-width: 1199px) {
footer > .d-flex > div {
width: 312px;
}
}
/* Sidebar is visible */
@media all and (min-width: 850px) {
/* Sidebar visible */
@media all and (min-width: 831px) {
/* Solved jumping scrollbar */
html {
overflow-y: scroll;
}
#main-wrapper {
margin-left: $sidebar-width;
margin-left: $sidebar-width-medium;
}
.profile-wrapper {
@@ -1317,9 +1286,9 @@ $sidebar-display: "sidebar-display";
}
/* Pad horizontal */
@media all and (min-width: 992px) and (max-width: 1199px) {
#main .col-lg-11 {
/* iPad 9.7" horizontal */
@media all and (min-width: 992px) and (max-width: 1024px) {
#main-wrapper .col-lg-11 {
-webkit-box-flex: 0;
-ms-flex: 0 0 96%;
flex: 0 0 96%;
@@ -1327,17 +1296,11 @@ $sidebar-display: "sidebar-display";
}
}
/* Compact icons in sidebar & panel hidden */
@media all and (min-width: 850px) and (max-width: 1199px) {
/* Compact icons in sidebar & TOC hidden */
@media all and (min-width: 832px) and (max-width: 1199px) {
#sidebar {
width: $sidebar-width-small;
.site-subtitle {
margin-left: 1rem;
margin-right: 1rem;
}
.sidebar-bottom {
a,
span {
@@ -1382,7 +1345,7 @@ $sidebar-display: "sidebar-display";
}
/* panel hidden */
/* Pannel hidden */
@media all and (max-width: 1199px) {
#panel-wrapper {
display: none;
@@ -1444,7 +1407,7 @@ $sidebar-display: "sidebar-display";
}
}
.post-content {
.post-content p {
font-size: 1.03rem;
}
@@ -1637,7 +1600,7 @@ $sidebar-display: "sidebar-display";
} // #sidebar
footer > div.d-flex {
width: 92%;
width: 87%;
max-width: 1140px;
}

View File

@@ -39,6 +39,8 @@ html[mode=dark] {
padding: 1.5rem;
}
$code-font-size: 0.85rem;
div > pre {
@extend %code-snippet-bg;
@extend %code-snippet-radius;
@@ -63,28 +65,6 @@ div > pre {
}
overflow: auto;
pre {
margin-bottom: 0;
font-size: $code-font-size;
line-height: 1.4rem;
word-wrap: normal; /* Fixed Safari overflow-x */
}
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;
}
.lineno {
margin-left: 0.2rem;
padding-right: 0.5rem;
@@ -99,12 +79,24 @@ div > pre {
-o-user-select: none;
user-select: none;
}
/* set the dollar sign to non-selectable */
.gp {
user-select: none;
pre {
margin-bottom: 0;
font-size: $code-font-size;
line-height: 1.4rem;
word-wrap: normal; /* Fixed Safari overflow-x */
}
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;
}
} //.highlight
code {

View File

@@ -1,34 +1,22 @@
/*
* The SCSS variables
*/
* Mainly scss variables
*/
/* sidebar */
/* --- ↓ width and height ---- */
$sidebar-width: 260px !default; // the basic width
$sidebar-width-small: 210px !default; // screen width: >= 850px, <= 1199px (iPad landscape)
$sidebar-width-large: 350px !default; // screen width: >= 1650px
$tab-height: 3.2rem;
$tab-cursor-height: 1.6rem;
/* tabs of sidebar */
$sidebar-width-small: 210px;
$sidebar-width-medium: 260px;
$sidebar-width-large: 350px;
$tab-count: 5 !default; // backward compatible (version <= 4.0.2)
$tab-height: 3.2rem !default;
$tab-cursor-height: 1.6rem !default;
$topbar-height: 3rem;
$cursor-width: 3px !default; // the cursor width of the selected tab
$footer-height: 5rem;
/* other framework sizes */
$main-content-max-width: 1150px;
$topbar-height: 3rem !default;
$panel-max-width: 300px;
$footer-height: 5rem !default;
$footer-height-mobile: 6rem !default; // screen width: <= 576px
$main-content-max-width: 1150px !default;
$panel-max-width: 300px !default;
$post-extend-min-height: 35rem !default;
/* syntax highlight */
$code-font-size: 0.85rem !default;
$post-extend-min-height: 35rem;

View File

@@ -68,7 +68,7 @@
/* --- custom light colors --- */
--highlight-bg-color: #f7f7f7;
--highlighter-rouge-color: #2f2f2f;
--highlighter-rouge-color: #505050;
--highlight-lineno-color: #c2c6cc;
--highlight-lineno-border-color: #e9ecef;
--inline-code-bg: #f3f3f3;

View File

@@ -9,7 +9,7 @@
--main-wrapper-bg: white;
--main-border-color: #f3f3f3;
--btn-border-color: #e9ecef;
--text-color: #34343c;
--text-color: #4a4a4a;
--heading-color: black;
--blockquote-border-color: #eee;
--blockquote-text-color: #9a9a9a;

View File

@@ -1,7 +1,7 @@
/*!
* The styles for Jekyll theme Chirpy
*
* Chirpy v4.1.0 (https://github.com/cotes2020/jekyll-theme-chirpy)
* Chirpy v3.3.2 (https://github.com/cotes2020/jekyll-theme-chirpy)
* © 2019 Cotes Chung
* MIT Licensed
*/
@@ -12,7 +12,6 @@
"addon/module",
"addon/variables",
"variables-hook",
"addon/syntax",
"addon/commons",

View File

@@ -3,24 +3,27 @@
*/
.pagination {
color: var(--btn-patinator-text-color);
font-family: 'Lato', sans-serif;
font-size: 1rem;
a:hover {
text-decoration: none;
}
.page-item {
.page-link {
color: inherit;
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);
&:hover {
background-color: var(--btn-paginator-hover-color);
@@ -46,6 +49,9 @@
&:last-child .page-link {
border-radius: 50%;
}
&:not(:last-child) {
margin-right: 0.7rem;
}
} // .page-item
} // .pagination
@@ -110,15 +116,7 @@
/* Hide SideBar and TOC */
@media all and (max-width: 830px) {
.pagination {
justify-content: space-evenly;
.page-item {
&:not(:first-child):not(:last-child) {
display: none;
}
}
justify-content: center;
}
}
@@ -146,24 +144,11 @@
.pagination {
font-size: 0.85rem;
.page-item {
&:not(:last-child) {
margin-right: 0.7rem;
}
.page-link {
width: 2rem;
height: 2rem;
}
.page-item .page-link {
width: 2.2rem;
height: 2.2rem;
}
.page-index {
display: none;
}
} // .pagination
}
}

View File

@@ -23,12 +23,24 @@
padding-right: $pr;
}
.timeago::before {
content: attr(prefix);
}
#post-wrapper .post-meta {
> div:nth-child(2) {
> span:not(:first-child)::before {
@include dot;
}
}
#pv::after {
content: " views";
}
.readtime::after {
content: " read";
}
}
.post-content {
@@ -143,10 +155,6 @@
line-height: 1rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
&.nav-link:not(.active) {
color: inherit;
}
}
/* --- Related Posts --- */

View File

@@ -1,3 +0,0 @@
/*
Appending custom SCSS variables will override the default ones in `_sass/addon/variables.scsss`
*/

View File

@@ -1,6 +1,5 @@
---
layout: compress
permalink: '/app.js'
---
/* Registering Service Worker */

View File

@@ -1,31 +0,0 @@
---
layout: page
title: "404: Page not found"
permalink: /404.html
redirect_from:
- /norobots/
- /assets/
- /posts/
dynamic_title: true
---
<div class="lead">
{%- capture _head_back -%}
<a href="{{ '/' | relative_url }}">{{ site.data.locales[site.lang].not_found.head_back }}</a>
{%- endcapture -%}
{%- capture _archives_page -%}
<a href="{{ 'archives' | relative_url }}">{{ site.data.locales[site.lang].not_found.archives_page }}</a>
{%- endcapture -%}
<p>{{site.data.locales[site.lang].not_found.statment }}</p>
<p>{{ site.data.locales[site.lang].not_found.hint_template
| replace: ':HEAD_BAK', _head_back
| replace: ':ARCHIVES_PAGE', _archives_page }}
</p>
</div>

View File

@@ -1,12 +1,7 @@
---
---
/*
If the number of TAB files has changed, the following variable is required.
And it must be defined before `@import`.
*/
// see: /_sass/addon/commons.scss
$tab-count: {{ site.tabs | size | plus: 1 }}; // plus 1 for home tab
@import "{{ site.theme }}";
/* append your custom style below */
@import "jekyll-theme-chirpy";

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View File

@@ -1,13 +1,16 @@
---
layout: compress
---
# A part of the Favicons
---
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square150x150logo src="{{ '/assets/img/favicons/mstile-150x150.png' | relative_url }}" />
<TileColor>#da532c</TileColor>
<square70x70logo src="{{ site.baseurl }}/assets/img/favicons/ms-icon-70x70.png" />
<square150x150logo src="{{ site.baseurl }}/assets/img/favicons/ms-icon-150x150.png" />
<square310x310logo src="{{ site.baseurl }}/assets/img/favicons/ms-icon-310x310.png" />
<TileColor>#ffffff</TileColor>
</tile>
</msapplication>
</browserconfig>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,54 @@
---
layout: compress
#
# A part of the Favicons
---
{% assign icon_url = "/assets/img/favicons" | relative_url %}
{
"name": "{{ site.title }}",
"short_name": "{{ site.title }}",
"description": "{{ site.description }}",
"icons": [
{
"src": "{{ icon_url }}/android-icon-36x36.png",
"sizes": "36x36",
"type": "image/png",
"density": "0.75"
},
{
"src": "{{ icon_url }}/android-icon-48x48.png",
"sizes": "48x48",
"type": "image/png",
"density": "1.0"
},
{
"src": "{{ icon_url }}/android-icon-72x72.png",
"sizes": "72x72",
"type": "image/png",
"density": "1.5"
},
{
"src": "{{ icon_url }}/android-icon-96x96.png",
"sizes": "96x96",
"type": "image/png",
"density": "2.0"
},
{
"src": "{{ icon_url }}/android-icon-144x144.png",
"sizes": "144x144",
"type": "image/png",
"density": "3.0"
},
{
"src": "{{ icon_url }}/android-icon-192x192.png",
"sizes": "192x192",
"type": "image/png",
"density": "4.0"
}],
"start_url": "{{ '/index.html' | relative_url }}",
"display": "fullscreen",
"theme_color": "#2a1e6b",
"background_color": "white"
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

View File

@@ -1,26 +0,0 @@
---
layout: compress
---
{% assign favicon_path = "/assets/img/favicons" | relative_url %}
{
"name": "{{ site.title }}",
"short_name": "{{ site.title }}",
"description": "{{ site.description }}",
"icons": [
{
"src": "{{ favicon_path }}/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "{{ favicon_path }}/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}],
"start_url": "{{ '/index.html' | relative_url }}",
"theme_color": "#2a1e6b",
"background_color": "#ffffff",
"display": "fullscreen"
}

View File

@@ -2,7 +2,7 @@
* Copy current page url to clipboard.
*/
function copyLink(url, msg) {
function copyLink(url) {
if (!url || 0 === url.length) {
url = window.location.href;
}
@@ -13,10 +13,6 @@ function copyLink(url, msg) {
document.execCommand("copy");
$temp.remove();
let feedback = "Link copied successfully!";
if (msg && msg.length > 0) {
feedback = msg;
}
alert("Link copied successfully!");
alert(feedback);
}

5
assets/js/_copyright Normal file
View File

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

Some files were not shown because too many files have changed in this diff Show More