{title}
{content}
Repository: cotes2020/jekyll-theme-chirpy Branch: master Commit: 9adb7e352b7d Files: 219 Total size: 395.1 KB Directory structure: gitextract_gso752j0/ ├── .devcontainer/ │ ├── devcontainer.json │ └── post-create.sh ├── .editorconfig ├── .gitattributes ├── .github/ │ ├── DISCUSSION_TEMPLATE/ │ │ ├── general.yml │ │ ├── ideas.yml │ │ └── q-a.yml │ ├── FUNDING.yml │ ├── ISSUE_TEMPLATE/ │ │ ├── bug_report.yml │ │ ├── config.yml │ │ └── feature_request.yml │ ├── PULL_REQUEST_TEMPLATE.md │ ├── codeql/ │ │ └── codeql-config.yml │ ├── dependabot.yml │ └── workflows/ │ ├── cd.yml │ ├── ci.yml │ ├── codeql.yml │ ├── commitlint.yml │ ├── lint-js.yml │ ├── lint-scss.yml │ ├── pr-filter.yml │ ├── publish.yml │ ├── scripts/ │ │ └── pr-filter.js │ ├── stale.yml │ └── starter/ │ └── pages-deploy.yml ├── .gitignore ├── .gitmodules ├── .husky/ │ └── commit-msg ├── .markdownlint.json ├── .nojekyll ├── .stylelintrc.json ├── .vscode/ │ ├── extensions.json │ ├── settings.json │ └── tasks.json ├── Gemfile ├── LICENSE ├── README.md ├── _config.yml ├── _data/ │ ├── authors.yml │ ├── contact.yml │ ├── locales/ │ │ ├── ar.yml │ │ ├── bg-BG.yml │ │ ├── ca-ES.yml │ │ ├── cs-CZ.yml │ │ ├── da-DK.yml │ │ ├── de-DE.yml │ │ ├── dv‑MV.yml │ │ ├── el-GR.yml │ │ ├── en.yml │ │ ├── es-ES.yml │ │ ├── fa-IR.yml │ │ ├── fi-FI.yml │ │ ├── fr-FR.yml │ │ ├── hu-HU.yml │ │ ├── id-ID.yml │ │ ├── it-IT.yml │ │ ├── ja-JP.yml │ │ ├── ko-KR.yml │ │ ├── ku-IQ.yml │ │ ├── my-MM.yml │ │ ├── nl-NL.yml │ │ ├── ps‑AF.yml │ │ ├── pt-BR.yml │ │ ├── ru-RU.yml │ │ ├── sl-SI.yml │ │ ├── sv-SE.yml │ │ ├── th.yml │ │ ├── tr-TR.yml │ │ ├── uk-UA.yml │ │ ├── ur-PK.yml │ │ ├── vi-VN.yml │ │ ├── zh-CN.yml │ │ └── zh-TW.yml │ ├── media.yml │ ├── origin/ │ │ ├── basic.yml │ │ └── cors.yml │ └── share.yml ├── _includes/ │ ├── analytics/ │ │ ├── cloudflare.html │ │ ├── fathom.html │ │ ├── goatcounter.html │ │ ├── google.html │ │ ├── matomo.html │ │ └── umami.html │ ├── comment.html │ ├── comments/ │ │ ├── disqus.html │ │ ├── giscus.html │ │ └── utterances.html │ ├── datetime.html │ ├── embed/ │ │ ├── audio.html │ │ ├── bilibili.html │ │ ├── spotify.html │ │ ├── twitch.html │ │ ├── video.html │ │ └── youtube.html │ ├── favicons.html │ ├── footer.html │ ├── head.html │ ├── js-selector.html │ ├── jsdelivr-combine.html │ ├── lang.html │ ├── language-alias.html │ ├── media-url.html │ ├── metadata-hook.html │ ├── notification.html │ ├── origin-type.html │ ├── pageviews/ │ │ └── goatcounter.html │ ├── post-nav.html │ ├── post-paginator.html │ ├── post-sharing.html │ ├── post-summary.html │ ├── read-time.html │ ├── refactor-content.html │ ├── related-posts.html │ ├── search-loader.html │ ├── search-results.html │ ├── sidebar.html │ ├── toc-status.html │ ├── toc.html │ ├── topbar.html │ ├── trending-tags.html │ └── update-list.html ├── _javascript/ │ ├── categories.js │ ├── commons.js │ ├── home.js │ ├── misc.js │ ├── modules/ │ │ ├── components/ │ │ │ ├── back-to-top.js │ │ │ ├── category-collapse.js │ │ │ ├── clipboard.js │ │ │ ├── img-loading.js │ │ │ ├── img-popup.js │ │ │ ├── locale-datetime.js │ │ │ ├── mermaid.js │ │ │ ├── mode-toggle.js │ │ │ ├── search-display.js │ │ │ ├── toc/ │ │ │ │ ├── toc-desktop.js │ │ │ │ └── toc-mobile.js │ │ │ ├── toc.js │ │ │ └── tooltip-loader.js │ │ ├── components.js │ │ ├── layouts/ │ │ │ ├── basic.js │ │ │ ├── sidebar.js │ │ │ └── topbar.js │ │ └── layouts.js │ ├── page.js │ ├── post.js │ ├── pwa/ │ │ ├── app.js │ │ └── sw.js │ └── theme.js ├── _layouts/ │ ├── archives.html │ ├── categories.html │ ├── category.html │ ├── compress.html │ ├── default.html │ ├── home.html │ ├── page.html │ ├── post.html │ ├── tag.html │ └── tags.html ├── _plugins/ │ └── posts-lastmod-hook.rb ├── _posts/ │ ├── 2019-08-08-text-and-typography.md │ ├── 2019-08-08-write-a-new-post.md │ ├── 2019-08-09-getting-started.md │ └── 2019-08-11-customize-the-favicon.md ├── _sass/ │ ├── abstracts/ │ │ ├── _breakpoints.scss │ │ ├── _index.scss │ │ ├── _mixins.scss │ │ ├── _placeholders.scss │ │ └── _variables.scss │ ├── base/ │ │ ├── _base.scss │ │ ├── _index.scss │ │ ├── _reset.scss │ │ ├── _syntax.scss │ │ └── _typography.scss │ ├── components/ │ │ ├── _buttons.scss │ │ ├── _index.scss │ │ └── _popups.scss │ ├── layout/ │ │ ├── _footer.scss │ │ ├── _index.scss │ │ ├── _panel.scss │ │ ├── _sidebar.scss │ │ └── _topbar.scss │ ├── main.bundle.scss │ ├── main.scss │ ├── pages/ │ │ ├── _archives.scss │ │ ├── _categories.scss │ │ ├── _category-tag.scss │ │ ├── _home.scss │ │ ├── _index.scss │ │ ├── _post.scss │ │ ├── _search.scss │ │ └── _tags.scss │ └── themes/ │ ├── _dark.scss │ └── _light.scss ├── _tabs/ │ ├── about.md │ ├── archives.md │ ├── categories.md │ └── tags.md ├── assets/ │ ├── 404.html │ ├── css/ │ │ └── jekyll-theme-chirpy.scss │ ├── feed.xml │ ├── img/ │ │ └── favicons/ │ │ └── site.webmanifest │ ├── js/ │ │ └── data/ │ │ ├── mathjax.js │ │ ├── search.json │ │ └── swconf.js │ └── robots.txt ├── docs/ │ ├── CHANGELOG.md │ ├── CODE_OF_CONDUCT.md │ ├── CONTRIBUTING.md │ └── SECURITY.md ├── eslint.config.js ├── index.html ├── jekyll-theme-chirpy.gemspec ├── package.json ├── purgecss.js ├── rollup.config.js └── tools/ ├── init.sh ├── release.sh ├── run.sh └── test.sh ================================================ FILE CONTENTS ================================================ ================================================ FILE: .devcontainer/devcontainer.json ================================================ { "name": "Jekyll", "image": "mcr.microsoft.com/devcontainers/jekyll:2-bullseye", "onCreateCommand": "git config --global --add safe.directory ${containerWorkspaceFolder}", "postCreateCommand": "bash .devcontainer/post-create.sh", "customizations": { "vscode": { "settings": { "terminal.integrated.defaultProfile.linux": "zsh" }, "extensions": [ // Liquid tags auto-complete "killalau.vscode-liquid-snippets", // Liquid syntax highlighting and formatting "Shopify.theme-check-vscode", // Shell "timonwong.shellcheck", "mkhl.shfmt", // Common formatter "EditorConfig.EditorConfig", "esbenp.prettier-vscode", "stylelint.vscode-stylelint", "yzhang.markdown-all-in-one", // Git "mhutchie.git-graph" ] } } } ================================================ FILE: .devcontainer/post-create.sh ================================================ #!/usr/bin/env bash if [ -f package.json ]; then bash -i -c "nvm install --lts && nvm install-latest-npm" npm i npm run build fi # Install dependencies for shfmt extension curl -sS https://webi.sh/shfmt | sh &>/dev/null # Add OMZ plugins git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ~/.oh-my-zsh/custom/plugins/zsh-syntax-highlighting git clone https://github.com/zsh-users/zsh-autosuggestions ~/.oh-my-zsh/custom/plugins/zsh-autosuggestions sed -i -E "s/^(plugins=\()(git)(\))/\1\2 zsh-syntax-highlighting zsh-autosuggestions\3/" ~/.zshrc # Avoid git log use less echo -e "\nunset LESS" >>~/.zshrc ================================================ FILE: .editorconfig ================================================ root = true [*] charset = utf-8 indent_style = space indent_size = 2 trim_trailing_whitespace = true # Unix-style newlines with a newline ending every file end_of_line = lf insert_final_newline = true [*.{js,css,scss}] quote_type = single [*.{yml,yaml}] quote_type = double [*.md] trim_trailing_whitespace = false ================================================ FILE: .gitattributes ================================================ # Set default behavior to automatically normalize line endings. * text=auto # Force bash scripts to always use LF line endings so that if a repo is accessed # in Unix via a file share from Windows, the scripts will work. *.sh text eol=lf # Force batch scripts to always use CRLF line endings so that if a repo is accessed # in Windows via a file share from Linux, the scripts will work. *.{cmd,[cC][mM][dD]} text eol=crlf *.{bat,[bB][aA][tT]} text eol=crlf # Denote all files that are truly binary and should not be modified. *.png binary *.jpg binary *.ico binary ================================================ FILE: .github/DISCUSSION_TEMPLATE/general.yml ================================================ body: - type: checkboxes attributes: label: Checklist description: Following the guidelines can make you more likely to get responses. options: - label: >- I have read and accepted the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CONTRIBUTING.md). required: true - type: textarea attributes: label: Description description: Please describe in detail what you want to share. validations: required: true ================================================ FILE: .github/DISCUSSION_TEMPLATE/ideas.yml ================================================ body: - type: textarea attributes: label: Description description: Please describe in detail what you want to share. validations: required: true ================================================ FILE: .github/DISCUSSION_TEMPLATE/q-a.yml ================================================ body: - type: checkboxes attributes: label: Checklist description: Following the guidelines can make you more likely to get responses. options: - label: >- I have read and accepted the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CONTRIBUTING.md). required: true - type: dropdown id: download attributes: label: How did you create the site? options: - Generated from `chirpy-starter` - Built from `jekyll-theme-chirpy` validations: required: true - type: textarea attributes: label: Description description: Please describe your need in detail. validations: required: true - type: textarea attributes: label: Operations you have already tried description: Describe the effort you went through. validations: required: true - type: textarea attributes: label: Anything else? description: | Links? References? Or logs? Anything that will give us more context about the issue you are encountering! ================================================ FILE: .github/FUNDING.yml ================================================ ko_fi: coteschung ================================================ FILE: .github/ISSUE_TEMPLATE/bug_report.yml ================================================ name: Bug Report description: Create a report to help us improve body: - type: checkboxes attributes: label: Checklist description: Following the guidelines can make you more likely to get responses. options: - label: >- I have read and accepted the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CONTRIBUTING.md). required: true - type: dropdown id: download attributes: label: How did you create the site? options: - Generated from `chirpy-starter` - Built from `jekyll-theme-chirpy` validations: required: true - type: textarea attributes: label: Describe the bug description: A clear and concise description of what the bug is. validations: required: true - type: textarea attributes: label: Steps To Reproduce description: Steps to reproduce the behavior. placeholder: | 1. In this environment... 2. With this config... 3. Run '...' 4. See error... validations: required: true - type: textarea attributes: label: Expected Behavior description: A concise description of what you expected to happen. validations: required: true - type: textarea attributes: label: Environment value: | - Ruby: - Jekyll: - Chirpy: validations: required: true - type: textarea attributes: label: Anything else? description: | Links? References? Or logs? Anything that will give us more context about the issue you are encountering! ================================================ FILE: .github/ISSUE_TEMPLATE/config.yml ================================================ blank_issues_enabled: false contact_links: - name: Ask the community for help url: https://github.com/cotes2020/jekyll-theme-chirpy/discussions about: Please ask and answer questions here. ================================================ FILE: .github/ISSUE_TEMPLATE/feature_request.yml ================================================ name: Feature Request description: Suggest an idea for this project labels: - enhancement body: - type: checkboxes attributes: label: Checklist description: Following the guidelines can make you more likely to get responses. options: - label: >- I have read and accepted the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CONTRIBUTING.md). required: true - type: textarea attributes: label: Is your feature request related to a problem? Please describe description: A clear and concise description of what the problem is. validations: required: true - type: textarea attributes: label: Describe the solution you'd like description: A clear and concise description of what you want to happen. validations: required: true - type: textarea attributes: label: Describe alternatives you've considered description: A clear and concise description of any alternative solutions or features you've considered. - type: textarea attributes: label: Additional context description: Add any other context or screenshots about the feature request here. ================================================ FILE: .github/PULL_REQUEST_TEMPLATE.md ================================================ ## Type of change - [ ] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Improvement (refactoring and improving code) - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [ ] Documentation update ## Description ## Additional context ================================================ FILE: .github/codeql/codeql-config.yml ================================================ paths-ignore: - "assets/js" ================================================ FILE: .github/dependabot.yml ================================================ version: 2 updates: - package-ecosystem: "bundler" directory: "/" schedule: interval: "weekly" - package-ecosystem: "npm" directory: "/" versioning-strategy: increase groups: prod-deps: dependency-type: production dev-deps: dependency-type: development schedule: interval: "weekly" - package-ecosystem: "github-actions" directories: - "/.github/workflows/**" groups: gh-actions: update-types: - "major" schedule: interval: "weekly" - package-ecosystem: "devcontainers" directory: "/" schedule: interval: weekly ================================================ FILE: .github/workflows/cd.yml ================================================ name: CD on: push: branches: [production] tags-ignore: ["**"] jobs: release: if: ${{ ! startsWith(github.event.head_commit.message, 'chore(release)') }} permissions: contents: write issues: write pull-requests: write runs-on: ubuntu-latest steps: - uses: actions/checkout@v6 - uses: ruby/setup-ruby@v1 with: ruby-version: 3.4 bundler-cache: true - uses: actions/setup-node@v6 with: node-version: lts/* - run: npm install - run: npx semantic-release env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} GEM_HOST_API_KEY: ${{ secrets.GEM_HOST_API_KEY }} publish: needs: release uses: ./.github/workflows/publish.yml secrets: GH_PAT: ${{ secrets.GH_PAT }} BUILDER: ${{ secrets.BUILDER }} ================================================ FILE: .github/workflows/ci.yml ================================================ name: CI on: push: branches: - master - "hotfix/*" paths-ignore: - ".github/**" - "!.github/workflows/ci.yml" - .gitignore - "docs/**" - README.md - LICENSE pull_request: paths-ignore: - ".github/**" - "!.github/workflows/ci.yml" - .gitignore - "docs/**" - README.md - LICENSE jobs: build: runs-on: ubuntu-latest strategy: matrix: ruby: ["3.3", "3.4"] steps: - name: Checkout uses: actions/checkout@v6 with: fetch-depth: 0 # for posts's lastmod - name: Setup Ruby uses: ruby/setup-ruby@v1 with: ruby-version: ${{ matrix.ruby }} bundler-cache: true - name: Setup Node uses: actions/setup-node@v6 with: node-version: lts/* - name: Build Assets run: npm i && npm run build - name: Test Site run: bash tools/test.sh ================================================ FILE: .github/workflows/codeql.yml ================================================ name: "CodeQL" on: push: branches: ["master"] paths: ["_javascript/**/*.js"] pull_request: paths: ["_javascript/**/*.js"] jobs: analyze: name: Analyze runs-on: ubuntu-latest permissions: actions: read contents: read security-events: write strategy: fail-fast: false matrix: language: ["javascript"] # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support steps: - name: Checkout repository uses: actions/checkout@v6 # Initializes the CodeQL tools for scanning. - name: Initialize CodeQL uses: github/codeql-action/init@v4 with: languages: "${{ matrix.language }}" config-file: .github/codeql/codeql-config.yml # Autobuild attempts to build any compiled languages (C/C++, C#, Go, or Java). # If this step fails, then you should remove it and run the build manually (see below) - name: Autobuild uses: github/codeql-action/autobuild@v4 - name: Perform CodeQL Analysis uses: github/codeql-action/analyze@v4 with: category: "/language:${{ matrix.language }}" ================================================ FILE: .github/workflows/commitlint.yml ================================================ name: Lint Commit Messages on: push: branches: - master - "hotfix/*" pull_request: jobs: commitlint: runs-on: ubuntu-latest steps: - uses: actions/checkout@v6 - uses: wagoid/commitlint-github-action@v6 ================================================ FILE: .github/workflows/lint-js.yml ================================================ name: Lint JS on: push: paths: - "_javascript/**/*.js" - ".github/workflows/scripts/**/*.js" - "*.js" pull_request: paths: - "_javascript/**/*.js" - ".github/workflows/scripts/*.js" - "*.js" jobs: lint-js: runs-on: ubuntu-latest steps: - uses: actions/checkout@v6 - name: Setup Node.js uses: actions/setup-node@v6 with: node-version: lts/* - name: Install Dependencies run: npm i - name: Lint JS run: npm run lint:js ================================================ FILE: .github/workflows/lint-scss.yml ================================================ name: Lint SCSS on: push: paths: - "_sass/**/*.scss" pull_request: paths: - "_sass/**/*.scss" jobs: lint-scss: runs-on: ubuntu-latest steps: - uses: actions/checkout@v6 - name: Setup Node.js uses: actions/setup-node@v6 with: node-version: lts/* - name: Install Dependencies run: npm i - name: Lint SCSS run: npm run lint:scss ================================================ FILE: .github/workflows/pr-filter.yml ================================================ name: PR Filter on: pull_request_target: types: [opened, reopened] jobs: check-template: if: github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name runs-on: ubuntu-latest permissions: pull-requests: write steps: - name: Checkout Code uses: actions/checkout@v6 - name: Check PR Content id: intercept uses: actions/github-script@v8 with: github-token: ${{ secrets.GITHUB_TOKEN }} script: | const { default: filter } = await import('${{ github.workspace }}/.github/workflows/scripts/pr-filter.js'); await filter({ github, context, core }); ================================================ FILE: .github/workflows/publish.yml ================================================ name: Publish on: push: branches: - docs workflow_call: secrets: GH_PAT: required: true BUILDER: required: true workflow_dispatch: jobs: launch: runs-on: ubuntu-latest steps: - run: | curl -X POST -H "Accept: application/vnd.github+json" \ -H "Authorization: Bearer ${{ secrets.GH_PAT }}" \ https://api.github.com/repos/${{ secrets.BUILDER }}/dispatches \ -d '{"event_type":"deploy", "client_payload":{"branch": "${{ github.ref_name }}"}}' ================================================ FILE: .github/workflows/scripts/pr-filter.js ================================================ function hasTypes(markdown) { return /## Type of change/.test(markdown) && /-\s\[x\]/i.test(markdown); } function hasDescription(markdown) { return ( /## Description/.test(markdown) && !/## Description\s*\n\s*(##|\s*$)/.test(markdown) ); } export default async ({ github, context, core }) => { const pr = context.payload.pull_request; const body = pr.body === null ? '' : pr.body; const markdown = body.replace(//g, ''); const action = context.payload.action; const isValid = markdown !== '' && hasTypes(markdown) && hasDescription(markdown); if (!isValid) { await github.rest.pulls.update({ ...context.repo, pull_number: pr.number, state: 'closed' }); await github.rest.issues.createComment({ ...context.repo, issue_number: pr.number, body: `Oops, it seems you've ${action} an invalid pull request. No worries, we'll close it for you.` }); core.setFailed('PR content does not meet template requirements.'); } }; ================================================ FILE: .github/workflows/stale.yml ================================================ name: "Close stale issues and PRs" on: schedule: - cron: "0 0 * * *" # every day at 00:00 UTC permissions: issues: write pull-requests: write env: STALE_LABEL: inactive EXEMPT_LABELS: "pending,planning,in progress" MESSAGE: > This conversation has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. jobs: stale: runs-on: ubuntu-latest steps: - uses: actions/stale@v10 with: # 60 days before marking issues/PRs stale days-before-close: -1 # does not close automatically stale-issue-label: ${{ env.STALE_LABEL }} exempt-issue-labels: ${{ env.EXEMPT_LABELS }} stale-issue-message: ${{ env.MESSAGE }} stale-pr-label: ${{ env.STALE_LABEL }} exempt-pr-labels: ${{ env.EXEMPT_LABELS }} stale-pr-message: ${{ env.MESSAGE }} ================================================ FILE: .github/workflows/starter/pages-deploy.yml ================================================ name: "Build and Deploy" on: push: branches: - main - master paths-ignore: - .gitignore - README.md - LICENSE # Allows you to run this workflow manually from the Actions tab workflow_dispatch: permissions: contents: read pages: write id-token: write # Allow one concurrent deployment concurrency: group: "pages" cancel-in-progress: true jobs: build: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v6 with: fetch-depth: 0 # submodules: true # If using the 'assets' git submodule from Chirpy Starter, uncomment above # (See: https://github.com/cotes2020/chirpy-starter/tree/main/assets) - name: Setup Pages id: pages uses: actions/configure-pages@v5 - name: Setup Ruby uses: ruby/setup-ruby@v1 with: ruby-version: 3.4 bundler-cache: true - name: Build site run: bundle exec jekyll b -d "_site${{ steps.pages.outputs.base_path }}" env: JEKYLL_ENV: "production" - name: Test site run: | bundle exec htmlproofer _site \ \-\-disable-external \ \-\-ignore-urls "/^http:\/\/127.0.0.1/,/^http:\/\/0.0.0.0/,/^http:\/\/localhost/" - name: Upload site artifact uses: actions/upload-pages-artifact@v4 with: path: "_site${{ steps.pages.outputs.base_path }}" deploy: environment: name: github-pages url: ${{ steps.deployment.outputs.page_url }} runs-on: ubuntu-latest needs: build steps: - name: Deploy to GitHub Pages id: deployment uses: actions/deploy-pages@v4 ================================================ FILE: .gitignore ================================================ # Bundler cache .bundle vendor Gemfile.lock # Jekyll cache .jekyll-cache .jekyll-metadata _site # RubyGems *.gem # NPM dependencies node_modules package-lock.json # IDE configurations .idea .vscode/* !.vscode/settings.json !.vscode/extensions.json !.vscode/tasks.json # Misc _sass/vendors assets/js/dist ================================================ FILE: .gitmodules ================================================ [submodule "assets/lib"] path = assets/lib url = https://github.com/cotes2020/chirpy-static-assets.git ================================================ FILE: .husky/commit-msg ================================================ npx --no -- commitlint --edit $1 ================================================ FILE: .markdownlint.json ================================================ { "commands-show-output": false, "blanks-around-fences": false, "line-length": false, "no-inline-html": { "allowed_elements": ["kbd", "sub"] } } ================================================ FILE: .nojekyll ================================================ ================================================ FILE: .stylelintrc.json ================================================ { "ignoreFiles": ["_sass/vendors/**"], "extends": "stylelint-config-standard-scss", "rules": { "no-descending-specificity": null, "shorthand-property-no-redundant-values": null, "at-rule-no-vendor-prefix": null, "property-no-vendor-prefix": null, "selector-no-vendor-prefix": null, "value-no-vendor-prefix": null, "selector-not-notation": "simple", "color-hex-length": "long", "declaration-block-single-line-max-declarations": 3, "scss/operator-no-newline-after": null, "rule-empty-line-before": [ "always", { "ignore": ["after-comment", "first-nested"] } ], "value-keyword-case": [ "lower", { "ignoreProperties": ["/^\\$/"] } ], "media-feature-range-notation": "prefix" } } ================================================ FILE: .vscode/extensions.json ================================================ { "recommendations": ["ms-vscode-remote.remote-containers"] } ================================================ FILE: .vscode/settings.json ================================================ { // Prettier "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.formatOnSave": true, // Shopify Liquid "files.associations": { "*.html": "liquid" }, "[markdown]": { "editor.defaultFormatter": "yzhang.markdown-all-in-one" }, // Formatter "[html][liquid]": { "editor.defaultFormatter": "Shopify.theme-check-vscode" }, "[shellscript]": { "editor.defaultFormatter": "mkhl.shfmt" }, // Disable vscode built-in stylelint "css.validate": false, "scss.validate": false, "less.validate": false, // Stylint extension settings "stylelint.snippet": ["css", "scss"], "stylelint.validate": ["css", "scss"], // Run tasks in macOS "terminal.integrated.profiles.osx": { "zsh": { "path": "/bin/zsh", "args": ["-l", "-i"] } } } ================================================ FILE: .vscode/tasks.json ================================================ { "version": "2.0.0", "tasks": [ { "label": "Run Jekyll Server", "type": "shell", "command": "./tools/run.sh", "group": { "kind": "build", "isDefault": true }, "problemMatcher": [], "detail": "Runs the Jekyll server with live reload." }, { "label": "Build Jekyll Site", "type": "shell", "command": "./tools/test.sh", "group": { "kind": "build" }, "problemMatcher": [], "detail": "Build the Jekyll site for production." }, { "label": "Build JS (watch)", "type": "shell", "command": "npm run watch:js", "group": { "kind": "build" }, "problemMatcher": [], "detail": "Build JS files in watch mode." }, { "label": "Build CSS", "type": "shell", "command": "npm run build:css", "group": { "kind": "build" }, "problemMatcher": [], "detail": "Build CSS files." }, { "label": "Build JS & CSS", "type": "shell", "command": "npm run build", "group": { "kind": "build" }, "problemMatcher": [], "detail": "Build JS & CSS for production." }, { "label": "Run Jekyll Server + Build JS (watch)", "dependsOn": ["Run Jekyll Server", "Build JS (watch)"], "group": { "kind": "build" }, "detail": "Runs both the Jekyll server with live reload and build JS files in watch mode." } ] } ================================================ FILE: Gemfile ================================================ # frozen_string_literal: true source "https://rubygems.org" gemspec gem "html-proofer", "~> 5.0", group: :test platforms :windows, :jruby do gem "tzinfo", ">= 1", "< 3" gem "tzinfo-data" end gem "wdm", "~> 0.2.0", :platforms => [:windows] ================================================ FILE: LICENSE ================================================ The MIT License (MIT) Copyright (c) 2019 Cotes Chung Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ================================================ FILE: README.md ================================================
{% if title %} {{ title }} {% endif %}
================================================ FILE: _includes/embed/bilibili.html ================================================ ================================================ FILE: _includes/embed/spotify.html ================================================ {% assign size = 352 %} {% assign theme = '' %} {% if include.compact %} {% assign size = 152 %} {% endif %} {% if include.dark %} {% assign theme = '?theme=0' %} {% endif %} ================================================ FILE: _includes/embed/twitch.html ================================================ ================================================ FILE: _includes/embed/video.html ================================================ {% assign video_url = include.src %} {% assign title = include.title %} {% assign poster_url = include.poster %} {% assign types = include.types | default: '' | strip | split: '|' %} {% unless video_url contains '://' %} {%- capture video_url -%} {% include media-url.html src=video_url subpath=page.media_subpath %} {%- endcapture -%} {% endunless %} {% if poster_url %} {% unless poster_url contains '://' %} {%- capture poster_url -%} {% include media-url.html src=poster_url subpath=page.media_subpath %} {%- endcapture -%} {% endunless %} {% assign poster = 'poster="' | append: poster_url | append: '"' %} {% endif %} {% assign attributes = 'controls' %} {% if include.autoplay %} {% assign attributes = attributes | append: ' ' | append: 'autoplay' %} {% endif %} {% if include.loop %} {% assign attributes = attributes | append: ' ' | append: 'loop' %} {% endif %} {% if include.muted %} {% assign attributes = attributes | append: ' ' | append: 'muted' %} {% endif %}{% if title %} {{ title }} {% endif %}
================================================ FILE: _includes/embed/youtube.html ================================================ ================================================ FILE: _includes/favicons.html ================================================ {% capture favicon_path %}{{ '/assets/img/favicons' | relative_url }}{% endcapture %} {% if site.pwa.enabled %} {% endif %} ================================================ FILE: _includes/footer.html ================================================ ================================================ FILE: _includes/head.html ================================================ {%- capture seo_tags -%} {% seo title=false %} {%- endcapture -%} {% if page.image %} {% assign src = page.image.path | default: page.image %} {% unless src contains '://' %} {%- capture img_url -%} {% include media-url.html src=src subpath=page.media_subpath absolute=true %} {%- endcapture -%} {%- capture old_url -%}{{ src | absolute_url }}{%- endcapture -%} {%- capture new_url -%}{{ img_url }}{%- endcapture -%} {% assign seo_tags = seo_tags | replace: old_url, new_url %} {% endunless %} {% elsif site.social_preview_image %} {%- capture img_url -%} {% include media-url.html src=site.social_preview_image absolute=true %} {%- endcapture -%} {%- capture og_image -%} {%- endcapture -%} {%- capture twitter_image -%} {%- endcapture -%} {% assign old_meta_clip = '' %} {% assign new_meta_clip = og_image | append: twitter_image %} {% assign seo_tags = seo_tags | replace: old_meta_clip, new_meta_clip %} {% endif %} {{ seo_tags }} {%- if site.social.fediverse_handle %} {% endif %}' -%}
{%- assign content = content
| replace: '',
'' -%}
{%- endif -%}
{%- assign content = content
| markdownify
| strip_html
| newline_to_br
| replace: '
', ' '
| strip_newlines
| strip
-%}
{%- unless include.full_text -%}
{%- assign max_length = include.max_length | default: 200 -%}
{%- assign content = content | truncate: max_length -%}
{%- endunless -%}
{{- content -}}
{%- endif -%}
================================================
FILE: _includes/read-time.html
================================================
{% assign words = include.content | strip_html | number_of_words: 'auto' %}
{% assign wpm = 180 %}
{% assign min_time = 1 %}
{% assign read_time = words | divided_by: wpm %}
{% unless read_time > 0 %}
{% assign read_time = min_time %}
{% endunless %}
{% capture read_prompt %}
{{- site.data.locales[include.lang].post.read_time.prompt -}}
{% endcapture %}
{{- read_time -}}
{{ ' ' }}
{{- site.data.locales[include.lang].post.read_time.unit -}}
{%- if include.prompt -%}
{%- assign _prompt_words = read_prompt | number_of_words: 'auto' -%}
{%- unless _prompt_words > 1 -%}{{ ' ' }}{%- endunless -%}
{{ read_prompt }}
{%- endif -%}
================================================
FILE: _includes/refactor-content.html
================================================
{% assign _content = include.content %}
{% if _content contains '', '
'
| replace: '', ''
| replace: '
', ''
%}
{% endif %}
{% if _content contains '' %}
{% assign _content = _content
| replace: '
', ''
%}
{% endif %}
{% if _content contains '',
''
| replace: '',
''
%}
{% endif %}
{% assign IMG_TAG = '
' | first %}
{% assign _right = _img_snippet | remove: _left %}
{% unless _left contains 'src=' %}
{% continue %}
{% endunless %}
{% assign _left = _left | remove: ' /' | replace: ' w=', ' width=' | replace: ' h=', ' height=' %}
{% assign _attrs = _left | split: '" ' %}
{% assign _src = null %}
{% assign _lqip = null %}
{% assign _class = null %}
{% for _attr in _attrs %}
{% unless _attr contains '=' %}
{% continue %}
{% endunless %}
{% assign _pair = _attr | split: '="' %}
{% capture _key %}{{ _pair | first }}{% endcapture %}
{% capture _value %}{{ _pair | last | remove: '"' }}{% endcapture %}
{% case _key %}
{% when 'src' %}
{% assign _src = _value %}
{% when 'lqip' %}
{% assign _lqip = _value %}
{% when 'class' %}
{% assign _class = _value %}
{% endcase %}
{% endfor %}
{% assign _wrapper_class = '' %}
{% if _class %}
{% assign _remain = _class %}
{% assign _class_array = _class | split: ' ' %}
{% for c in _class_array %}
{% assign _pick = false %}
{% case c %}
{% when 'preview-img', 'normal', 'left', 'right', 'light', 'dark' %}
{% assign _pick = true %}
{% else %}
{% if c contains '-' %}
{% assign start = c | split: '-' | first %}
{% if start == 'w' %}
{% assign _pick = true %}
{% endif %}
{% endif %}
{% endcase %}
{% if _pick %}
{% assign _remain = _remain | remove: c | strip %}
{% assign _wrapper_class = _wrapper_class | append: ' ' | append: c %}
{% endif %}
{% endfor %}
{% unless _wrapper_class == '' %}
{% capture _old_class %}class="{{ _class }}"{% endcapture %}
{% assign _left = _left | remove: _old_class %}
{% unless _remain == '' %}
{% capture _new_class %}class="{{ _remain }}"{% endcapture %}
{% assign _left = _left | append: _new_class %}
{% endunless %}
{% endunless %}
{% endif %}
{% assign _final_src = null %}
{% assign _lazyload = true %}
{%- capture _img_url -%}
{% include media-url.html src=_src subpath=page.media_subpath %}
{%- endcapture -%}
{% assign _path_prefix = _img_url | remove: _src %}
{% unless _src contains '//' %}
{% assign _final_src = _path_prefix | append: _src %}
{% assign _src_alt = 'src="' | append: _path_prefix %}
{% assign _left = _left | replace: 'src="', _src_alt %}
{% endunless %}
{% if _lqip %}
{% assign _lazyload = false %}
{% assign _wrapper_class = _wrapper_class | append: ' blur' %}
{% unless _lqip contains 'data:' %}
{% assign _lqip_alt = 'lqip="' | append: _path_prefix %}
{% assign _left = _left | replace: 'lqip="', _lqip_alt %}
{% endunless %}
{% assign _left = _left | replace: 'src=', 'data-src=' | replace: ' lqip=', ' data-lqip="true" src=' %}
{% else %}
{% assign _wrapper_class = _wrapper_class | append: ' shimmer' %}
{% endif %}
{% if _lazyload %}
{% assign _left = _left | append: ' loading="lazy"' %}
{% endif %}
{% if page.layout == 'home' %}
{% assign _wrapper_start = '' %}
{% assign _img_content = _img_content | append: _wrapper_start %}
{% assign _right = _right | prepend: '>` is wrapped by `` -->
{% assign _parent = _right | slice: 1, 4 %}
{% if _parent == '' %}
{% assign _size = _img_content | size | minus: 1 %}
{% capture _class %}
class="img-link{% unless _lqip %} shimmer{% endunless %}"
{% endcapture %}
{% assign _img_content = _img_content | slice: 0, _size | append: _class | append: '>' %}
{% else %}
{% assign _wrapper_start = _final_src
| default: _src
| prepend: ''
%}
{% assign _img_content = _img_content | append: _wrapper_start %}
{% assign _right = '>
{% assign _img_content = _img_content | append: IMG_TAG | append: _left | append: _right %}
{% endfor %}
{% if _img_content %}
{% assign _content = _img_content %}
{% endif %}
{% endif %}
{% if _content contains '' %}
{% assign _code_spippets = _content | split: '' %}
{% assign _new_content = '' %}
{% for _snippet in _code_spippets %}
{% if forloop.last %}
{% assign _new_content = _new_content | append: _snippet %}
{% else %}
{% assign _left = _snippet | split: '><' | last %}
{% if _left contains 'file="' %}
{% assign _label_text = _left | split: 'file="' | last | split: '"' | first %}
{% assign _label_icon = 'far fa-file-code fa-fw' %}
{% else %}
{% assign _lang = _left | split: 'language-' | last | split: ' ' | first %}
{% capture _label_text %}{% include language-alias.html language=_lang %}{% endcapture %}
{% assign _label_icon = 'fas fa-code fa-fw small' %}
{% endif %}
{% capture _label %}
{% endcapture %}
{% assign _new_content = _new_content
| append: _snippet
| append: ''
| append: _label
| append: ''
| append: ''
%}
{% endif %}
{% endfor %}
{% assign _content = _new_content %}
{% endif %}
{% assign heading_levels = '2,3,4,5' | split: ',' %}
{% assign _heading_content = _content %}
{% for level in heading_levels %}
{% assign mark_start = ''
%}
{% assign left = snippet | split: mark_end | first %}
{% assign right = snippet | slice: left.size, snippet.size %}
{% assign left = left | replace_first: '">', '">' | append: '' %}
{% assign _new_content = _new_content | append: mark_start | append: left | append: anchor | append: right %}
{% endfor %}
{% assign _heading_content = _new_content %}
{% endif %}
{% endfor %}
{% assign _content = _heading_content %}
{{ _content }}
================================================
FILE: _includes/related-posts.html
================================================
{% assign TOTAL_SIZE = 3 %}
{% assign TAG_SCORE = 1 %}
{% assign CATEGORY_SCORE = 0.5 %}
{% assign SEPARATOR = ':' %}
{% assign match_posts = '' | split: '' %}
{% for category in page.categories %}
{% assign match_posts = match_posts | push: site.categories[category] | uniq %}
{% endfor %}
{% for tag in page.tags %}
{% assign match_posts = match_posts | push: site.tags[tag] | uniq %}
{% endfor %}
{% assign match_posts = match_posts | reverse %}
{% assign last_index = match_posts.size | minus: 1 %}
{% assign score_list = '' | split: '' %}
{% for i in (0..last_index) %}
{% assign post = match_posts[i] %}
{% if post.url == page.url %}
{% continue %}
{% endif %}
{% assign score = 0 %}
{% for tag in post.tags %}
{% if page.tags contains tag %}
{% assign score = score | plus: TAG_SCORE %}
{% endif %}
{% endfor %}
{% for category in post.categories %}
{% if page.categories contains category %}
{% assign score = score | plus: CATEGORY_SCORE %}
{% endif %}
{% endfor %}
{% if score > 0 %}
{% capture score_item %}{{ score }}{{ SEPARATOR }}{{ i }}{% endcapture %}
{% assign score_list = score_list | push: score_item %}
{% endif %}
{% endfor %}
{% assign index_list = '' | split: '' %}
{% if score_list.size > 0 %}
{% assign score_list = score_list | sort | reverse %}
{% for entry in score_list limit: TOTAL_SIZE %}
{% assign index = entry | split: SEPARATOR | last %}
{% assign index_list = index_list | push: index %}
{% endfor %}
{% endif %}
{% assign relate_posts = '' | split: '' %}
{% for index in index_list %}
{% assign i = index | to_integer %}
{% assign relate_posts = relate_posts | push: match_posts[i] %}
{% endfor %}
{% if relate_posts.size > 0 %}
{% endif %}
================================================
FILE: _includes/search-loader.html
================================================
{% capture result_elem %}
{title}
{content}
{% endcapture %}
{% capture not_found %}{{ site.data.locales[include.lang].search.no_results }}
{% endcapture %}
================================================
FILE: _includes/search-results.html
================================================
{% include_cached trending-tags.html lang=include.lang %}
================================================
FILE: _includes/sidebar.html
================================================
================================================
FILE: _includes/toc-status.html
================================================
{% comment %}
Determine TOC state and return it through variable "enable_toc"
{% endcomment %}
{% assign enable_toc = false %}
{% if site.toc and page.toc %}
{% if page.content contains '
{{- site.data.locales[include.lang].panel.toc -}}
{% endif %}
================================================
FILE: _includes/topbar.html
================================================
{% if page.layout == 'home' %}
{{- site.data.locales[include.lang].title | default: site.title -}}
{% elsif page.collection == 'tabs' or page.layout == 'page' %}
{%- capture tab_key -%}{{ page.url | split: '/' }}{%- endcapture -%}
{{- site.data.locales[include.lang].tabs[tab_key] | default: page.title -}}
{% else %}
{{- site.data.locales[include.lang].layout[page.layout] | default: page.layout | capitalize -}}
{% endif %}
================================================
FILE: _includes/trending-tags.html
================================================
{% assign MAX = 10 %}
{% assign size_list = '' | split: '' %}
{% assign tag_list = '' | split: '' %}
{% for tag in site.tags %}
{% assign size = tag | last | size %}
{% assign size_list = size_list | push: size %}
{% assign tag_str = tag | first | append: '::' | append: size %}
{% assign tag_list = tag_list | push: tag_str %}
{% endfor %}
{% assign size_list = size_list | sort | reverse %}
{% assign tag_list = tag_list | sort_natural %}
{% assign trending_tags = '' | split: '' %}
{% for size in size_list limit: MAX %}
{% for tag_str in tag_list %}
{% assign tag = tag_str | split: '::' %}
{% assign tag_name = tag | first %}
{% assign tag_size = tag | last | plus: 0 %}
{% if tag_size == size %}
{% unless trending_tags contains tag_name %}
{% assign trending_tags = trending_tags | push: tag_name %}
{% break %}
{% endunless %}
{% endif %}
{% endfor %}
{% endfor %}
{% if trending_tags.size > 0 %}
{{- site.data.locales[include.lang].panel.trending_tags -}}
{% for tag_name in trending_tags %}
{% assign url = tag_name | slugify | url_encode | prepend: '/tags/' | append: '/' %}
{{ tag_name }}
{% endfor %}
{% endif %}
================================================
FILE: _includes/update-list.html
================================================
{% assign MAX_SIZE = 5 %}
{% assign all_list = '' | split: '' %}
{% for post in site.posts %}
{% assign datetime = post.last_modified_at | default: post.date %}
{% capture elem %}
{{- datetime | date: "%Y%m%d%H%M%S" -}}::{{- forloop.index0 -}}
{% endcapture %}
{% assign all_list = all_list | push: elem %}
{% endfor %}
{% assign all_list = all_list | sort | reverse %}
{% assign update_list = '' | split: '' %}
{% for entry in all_list limit: MAX_SIZE %}
{% assign update_list = update_list | push: entry %}
{% endfor %}
{% if update_list.size > 0 %}
{{- site.data.locales[include.lang].panel.lastmod -}}
{% for item in update_list %}
{% assign index = item | split: '::' | last | plus: 0 %}
{% assign post = site.posts[index] %}
{% assign url = post.url | relative_url %}
-
{{ post.title }}
{% endfor %}
{% endif %}
================================================
FILE: _javascript/categories.js
================================================
import { basic, initSidebar, initTopbar } from './modules/layouts';
import { categoryCollapse } from './modules/components';
basic();
initSidebar();
initTopbar();
categoryCollapse();
================================================
FILE: _javascript/commons.js
================================================
import { basic, initSidebar, initTopbar } from './modules/layouts';
initSidebar();
initTopbar();
basic();
================================================
FILE: _javascript/home.js
================================================
import { basic, initSidebar, initTopbar } from './modules/layouts';
import { initLocaleDatetime, loadImg } from './modules/components';
loadImg();
initLocaleDatetime();
initSidebar();
initTopbar();
basic();
================================================
FILE: _javascript/misc.js
================================================
import { basic, initSidebar, initTopbar } from './modules/layouts';
import { initLocaleDatetime } from './modules/components';
initSidebar();
initTopbar();
initLocaleDatetime();
basic();
================================================
FILE: _javascript/modules/components/back-to-top.js
================================================
/**
* Reference: https://bootsnipp.com/snippets/featured/link-to-top-page
*/
export function back2top() {
const btn = document.getElementById('back-to-top');
window.addEventListener('scroll', () => {
if (window.scrollY > 50) {
btn.classList.add('show');
} else {
btn.classList.remove('show');
}
});
btn.addEventListener('click', () => {
window.scrollTo({ top: 0 });
});
}
================================================
FILE: _javascript/modules/components/category-collapse.js
================================================
/**
* Tab 'Categories' expand/close effect.
*/
import 'bootstrap/js/src/collapse.js';
const childPrefix = 'l_';
const parentPrefix = 'h_';
const children = document.getElementsByClassName('collapse');
export function categoryCollapse() {
[...children].forEach((elem) => {
const id = parentPrefix + elem.id.substring(childPrefix.length);
const parent = document.getElementById(id);
// collapse sub-categories
elem.addEventListener('hide.bs.collapse', () => {
if (parent) {
parent.querySelector('.far.fa-folder-open').className =
'far fa-folder fa-fw';
parent.querySelector('.fas.fa-angle-down').classList.add('rotate');
parent.classList.remove('hide-border-bottom');
}
});
// expand sub-categories
elem.addEventListener('show.bs.collapse', () => {
if (parent) {
parent.querySelector('.far.fa-folder').className =
'far fa-folder-open fa-fw';
parent.querySelector('.fas.fa-angle-down').classList.remove('rotate');
parent.classList.add('hide-border-bottom');
}
});
});
}
================================================
FILE: _javascript/modules/components/clipboard.js
================================================
/**
* Clipboard functions
*
* Dependencies:
* clipboard.js (https://github.com/zenorocha/clipboard.js)
*/
import Tooltip from 'bootstrap/js/src/tooltip';
const clipboardSelector = '.code-header>button';
const ICON_DEFAULT = 'far fa-clipboard';
const ICON_SUCCESS = 'fas fa-check';
const ATTR_TIMEOUT = 'timeout';
const ATTR_TITLE_SUCCEED = 'data-title-succeed';
const ATTR_TITLE_ORIGIN = 'data-bs-original-title';
const TIMEOUT = 2000; // in milliseconds
function isLocked(node) {
if (node.hasAttribute(ATTR_TIMEOUT)) {
let timeout = node.getAttribute(ATTR_TIMEOUT);
if (Number(timeout) > Date.now()) {
return true;
}
}
return false;
}
function lock(node) {
node.setAttribute(ATTR_TIMEOUT, Date.now() + TIMEOUT);
}
function unlock(node) {
node.removeAttribute(ATTR_TIMEOUT);
}
function showTooltip(btn) {
const succeedTitle = btn.getAttribute(ATTR_TITLE_SUCCEED);
btn.setAttribute(ATTR_TITLE_ORIGIN, succeedTitle);
Tooltip.getInstance(btn).show();
}
function hideTooltip(btn) {
Tooltip.getInstance(btn).hide();
btn.removeAttribute(ATTR_TITLE_ORIGIN);
}
function setSuccessIcon(btn) {
const icon = btn.children[0];
icon.setAttribute('class', ICON_SUCCESS);
}
function resumeIcon(btn) {
const icon = btn.children[0];
icon.setAttribute('class', ICON_DEFAULT);
}
function setCodeClipboard() {
const clipboardList = document.querySelectorAll(clipboardSelector);
if (clipboardList.length === 0) {
return;
}
// Initial the clipboard.js object
const clipboard = new ClipboardJS(clipboardSelector, {
target: (trigger) => {
const codeBlock = trigger.parentNode.nextElementSibling;
return codeBlock.querySelector('code .rouge-code');
}
});
[...clipboardList].map(
(elem) =>
new Tooltip(elem, {
placement: 'left'
})
);
clipboard.on('success', (e) => {
const trigger = e.trigger;
e.clearSelection();
if (isLocked(trigger)) {
return;
}
setSuccessIcon(trigger);
showTooltip(trigger);
lock(trigger);
setTimeout(() => {
hideTooltip(trigger);
resumeIcon(trigger);
unlock(trigger);
}, TIMEOUT);
});
}
function setLinkClipboard() {
const btnCopyLink = document.getElementById('copy-link');
if (btnCopyLink === null) {
return;
}
btnCopyLink.addEventListener('click', (e) => {
const target = e.target;
if (isLocked(target)) {
return;
}
// Copy URL to clipboard
navigator.clipboard.writeText(window.location.href).then(() => {
const defaultTitle = target.getAttribute(ATTR_TITLE_ORIGIN);
const succeedTitle = target.getAttribute(ATTR_TITLE_SUCCEED);
// Switch tooltip title
target.setAttribute(ATTR_TITLE_ORIGIN, succeedTitle);
Tooltip.getInstance(target).show();
lock(target);
setTimeout(() => {
target.setAttribute(ATTR_TITLE_ORIGIN, defaultTitle);
unlock(target);
}, TIMEOUT);
});
});
btnCopyLink.addEventListener('mouseleave', (e) => {
Tooltip.getInstance(e.target).hide();
});
}
export function initClipboard() {
setCodeClipboard();
setLinkClipboard();
}
================================================
FILE: _javascript/modules/components/img-loading.js
================================================
/**
* Setting up image lazy loading and LQIP switching
*/
const ATTR_DATA_SRC = 'data-src';
const ATTR_DATA_LQIP = 'data-lqip';
const cover = {
SHIMMER: 'shimmer',
BLUR: 'blur'
};
function removeCover(clzss) {
this.parentElement.classList.remove(clzss);
}
function handleImage() {
if (!this.complete) {
return;
}
if (this.hasAttribute(ATTR_DATA_LQIP)) {
removeCover.call(this, cover.BLUR);
} else {
removeCover.call(this, cover.SHIMMER);
}
}
/**
* Switches the LQIP with the real image URL.
*/
function switchLQIP() {
const src = this.getAttribute(ATTR_DATA_SRC);
this.setAttribute('src', encodeURI(src));
this.removeAttribute(ATTR_DATA_SRC);
}
export function loadImg() {
const images = document.querySelectorAll('article img');
if (images.length === 0) {
return;
}
images.forEach((img) => {
img.addEventListener('load', handleImage);
});
// Images loaded from the browser cache do not trigger the 'load' event
document.querySelectorAll('article img[loading="lazy"]').forEach((img) => {
if (img.complete) {
removeCover.call(img, cover.SHIMMER);
}
});
// LQIPs set by the data URI or WebP will not trigger the 'load' event,
// so manually convert the URI to the URL of a high-resolution image.
const lqips = document.querySelectorAll(
`article img[${ATTR_DATA_LQIP}="true"]`
);
if (lqips.length) {
lqips.forEach((lqip) => {
switchLQIP.call(lqip);
});
}
}
================================================
FILE: _javascript/modules/components/img-popup.js
================================================
/**
* Set up image popup
*
* Dependencies: https://github.com/biati-digital/glightbox
*/
const lightImages = '.popup:not(.dark)';
const darkImages = '.popup:not(.light)';
let selector = lightImages;
function swapImages(current, reverse) {
if (selector === lightImages) {
selector = darkImages;
} else {
selector = lightImages;
}
if (reverse === null) {
reverse = GLightbox({ selector: `${selector}` });
}
return [reverse, current];
}
export function imgPopup() {
if (document.querySelector('.popup') === null) {
return;
}
const hasDualImages = !(
document.querySelector('.popup.light') === null &&
document.querySelector('.popup.dark') === null
);
if (Theme.visualState === Theme.DARK) {
selector = darkImages;
}
let current = GLightbox({ selector: `${selector}` });
if (hasDualImages && Theme.switchable) {
let reverse = null;
window.addEventListener('message', (event) => {
if (event.source === window && event.data && event.data.id === Theme.ID) {
[current, reverse] = swapImages(current, reverse);
}
});
}
}
================================================
FILE: _javascript/modules/components/locale-datetime.js
================================================
/**
* Update month/day to locale datetime
*
* Requirement:
*/
/* A tool for locale datetime */
class LocaleHelper {
static get attrTimestamp() {
return 'data-ts';
}
static get attrDateFormat() {
return 'data-df';
}
static get locale() {
return document.documentElement.getAttribute('lang').substring(0, 2);
}
static getTimestamp(elem) {
return Number(elem.getAttribute(this.attrTimestamp)); // unix timestamp
}
static getDateFormat(elem) {
return elem.getAttribute(this.attrDateFormat);
}
}
export function initLocaleDatetime() {
dayjs.locale(LocaleHelper.locale);
dayjs.extend(window.dayjs_plugin_localizedFormat);
document
.querySelectorAll(`[${LocaleHelper.attrTimestamp}]`)
.forEach((elem) => {
const date = dayjs.unix(LocaleHelper.getTimestamp(elem));
const text = date.format(LocaleHelper.getDateFormat(elem));
elem.textContent = text;
elem.removeAttribute(LocaleHelper.attrTimestamp);
elem.removeAttribute(LocaleHelper.attrDateFormat);
// setup tooltips
if (
elem.hasAttribute('data-bs-toggle') &&
elem.getAttribute('data-bs-toggle') === 'tooltip'
) {
// see: https://day.js.org/docs/en/display/format#list-of-localized-formats
const tooltipText = date.format('llll');
elem.setAttribute('data-bs-title', tooltipText);
}
});
}
================================================
FILE: _javascript/modules/components/mermaid.js
================================================
/**
* Mermaid-js loader
*/
const MERMAID = 'mermaid';
const themeMapper = Theme.getThemeMapper('default', 'dark');
function refreshTheme(event) {
if (event.source === window && event.data && event.data.id === Theme.ID) {
// Re-render the SVG ›
const mermaidList = document.getElementsByClassName(MERMAID);
[...mermaidList].forEach((elem) => {
const svgCode = elem.previousSibling.children.item(0).textContent;
elem.textContent = svgCode;
elem.removeAttribute('data-processed');
});
const newTheme = themeMapper[Theme.visualState];
mermaid.initialize({ theme: newTheme });
mermaid.init(null, `.${MERMAID}`);
}
}
function setNode(elem) {
const svgCode = elem.textContent;
const backup = elem.parentElement;
backup.classList.add('d-none');
// Create mermaid node
const mermaid = document.createElement('pre');
mermaid.classList.add(MERMAID);
const text = document.createTextNode(svgCode);
mermaid.appendChild(text);
backup.after(mermaid);
}
export function loadMermaid() {
if (
typeof mermaid === 'undefined' ||
typeof mermaid.initialize !== 'function'
) {
return;
}
const initTheme = themeMapper[Theme.visualState];
let mermaidConf = {
theme: initTheme
};
const basicList = document.getElementsByClassName('language-mermaid');
[...basicList].forEach(setNode);
mermaid.initialize(mermaidConf);
if (Theme.switchable) {
window.addEventListener('message', refreshTheme);
}
}
================================================
FILE: _javascript/modules/components/mode-toggle.js
================================================
/**
* Add listener for theme mode toggle
*/
const $toggle = document.getElementById('mode-toggle');
export function modeWatcher() {
if (!$toggle) {
return;
}
$toggle.addEventListener('click', () => {
Theme.flip();
});
}
================================================
FILE: _javascript/modules/components/search-display.js
================================================
/**
* This script makes #search-result-wrapper switch to unload or shown automatically.
*/
const btnSbTrigger = document.getElementById('sidebar-trigger');
const btnSearchTrigger = document.getElementById('search-trigger');
const btnCancel = document.getElementById('search-cancel');
const content = document.querySelectorAll('#main-wrapper>.container>.row');
const topbarTitle = document.getElementById('topbar-title');
const search = document.getElementById('search');
const resultWrapper = document.getElementById('search-result-wrapper');
const results = document.getElementById('search-results');
const input = document.getElementById('search-input');
const hints = document.getElementById('search-hints');
// CSS class names
const LOADED = 'd-block';
const UNLOADED = 'd-none';
const FOCUS = 'input-focus';
const FLEX = 'd-flex';
/* Actions in mobile screens (Sidebar hidden) */
class MobileSearchBar {
static on() {
btnSbTrigger.classList.add(UNLOADED);
topbarTitle.classList.add(UNLOADED);
btnSearchTrigger.classList.add(UNLOADED);
search.classList.add(FLEX);
btnCancel.classList.add(LOADED);
}
static off() {
btnCancel.classList.remove(LOADED);
search.classList.remove(FLEX);
btnSbTrigger.classList.remove(UNLOADED);
topbarTitle.classList.remove(UNLOADED);
btnSearchTrigger.classList.remove(UNLOADED);
}
}
class ResultSwitch {
static resultVisible = false;
static on() {
if (!this.resultVisible) {
resultWrapper.classList.remove(UNLOADED);
content.forEach((el) => {
el.classList.add(UNLOADED);
});
this.resultVisible = true;
}
}
static off() {
if (this.resultVisible) {
results.innerHTML = '';
if (hints.classList.contains(UNLOADED)) {
hints.classList.remove(UNLOADED);
}
resultWrapper.classList.add(UNLOADED);
content.forEach((el) => {
el.classList.remove(UNLOADED);
});
input.textContent = '';
this.resultVisible = false;
}
}
}
function isMobileView() {
return btnCancel.classList.contains(LOADED);
}
export function displaySearch() {
btnSearchTrigger.addEventListener('click', () => {
MobileSearchBar.on();
ResultSwitch.on();
input.focus();
});
btnCancel.addEventListener('click', () => {
MobileSearchBar.off();
ResultSwitch.off();
});
input.addEventListener('focus', () => {
search.classList.add(FOCUS);
});
input.addEventListener('focusout', () => {
search.classList.remove(FOCUS);
});
input.addEventListener('input', () => {
if (input.value === '') {
if (isMobileView()) {
hints.classList.remove(UNLOADED);
} else {
ResultSwitch.off();
}
} else {
ResultSwitch.on();
if (isMobileView()) {
hints.classList.add(UNLOADED);
}
}
});
}
================================================
FILE: _javascript/modules/components/toc/toc-desktop.js
================================================
export class TocDesktop {
/* Tocbot options Ref: https://github.com/tscanlin/tocbot#usage */
static options = {
tocSelector: '#toc',
contentSelector: '.content',
ignoreSelector: '[data-toc-skip]',
headingSelector: 'h2, h3, h4',
orderedList: false,
scrollSmooth: false,
headingsOffset: 16 * 2 // 2rem
};
static refresh() {
tocbot.refresh(this.options);
}
static init() {
tocbot.init(this.options);
}
}
================================================
FILE: _javascript/modules/components/toc/toc-mobile.js
================================================
/**
* TOC button, topbar and popup for mobile devices
*/
const $tocBar = document.getElementById('toc-bar');
const $soloTrigger = document.getElementById('toc-solo-trigger');
const $triggers = document.getElementsByClassName('toc-trigger');
const $popup = document.getElementById('toc-popup');
const $btnClose = document.getElementById('toc-popup-close');
const SCROLL_LOCK = 'overflow-hidden';
const CLOSING = 'closing';
export class TocMobile {
static #invisible = true;
static #barHeight = 16 * 3; // 3rem
static options = {
tocSelector: '#toc-popup-content',
contentSelector: '.content',
ignoreSelector: '[data-toc-skip]',
headingSelector: 'h2, h3, h4',
orderedList: false,
scrollSmooth: false,
collapseDepth: 4,
headingsOffset: this.#barHeight
};
static initBar() {
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((entry) => {
$tocBar.classList.toggle('invisible', entry.isIntersecting);
});
},
{ rootMargin: `-${this.#barHeight}px 0px 0px 0px` }
);
observer.observe($soloTrigger);
this.#invisible = false;
}
static listenAnchors() {
const $anchors = document.getElementsByClassName('toc-link');
[...$anchors].forEach((anchor) => {
anchor.onclick = () => this.hidePopup();
});
}
static refresh() {
if (this.#invisible) {
this.initComponents();
}
tocbot.refresh(this.options);
this.listenAnchors();
}
static get popupOpened() {
return $popup.open;
}
static showPopup() {
this.lockScroll(true);
$popup.showModal();
const activeItem = $popup.querySelector('li.is-active-li');
activeItem.scrollIntoView({ block: 'center' });
}
static hidePopup() {
$popup.toggleAttribute(CLOSING);
$popup.addEventListener(
'animationend',
() => {
$popup.toggleAttribute(CLOSING);
$popup.close();
},
{ once: true }
);
this.lockScroll(false);
}
static lockScroll(enable) {
document.documentElement.classList.toggle(SCROLL_LOCK, enable);
document.body.classList.toggle(SCROLL_LOCK, enable);
}
static clickBackdrop(event) {
if ($popup.hasAttribute(CLOSING)) {
return;
}
const rect = event.target.getBoundingClientRect();
if (
event.clientX < rect.left ||
event.clientX > rect.right ||
event.clientY < rect.top ||
event.clientY > rect.bottom
) {
this.hidePopup();
}
}
static initComponents() {
this.initBar();
[...$triggers].forEach((trigger) => {
trigger.onclick = () => this.showPopup();
});
$popup.onclick = (e) => this.clickBackdrop(e);
$btnClose.onclick = () => this.hidePopup();
$popup.oncancel = (e) => {
e.preventDefault();
this.hidePopup();
};
}
static init() {
tocbot.init(this.options);
this.listenAnchors();
this.initComponents();
}
}
================================================
FILE: _javascript/modules/components/toc.js
================================================
import { TocMobile as mobile } from './toc/toc-mobile';
import { TocDesktop as desktop } from './toc/toc-desktop';
const desktopMode = matchMedia('(min-width: 1200px)');
function refresh(e) {
if (e.matches) {
if (mobile.popupOpened) {
mobile.hidePopup();
}
desktop.refresh();
} else {
mobile.refresh();
}
}
function init() {
if (document.querySelector('main>article[data-toc="true"]') === null) {
return;
}
// Avoid create multiple instances of Tocbot. Ref:
if (desktopMode.matches) {
desktop.init();
} else {
mobile.init();
}
const $tocWrapper = document.getElementById('toc-wrapper');
$tocWrapper.classList.remove('invisible');
desktopMode.onchange = refresh;
}
export { init as initToc };
================================================
FILE: _javascript/modules/components/tooltip-loader.js
================================================
import Tooltip from 'bootstrap/js/src/tooltip';
export function loadTooltip() {
const tooltipTriggerList = document.querySelectorAll(
'[data-bs-toggle="tooltip"]'
);
[...tooltipTriggerList].map(
(tooltipTriggerEl) => new Tooltip(tooltipTriggerEl)
);
}
================================================
FILE: _javascript/modules/components.js
================================================
export { categoryCollapse } from './components/category-collapse';
export { initClipboard } from './components/clipboard';
export { loadImg } from './components/img-loading';
export { imgPopup } from './components/img-popup';
export { initLocaleDatetime } from './components/locale-datetime';
export { initToc } from './components/toc';
export { loadMermaid } from './components/mermaid';
export { modeWatcher } from './components/mode-toggle';
export { back2top } from './components/back-to-top';
export { loadTooltip } from './components/tooltip-loader';
================================================
FILE: _javascript/modules/layouts/basic.js
================================================
import { back2top, loadTooltip, modeWatcher } from '../components';
export function basic() {
modeWatcher();
back2top();
loadTooltip();
}
================================================
FILE: _javascript/modules/layouts/sidebar.js
================================================
const ATTR_DISPLAY = 'sidebar-display';
const $sidebar = document.getElementById('sidebar');
const $trigger = document.getElementById('sidebar-trigger');
const $mask = document.getElementById('mask');
class SidebarUtil {
static #isExpanded = false;
static toggle() {
this.#isExpanded = !this.#isExpanded;
document.body.toggleAttribute(ATTR_DISPLAY, this.#isExpanded);
$sidebar.classList.toggle('z-2', this.#isExpanded);
$mask.classList.toggle('d-none', !this.#isExpanded);
}
}
export function initSidebar() {
$trigger.onclick = $mask.onclick = () => SidebarUtil.toggle();
}
================================================
FILE: _javascript/modules/layouts/topbar.js
================================================
import { displaySearch } from '../components/search-display';
export function initTopbar() {
displaySearch();
}
================================================
FILE: _javascript/modules/layouts.js
================================================
export { basic } from './layouts/basic';
export { initSidebar } from './layouts/sidebar';
export { initTopbar } from './layouts/topbar';
================================================
FILE: _javascript/page.js
================================================
import { basic, initSidebar, initTopbar } from './modules/layouts';
import {
loadImg,
imgPopup,
initClipboard,
loadMermaid
} from './modules/components';
loadImg();
imgPopup();
initSidebar();
initTopbar();
initClipboard();
loadMermaid();
basic();
================================================
FILE: _javascript/post.js
================================================
import { basic, initTopbar, initSidebar } from './modules/layouts';
import {
loadImg,
imgPopup,
initLocaleDatetime,
initClipboard,
initToc,
loadMermaid
} from './modules/components';
loadImg();
initToc();
imgPopup();
initSidebar();
initLocaleDatetime();
initClipboard();
initTopbar();
loadMermaid();
basic();
================================================
FILE: _javascript/pwa/app.js
================================================
import Toast from 'bootstrap/js/src/toast';
if ('serviceWorker' in navigator) {
// Get Jekyll config from URL parameters
const src = new URL(document.currentScript.src);
const register = src.searchParams.get('register');
const baseUrl = src.searchParams.get('baseurl');
if (register) {
const swUrl = `${baseUrl}/sw.min.js`;
const notification = document.getElementById('notification');
const btnRefresh = notification.querySelector('.toast-body>button');
const popupWindow = Toast.getOrCreateInstance(notification);
navigator.serviceWorker.register(swUrl).then((registration) => {
// Restore the update window that was last manually closed by the user
if (registration.waiting) {
popupWindow.show();
}
registration.addEventListener('updatefound', () => {
registration.installing.addEventListener('statechange', () => {
if (registration.waiting) {
if (navigator.serviceWorker.controller) {
popupWindow.show();
}
}
});
});
btnRefresh.addEventListener('click', () => {
if (registration.waiting) {
registration.waiting.postMessage('SKIP_WAITING');
}
popupWindow.hide();
});
});
let refreshing = false;
// Detect controller change and refresh all the opened tabs
navigator.serviceWorker.addEventListener('controllerchange', () => {
if (!refreshing) {
window.location.reload();
refreshing = true;
}
});
} else {
navigator.serviceWorker.getRegistrations().then(function (registrations) {
for (let registration of registrations) {
registration.unregister();
}
});
}
}
================================================
FILE: _javascript/pwa/sw.js
================================================
importScripts('./assets/js/data/swconf.js');
const purge = swconf.purge;
const interceptor = swconf.interceptor;
function verifyUrl(url) {
const requestUrl = new URL(url);
const requestPath = requestUrl.pathname;
if (!requestUrl.protocol.startsWith('http')) {
return false;
}
for (const prefix of interceptor.urlPrefixes) {
if (requestUrl.href.startsWith(prefix)) {
return false;
}
}
for (const path of interceptor.paths) {
if (requestPath.startsWith(path)) {
return false;
}
}
return true;
}
self.addEventListener('install', (event) => {
if (purge) {
return;
}
event.waitUntil(
caches.open(swconf.cacheName).then((cache) => {
return cache.addAll(swconf.resources);
})
);
});
self.addEventListener('activate', (event) => {
event.waitUntil(
caches.keys().then((keyList) => {
return Promise.all(
keyList.map((key) => {
if (purge) {
return caches.delete(key);
} else {
if (key !== swconf.cacheName) {
return caches.delete(key);
}
}
})
);
})
);
});
self.addEventListener('message', (event) => {
if (event.data === 'SKIP_WAITING') {
self.skipWaiting();
}
});
self.addEventListener('fetch', (event) => {
if (event.request.headers.has('range')) {
return;
}
event.respondWith(
caches.match(event.request).then((response) => {
if (response) {
return response;
}
return fetch(event.request).then((response) => {
const url = event.request.url;
if (purge || event.request.method !== 'GET' || !verifyUrl(url)) {
return response;
}
// See:
let responseToCache = response.clone();
caches.open(swconf.cacheName).then((cache) => {
cache.put(event.request, responseToCache);
});
return response;
});
})
);
});
================================================
FILE: _javascript/theme.js
================================================
/**
* Theme management class
*
* To reduce flickering during page load, this script should be loaded synchronously.
*/
class Theme {
static #modeKey = 'mode';
static #modeAttr = 'data-mode';
static #darkMedia = window.matchMedia('(prefers-color-scheme: dark)');
static switchable = !document.documentElement.hasAttribute(this.#modeAttr);
static get DARK() {
return 'dark';
}
static get LIGHT() {
return 'light';
}
/**
* @returns {string} Theme mode identifier
*/
static get ID() {
return 'theme-mode';
}
/**
* Gets the current visual state of the theme.
*
* @returns {string} The current visual state, either the mode if it exists,
* or the system dark mode state ('dark' or 'light').
*/
static get visualState() {
if (this.#hasMode) {
return this.#mode;
} else {
return this.#sysDark ? this.DARK : this.LIGHT;
}
}
static get #mode() {
return (
sessionStorage.getItem(this.#modeKey) ||
document.documentElement.getAttribute(this.#modeAttr)
);
}
static get #isDarkMode() {
return this.#mode === this.DARK;
}
static get #hasMode() {
return this.#mode !== null;
}
static get #sysDark() {
return this.#darkMedia.matches;
}
/**
* Maps theme modes to provided values
* @param {string} light Value for light mode
* @param {string} dark Value for dark mode
* @returns {Object} Mapped values
*/
static getThemeMapper(light, dark) {
return {
[this.LIGHT]: light,
[this.DARK]: dark
};
}
/**
* Initializes the theme based on system preferences or stored mode
*/
static init() {
if (!this.switchable) {
return;
}
this.#darkMedia.addEventListener('change', () => {
const lastMode = this.#mode;
this.#clearMode();
if (lastMode !== this.visualState) {
this.#notify();
}
});
if (!this.#hasMode) {
return;
}
if (this.#isDarkMode) {
this.#setDark();
} else {
this.#setLight();
}
}
/**
* Flips the current theme mode
*/
static flip() {
if (this.#hasMode) {
this.#clearMode();
} else {
this.#sysDark ? this.#setLight() : this.#setDark();
}
this.#notify();
}
static #setDark() {
document.documentElement.setAttribute(this.#modeAttr, this.DARK);
sessionStorage.setItem(this.#modeKey, this.DARK);
}
static #setLight() {
document.documentElement.setAttribute(this.#modeAttr, this.LIGHT);
sessionStorage.setItem(this.#modeKey, this.LIGHT);
}
static #clearMode() {
document.documentElement.removeAttribute(this.#modeAttr);
sessionStorage.removeItem(this.#modeKey);
}
/**
* Notifies other plugins that the theme mode has changed
*/
static #notify() {
window.postMessage({ id: this.ID }, '*');
}
}
Theme.init();
export default Theme;
================================================
FILE: _layouts/archives.html
================================================
---
layout: page
# The Archives of posts.
---
{% include lang.html %}
{% assign df_strftime_m = site.data.locales[lang].df.archives.strftime | default: '/ %m' %}
{% assign df_dayjs_m = site.data.locales[lang].df.archives.dayjs | default: '/ MM' %}
{% for post in site.posts %}
{% assign cur_year = post.date | date: '%Y' %}
{% if cur_year != last_year %}
{% unless forloop.first %}{% endunless %}
{{ '' }}
{% assign last_year = cur_year %}
{% endif %}
-
{% assign ts = post.date | date: '%s' %}
{{ post.date | date: '%d' }}
{{ post.date | date: df_strftime_m }}
{{ post.title }}
{% if forloop.last %}
{% endif %}
{% endfor %}
================================================
FILE: _layouts/categories.html
================================================
---
layout: page
# All the Categories of posts
---
{% include lang.html %}
{% assign HEAD_PREFIX = 'h_' %}
{% assign LIST_PREFIX = 'l_' %}
{% assign group_index = 0 %}
{% assign sort_categories = site.categories | sort %}
{% for category in sort_categories %}
{% assign category_name = category | first %}
{% assign posts_of_category = category | last %}
{% assign first_post = posts_of_category | first %}
{% if category_name == first_post.categories[0] %}
{% assign sub_categories = '' | split: '' %}
{% for post in posts_of_category %}
{% assign second_category = post.categories[1] %}
{% if second_category %}
{% unless sub_categories contains second_category %}
{% assign sub_categories = sub_categories | push: second_category %}
{% endunless %}
{% endif %}
{% endfor %}
{% assign sub_categories = sub_categories | sort %}
{% assign sub_categories_size = sub_categories | size %}
{% if sub_categories_size > 0 %}
{% for sub_category in sub_categories %}
-
{% capture _sub_ctg_url %}/categories/{{ sub_category | slugify | url_encode }}/{% endcapture %}
{{ sub_category }}
{% assign posts_size = site.categories[sub_category] | size %}
{{ posts_size }}
{% if posts_size > 1 %}
{{
site.data.locales[lang].categories.post_measure.plural
| default: site.data.locales[lang].categories.post_measure
}}
{% else %}
{{
site.data.locales[lang].categories.post_measure.singular
| default: site.data.locales[lang].categories.post_measure
}}
{% endif %}
{% endfor %}
{% endif %}
{% assign group_index = group_index | plus: 1 %}
{% endif %}
{% endfor %}
================================================
FILE: _layouts/category.html
================================================
---
layout: page
# The Category layout
---
{% include lang.html %}
{{ page.title }}
{{ page.posts | size }}
{% for post in page.posts %}
-
{{ post.title }}
{% include datetime.html date=post.date class='text-muted small text-nowrap' lang=lang %}
{% endfor %}
================================================
FILE: _layouts/compress.html
================================================
---
# Jekyll layout that compresses HTML
# v3.2.0
# http://jch.penibelst.de/
# © 2014–2015 Anatol Broder
# MIT License
---
{% capture _LINE_FEED %}
{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment or site.compress_html.ignore.envs == "all" or page.compress_html == false %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "" %}{% endif %}{% unless _pre_before contains "" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " ; ; ;" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} Step Bytes raw {{ content | size }}{% if _profile_endings %} endings {{ _profile_endings }}{% endif %}{% if _profile_startings %} startings {{ _profile_startings }}{% endif %}{% if _profile_comments %} comments {{ _profile_comments }}{% endif %}{% if _profile_collapse %} collapse {{ _profile_collapse }}{% endif %}{% if _profile_clippings %} clippings {{ _profile_clippings }}{% endif %}
{% endif %}{% endif %}
================================================
FILE: _layouts/default.html
================================================
---
layout: compress
---
{% include origin-type.html %}
{% include lang.html %}
{% if site.theme_mode %}
{% capture prefer_mode %}data-mode="{{ site.theme_mode }}"{% endcapture %}
{% endif %}
{% include head.html lang=lang %}
{% include sidebar.html lang=lang %}
{% include topbar.html lang=lang %}
{% if layout.layout == 'default' %}
{% include refactor-content.html content=content lang=lang %}
{% else %}
{{ content }}
{% endif %}
{% for _include in layout.tail_includes %}
{% assign _include_path = _include | append: '.html' %}
{% include {{ _include_path }} lang=lang %}
{% endfor %}
{% include_cached footer.html lang=lang %}
{% include_cached search-results.html lang=lang %}
{% if site.pwa.enabled %}
{% include_cached notification.html lang=lang %}
{% endif %}
{% for _include in layout.script_includes %}
{% assign _include_path = _include | append: '.html' %}
{% include {{ _include_path }} %}
{% endfor %}
{% include_cached search-loader.html lang=lang %}
================================================
FILE: _layouts/home.html
================================================
---
layout: default
---
{% include lang.html %}
{% assign all_pinned = site.posts | where: 'pin', 'true' %}
{% assign all_normal = site.posts | where_exp: 'item', 'item.pin != true and item.hidden != true' %}
{% assign posts = '' | split: '' %}
{% assign visible_start = paginator.page | minus: 1 | times: paginator.per_page %}
{% assign visible_end = visible_start | plus: paginator.per_page %}
{% if all_pinned.size > visible_start %}
{% if all_pinned.size > visible_end %}
{% assign pinned_size = paginator.per_page %}
{% else %}
{% assign pinned_size = all_pinned.size | minus: visible_start %}
{% endif %}
{% for i in (visible_start..all_pinned.size) limit: pinned_size %}
{% assign posts = posts | push: all_pinned[i] %}
{% endfor %}
{% else %}
{% assign pinned_size = 0 %}
{% endif %}
{% assign normal_size = paginator.posts | size | minus: pinned_size %}
{% if normal_size > 0 %}
{% if pinned_size > 0 %}
{% assign normal_start = 0 %}
{% else %}
{% assign normal_start = visible_start | minus: all_pinned.size %}
{% endif %}
{% assign normal_end = normal_start | plus: normal_size | minus: 1 %}
{% for i in (normal_start..normal_end) %}
{% assign posts = posts | push: all_normal[i] %}
{% endfor %}
{% endif %}
{% if paginator.total_pages > 1 %}
{% include post-paginator.html %}
{% endif %}
================================================
FILE: _layouts/page.html
================================================
---
layout: default
---
{% include lang.html %}
{% if page.layout == 'page' or page.collection == 'tabs' %}
{% assign tab_key = page.title | downcase %}
{% assign title = site.data.locales[lang].tabs[tab_key] | default: page.title %}
{{ title }}
{{ content }}
{% else %}
{{ content }}
{% endif %}
================================================
FILE: _layouts/post.html
================================================
---
layout: default
panel_includes:
- toc
tail_includes:
- related-posts
- post-nav
script_includes:
- comment
---
{% include lang.html %}
{% include toc-status.html %}
{{ page.title }}
{% if page.description %}
{{ page.description }}
{% endif %}
{% if enable_toc %}
{{ page.title }}
{% endif %}
{{ content }}
{% if page.categories.size > 0 %}
{% endif %}
{% if page.tags.size > 0 %}
{% endif %}
{% if site.data.locales[lang].copyright.license.template %}
{% capture _replacement %}
{{ site.data.locales[lang].copyright.license.name }}
{% endcapture %}
{{ site.data.locales[lang].copyright.license.template | replace: ':LICENSE_NAME', _replacement }}
{% endif %}
{% include post-sharing.html lang=lang %}
================================================
FILE: _layouts/tag.html
================================================
---
layout: page
# The layout for Tag page
---
{% include lang.html %}
{{ page.title }}
{{ page.posts | size }}
{% for post in page.posts %}
-
{{ post.title }}
{% include datetime.html date=post.date class='text-muted small text-nowrap' lang=lang %}
{% endfor %}
================================================
FILE: _layouts/tags.html
================================================
---
layout: page
# All the Tags of posts.
---
================================================
FILE: _plugins/posts-lastmod-hook.rb
================================================
#!/usr/bin/env ruby
#
# Check for changed posts
Jekyll::Hooks.register :posts, :post_init do |post|
commit_num = `git rev-list --count HEAD "#{ post.path }"`
if commit_num.to_i > 1
lastmod_date = `git log -1 --pretty="%ad" --date=iso "#{ post.path }"`
post.data['last_modified_at'] = lastmod_date
end
end
================================================
FILE: _posts/2019-08-08-text-and-typography.md
================================================
---
title: Text and Typography
description: Examples of text, typography, math equations, diagrams, flowcharts, pictures, videos, and more.
author: cotes
date: 2019-08-08 11:33:00 +0800
categories: [Blogging, Demo]
tags: [typography]
pin: true
math: true
mermaid: true
image:
path: /commons/devices-mockup.png
lqip: data:image/webp;base64,UklGRpoAAABXRUJQVlA4WAoAAAAQAAAADwAABwAAQUxQSDIAAAARL0AmbZurmr57yyIiqE8oiG0bejIYEQTgqiDA9vqnsUSI6H+oAERp2HZ65qP/VIAWAFZQOCBCAAAA8AEAnQEqEAAIAAVAfCWkAALp8sF8rgRgAP7o9FDvMCkMde9PK7euH5M1m6VWoDXf2FkP3BqV0ZYbO6NA/VFIAAAA
alt: Responsive rendering of Chirpy theme on multiple devices.
---
## Headings
# H1 — heading
{: .mt-4 .mb-0 }
## H2 — heading
{: data-toc-skip='' .mt-4 .mb-0 }
### H3 — heading
{: data-toc-skip='' .mt-4 .mb-0 }
#### H4 — heading
{: data-toc-skip='' .mt-4 }
## Paragraph
Quisque egestas convallis ipsum, ut sollicitudin risus tincidunt a. Maecenas interdum malesuada egestas. Duis consectetur porta risus, sit amet vulputate urna facilisis ac. Phasellus semper dui non purus ultrices sodales. Aliquam ante lorem, ornare a feugiat ac, finibus nec mauris. Vivamus ut tristique nisi. Sed vel leo vulputate, efficitur risus non, posuere mi. Nullam tincidunt bibendum rutrum. Proin commodo ornare sapien. Vivamus interdum diam sed sapien blandit, sit amet aliquam risus mattis. Nullam arcu turpis, mollis quis laoreet at, placerat id nibh. Suspendisse venenatis eros eros.
## Lists
### Ordered list
1. Firstly
2. Secondly
3. Thirdly
### Unordered list
- Chapter
- Section
- Paragraph
### ToDo list
- [ ] Job
- [x] Step 1
- [x] Step 2
- [ ] Step 3
### Description list
Sun
: the star around which the earth orbits
Moon
: the natural satellite of the earth, visible by reflected light from the sun
## Block Quote
> This line shows the _block quote_.
## Prompts
> An example showing the `tip` type prompt.
{: .prompt-tip }
> An example showing the `info` type prompt.
{: .prompt-info }
> An example showing the `warning` type prompt.
{: .prompt-warning }
> An example showing the `danger` type prompt.
{: .prompt-danger }
## Tables
| Company | Contact | Country |
| :--------------------------- | :--------------- | ------: |
| Alfreds Futterkiste | Maria Anders | Germany |
| Island Trading | Helen Bennett | UK |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
## Links
## Footnote
Clicking the hook will locate the footnote[^footnote], and here is another footnote[^fn-nth-2].
## Inline code
This is an example of `Inline Code`.
## Filepath
Here is the `/path/to/the/file.extend`{: .filepath}.
## Code blocks
### Common
```
This is a common code snippet, without syntax highlight and line number.
```
### Specific Language
```bash
if [ $? -ne 0 ]; then
echo "The command was not successful.";
#do the needful / exit
fi;
```
### Specific filename
```sass
@import
"colors/light-typography",
"colors/dark-typography";
```
{: file='_sass/jekyll-theme-chirpy.scss'}
## Mathematics
The mathematics powered by [**MathJax**](https://www.mathjax.org/):
$$
\begin{equation}
\sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6}
\label{eq:series}
\end{equation}
$$
We can reference the equation as \eqref{eq:series}.
When $a \ne 0$, there are two solutions to $ax^2 + bx + c = 0$ and they are
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
## Mermaid SVG
```mermaid
gantt
title Adding GANTT diagram functionality to mermaid
apple :a, 2017-07-20, 1w
banana :crit, b, 2017-07-23, 1d
cherry :active, c, after b a, 1d
```
## Images
### Default (with caption)
{: width="972" height="589" }
_Full screen width and center alignment_
### Left aligned
{: width="972" height="589" .w-75 .normal}
### Float to left
{: width="972" height="589" .w-50 .left}
Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
### Float to right
{: width="972" height="589" .w-50 .right}
Praesent maximus aliquam sapien. Sed vel neque in dolor pulvinar auctor. Maecenas pharetra, sem sit amet interdum posuere, tellus lacus eleifend magna, ac lobortis felis ipsum id sapien. Proin ornare rutrum metus, ac convallis diam volutpat sit amet. Phasellus volutpat, elit sit amet tincidunt mollis, felis mi scelerisque mauris, ut facilisis leo magna accumsan sapien. In rutrum vehicula nisl eget tempor. Nullam maximus ullamcorper libero non maximus. Integer ultricies velit id convallis varius. Praesent eu nisl eu urna finibus ultrices id nec ex. Mauris ac mattis quam. Fusce aliquam est nec sapien bibendum, vitae malesuada ligula condimentum.
### Dark/Light mode & Shadow
The image below will toggle dark/light mode based on theme preference, notice it has shadows.
{: .light .w-75 .shadow .rounded-10 w='1212' h='668' }
{: .dark .w-75 .shadow .rounded-10 w='1212' h='668' }
## Video
{% include embed/youtube.html id='Balreaj8Yqs' %}
## Reverse Footnote
[^footnote]: The footnote source
[^fn-nth-2]: The 2nd footnote source
================================================
FILE: _posts/2019-08-08-write-a-new-post.md
================================================
---
title: Writing a New Post
author: cotes
date: 2019-08-08 14:10:00 +0800
categories: [Blogging, Tutorial]
tags: [writing]
render_with_liquid: false
---
This tutorial will guide you on how to write a post in the _Chirpy_ template, and it's worth reading even if you've used Jekyll before, as many features require specific variables to be set.
## Naming and Path
Create a new file named `YYYY-MM-DD-TITLE.EXTENSION`{: .filepath} and put it in the `_posts`{: .filepath} of the root directory. Please note that the `EXTENSION`{: .filepath} must be one of `md`{: .filepath} and `markdown`{: .filepath}. If you want to save time of creating files, please consider using the plugin [`Jekyll-Compose`](https://github.com/jekyll/jekyll-compose) to accomplish this.
## Front Matter
Basically, you need to fill the [Front Matter](https://jekyllrb.com/docs/front-matter/) as below at the top of the post:
```yaml
---
title: TITLE
date: YYYY-MM-DD HH:MM:SS +/-TTTT
categories: [TOP_CATEGORY, SUB_CATEGORY]
tags: [TAG] # TAG names should always be lowercase
---
```
> The posts' _layout_ has been set to `post` by default, so there is no need to add the variable _layout_ in the Front Matter block.
{: .prompt-tip }
### Timezone of Date
To accurately record the release date of a post, you should not only set up the `timezone` of `_config.yml`{: .filepath} but also provide the post's timezone in variable `date` of its Front Matter block. Format: `+/-TTTT`, e.g. `+0800`.
### Categories and Tags
The `categories` of each post are designed to contain up to two elements, and the number of elements in `tags` can be zero to infinity. For instance:
```yaml
---
categories: [Animal, Insect]
tags: [bee]
---
```
### Author Information
The author information of the post usually does not need to be filled in the _Front Matter_ , they will be obtained from variables `social.name` and the first entry of `social.links` of the configuration file by default. But you can also override it as follows:
Adding author information in `_data/authors.yml` (If your website doesn't have this file, don't hesitate to create one).
```yaml
:
name:
twitter:
url:
```
{: file="_data/authors.yml" }
And then use `author` to specify a single entry or `authors` to specify multiple entries:
```yaml
---
author: # for single entry
# or
authors: [, ] # for multiple entries
---
```
Having said that, the key `author` can also identify multiple entries.
> The benefit of reading the author information from the file `_data/authors.yml`{: .filepath } is that the page will have the meta tag `twitter:creator`, which enriches the [Twitter Cards](https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started#card-and-content-attribution) and is good for SEO.
{: .prompt-info }
### Post Description
By default, the first words of the post are used to display on the home page for a list of posts, in the _Further Reading_ section, and in the XML of the RSS feed. If you don't want to display the auto-generated description for the post, you can customize it using the `description` field in the _Front Matter_ as follows:
```yaml
---
description: Short summary of the post.
---
```
Additionally, the `description` text will also be displayed under the post title on the post's page.
## Table of Contents
By default, the **T**able **o**f **C**ontents (TOC) is displayed on the right panel of the post. If you want to turn it off globally, go to `_config.yml`{: .filepath} and set the value of variable `toc` to `false`. If you want to turn off TOC for a specific post, add the following to the post's [Front Matter](https://jekyllrb.com/docs/front-matter/):
```yaml
---
toc: false
---
```
## Comments
The global setting for comments is defined by the `comments.provider` option in the `_config.yml`{: .filepath} file. Once a comment system is selected for this variable, comments will be enabled for all posts.
If you want to close the comment for a specific post, add the following to the **Front Matter** of the post:
```yaml
---
comments: false
---
```
## Media
We refer to images, audio and video as media resources in _Chirpy_.
### URL Prefix
From time to time we have to define duplicate URL prefixes for multiple resources in a post, which is a boring task that you can avoid by setting two parameters.
- If you are using a CDN to host media files, you can specify the `cdn` in `_config.yml`{: .filepath }. The URLs of media resources for site avatar and posts are then prefixed with the CDN domain name.
```yaml
cdn: https://cdn.com
```
{: file='_config.yml' .nolineno }
- To specify the resource path prefix for the current post/page range, set `media_subpath` in the _front matter_ of the post:
```yaml
---
media_subpath: /path/to/media/
---
```
{: .nolineno }
The option `site.cdn` and `page.media_subpath` can be used individually or in combination to flexibly compose the final resource URL: `[site.cdn/][page.media_subpath/]file.ext`
### Images
#### Caption
Add italics to the next line of an image, then it will become the caption and appear at the bottom of the image:
```markdown

_Image Caption_
```
{: .nolineno}
#### Size
To prevent the page content layout from shifting when the image is loaded, we should set the width and height for each image.
```markdown
{: width="700" height="400" }
```
{: .nolineno}
> For an SVG, you have to at least specify its _width_, otherwise it won't be rendered.
{: .prompt-info }
Starting from _Chirpy v5.0.0_, `height` and `width` support abbreviations (`height` → `h`, `width` → `w`). The following example has the same effect as the above:
```markdown
{: w="700" h="400" }
```
{: .nolineno}
#### Position
By default, the image is centered, but you can specify the position by using one of the classes `normal`, `left`, and `right`.
> Once the position is specified, the image caption should not be added.
{: .prompt-warning }
- **Normal position**
The image will be left aligned in the below sample:
```markdown
{: .normal }
```
{: .nolineno}
- **Float to the left**
```markdown
{: .left }
```
{: .nolineno}
- **Float to the right**
```markdown
{: .right }
```
{: .nolineno}
#### Dark/Light mode
You can make images follow theme preferences in dark/light mode. This requires you to prepare two images, one for dark mode and one for light mode, and then assign them a specific class (`dark` or `light`):
```markdown
{: .light }
{: .dark }
```
#### Shadow
The screenshots of the program window can be considered to show the shadow effect:
```markdown
{: .shadow }
```
{: .nolineno}
#### Preview Image
If you want to add an image at the top of the post, please provide an image with a resolution of `1200 x 630`. Please note that if the image aspect ratio does not meet `1.91 : 1`, the image will be scaled and cropped.
Knowing these prerequisites, you can start setting the image's attribute:
```yaml
---
image:
path: /path/to/image
alt: image alternative text
---
```
Note that the [`media_subpath`](#url-prefix) can also be passed to the preview image, that is, when it has been set, the attribute `path` only needs the image file name.
For simple use, you can also just use `image` to define the path.
```yml
---
image: /path/to/image
---
```
#### LQIP
For preview images:
```yaml
---
image:
lqip: /path/to/lqip-file # or base64 URI
---
```
> You can observe LQIP in the preview image of post \"[Text and Typography](../text-and-typography/)\".
For normal images:
```markdown
{: lqip="/path/to/lqip-file" }
```
{: .nolineno }
### Social Media Platforms
You can embed video/audio from social media platforms with the following syntax:
```liquid
{% include embed/{Platform}.html id='{ID}' %}
```
Where `Platform` is the lowercase of the platform name, and `ID` is the video ID.
The following table shows how to get the two parameters we need in a given video/audio URL, and you can also know the currently supported video platforms.
| Video URL | Platform | ID |
| -------------------------------------------------------------------------------------------------------------------------- | ---------- | :----------------------- |
| [https://www.**youtube**.com/watch?v=**H-B46URT4mg**](https://www.youtube.com/watch?v=H-B46URT4mg) | `youtube` | `H-B46URT4mg` |
| [https://www.**twitch**.tv/videos/**1634779211**](https://www.twitch.tv/videos/1634779211) | `twitch` | `1634779211` |
| [https://www.**bilibili**.com/video/**BV1Q44y1B7Wf**](https://www.bilibili.com/video/BV1Q44y1B7Wf) | `bilibili` | `BV1Q44y1B7Wf` |
| [https://www.open.**spotify**.com/track/**3OuMIIFP5TxM8tLXMWYPGV**](https://open.spotify.com/track/3OuMIIFP5TxM8tLXMWYPGV) | `spotify` | `3OuMIIFP5TxM8tLXMWYPGV` |
Spotify supports some additional parameters:
- `compact` - to display a compact player instead (ex. `{% include embed/spotify.html id='3OuMIIFP5TxM8tLXMWYPGV' compact=1 %}`);
- `dark` - to force dark theme (ex. `{% include embed/spotify.html id='3OuMIIFP5TxM8tLXMWYPGV' dark=1 %}`).
### Video Files
If you want to embed a video file directly, use the following syntax:
```liquid
{% include embed/video.html src='{URL}' %}
```
Where `URL` is a URL to a video file e.g. `/path/to/sample/video.mp4`.
You can also specify additional attributes for the embedded video file. Here is a full list of attributes allowed.
- `poster='/path/to/poster.png'` — poster image for a video that is shown while video is downloading
- `title='Text'` — title for a video that appears below the video and looks the same as for images
- `autoplay=true` — video automatically begins to play back as soon as it can
- `loop=true` — automatically seek back to the start upon reaching the end of the video
- `muted=true` — audio will be initially silenced
- `types` — specify the extensions of additional video formats separated by `|`. Ensure these files exist in the same directory as your primary video file.
Consider an example using all of the above:
```liquid
{%
include embed/video.html
src='/path/to/video.mp4'
types='ogg|mov'
poster='poster.png'
title='Demo video'
autoplay=true
loop=true
muted=true
%}
```
### Audio Files
If you want to embed an audio file directly, use the following syntax:
```liquid
{% include embed/audio.html src='{URL}' %}
```
Where `URL` is a URL to an audio file e.g. `/path/to/audio.mp3`.
You can also specify additional attributes for the embedded audio file. Here is a full list of attributes allowed.
- `title='Text'` — title for an audio that appears below the audio and looks the same as for images
- `types` — specify the extensions of additional audio formats separated by `|`. Ensure these files exist in the same directory as your primary audio file.
Consider an example using all of the above:
```liquid
{%
include embed/audio.html
src='/path/to/audio.mp3'
types='ogg|wav|aac'
title='Demo audio'
%}
```
## Pinned Posts
You can pin one or more posts to the top of the home page, and the fixed posts are sorted in reverse order according to their release date. Enable by:
```yaml
---
pin: true
---
```
## Prompts
There are several types of prompts: `tip`, `info`, `warning`, and `danger`. They can be generated by adding the class `prompt-{type}` to the blockquote. For example, define a prompt of type `info` as follows:
```md
> Example line for prompt.
{: .prompt-info }
```
{: .nolineno }
## Syntax
### Inline Code
```md
`inline code part`
```
{: .nolineno }
### Filepath Highlight
```md
`/path/to/a/file.extend`{: .filepath}
```
{: .nolineno }
### Code Block
Markdown symbols ```` ``` ```` can easily create a code block as follows:
````md
```
This is a plaintext code snippet.
```
````
#### Specifying Language
Using ```` ```{language} ```` you will get a code block with syntax highlight:
````markdown
```yaml
key: value
```
````
> The Jekyll tag `{% highlight %}` is not compatible with this theme.
{: .prompt-danger }
#### Line Number
By default, all languages except `plaintext`, `console`, and `terminal` will display line numbers. When you want to hide the line number of a code block, add the class `nolineno` to it:
````markdown
```shell
echo 'No more line numbers!'
```
{: .nolineno }
````
#### Specifying the Filename
You may have noticed that the code language will be displayed at the top of the code block. If you want to replace it with the file name, you can add the attribute `file` to achieve this:
````markdown
```shell
# content
```
{: file="path/to/file" }
````
#### Liquid Codes
If you want to display the **Liquid** snippet, surround the liquid code with `{% raw %}` and `{% endraw %}`:
````markdown
{% raw %}
```liquid
{% if product.title contains 'Pack' %}
This product's title contains the word Pack.
{% endif %}
```
{% endraw %}
````
Or adding `render_with_liquid: false` (Requires Jekyll 4.0 or higher) to the post's YAML block.
## Mathematics
We use [**MathJax**][mathjax] to generate mathematics. For website performance reasons, the mathematical feature won't be loaded by default. But it can be enabled by:
[mathjax]: https://www.mathjax.org/
```yaml
---
math: true
---
```
After enabling the mathematical feature, you can add math equations with the following syntax:
- **Block math** should be added with `$$ math $$` with **mandatory** blank lines before and after `$$`
- **Inserting equation numbering** should be added with `$$\begin{equation} math \end{equation}$$`
- **Referencing equation numbering** should be done with `\label{eq:label_name}` in the equation block and `\eqref{eq:label_name}` inline with text (see example below)
- **Inline math** (in lines) should be added with `$$ math $$` without any blank line before or after `$$`
- **Inline math** (in lists) should be added with `\$$ math $$`
```markdown
$$
LaTeX_math_expression
$$
$$
\begin{equation}
LaTeX_math_expression
\label{eq:label_name}
\end{equation}
$$
Can be referenced as \eqref{eq:label_name}.
"Lorem ipsum dolor sit amet, $$ LaTeX_math_expression $$ consectetur adipiscing elit."
1. \$$ LaTeX_math_expression $$
2. \$$ LaTeX_math_expression $$
3. \$$ LaTeX_math_expression $$
```
> Starting with `v7.0.0`, configuration options for **MathJax** have been moved to file `assets/js/data/mathjax.js`{: .filepath }, and you can change the options as needed, such as adding [extensions][mathjax-exts].
> If you are building the site via `chirpy-starter`, copy that file from the gem installation directory (check with command `bundle info --path jekyll-theme-chirpy`) to the same directory in your repository.
{: .prompt-tip }
[mathjax-exts]: https://docs.mathjax.org/en/latest/input/tex/extensions/index.html
## Mermaid
[**Mermaid**](https://github.com/mermaid-js/mermaid) is a great diagram generation tool. To enable it on your post, add the following to the YAML block:
```yaml
---
mermaid: true
---
```
Then you can use it like other markdown languages: surround the graph code with ```` ```mermaid ```` and ```` ``` ````.
## Learn More
For more knowledge about Jekyll posts, visit the [Jekyll Docs: Posts](https://jekyllrb.com/docs/posts/).
================================================
FILE: _posts/2019-08-09-getting-started.md
================================================
---
title: Getting Started
description: >-
Get started with Chirpy basics in this comprehensive overview.
You will learn how to install, configure, and use your first Chirpy-based website, as well as deploy it to a web server.
author: cotes
date: 2019-08-09 20:55:00 +0800
categories: [Blogging, Tutorial]
tags: [getting started]
pin: true
media_subpath: '/posts/20180809'
---
## Creating a Site Repository
When creating your site repository, you have two options depending on your needs:
### Option 1. Using the Starter (Recommended)
This approach simplifies upgrades, isolates unnecessary files, and is perfect for users who want to focus on writing with minimal configuration.
1. Sign in to GitHub and navigate to the [**starter**][starter].
2. Click the Use this template button and then select Create a new repository.
3. Name the new repository `.github.io`, replacing `username` with your lowercase GitHub username.
### Option 2. Forking the Theme
This approach is convenient for modifying features or UI design, but presents challenges during upgrades. So don't try this unless you are familiar with Jekyll and plan to heavily modify this theme.
1. Sign in to GitHub.
2. [Fork the theme repository](https://github.com/cotes2020/jekyll-theme-chirpy/fork).
3. Name the new repository `.github.io`, replacing `username` with your lowercase GitHub username.
## Setting up the Environment
Once your repository is created, it's time to set up your development environment. There are two primary methods:
### Using Dev Containers (Recommended for Windows)
Dev Containers offer an isolated environment using Docker, which prevents conflicts with your system and ensures all dependencies are managed within the container.
**Steps**:
1. Install Docker:
- On Windows/macOS, install [Docker Desktop][docker-desktop].
- On Linux, install [Docker Engine][docker-engine].
2. Install [VS Code][vscode] and the [Dev Containers extension][dev-containers].
3. Clone your repository:
- For Docker Desktop: Start VS Code and [clone your repo in a container volume][dc-clone-in-vol].
- For Docker Engine: Clone your repo locally, then [open it in a container][dc-open-in-container] via VS Code.
4. Wait for the Dev Containers setup to complete.
### Setting up Natively (Recommended for Unix-like OS)
For Unix-like systems, you can set up the environment natively for optimal performance, though you can also use Dev Containers as an alternative.
**Steps**:
1. Follow the [Jekyll installation guide](https://jekyllrb.com/docs/installation/) to install Jekyll and ensure [Git](https://git-scm.com/) is installed.
2. Clone your repository to your local machine.
3. If you forked the theme, install [Node.js][nodejs] and run `bash tools/init.sh` in the root directory to initialize the repository.
4. Run command `bundle install` in the root of your repository to install the dependencies.
## Usage
### Start the Jekyll Server
To run the site locally, use the following command:
```terminal
$ bundle exec jekyll serve
```
> If you are using Dev Containers, you must run that command in the **VS Code** Terminal.
{: .prompt-info }
After a few seconds, the local server will be available at .
### Configuration
Update the variables in `_config.yml`{: .filepath} as needed. Some typical options include:
- `url`
- `avatar`
- `timezone`
- `lang`
### Social Contact Options
Social contact options are displayed at the bottom of the sidebar. You can enable or disable specific contacts in the `_data/contact.yml`{: .filepath} file.
### Customizing the Stylesheet
To customize the stylesheet, copy the theme's `assets/css/jekyll-theme-chirpy.scss`{: .filepath} file to the same path in your Jekyll site, and add your custom styles at the end of the file.
### Customizing Static Assets
Static assets configuration was introduced in version `5.1.0`. The CDN of the static assets is defined in `_data/origin/cors.yml`{: .filepath }. You can replace some of them based on the network conditions in the region where your website is published.
If you prefer to self-host the static assets, refer to the [_chirpy-static-assets_](https://github.com/cotes2020/chirpy-static-assets#readme) repository.
## Deployment
Before deploying, check the `_config.yml`{: .filepath} file and ensure the `url` is configured correctly. If you prefer a [**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 if you want to visit your website with a base URL on a web server other than **GitHub Pages**, remember to set the `baseurl` to your project name, starting with a slash, e.g., `/project-name`.
Now you can choose _ONE_ of the following methods to deploy your Jekyll site.
### Deploy Using GitHub Actions
Prepare the following:
- If you're on the GitHub Free plan, keep your site repository public.
- If you have committed `Gemfile.lock`{: .filepath} to the repository, and your local machine is not running Linux, update the platform list of the lock file:
```console
$ bundle lock --add-platform x86_64-linux
```
Next, configure the _Pages_ service:
1. Go to your repository on GitHub. Select the _Settings_ tab, then click _Pages_ in the left navigation bar. In the **Source** section (under _Build and deployment_), select [**GitHub Actions**][pages-workflow-src] from the dropdown menu.
{: .light .border .normal w='375' h='140' }
{: .dark .normal w='375' h='140' }
2. Push any commits to GitHub to trigger the _Actions_ workflow. In the _Actions_ tab of your repository, you should see the workflow _Build and Deploy_ running. Once the build is complete and successful, the site will be deployed automatically.
You can now visit the URL provided by GitHub to access your site.
### Manual Build and Deployment
For self-hosted servers, you will need to build the site on your local machine and then upload the site files to the server.
Navigate to the root of the source project, and build your site with the following command:
```console
$ JEKYLL_ENV=production bundle exec jekyll b
```
Unless you specified the output path, the generated site files will be placed in the `_site`{: .filepath} folder of the project's root directory. Upload these files to your target server.
[nodejs]: https://nodejs.org/
[starter]: https://github.com/cotes2020/chirpy-starter
[pages-workflow-src]: https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow
[docker-desktop]: https://www.docker.com/products/docker-desktop/
[docker-engine]: https://docs.docker.com/engine/install/
[vscode]: https://code.visualstudio.com/
[dev-containers]: https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers
[dc-clone-in-vol]: https://code.visualstudio.com/docs/devcontainers/containers#_quick-start-open-a-git-repository-or-github-pr-in-an-isolated-container-volume
[dc-open-in-container]: https://code.visualstudio.com/docs/devcontainers/containers#_quick-start-open-an-existing-folder-in-a-container
================================================
FILE: _posts/2019-08-11-customize-the-favicon.md
================================================
---
title: Customize the Favicon
author: cotes
date: 2019-08-11 00:34:00 +0800
categories: [Blogging, Tutorial]
tags: [favicon]
---
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/`{: .filepath}. You may want to replace them with your own. The following sections will guide you to create and replace the default favicons.
## Generate the favicon
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 the button Pick your favicon image to upload your image file.
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 Next → to generate the favicon.
## Download & Replace
Download the generated package, unzip and delete the following file(s) from the extracted files:
- `site.webmanifest`{: .filepath}
And then copy the remaining image files (`.PNG`{: .filepath}, `.ICO`{: .filepath} and `.SVG`{: .filepath}) to cover the original files in the directory `assets/img/favicons/`{: .filepath} of your Jekyll site. If your Jekyll site doesn't have this directory yet, just create one.
The following table will help you understand the changes to the favicon files:
| File(s) | From Online Tool | From Chirpy |
| ------- | :--------------: | :---------: |
| `*.PNG` | ✓ | ✗ |
| `*.ICO` | ✓ | ✗ |
| `*.SVG` | ✓ | ✗ |
> ✓ means keep, ✗ means delete.
{: .prompt-info }
The next time you build the site, the favicon will be replaced with a customized edition.
================================================
FILE: _sass/abstracts/_breakpoints.scss
================================================
@use 'sass:map';
$-breakpoints: (
// 1 column
sm: 576px,
md: 768px,
// 2 columns
lg: 850px,
// 3 columns
xl: 1200px,
xxl: 1400px,
xxxl: 1650px
);
@function get($breakpoint) {
@return map.get($-breakpoints, $breakpoint);
}
/* Less than the given width */
@mixin lt($width) {
@media all and (max-width: calc(#{$width} - 1px)) {
@content;
}
}
/* Less than or equal to the given width */
@mixin lte($width) {
@media all and (max-width: $width) {
@content;
}
}
@mixin sm {
@media all and (min-width: get(sm)) {
@content;
}
}
@mixin md {
@media all and (min-width: get(md)) {
@content;
}
}
@mixin lg {
@media all and (min-width: get(lg)) {
@content;
}
}
@mixin xl {
@media all and (min-width: get(xl)) {
@content;
}
}
@mixin xxl {
@media all and (min-width: get(xxl)) {
@content;
}
}
@mixin xxxl {
@media all and (min-width: get(xxxl)) {
@content;
}
}
@mixin between($min, $max) {
@media all and (min-width: $min) and (max-width: $max) {
@content;
}
}
================================================
FILE: _sass/abstracts/_index.scss
================================================
@forward 'variables';
@forward 'mixins';
@forward 'placeholders';
@forward 'breakpoints';
================================================
FILE: _sass/abstracts/_mixins.scss
================================================
@mixin text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
@mixin mt-mb($value) {
margin-top: $value;
margin-bottom: $value;
}
@mixin ml-mr($value) {
margin-left: $value;
margin-right: $value;
}
@mixin pt-pb($val) {
padding-top: $val;
padding-bottom: $val;
}
@mixin pl-pr($val, $important: false) {
@if $important {
padding-left: $val !important;
padding-right: $val !important;
} @else {
padding-left: $val;
padding-right: $val;
}
}
@mixin placeholder {
color: var(--text-muted-color) !important;
}
@mixin placeholder-focus {
opacity: 0.6;
}
@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {
color: $color;
font-size: $font-size;
font-weight: $font-weight;
}
@mixin align-center {
position: relative;
left: 50%;
transform: translateX(-50%);
}
@mixin prompt($type, $fa-content, $fa-style: 'solid', $rotate: 0) {
&.prompt-#{$type} {
background-color: var(--prompt-#{$type}-bg);
&::before {
content: $fa-content;
color: var(--prompt-#{$type}-icon-color);
font: var(--fa-font-#{$fa-style});
@if $rotate != 0 {
transform: rotate(#{$rotate}deg);
}
}
}
}
@mixin slide($append: null) {
$basic: transform 0.4s ease;
@if $append {
transition: $basic, $append;
} @else {
transition: $basic;
}
}
@mixin max-w-100 {
max-width: 100%;
}
================================================
FILE: _sass/abstracts/_placeholders.scss
================================================
@use 'variables' as v;
@use 'mixins' as mx;
%heading {
color: var(--heading-color);
font-weight: 400;
font-family: v.$font-family-heading;
scroll-margin-top: 3.5rem;
}
%anchor {
.anchor {
font-size: 80%;
}
@media (hover: hover) {
.anchor {
visibility: hidden;
opacity: 0;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;
}
&:hover {
.anchor {
visibility: visible;
opacity: 1;
transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;
}
}
}
}
%tag-hover {
@extend %link-color;
background: var(--tag-hover);
border-color: var(--tag-hover);
transition: background 0.35s ease-in-out;
}
%table-cell {
padding: 0.4rem 1rem;
font-size: 95%;
white-space: nowrap;
}
%link-hover {
color: #d2603a !important;
border-bottom: 1px solid #d2603a;
text-decoration: none;
}
%link-color {
color: var(--link-color);
}
%link-underline {
border-bottom: 1px solid var(--link-underline-color);
}
%clickable-transition {
transition: all 0.3s ease-in-out;
}
%no-cursor {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
%no-bottom-border {
border-bottom: none;
}
%cursor-pointer {
cursor: pointer;
}
%normal-font-style {
font-style: normal;
}
%rounded {
border-radius: v.$radius-lg;
}
%img-caption {
+ em {
display: block;
text-align: center;
font-style: normal;
font-size: 80%;
padding: 0;
color: #6d6c6c;
}
}
%sidebar-links {
color: var(--sidebar-muted-color);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
%text-clip {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
%text-ellipsis {
@include mx.text-ellipsis;
}
%text-highlight {
color: var(--text-muted-highlight-color);
font-weight: 600;
}
%text-sm {
font-size: 0.85rem;
}
%text-xs {
font-size: 0.8rem;
}
%sup-fn-target {
&:target {
background-color: var(--footnote-target-bg);
width: -moz-fit-content;
width: -webkit-fit-content;
width: fit-content;
transition: background-color 1.75s ease-in-out;
}
}
%btn-color {
button i {
color: #999999;
}
}
%code-snippet-bg {
background-color: var(--highlight-bg-color);
}
%code-snippet-padding {
padding-left: 1rem;
padding-right: 1.5rem;
}
%max-w-100 {
max-width: 100%;
}
%panel-border {
border-left: 1px solid var(--main-border-color);
}
================================================
FILE: _sass/abstracts/_variables.scss
================================================
/* sidebar */
$sidebar-width: 260px !default; /* the basic width */
$sidebar-width-large: 300px !default; /* screen width: >= 1650px */
$sb-btn-gap: 0.8rem !default;
$sb-btn-gap-lg: 1rem !default;
/* other framework sizes */
$topbar-height: 3rem !default;
$search-max-width: 200px !default;
$footer-height: 5rem !default;
$footer-height-large: 6rem !default; /* screen width: < 850px */
$main-content-max-width: 1250px !default;
$radius-sm: 6px !default;
$radius-lg: 10px !default;
$back2top-size: 2.75rem !default;
/* syntax highlight */
$code-font-size: 0.85rem !default;
$code-header-height: 2.25rem !default;
$code-dot-size: 0.75rem !default;
$code-dot-gap: 0.5rem !default;
$code-icon-width: 1.75rem !default;
/* fonts */
$font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif !default;
$font-family-heading: Lato, 'Microsoft Yahei', sans-serif !default;
================================================
FILE: _sass/base/_base.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
@use '../themes/light';
@use '../themes/dark';
:root {
font-size: 16px;
}
html {
@media (prefers-color-scheme: light) {
&:not([data-mode]),
&[data-mode='light'] {
@include light.styles;
}
&[data-mode='dark'] {
@include dark.styles;
}
}
@media (prefers-color-scheme: dark) {
&:not([data-mode]),
&[data-mode='dark'] {
@include dark.styles;
}
&[data-mode='light'] {
@include light.styles;
}
}
@include bp.lg {
overflow-y: scroll;
}
}
body {
background: var(--main-bg);
padding: env(safe-area-inset-top) env(safe-area-inset-right)
env(safe-area-inset-bottom) env(safe-area-inset-left);
color: var(--text-color);
-webkit-font-smoothing: antialiased;
font-family: v.$font-family-base;
}
h1.dynamic-title {
@include bp.lt(bp.get(lg)) {
display: none;
~ .content {
margin-top: 2.5rem;
}
}
}
main {
&.col-12 {
@include bp.xxxl {
padding-right: 4.5rem !important;
}
}
}
.preview-img {
aspect-ratio: 40 / 21;
width: 100%;
height: 100%;
overflow: hidden;
@extend %rounded;
&:not(.no-bg) {
background: var(--img-bg);
}
img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
@extend %rounded;
@at-root #post-list & {
width: 100%;
}
}
}
.post-preview {
@extend %rounded;
border: 0;
background: var(--card-bg);
box-shadow: var(--card-shadow);
&::before {
@extend %rounded;
content: '';
width: 100%;
height: 100%;
position: absolute;
background-color: var(--card-hover-bg);
opacity: 0;
transition: opacity 0.35s ease-in-out;
}
&:hover {
&::before {
opacity: 0.3;
}
}
}
.post-meta {
@extend %text-sm;
a {
&:not([class]):hover {
@extend %link-hover;
}
}
em {
@extend %normal-font-style;
}
}
.content {
font-size: 1.08rem;
margin-top: 2rem;
overflow-wrap: break-word;
@include bp.xl {
font-size: 1.03rem;
}
a {
&.popup {
@extend %no-cursor;
@extend %img-caption;
@include mx.mt-mb(0.5rem);
cursor: zoom-in;
}
&:not(.img-link) {
@extend %link-underline;
&:hover {
@extend %link-hover;
}
}
}
ol,
ul {
&:not([class]),
&.task-list {
-webkit-padding-start: 1.75rem;
padding-inline-start: 1.75rem;
li {
margin: 0.25rem 0;
padding-left: 0.25rem;
}
ol,
ul {
-webkit-padding-start: 1.25rem;
padding-inline-start: 1.25rem;
margin: 0.5rem 0;
}
}
}
ul.task-list {
-webkit-padding-start: 1.25rem;
padding-inline-start: 1.25rem;
li {
list-style-type: none;
padding-left: 0;
/* checkbox icon */
> i {
width: 2rem;
margin-left: -1.25rem;
color: var(--checkbox-color);
&.checked {
color: var(--checkbox-checked-color);
}
}
ul {
-webkit-padding-start: 1.75rem;
padding-inline-start: 1.75rem;
}
}
input[type='checkbox'] {
margin: 0 0.5rem 0.2rem -1.3rem;
vertical-align: middle;
}
} /* ul */
dl > dd {
margin-left: 1rem;
}
::marker {
color: var(--text-muted-color);
}
.table-wrapper > table {
@include bp.lg {
min-width: 70%;
}
}
} /* .content */
.tag:hover {
@extend %tag-hover;
}
.post-tag {
display: inline-block;
min-width: 2rem;
text-align: center;
border-radius: 0.5rem;
border: 1px solid var(--btn-border-color);
padding: 0 0.4rem;
color: var(--text-muted-color);
line-height: 1.3rem;
&:not(:last-child) {
margin-right: 0.2rem;
}
}
.rounded-10 {
border-radius: 10px !important;
}
.img-link {
color: transparent;
display: inline-flex;
}
.shimmer {
overflow: hidden;
position: relative;
background: var(--img-bg);
&::before {
content: '';
position: absolute;
background: var(--shimmer-bg);
height: 100%;
width: 100%;
-webkit-animation: shimmer 1.3s infinite;
animation: shimmer 1.3s infinite;
}
@-webkit-keyframes shimmer {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(100%);
}
}
@keyframes shimmer {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(100%);
}
}
}
.embed-video {
width: 100%;
height: 100%;
margin-bottom: 1rem;
aspect-ratio: 16 / 9;
@extend %rounded;
&.twitch {
aspect-ratio: 310 / 189;
}
&.file {
display: block;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
margin: auto;
margin-bottom: 0;
}
@extend %img-caption;
}
.embed-audio {
width: 100%;
&.file {
display: block;
}
&.spotify {
border-radius: 14px;
}
@extend %img-caption;
}
/* --- Effects classes --- */
.flex-grow-1 {
flex-grow: 1 !important;
}
.btn-box-shadow {
box-shadow: var(--card-shadow);
}
/* overwrite bootstrap muted */
.text-muted {
color: var(--text-muted-color) !important;
}
/* Overwrite bootstrap tooltip */
.tooltip-inner {
font-size: 0.7rem;
max-width: 220px;
text-align: left;
}
/* Overwrite bootstrap outline button */
.btn.btn-outline-primary {
&:not(.disabled):hover {
border-color: #007bff !important;
}
}
.disabled {
color: rgb(206 196 196);
pointer-events: auto;
cursor: not-allowed;
}
.hide-border-bottom {
border-bottom: none !important;
}
.input-focus {
box-shadow: none;
border-color: var(--input-focus-border-color) !important;
background: center !important;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.left {
float: left;
margin: 0.75rem 1rem 1rem 0;
}
.right {
float: right;
margin: 0.75rem 0 1rem 1rem;
}
/* --- Overriding --- */
/* mermaid */
.mermaid {
text-align: center;
}
/* MathJax */
mjx-container {
overflow-y: hidden;
min-width: auto !important;
}
@media (hover: hover) {
#sidebar ul > li:last-child::after {
transition: top 0.5s ease;
}
.nav-link {
transition: background-color 0.3s ease-in-out;
}
.post-preview {
transition: background-color 0.35s ease-in-out;
}
}
#mask {
inset: 0 0 0 0;
}
#main-wrapper {
position: relative;
@include mx.pl-pr(0);
@include bp.lt(bp.get(lg)) {
@include mx.slide;
}
@include bp.lg {
margin-left: v.$sidebar-width;
}
@include bp.xxxl {
margin-left: v.$sidebar-width-large;
}
> .container {
min-height: 100vh;
@include bp.lte(bp.get(md)) {
@include mx.max-w-100;
@include mx.pl-pr(0);
}
@include bp.lt(bp.get(lg)) {
max-width: 100%;
}
/* Pad horizontal */
@include bp.between(992px, calc(#{bp.get(xl)} - 1px)) {
.col-lg-11 {
flex: 0 0 96%;
max-width: 96%;
}
}
@include bp.lt(bp.get(xl)) {
> .row {
justify-content: center !important;
}
}
@include bp.xxxl {
max-width: v.$main-content-max-width;
@include mx.pl-pr(1.75rem, true);
}
}
}
/* --- basic wrappers --- */
#topbar-wrapper.row,
#main-wrapper > .container > .row,
#search-result-wrapper > .row {
@include mx.ml-mr(0);
}
#tail-wrapper {
@include bp.xxxl {
padding-right: 4.5rem !important;
}
> :not(script) {
margin-top: 3rem;
}
}
================================================
FILE: _sass/base/_index.scss
================================================
@forward 'reset';
@forward 'base';
@forward 'typography';
@forward 'syntax';
================================================
FILE: _sass/base/_reset.scss
================================================
@use '../abstracts/mixins' as *;
::-webkit-input-placeholder {
@include placeholder;
}
::-moz-placeholder {
@include placeholder;
}
:-ms-input-placeholder {
@include placeholder;
}
::-ms-input-placeholder {
@include placeholder;
}
::placeholder {
@include placeholder;
}
:focus::-webkit-input-placeholder {
@include placeholder-focus;
}
:focus::-moz-placeholder {
@include placeholder-focus;
}
:focus:-ms-input-placeholder {
@include placeholder-focus;
}
:focus::-ms-input-placeholder {
@include placeholder-focus;
}
:focus::placeholder {
@include placeholder-focus;
}
================================================
FILE: _sass/base/_syntax.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
.highlighter-rouge {
color: var(--highlighter-rouge-color);
margin-top: 0.5rem;
margin-bottom: 1.2em; /* Override BS Inline-code style */
}
.highlight {
@extend %rounded;
@extend %code-snippet-bg;
overflow: auto;
padding-bottom: 0.75rem;
@at-root figure#{&} {
@extend %code-snippet-bg;
}
pre {
margin-bottom: 0;
font-size: v.$code-font-size;
line-height: 1.4rem;
}
table {
td {
&:first-child {
display: inline-block;
margin-left: 1rem;
margin-right: 0.75rem;
}
&:last-child {
padding-right: 2rem !important;
}
pre {
overflow: visible; /* Fixed iOS safari overflow-x */
word-break: normal; /* Fixed iOS safari linenos code break */
}
}
}
.lineno {
text-align: right;
color: var(--highlight-lineno-color);
-webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
-ms-user-select: none;
user-select: none;
}
} /* .highlight */
code {
-webkit-hyphens: none;
-ms-hyphens: none;
hyphens: none;
color: var(--code-color);
&.highlighter-rouge {
font-size: v.$code-font-size;
padding: 3px 5px;
overflow-wrap: break-word;
border-radius: v.$radius-sm;
background-color: var(--inline-code-bg);
}
&.filepath {
background-color: inherit;
color: var(--filepath-text-color);
font-weight: 600;
padding: 0;
}
a > &.highlighter-rouge {
padding-bottom: 0; /* show link's underline */
color: inherit;
}
a:hover > &.highlighter-rouge {
border-bottom: none;
}
blockquote & {
color: inherit;
}
}
td.rouge-code {
@extend %code-snippet-padding;
/*
Prevent some browser extends from
changing the URL string of code block.
*/
a {
color: inherit !important;
border-bottom: none !important;
pointer-events: none;
}
}
div[class^='language-'] {
@extend %rounded;
@extend %code-snippet-bg;
box-shadow: var(--language-border-color) 0 0 0 1px;
.content > & {
@include mx.ml-mr(-1rem);
border-radius: 0;
@include bp.sm {
@include mx.ml-mr(0);
border-radius: v.$radius-lg;
}
}
.code-header {
@include bp.sm {
@include mx.ml-mr(0);
$dot-margin: 1rem;
&::before {
content: '';
display: inline-block;
margin-left: $dot-margin;
width: v.$code-dot-size;
height: v.$code-dot-size;
border-radius: 50%;
background-color: var(--code-header-muted-color);
box-shadow:
(v.$code-dot-size + v.$code-dot-gap) 0 0
var(--code-header-muted-color),
(v.$code-dot-size + v.$code-dot-gap) * 2 0 0
var(--code-header-muted-color);
}
span {
// center the text of label
margin-left: calc(($dot-margin + v.$code-dot-size) / 2 * -1);
}
}
}
.highlight {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
/* Hide line numbers for default, console, and terminal code snippets */
div {
&.nolineno,
&.language-plaintext,
&.language-console,
&.language-terminal {
td:first-child {
padding: 0 !important;
margin-right: 0;
.lineno {
display: none;
}
}
}
}
.code-header {
@extend %no-cursor;
display: flex;
justify-content: space-between;
align-items: center;
height: v.$code-header-height;
margin-left: 0.75rem;
margin-right: 0.25rem;
/* the label block */
span {
line-height: v.$code-header-height;
/* label icon */
i {
font-size: 1rem;
width: v.$code-icon-width;
color: var(--code-header-icon-color);
&.small {
font-size: 70%;
}
}
@at-root [file] #{&} > i {
position: relative;
top: 1px; /* center the file icon */
}
/* label text */
&::after {
content: attr(data-label-text);
font-size: 0.85rem;
font-weight: 600;
color: var(--code-header-text-color);
}
}
/* clipboard */
button {
@extend %cursor-pointer;
@extend %rounded;
border: 1px solid transparent;
height: v.$code-header-height;
width: v.$code-header-height;
padding: 0;
background-color: inherit;
i {
color: var(--code-header-icon-color);
}
&[timeout] {
&:hover {
border-color: var(--clipboard-checked-color);
}
i {
color: var(--clipboard-checked-color);
}
}
&:focus {
outline: none;
}
&:not([timeout]):hover {
background-color: rgb(128 128 128 / 37%);
i {
color: white;
}
}
}
}
================================================
FILE: _sass/base/_typography.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
@for $i from 1 through 5 {
h#{$i} {
@extend %heading;
@if $i > 1 {
@extend %anchor;
}
@if $i < 5 {
$size-factor: 0.25rem;
@if $i > 1 {
$size-factor: 0.18rem;
main & {
@if $i == 2 {
margin: 2.5rem 0 1.25rem;
} @else {
margin: 2rem 0 1rem;
}
}
}
font-size: 1rem + (5 - $i) * $size-factor;
} @else {
font-size: 1.05rem;
}
}
}
a {
@extend %link-color;
text-decoration: none;
}
img {
max-width: 100%;
height: auto;
transition: all 0.35s ease-in-out;
.blur & {
$blur: 20px;
-webkit-filter: blur($blur);
filter: blur($blur);
}
}
blockquote {
border-left: 0.125rem solid var(--blockquote-border-color);
padding-left: 1rem;
color: var(--blockquote-text-color);
margin-top: 0.5rem;
> p:last-child {
margin-bottom: 0;
}
&[class^='prompt-'] {
border-left: 0;
position: relative;
padding: 1rem 1rem 1rem 3rem;
color: var(--prompt-text-color);
@extend %rounded;
&::before {
text-align: center;
width: 3rem;
position: absolute;
left: 0.25rem;
margin-top: 0.4rem;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
}
@include mx.prompt('tip', '\f0eb', $fa-style: 'regular');
@include mx.prompt('info', '\f06a', $rotate: 180);
@include mx.prompt('warning', '\f06a');
@include mx.prompt('danger', '\f071');
}
kbd {
font-family: Lato, sans-serif;
display: inline-block;
vertical-align: middle;
line-height: 1.3rem;
min-width: 1.75rem;
text-align: center;
margin: 0 0.3rem;
padding-top: 0.1rem;
color: var(--kbd-text-color);
background-color: var(--kbd-bg-color);
border-radius: v.$radius-sm;
border: solid 1px var(--kbd-wrap-color);
box-shadow: inset 0 -2px 0 var(--kbd-wrap-color);
}
hr {
border-color: var(--main-border-color);
opacity: 1;
}
footer {
background-color: var(--main-bg);
height: v.$footer-height;
border-top: 1px solid var(--main-border-color);
@extend %text-xs;
a {
@extend %text-highlight;
&:hover {
@extend %link-hover;
}
}
em {
@extend %text-highlight;
}
p {
text-align: center;
margin-bottom: 0;
}
}
/* fontawesome icons */
i {
&.far,
&.fas {
@extend %no-cursor;
}
}
sup {
@extend %sup-fn-target;
}
main {
line-height: 1.75;
h1 {
margin-top: 2rem;
@include bp.lg {
margin-top: 3rem;
}
}
p {
> a.popup {
&:not(.normal):not(.left):not(.right) {
@include mx.align-center;
}
}
}
.categories,
#tags,
#archives {
a:not(:hover) {
@extend %no-bottom-border;
}
}
@include bp.lte(bp.get(sm)) {
.content {
> blockquote[class^='prompt-'] {
@include mx.ml-mr(-1rem);
border-radius: 0;
max-width: none;
}
}
}
}
.footnotes > ol {
padding-left: 2rem;
margin-top: 0.5rem;
> li {
&:not(:last-child) {
margin-bottom: 0.3rem;
}
@extend %sup-fn-target;
> p {
margin-left: 0.25em;
@include mx.mt-mb(0);
}
}
}
.footnote {
@at-root a#{&} {
@include mx.ml-mr(1px);
@include mx.pl-pr(2px);
border-bottom-style: none !important;
}
}
.reversefootnote {
@at-root a#{&} {
font-size: 0.6rem;
line-height: 1;
position: relative;
bottom: 0.25em;
margin-left: 0.25em;
border-bottom-style: none !important;
}
}
/* --- Begin of Markdown table style --- */
/* it will be created by Liquid */
.table-wrapper {
overflow-x: auto;
margin-bottom: 1.5rem;
> table {
min-width: 100%;
overflow-x: auto;
border-spacing: 0;
thead {
border-bottom: solid 2px rgb(210 215 217 / 75%);
th {
@extend %table-cell;
}
}
tbody {
tr {
border-bottom: 1px solid var(--tb-border-color);
&:nth-child(2n) {
background-color: var(--tb-even-bg);
}
&:nth-child(2n + 1) {
background-color: var(--tb-odd-bg);
}
td {
@extend %table-cell;
}
}
} /* tbody */
} /* table */
}
================================================
FILE: _sass/components/_buttons.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
#back-to-top {
visibility: hidden;
opacity: 0;
z-index: 1;
cursor: pointer;
position: fixed;
right: 1rem;
bottom: calc(v.$footer-height-large - v.$back2top-size / 2);
background: var(--button-bg);
color: var(--btn-backtotop-color);
padding: 0;
width: v.$back2top-size;
height: v.$back2top-size;
border-radius: 50%;
border: 1px solid var(--btn-backtotop-border-color);
transition: opacity 0.5s ease-in-out, transform 0.2s ease-out;
@include bp.lg {
right: 5%;
bottom: calc(v.$footer-height - v.$back2top-size / 2);
}
@include bp.xxl {
right: calc((100vw - v.$sidebar-width - 1140px) / 2 + 3rem);
}
@include bp.xxxl {
right: calc(
(100vw - v.$sidebar-width-large - v.$main-content-max-width) / 2 + 2rem
);
}
&:hover {
transform: translate3d(0, -5px, 0);
-webkit-transform: translate3d(0, -5px, 0);
}
i {
line-height: v.$back2top-size;
position: relative;
bottom: 2px;
}
&.show {
opacity: 1;
visibility: visible;
}
}
================================================
FILE: _sass/components/_index.scss
================================================
@forward 'buttons';
@forward 'popups';
================================================
FILE: _sass/components/_popups.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/placeholders';
/* PWA update popup */
#notification {
@-webkit-keyframes popup {
from {
opacity: 0;
bottom: 0;
}
}
@keyframes popup {
from {
opacity: 0;
bottom: 0;
}
}
.toast-header {
background: none;
border-bottom: none;
color: inherit;
}
.toast-body {
font-family: Lato, sans-serif;
line-height: 1.25rem;
button {
font-size: 90%;
min-width: 4rem;
}
}
&.toast {
&.show {
display: block;
min-width: 20rem;
border-radius: 0.5rem;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: rgb(255 255 255 / 50%);
color: #1b1b1eba;
position: fixed;
left: 50%;
bottom: 20%;
transform: translateX(-50%);
-webkit-animation: popup 0.8s;
animation: popup 0.8s;
}
}
}
#toc-popup {
$slide-in: slide-in 0.3s ease-out;
$slide-out: slide-out 0.3s ease-out;
$curtain-height: 2rem;
$backdrop: blur(5px);
border-color: var(--toc-popup-border-color);
border-width: 1px;
border-radius: v.$radius-lg;
color: var(--text-color);
background: var(--card-bg);
margin-top: v.$topbar-height;
min-width: 20rem;
font-size: 1.05rem;
@include bp.sm {
max-width: 32rem;
}
&[open] {
-webkit-animation: $slide-in;
animation: $slide-in;
}
&[closing] {
-webkit-animation: $slide-out;
animation: $slide-out;
}
@include bp.lg {
left: v.$sidebar-width;
}
.header {
@extend %btn-color;
position: -webkit-sticky;
position: sticky;
top: 0;
background-color: inherit;
border-bottom: 1px solid var(--main-border-color);
.label {
font-family: v.$font-family-heading;
}
}
button {
> i {
font-size: 1.25rem;
vertical-align: middle;
}
&:focus-visible {
box-shadow: none;
}
}
ul {
list-style-type: none;
padding-left: 0;
li {
ul,
& + li {
margin-top: 0.25rem;
}
a {
display: flex;
line-height: 1.5;
padding: 0.375rem 0;
padding-right: 1.125rem;
&.toc-link::before {
display: none;
}
}
}
}
@for $i from 2 through 4 {
.node-name--H#{$i} {
padding-left: 1.125rem * ($i - 1);
}
}
.is-active-link {
color: var(--toc-highlight) !important;
font-weight: 600;
}
&::-webkit-backdrop {
-webkit-backdrop-filter: $backdrop;
backdrop-filter: $backdrop;
}
&::backdrop {
-webkit-backdrop-filter: $backdrop;
backdrop-filter: $backdrop;
}
&::after {
display: flex;
content: '';
position: relative;
background: linear-gradient(transparent, var(--card-bg) 70%);
height: $curtain-height;
}
#toc-popup-content {
overflow: auto;
max-height: calc(100vh - 4 * v.$topbar-height);
font-family: v.$font-family-heading;
margin-bottom: -$curtain-height;
}
}
================================================
FILE: _sass/layout/_footer.scss
================================================
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/variables' as v;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
footer {
background-color: var(--main-bg);
height: v.$footer-height;
border-top: 1px solid var(--main-border-color);
@extend %text-xs;
@include bp.lt(bp.get(lg)) {
@include mx.slide;
height: v.$footer-height-large;
padding: 1.5rem 0;
}
a {
@extend %text-highlight;
&:hover {
@extend %link-hover;
}
}
em {
@extend %text-highlight;
}
p {
text-align: center;
margin-bottom: 0;
}
}
================================================
FILE: _sass/layout/_index.scss
================================================
@forward 'sidebar';
@forward 'topbar';
@forward 'panel';
@forward 'footer';
================================================
FILE: _sass/layout/_panel.scss
================================================
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
.access {
top: 2rem;
transition: top 0.2s ease-in-out;
margin-top: 3rem;
&:only-child {
position: -webkit-sticky;
position: sticky;
}
> section {
@extend %panel-border;
padding-left: 1rem;
&:not(:first-child) {
margin-top: 4rem;
}
}
.content {
font-size: 0.9rem;
}
}
#panel-wrapper {
/* the headings */
.panel-heading {
font-family: inherit;
line-height: inherit;
@include mx.label(inherit);
}
.post-tag {
line-height: 1.05rem;
font-size: 0.85rem;
border-radius: 0.8rem;
padding: 0.3rem 0.5rem;
margin: 0 0.35rem 0.5rem 0;
&:hover {
transition: all 0.3s ease-in;
}
}
> :last-child {
margin-bottom: 4rem;
}
@include bp.lt(bp.get(xl)) {
display: none;
}
}
#access-lastmod {
a {
color: inherit;
&:hover {
@extend %link-hover;
}
@extend %no-bottom-border;
}
}
================================================
FILE: _sass/layout/_sidebar.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/mixins' as mx;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/placeholders';
$btn-border-width: 3px;
$btn-mb: 0.5rem;
$sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
#sidebar {
@include mx.pl-pr(0);
position: fixed;
top: 0;
left: 0;
height: 100%;
overflow-y: auto;
width: v.$sidebar-width;
background: var(--sidebar-bg);
border-right: 1px solid var(--sidebar-border-color);
/* Hide scrollbar for IE, Edge and Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
/* Hide scrollbar for Chrome, Safari and Opera */
&::-webkit-scrollbar {
display: none;
}
@include bp.lt(bp.get(lg)) {
@include mx.slide;
transform: translateX(-#{v.$sidebar-width}); /* hide */
-webkit-transform: translateX(-#{v.$sidebar-width});
[#{$sidebar-display}] & {
transform: translateX(0);
}
}
@include bp.xxxl {
width: v.$sidebar-width-large;
}
%sidebar-link-hover {
&:hover {
color: var(--sidebar-active-color);
}
}
a {
@extend %sidebar-links;
}
#avatar {
display: block;
width: 6.5rem;
height: 6.5rem;
overflow: hidden;
box-shadow: var(--avatar-border-color) 0 0 0 2px;
transform: translateZ(0); /* fixed the zoom in Safari */
@include bp.sm {
width: 7rem;
height: 7rem;
}
img {
transition: transform 0.5s;
&:hover {
transform: scale(1.2);
}
}
}
.profile-wrapper {
@include mx.mt-mb(2.5rem);
@extend %clickable-transition;
padding-left: 2.5rem;
padding-right: 1.25rem;
width: 100%;
@include bp.lg {
margin-top: 3rem;
}
@include bp.xxxl {
margin-top: 3.5rem;
margin-bottom: 2.5rem;
padding-left: 3.5rem;
}
}
.site-title {
@extend %clickable-transition;
@extend %sidebar-link-hover;
font-family: inherit;
font-weight: 900;
font-size: 1.75rem;
line-height: 1.2;
letter-spacing: 0.25px;
margin-top: 1.25rem;
margin-bottom: 0.5rem;
width: fit-content;
color: var(--site-title-color);
}
.site-subtitle {
font-size: 95%;
color: var(--site-subtitle-color);
margin-top: 0.25rem;
word-spacing: 1px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
ul {
margin-bottom: 2rem;
li.nav-item {
opacity: 0.9;
width: 100%;
@include mx.pl-pr(1.5rem);
@include bp.xxxl {
@include mx.pl-pr(2.75rem);
}
a.nav-link {
@include mx.pt-pb(0.6rem);
display: flex;
align-items: center;
border-radius: 0.75rem;
font-weight: 600;
&:hover {
background-color: var(--sidebar-hover-bg);
}
i {
font-size: 95%;
opacity: 0.8;
margin-right: 1.5rem;
}
span {
font-size: 90%;
letter-spacing: 0.2px;
}
}
&.active {
.nav-link {
color: var(--sidebar-active-color);
background-color: var(--sidebar-hover-bg);
span {
opacity: 1;
}
}
}
&:not(:first-child) {
margin-top: 0.25rem;
}
}
}
.sidebar-bottom {
padding-left: 2rem;
padding-right: 1rem;
margin-bottom: 1.5rem;
@include bp.xxxl {
padding-left: 2.75rem;
margin-bottom: 1.75rem;
}
$btn-size: 1.75rem;
%button {
width: $btn-size;
height: $btn-size;
margin-bottom: $btn-mb; // multi line gap
border-radius: 50%;
color: var(--sidebar-btn-color);
background-color: var(--sidebar-btn-bg);
text-align: center;
display: flex;
align-items: center;
justify-content: center;
&:not(:focus-visible) {
box-shadow: var(--sidebar-border-color) 0 0 0 1px;
}
&:hover {
background-color: var(--sidebar-hover-bg);
}
}
a {
@extend %button;
@extend %sidebar-link-hover;
@extend %clickable-transition;
&:not(:last-child) {
margin-right: v.$sb-btn-gap;
@include bp.xxxl {
margin-right: v.$sb-btn-gap-lg;
}
}
}
i {
line-height: $btn-size;
}
#mode-toggle {
@extend %button;
@extend %sidebar-links;
@extend %sidebar-link-hover;
}
.icon-border {
@extend %no-cursor;
@include mx.ml-mr(calc((v.$sb-btn-gap - $btn-border-width) / 2));
background-color: var(--sidebar-btn-color);
content: '';
width: $btn-border-width;
height: $btn-border-width;
border-radius: 50%;
margin-bottom: $btn-mb;
@include bp.xxxl {
@include mx.ml-mr(calc((v.$sb-btn-gap-lg - $btn-border-width) / 2));
}
}
} /* .sidebar-bottom */
} /* #sidebar */
[#{$sidebar-display}] {
#main-wrapper {
@include bp.lt(bp.get(lg)) {
transform: translateX(v.$sidebar-width);
}
}
}
================================================
FILE: _sass/layout/_topbar.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/mixins' as mx;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/placeholders';
#topbar-wrapper {
height: v.$topbar-height;
background-color: var(--topbar-bg);
@include bp.lt(bp.get(lg)) {
@include mx.slide(top 0.2s ease);
left: 0;
}
}
#topbar {
@extend %btn-color;
#breadcrumb {
font-size: 1rem;
color: var(--text-muted-color);
padding-left: 0.5rem;
a:hover {
@extend %link-hover;
}
span {
&:not(:last-child) {
&::after {
content: '›';
padding: 0 0.3rem;
}
}
}
@include bp.lt(bp.get(lg)) {
display: none;
}
@include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {
width: 65%;
overflow: hidden;
text-overflow: ellipsis;
word-break: keep-all;
white-space: nowrap;
}
}
@include bp.lte(bp.get(md)) {
@include mx.max-w-100;
}
@include bp.lt(bp.get(lg)) {
max-width: 100%;
}
}
#topbar-title {
display: none;
font-size: 1.1rem;
font-weight: 600;
font-family: sans-serif;
color: var(--topbar-text-color);
text-align: center;
width: 70%;
word-break: keep-all;
@include bp.lt(bp.get(lg)) {
display: block;
}
@include bp.lg {
text-align: left;
}
}
#sidebar-trigger,
#search-trigger {
display: none;
@include bp.lt(bp.get(lg)) {
display: block;
}
}
================================================
FILE: _sass/main.bundle.scss
================================================
@use 'vendors/bootstrap';
@use 'main';
================================================
FILE: _sass/main.scss
================================================
@forward 'base';
@forward 'components';
@forward 'layout';
@forward 'pages';
================================================
FILE: _sass/pages/_archives.scss
================================================
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/placeholders';
#archives {
letter-spacing: 0.03rem;
@include bp.lt(bp.get(sm)) {
margin-top: -1rem;
ul {
letter-spacing: 0;
}
}
$timeline-width: 4px;
%timeline {
content: '';
width: $timeline-width;
position: relative;
float: left;
background-color: var(--timeline-color);
}
.year {
height: 3.5rem;
font-size: 1.5rem;
position: relative;
left: 2px;
margin-left: -$timeline-width;
&::before {
@extend %timeline;
height: 72px;
left: 79px;
bottom: 16px;
}
&:first-child::before {
@extend %timeline;
height: 32px;
top: 24px;
}
/* Year dot */
&::after {
content: '';
display: inline-block;
position: relative;
border-radius: 50%;
width: 12px;
height: 12px;
left: 21.5px;
border: 3px solid;
background-color: var(--timeline-year-dot-color);
border-color: var(--timeline-node-bg);
box-shadow: 0 0 2px 0 #c2c6cc;
z-index: 1;
}
}
ul {
li {
font-size: 1.1rem;
line-height: 3rem;
@extend %text-ellipsis;
&:nth-child(odd) {
background-color: var(--main-bg, #ffffff);
background-image: linear-gradient(
to left,
#ffffff,
#fbfbfb,
#fbfbfb,
#fbfbfb,
#ffffff
);
}
&::before {
@extend %timeline;
top: 0;
left: 77px;
height: 3.1rem;
}
}
&:last-child li:last-child::before {
height: 1.5rem;
}
} /* #archives ul */
.date {
white-space: nowrap;
display: inline-block;
position: relative;
right: 0.5rem;
&.month {
width: 1.4rem;
text-align: center;
}
&.day {
font-size: 85%;
font-family: Lato, sans-serif;
}
}
a {
/* post title in Archives */
margin-left: 2.5rem;
position: relative;
top: 0.1rem;
&:hover {
border-bottom: none;
}
&::before {
/* the dot before post title */
content: '';
display: inline-block;
position: relative;
border-radius: 50%;
width: 8px;
height: 8px;
float: left;
top: 1.35rem;
left: 71px;
background-color: var(--timeline-node-bg);
box-shadow: 0 0 3px 0 #c2c6cc;
z-index: 1;
}
}
} /* #archives */
================================================
FILE: _sass/pages/_categories.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/placeholders';
%-category-icon-color {
color: gray;
}
.categories {
margin-bottom: 2rem;
border-color: var(--categories-border);
&.card,
.list-group {
@extend %rounded;
}
.card-header {
$radius: calc(v.$radius-lg - 1px);
padding: 0.75rem;
border-radius: $radius;
border-bottom: 0;
&.hide-border-bottom {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
}
i {
@extend %-category-icon-color;
font-size: 86%; /* fontawesome icons */
}
.list-group-item {
border-left: none;
border-right: none;
padding-left: 2rem;
&:first-child {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
&:last-child {
border-bottom: 0;
}
}
} /* .categories */
.category-trigger {
width: 1.7rem;
height: 1.7rem;
border-radius: 50%;
text-align: center;
color: #6c757d !important;
i {
position: relative;
height: 0.7rem;
width: 1rem;
transition: transform 300ms ease;
}
&:hover {
i {
color: var(--categories-icon-hover-color);
}
}
}
/* only works on desktop */
@media (hover: hover) {
.category-trigger:hover {
background-color: var(--categories-hover-bg);
}
}
.rotate {
transform: rotate(-90deg);
}
================================================
FILE: _sass/pages/_category-tag.scss
================================================
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
.dash {
margin: 0 0.5rem 0.6rem 0.5rem;
border-bottom: 2px dotted var(--dash-color);
}
#page-category,
#page-tag {
ul > li {
line-height: 1.5rem;
padding: 0.6rem 0;
/* dot */
&::before {
background: #999999;
width: 5px;
height: 5px;
border-radius: 50%;
display: block;
content: '';
position: relative;
top: 0.6rem;
margin-right: 0.5rem;
@include bp.lt(bp.get(sm)) {
margin: 0 0.5rem;
}
}
/* post's title */
> a {
@extend %no-bottom-border;
font-size: 1.1rem;
@include bp.lt(bp.get(sm)) {
@include mx.text-ellipsis;
}
}
}
}
/* tag icon */
#page-tag h1 > i {
font-size: 1.2rem;
}
#page-category h1 > i {
font-size: 1.25rem;
}
#page-category,
#page-tag,
#access-lastmod {
a:hover {
@extend %link-hover;
margin-bottom: -1px; /* Avoid jumping */
}
}
================================================
FILE: _sass/pages/_home.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/placeholders';
#post-list {
margin-top: 2rem;
@include bp.lg {
margin-top: 2.5rem;
}
.card-wrapper {
&:hover {
text-decoration: none;
}
&:not(:last-child) {
margin-bottom: 1.25rem;
}
}
.card {
border: 0;
background: none;
%img-radius {
border-radius: v.$radius-lg v.$radius-lg 0 0;
@include bp.md {
border-radius: 0 v.$radius-lg v.$radius-lg 0;
}
}
.preview-img {
@extend %img-radius;
img {
@extend %img-radius;
}
}
.card-body {
height: 100%;
padding: 1rem;
@include bp.md {
padding: 1.75rem 1.75rem 1.25rem;
}
.card-title {
@extend %text-clip;
color: var(--heading-color) !important;
font-size: 1.25rem;
}
%muted {
color: var(--text-muted-color) !important;
}
.card-text {
@include bp.md {
display: inherit !important;
}
&.content {
@extend %muted;
p {
@extend %text-clip;
line-height: 1.5;
margin: 0;
}
}
}
.post-meta {
@extend %muted;
i {
&:not(:first-child) {
margin-left: 1.5rem;
@include bp.md {
margin-left: 1.75rem;
}
}
}
em {
@extend %normal-font-style;
color: inherit;
}
> div:first-child {
display: block;
@extend %text-ellipsis;
}
}
}
}
} /* #post-list */
.pagination {
color: var(--text-color);
font-family: Lato, sans-serif;
justify-content: space-evenly;
@include bp.lg {
font-size: 0.85rem;
justify-content: center;
}
a:hover {
text-decoration: none;
}
.page-item {
@include bp.lt(bp.get(lg)) {
&:not(:first-child):not(:last-child) {
display: none;
}
}
@include bp.lg {
&:not(:last-child) {
margin-right: 0.7rem;
}
}
.page-link {
color: var(--btn-patinator-text-color);
padding: 0 0.6rem;
border-radius: 0.5rem;
border: 0;
background-color: inherit;
}
&.active {
.page-link {
background-color: var(--btn-paginator-hover-color);
}
}
&:not(.active) {
.page-link {
&:hover {
box-shadow: inset var(--btn-border-color) 0 0 0 1px;
}
}
}
&.disabled {
cursor: not-allowed;
.page-link {
color: rgb(108 117 125 / 57%);
}
}
} /* .page-item */
.page-index {
@include bp.lg {
display: none;
}
}
}
================================================
FILE: _sass/pages/_index.scss
================================================
@forward 'search';
@forward 'home';
@forward 'post';
@forward 'categories';
@forward 'tags';
@forward 'archives';
@forward 'category-tag';
================================================
FILE: _sass/pages/_post.scss
================================================
@use '../abstracts/variables' as v;
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/mixins' as mx;
@use '../abstracts/placeholders';
%-btn-post-nav {
width: 50%;
position: relative;
border-color: var(--btn-border-color);
}
@mixin -dot($pl: 0.25rem, $pr: 0.25rem) {
content: '\2022';
padding-left: $pl;
padding-right: $pr;
}
header {
.post-desc {
@extend %heading;
font-size: 1.125rem;
line-height: 1.6;
}
.post-meta {
span + span::before {
@include -dot;
}
em,
time {
@extend %text-highlight;
}
em {
a {
color: inherit;
}
}
}
h1 + .post-meta {
margin-top: 1.5rem;
}
}
.post-tail-wrapper {
@extend %text-sm;
margin-top: 6rem;
border-bottom: 1px double var(--main-border-color);
.license-wrapper {
line-height: 1.2rem;
> a {
@extend %text-highlight;
&:hover {
@extend %link-hover;
}
}
span:last-child {
@extend %text-sm;
}
} /* .license-wrapper */
.post-meta a:not(:hover) {
@extend %link-underline;
}
.share-wrapper {
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
%icon-size {
font-size: 1.125rem;
}
.share-icons {
display: flex;
i {
color: var(--btn-share-color);
@extend %icon-size;
}
> * {
@extend %icon-size;
margin-left: 0.5rem;
&:hover {
i {
@extend %btn-share-hover;
}
}
}
button {
padding: 0;
border: none;
line-height: inherit;
@extend %cursor-pointer;
}
} /* .share-icons */
} /* .share-wrapper */
}
.post-tail-bottom {
@include bp.lte(bp.get(sm)) {
flex-wrap: wrap-reverse !important;
> div:first-child {
width: 100%;
margin-top: 1rem;
}
}
}
.share-mastodon {
/* See: https://github.com/justinribeiro/share-to-mastodon#properties */
--wc-stm-font-family: #{v.$font-family-base};
--wc-stm-dialog-background-color: var(--card-bg);
--wc-stm-form-button-border: 1px solid var(--btn-border-color);
--wc-stm-form-submit-background-color: var(--sidebar-btn-bg);
--wc-stm-form-cancel-background-color: var(--sidebar-btn-bg);
--wc-stm-form-button-background-color-hover: #007bff;
--wc-stm-form-button-color-hover: white;
font-size: 1rem;
}
.post-tags {
line-height: 2rem;
.post-tag {
&:hover {
@extend %tag-hover;
}
}
}
.post-navigation {
@include bp.lt(bp.get(lg)) {
@include mx.pl-pr(0);
@include mx.ml-mr(-0.5rem);
}
.btn {
@extend %-btn-post-nav;
&:not(:hover) {
color: var(--link-color);
}
&:hover {
&:not(.disabled)::before {
color: whitesmoke;
}
}
&.disabled {
@extend %-btn-post-nav;
pointer-events: auto;
cursor: not-allowed;
background: none;
color: gray;
}
&.btn-outline-primary.disabled:focus {
box-shadow: none;
}
&::before {
color: var(--text-muted-color);
font-size: 0.65rem;
text-transform: uppercase;
content: attr(aria-label);
}
&:first-child {
border-radius: v.$radius-lg 0 0 v.$radius-lg;
left: 0.5px;
}
&:last-child {
border-radius: 0 v.$radius-lg v.$radius-lg 0;
right: 0.5px;
}
}
p {
font-size: 1.1rem;
line-height: 1.5rem;
margin-top: 0.3rem;
white-space: normal;
}
} /* .post-navigation */
@media (hover: hover) {
.post-navigation {
.btn,
.btn::before {
transition: all 0.35s ease-in-out;
}
}
}
@-webkit-keyframes fade-up {
from {
opacity: 0;
margin-top: 4rem;
}
to {
opacity: 1;
}
}
@keyframes fade-up {
from {
opacity: 0;
margin-top: 4rem;
}
to {
opacity: 1;
}
}
/* TOC panel */
%top-cover {
content: '';
display: block;
position: -webkit-sticky;
position: sticky;
top: 0;
width: 100%;
height: 3rem;
background: linear-gradient(var(--main-bg) 50%, transparent);
}
#toc-wrapper {
top: 0;
transition: top 0.2s ease-in-out;
overflow-y: auto;
max-height: 100vh;
scrollbar-width: none;
margin-top: 2rem;
&:not(.invisible) {
-webkit-animation: fade-up 0.8s;
animation: fade-up 0.8s;
}
ul {
list-style: none;
font-size: 0.85rem;
line-height: 1.25;
padding-left: 0;
li {
a {
padding: 0.4rem 0 0.4rem 1.25rem;
}
}
/* Overwrite TOC plugin style */
.toc-link {
display: block;
@extend %text-ellipsis;
&:hover {
color: var(--toc-highlight);
text-decoration: none;
}
&::before {
display: none;
}
}
.is-active-link {
color: var(--toc-highlight) !important;
font-weight: 600;
&::before {
display: inline-block;
width: 1px;
height: 1.25rem;
background-color: var(--toc-highlight) !important;
}
}
ul {
padding-left: 0.75rem;
}
}
@at-root .toc-border-cover {
@extend %top-cover;
margin-bottom: -4rem;
}
&::before {
@extend %top-cover;
}
&::after {
content: '';
position: fixed;
bottom: 0;
width: 15%;
height: 2.25rem;
margin-left: -1px;
background: linear-gradient(transparent, var(--main-bg) 70%);
}
> * {
@extend %panel-border;
}
}
/* --- TOC button, bar and popup in mobile/tablet --- */
#toc-bar {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1;
margin: 0 -1rem;
height: v.$topbar-height;
background: var(--main-bg);
border-bottom: 1px solid var(--main-border-color);
transition: all 0.2s ease-in-out;
@extend %btn-color;
@include bp.xl {
display: none !important;
}
.label {
@extend %heading;
margin-left: 0.375rem;
padding: 0 0.75rem;
color: inherit;
}
&.invisible {
top: -#{v.$topbar-height};
transition: none;
}
}
#toc-solo-trigger {
color: var(--text-muted-color);
border-color: var(--btn-border-color);
border-radius: v.$radius-lg;
@include bp.xl {
display: none !important;
}
.label {
font-size: 1rem;
font-family: v.$font-family-heading;
}
&:hover {
box-shadow: none;
background: none;
}
}
@mixin slide-in {
from {
opacity: 0.7;
transform: translateY(-#{v.$topbar-height});
}
to {
opacity: 1;
transform: translateY(0);
}
}
@mixin slide-out {
0% {
transform: translateY(0);
opacity: 1;
}
100% {
transform: translateY(-#{v.$topbar-height});
opacity: 0;
}
}
@-webkit-keyframes slide-in {
@include slide-in;
}
@keyframes slide-in {
@include slide-in;
}
@-webkit-keyframes slide-out {
@include slide-out;
}
@keyframes slide-out {
@include slide-out;
}
/* --- Related Posts --- */
#related-posts {
> h3 {
@include mx.label(1.1rem, 600);
}
time {
@extend %normal-font-style;
@extend %text-xs;
color: var(--text-muted-color);
}
p {
@extend %text-ellipsis;
font-size: 0.9rem;
margin-bottom: 0.5rem;
white-space: break-spaces;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.card {
h4 {
@extend %text-clip;
}
}
}
/* stylelint-disable-next-line selector-id-pattern */
#disqus_thread {
min-height: 8.5rem;
}
.utterances {
max-width: 100%;
min-height: 269px;
}
%btn-share-hover {
color: var(--btn-share-hover-color) !important;
}
.share-label {
@include mx.label(inherit, 400, inherit);
&::after {
content: ':';
}
}
.content > p > img {
@include bp.lte(bp.get(md)) {
max-width: calc(100% + 1rem);
}
}
h2,
h3,
h4 {
@include bp.xl {
scroll-margin-top: 2rem;
}
}
================================================
FILE: _sass/pages/_search.scss
================================================
@use '../abstracts/breakpoints' as bp;
@use '../abstracts/variables' as v;
@use '../abstracts/placeholders';
search {
display: flex;
width: 100%;
border-radius: 1rem;
border: 1px solid var(--search-border-color);
background: var(--main-bg);
padding: 0 0.5rem;
i {
z-index: 2;
font-size: 0.9rem;
color: var(--search-icon-color);
}
@include bp.lt(bp.get(lg)) {
display: none;
}
@include bp.lg {
max-width: v.$search-max-width;
}
@include bp.xl {
margin-right: 4rem;
}
@include bp.xxxl {
margin-right: calc(
v.$main-content-max-width / 4 - v.$search-max-width - 0.75rem
);
}
}
#search-result-wrapper {
display: none;
height: 100%;
width: 100%;
overflow: auto;
.content {
margin-top: 2rem;
}
@include bp.lt(bp.get(lg)) {
width: 100%;
.content {
letter-spacing: 0;
}
}
@include bp.lg {
max-width: v.$main-content-max-width;
justify-content: start !important;
}
}
#search-results {
padding-bottom: 3rem;
@include bp.between(bp.get(lg), calc(#{bp.get(xl)} - 1px)) {
> div {
max-width: 700px;
}
}
a {
font-size: 1.4rem;
line-height: 1.5rem;
&:hover {
@extend %link-hover;
}
@extend %link-color;
@extend %no-bottom-border;
@extend %heading;
}
> article {
width: 100%;
&:not(:last-child) {
margin-bottom: 1rem;
}
@include bp.xl {
width: 45%;
&:nth-child(odd) {
margin-right: 1.5rem;
}
&:nth-child(even) {
margin-left: 1.5rem;
}
&:last-child:nth-child(odd) {
position: relative;
right: 24.3%;
}
}
h2 {
line-height: 2.5rem;
}
/* icons */
i {
color: #818182;
margin-right: 0.15rem;
font-size: 80%;
}
> p {
@extend %text-ellipsis;
white-space: break-spaces;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
}
}
/* 'Cancel' link */
#search-cancel {
color: var(--link-color);
display: none;
white-space: nowrap;
@extend %cursor-pointer;
}
#search-input {
background: center;
border: 0;
border-radius: 0;
padding: 0.18rem 0.3rem;
color: var(--text-color);
height: auto;
&:focus {
box-shadow: none;
}
@include bp.xl {
transition: all 0.3s ease-in-out;
}
}
#search-hints {
padding: 0 1rem;
@include bp.lg {
display: none;
}
h4 {
margin-bottom: 1.5rem;
}
.post-tag {
display: inline-block;
line-height: 1rem;
font-size: 1rem;
background: var(--search-tag-bg);
border: none;
padding: 0.5rem;
margin: 0 1.25rem 1rem 0;
&::before {
content: '#';
color: var(--text-muted-color);
padding-right: 0.2rem;
}
@extend %link-color;
}
}
================================================
FILE: _sass/pages/_tags.scss
================================================
@use '../abstracts/breakpoints' as bp;
.tag {
border-radius: 0.7em;
padding: 6px 8px 7px;
margin-right: 0.8rem;
line-height: 3rem;
letter-spacing: 0;
border: 1px solid var(--tag-border) !important;
box-shadow: 0 0 3px 0 var(--tag-shadow);
span {
margin-left: 0.6em;
font-size: 0.7em;
font-family: Oswald, sans-serif;
}
}
#tags {
@include bp.lt(bp.get(lg)) {
justify-content: center !important;
}
}
================================================
FILE: _sass/themes/_dark.scss
================================================
@mixin styles {
color-scheme: dark;
/* Framework color */
--main-bg: rgb(27 27 30);
--mask-bg: rgb(68 69 70);
--main-border-color: rgb(44 45 45);
/* Common color */
--text-color: rgb(175 176 177);
--text-muted-color: #868686;
--text-muted-highlight-color: #aeaeae;
--heading-color: #cccccc;
--label-color: #a7a7a7;
--blockquote-border-color: rgb(66 66 66);
--blockquote-text-color: #868686;
--link-color: rgb(138 180 248);
--link-underline-color: rgb(82 108 150);
--button-bg: #1e1e1e;
--btn-border-color: #2e2f31;
--btn-backtotop-color: var(--text-color);
--btn-backtotop-border-color: #212122;
--card-header-bg: #292929;
--checkbox-color: rgb(118 120 121);
--checkbox-checked-color: var(--link-color);
--img-bg: radial-gradient(circle, rgb(22 22 24) 0%, rgb(32 32 32) 100%);
--shimmer-bg: linear-gradient(
90deg,
rgb(255 255 255 / 0%) 0%,
rgb(58 55 55 / 40%) 50%,
rgb(255 255 255 / 0%) 100%
);
/* Sidebar */
--site-title-color: #717070;
--site-subtitle-color: #868686;
--sidebar-bg: #1e1e1e;
--sidebar-border-color: #292929;
--sidebar-muted-color: #868686;
--sidebar-active-color: rgb(255 255 255 / 95%);
--sidebar-hover-bg: #262626;
--sidebar-btn-bg: #232328;
--sidebar-btn-color: #787878;
--avatar-border-color: rgb(206 206 206 / 90%);
/* Topbar */
--topbar-bg: rgb(27 27 30 / 64%);
--topbar-text-color: var(--text-color);
--search-border-color: rgb(55 55 55);
--search-icon-color: rgb(100 102 105);
--input-focus-border-color: rgb(112 114 115);
/* Home page */
--post-list-text-color: rgb(175 176 177);
--btn-patinator-text-color: var(--text-color);
--btn-paginator-hover-color: #2e2e2e;
/* Posts */
--toc-highlight: rgb(116 178 243);
--toc-popup-border-color: #373737;
--tag-hover: rgb(43 56 62);
--tb-odd-bg: #252526; /* odd rows of the posts' table */
--tb-even-bg: rgb(31 31 34); /* even rows of the posts' table */
--tb-border-color: var(--tb-odd-bg);
--footnote-target-bg: rgb(63 81 181);
--btn-share-color: #6c757d;
--btn-share-hover-color: #bfc1ca;
--card-bg: #1e1e1e;
--card-hover-bg: #464d51;
--card-shadow: rgb(21 21 21 / 72%) 0 6px 18px 0,
rgb(137 135 135 / 24%) 0 0 0 1px;
--kbd-wrap-color: #6a6a6a;
--kbd-text-color: #d3d3d3;
--kbd-bg-color: #242424;
--prompt-text-color: rgb(216 212 212 / 75%);
--prompt-tip-bg: rgb(22 60 36 / 64%);
--prompt-tip-icon-color: rgb(15 164 15 / 81%);
--prompt-info-bg: rgb(7 59 104 / 80%);
--prompt-info-icon-color: #0075d1;
--prompt-warning-bg: rgb(90 69 3 / 88%);
--prompt-warning-icon-color: rgb(255 165 0 / 80%);
--prompt-danger-bg: rgb(86 28 8 / 80%);
--prompt-danger-icon-color: #cd0202;
/* Tags */
--tag-border: rgb(59 79 88);
--tag-shadow: rgb(32 33 33);
--dash-color: rgb(63 65 68);
--search-tag-bg: #292828;
/* Categories */
--categories-border: rgb(64 66 69 / 50%);
--categories-hover-bg: rgb(73 75 76);
--categories-icon-hover-color: white;
/* Archive */
--timeline-node-bg: rgb(150 152 156);
--timeline-color: rgb(63 65 68);
--timeline-year-dot-color: var(--timeline-color);
/* Code highlight colors */
--language-border-color: #2d2d2d;
--highlight-bg-color: #151515;
--highlighter-rouge-color: #c9def1;
--highlight-lineno-color: #808080;
--inline-code-bg: rgb(255 255 255 / 5%);
--code-color: #b0b0b0;
--code-header-text-color: #6a6a6a;
--code-header-muted-color: #353535;
--code-header-icon-color: #565656;
--clipboard-checked-color: #2bcc2b;
--filepath-text-color: #cacaca;
.light {
display: none;
}
/* Categories */
.categories.card,
.list-group-item {
background-color: var(--card-bg);
}
.categories {
.card-header {
background-color: var(--card-header-bg);
}
.list-group-item {
border-left: none;
border-right: none;
padding-left: 2rem;
border-color: var(--categories-border);
&:last-child {
border-bottom-color: var(--card-bg);
}
}
}
#archives li:nth-child(odd) {
background-image: linear-gradient(
to left,
rgb(26 26 30),
rgb(39 39 45),
rgb(39 39 45),
rgb(39 39 45),
rgb(26 26 30)
);
}
/* stylelint-disable-next-line selector-id-pattern */
#disqus_thread {
color-scheme: none;
}
/* --- Syntax highlight theme from `rougify style base16.dark` --- */
.highlight .gp {
color: #87939d;
}
.highlight table td {
padding: 5px;
}
.highlight table pre {
margin: 0;
}
.highlight,
.highlight .w {
color: #d0d0d0;
background-color: #151515;
}
.highlight .err {
color: #151515;
background-color: #ac4142;
}
.highlight .c,
.highlight .ch,
.highlight .cd,
.highlight .cm,
.highlight .cpf,
.highlight .c1,
.highlight .cs {
color: #848484;
}
.highlight .cp {
color: #f4bf75;
}
.highlight .nt {
color: #f4bf75;
}
.highlight .o,
.highlight .ow {
color: #d0d0d0;
}
.highlight .p,
.highlight .pi {
color: #d0d0d0;
}
.highlight .gi {
color: #90a959;
}
.highlight .gd {
color: #f08a8b;
background-color: #320000;
}
.highlight .gh {
color: #6a9fb5;
background-color: #151515;
font-weight: bold;
}
.highlight .k,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kv {
color: #aa759f;
}
.highlight .kc {
color: #d28445;
}
.highlight .kt {
color: #d28445;
}
.highlight .kd {
color: #d28445;
}
.highlight .s,
.highlight .sb,
.highlight .sc,
.highlight .dl,
.highlight .sd,
.highlight .s2,
.highlight .sh,
.highlight .sx,
.highlight .s1 {
color: #90a959;
}
.highlight .sa {
color: #aa759f;
}
.highlight .sr {
color: #75b5aa;
}
.highlight .si {
color: #b76d45;
}
.highlight .se {
color: #b76d45;
}
.highlight .nn {
color: #f4bf75;
}
.highlight .nc {
color: #f4bf75;
}
.highlight .no {
color: #f4bf75;
}
.highlight .na {
color: #6a9fb5;
}
.highlight .m,
.highlight .mb,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .il,
.highlight .mo,
.highlight .mx {
color: #90a959;
}
.highlight .ss {
color: #90a959;
}
}
================================================
FILE: _sass/themes/_light.scss
================================================
@mixin styles {
/* Framework color */
--main-bg: white;
--mask-bg: #c1c3c5;
--main-border-color: #f3f3f3;
/* Common color */
--text-color: #34343c;
--text-muted-color: #757575;
--text-muted-highlight-color: inherit;
--heading-color: #2a2a2a;
--label-color: #585858;
--blockquote-border-color: #eeeeee;
--blockquote-text-color: #757575;
--link-color: #0056b2;
--link-underline-color: #dee2e6;
--button-bg: #ffffff;
--btn-border-color: #e9ecef;
--btn-backtotop-color: #686868;
--btn-backtotop-border-color: #f1f1f1;
--checkbox-color: #c5c5c5;
--checkbox-checked-color: #07a8f7;
--img-bg: radial-gradient(circle, rgb(255 255 255) 0%, rgb(239 239 239) 100%);
--shimmer-bg: linear-gradient(
90deg,
rgb(250 250 250 / 0%) 0%,
rgb(232 230 230 / 100%) 50%,
rgb(250 250 250 / 0%) 100%
);
/* Sidebar */
--site-title-color: rgb(113 113 113);
--site-subtitle-color: #717171;
--sidebar-bg: #f6f8fa;
--sidebar-border-color: #efefef;
--sidebar-muted-color: #545454;
--sidebar-active-color: #1d1d1d;
--sidebar-hover-bg: rgb(223 233 241 / 64%);
--sidebar-btn-bg: white;
--sidebar-btn-color: #8e8e8e;
--avatar-border-color: white;
/* Topbar */
--topbar-bg: rgb(255 255 255 / 70%);
--topbar-text-color: rgb(78 78 78);
--search-border-color: rgb(240 240 240);
--search-icon-color: #c2c6cc;
--input-focus-border-color: #b8b8b8;
/* Home page */
--post-list-text-color: dimgray;
--btn-patinator-text-color: #555555;
--btn-paginator-hover-color: var(--sidebar-bg);
/* Posts */
--toc-highlight: #0550ae;
--toc-popup-border-color: lightgray;
--btn-share-color: gray;
--btn-share-hover-color: #0d6efd;
--card-bg: white;
--card-hover-bg: #e2e2e2;
--card-shadow: rgb(104 104 104 / 5%) 0 2px 6px 0,
rgb(211 209 209 / 15%) 0 0 0 1px;
--footnote-target-bg: lightcyan;
--tb-odd-bg: #fbfcfd;
--tb-border-color: #eaeaea;
--dash-color: silver;
--kbd-wrap-color: #bdbdbd;
--kbd-text-color: var(--text-color);
--kbd-bg-color: white;
--prompt-text-color: rgb(46 46 46 / 77%);
--prompt-tip-bg: rgb(123 247 144 / 20%);
--prompt-tip-icon-color: #03b303;
--prompt-info-bg: #e1f5fe;
--prompt-info-icon-color: #0070cb;
--prompt-warning-bg: rgb(255 243 205);
--prompt-warning-icon-color: #ef9c03;
--prompt-danger-bg: rgb(248 215 218 / 56%);
--prompt-danger-icon-color: #df3c30;
/* Tags */
--tag-border: #dee2e6;
--tag-shadow: var(--btn-border-color);
--tag-hover: rgb(222 226 230);
--search-tag-bg: #f8f9fa;
/* Categories */
--categories-border: rgb(0 0 0 / 12.5%);
--categories-hover-bg: var(--btn-border-color);
--categories-icon-hover-color: darkslategray;
/* Archive */
--timeline-color: rgb(0 0 0 / 7.5%);
--timeline-node-bg: #c2c6cc;
--timeline-year-dot-color: #ffffff;
/* --- Custom code light mode colors --- */
--language-border-color: #ececec;
--highlight-bg-color: #f6f8fa;
--highlighter-rouge-color: #3f596f;
--highlight-lineno-color: #9e9e9e;
--inline-code-bg: rgb(25 25 28 / 5%);
--code-color: #3a3a3a;
--code-header-text-color: #a3a3a3;
--code-header-muted-color: #e5e5e5;
--code-header-icon-color: #c9c8c8;
--clipboard-checked-color: #43c743;
[class^='prompt-'] {
--link-underline-color: rgb(219 216 216);
}
.dark {
display: none;
}
/* --- Syntax highlight theme from `rougify style github` --- */
.highlight table td {
padding: 5px;
}
.highlight table pre {
margin: 0;
}
.highlight,
.highlight .w {
color: #24292f;
background-color: #f6f8fa;
}
.highlight .k,
.highlight .kd,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kt,
.highlight .kv {
color: #cf222e;
}
.highlight .gr {
color: #f6f8fa;
}
.highlight .gd {
color: #82071e;
background-color: #ffebe9;
}
.highlight .nb {
color: #953800;
}
.highlight .nc {
color: #953800;
}
.highlight .no {
color: #953800;
}
.highlight .nn {
color: #953800;
}
.highlight .sr {
color: #116329;
}
.highlight .na {
color: #116329;
}
.highlight .nt {
color: #116329;
}
.highlight .gi {
color: #116329;
background-color: #dafbe1;
}
.highlight .kc {
color: #0550ae;
}
.highlight .l,
.highlight .ld,
.highlight .m,
.highlight .mb,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .il,
.highlight .mo,
.highlight .mx {
color: #0550ae;
}
.highlight .sb {
color: #0550ae;
}
.highlight .bp {
color: #0550ae;
}
.highlight .ne {
color: #0550ae;
}
.highlight .nl {
color: #0550ae;
}
.highlight .py {
color: #0550ae;
}
.highlight .nv,
.highlight .vc,
.highlight .vg,
.highlight .vi,
.highlight .vm {
color: #0550ae;
}
.highlight .o,
.highlight .ow {
color: #0550ae;
}
.highlight .gh {
color: #0550ae;
font-weight: bold;
}
.highlight .gu {
color: #0550ae;
font-weight: bold;
}
.highlight .s,
.highlight .sa,
.highlight .sc,
.highlight .dl,
.highlight .sd,
.highlight .s2,
.highlight .se,
.highlight .sh,
.highlight .sx,
.highlight .s1,
.highlight .ss {
color: #0a3069;
}
.highlight .nd {
color: #8250df;
}
.highlight .nf,
.highlight .fm {
color: #8250df;
}
.highlight .err {
color: #f6f8fa;
background-color: #82071e;
}
.highlight .c,
.highlight .ch,
.highlight .cd,
.highlight .cm,
.highlight .cp,
.highlight .cpf,
.highlight .c1,
.highlight .cs {
color: #68717a;
}
.highlight .gl {
color: #68717a;
}
.highlight .gt {
color: #68717a;
}
.highlight .ni {
color: #24292f;
}
.highlight .si {
color: #24292f;
}
.highlight .ge {
color: #24292f;
font-style: italic;
}
.highlight .gs {
color: #24292f;
font-weight: bold;
}
}
================================================
FILE: _tabs/about.md
================================================
---
# the default layout is 'page'
icon: fas fa-info-circle
order: 4
---
> Add Markdown syntax content to file `_tabs/about.md`{: .filepath } and it will show up on this page.
{: .prompt-tip }
================================================
FILE: _tabs/archives.md
================================================
---
layout: archives
icon: fas fa-archive
order: 3
---
================================================
FILE: _tabs/categories.md
================================================
---
layout: categories
icon: fas fa-stream
order: 1
---
================================================
FILE: _tabs/tags.md
================================================
---
layout: tags
icon: fas fa-tags
order: 2
---
================================================
FILE: assets/404.html
================================================
---
layout: page
title: "404: Page not found"
permalink: /404.html
---
{% include lang.html %}
{{ site.data.locales[lang].not_found.statement }}
================================================
FILE: assets/css/jekyll-theme-chirpy.scss
================================================
---
---
/* prettier-ignore */
@use 'main
{%- if jekyll.environment == 'production' -%}
.bundle
{%- endif -%}
';
/* append your custom style below */
================================================
FILE: assets/feed.xml
================================================
---
layout: compress
permalink: /feed.xml
# Atom Feed, reference: https://validator.w3.org/feed/docs/atom.html
---
{% capture source %}
{{ "/" | absolute_url }}
{{ site.title }}
{{ site.description }}
{{ site.time | date_to_xmlschema }}
{{ site.social.name }}
{{ "/" | absolute_url }}
Jekyll
© {{ 'now' | date: '%Y' }} {{ site.social.name }}
{{ site.baseurl }}/assets/img/favicons/favicon.ico
{{ site.baseurl }}/assets/img/favicons/favicon-96x96.png
{% for post in site.posts limit: 5 %}
{% assign post_absolute_url = post.url | absolute_url %}
{{ post.title }}
{{ post.date | date_to_xmlschema }}
{% if post.last_modified_at %}
{{ post.last_modified_at | date_to_xmlschema }}
{% else %}
{{ post.date | date_to_xmlschema }}
{% endif %}
{{ post_absolute_url }}
{{ post.author | default: site.social.name }}
{% if post.categories %}
{% for category in post.categories %}
{% endfor %}
{% endif %}
{% include post-summary.html max_length=400 %}
{% endfor %}
{% endcapture %}
{{ source | replace: '&', '&' }}
================================================
FILE: assets/img/favicons/site.webmanifest
================================================
---
layout: compress
---
{% assign favicon_path = "/assets/img/favicons" | relative_url %}
{
"name": "{{ site.title }}",
"short_name": "{{ site.title }}",
"description": "{{ site.description }}",
"icons": [
{
"src": "{{ favicon_path }}/web-app-manifest-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "{{ favicon_path }}/web-app-manifest-512x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
],
"start_url": "{{ '/index.html' | relative_url }}",
"theme_color": "#2a1e6b",
"background_color": "#ffffff",
"display": "fullscreen"
}
================================================
FILE: assets/js/data/mathjax.js
================================================
---
layout: compress
# WARNING: Don't use '//' to comment out code, use '{% comment %}' and '{% endcomment %}' instead.
---
{%- comment -%}
See:
{%- endcomment -%}
MathJax = {
tex: {
{%- comment -%} start/end delimiter pairs for in-line math {%- endcomment -%}
inlineMath: [
['$', '$'],
['\\(', '\\)']
],
{%- comment -%} start/end delimiter pairs for display math {%- endcomment -%}
displayMath: [
['$$', '$$'],
['\\[', '\\]']
],
{%- comment -%} equation numbering {%- endcomment -%}
tags: 'ams'
}
};
================================================
FILE: assets/js/data/search.json
================================================
---
layout: compress
swcache: true
---
[
{% for post in site.posts %}
{
"title": {{ post.title | jsonify }},
"url": {{ post.url | relative_url | jsonify }},
"categories": {{ post.categories | join: ', ' | jsonify }},
"tags": {{ post.tags | join: ', ' | jsonify }},
"date": {{ post.date | jsonify }},
{% capture content -%}{% include post-summary.html full_text=true %}{%- endcapture -%}
"content": {{ content | jsonify }}
}{% unless forloop.last %},{% endunless %}
{% endfor %}
]
================================================
FILE: assets/js/data/swconf.js
================================================
---
layout: compress
permalink: '/:path/swconf.js'
# Note that this file will be fetched by the ServiceWorker, so it will not be cached.
---
const swconf = {
{% if site.pwa.cache.enabled %}
cacheName: 'chirpy-{{ "now" | date: "%s" }}',
{%- comment -%} Resources added to the cache during PWA installation. {%- endcomment -%}
resources: [
'{{ "/assets/css/:THEME.css" | replace: ':THEME', site.theme | relative_url }}',
'{{ "/" | relative_url }}',
{% for tab in site.tabs %}
'{{- tab.url | relative_url -}}',
{% endfor %}
{% assign cache_list = site.static_files | where: 'swcache', true %}
{% for file in cache_list %}
'{{ file.path | relative_url }}'{%- unless forloop.last -%},{%- endunless -%}
{% endfor %}
],
interceptor: {
{%- comment -%} URLs containing the following paths will not be cached. {%- endcomment -%}
paths: [
{% for path in site.pwa.cache.deny_paths %}
{% unless path == empty %}
'{{ path | relative_url }}'{%- unless forloop.last -%},{%- endunless -%}
{% endunless %}
{% endfor %}
],
{%- comment -%} URLs containing the following prefixes will not be cached. {%- endcomment -%}
urlPrefixes: [
{% if site.analytics.goatcounter.id != nil and site.pageviews.provider == 'goatcounter' %}
'https://{{ site.analytics.goatcounter.id }}.goatcounter.com/counter/'
{% endif %}
]
},
purge: false
{% else %}
purge: true
{% endif %}
};
================================================
FILE: assets/robots.txt
================================================
---
permalink: /robots.txt
# The robots rules
---
User-agent: *
Disallow: /norobots/
Sitemap: {{ '/sitemap.xml' | absolute_url }}
================================================
FILE: docs/CHANGELOG.md
================================================
# Changelog
## [7.5.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.4.1...v7.5.0) (2026-03-15)
### Features
* add support for `fediverse:creator` meta tag ([#2593](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2593)) ([d2db439](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d2db439c169c45ac683fa1c8157c6ea7e0b54b85))
### Bug Fixes
* **i18n:** localize the title ([#2610](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2610)) ([52d160f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/52d160f8574e8d0cddcaa46af114eb382fea1644))
## [7.4.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.4.0...v7.4.1) (2025-10-26)
### Bug Fixes
* avoid duplicate base URL for homepage preview images ([#2568](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2568)) ([66bf232](https://github.com/cotes2020/jekyll-theme-chirpy/commit/66bf232951fbe752821b623dc1e7e4e2824c15bf))
## [7.4.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.3.1...v7.4.0) (2025-10-19)
### Features
* add support for embed spotify ([#2515](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2515)) ([cda62e2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/cda62e28d1b71ce4018301aacf93532230aa2b3b))
* **i18n:** add Danish locale ([#2410](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2410)) ([f5802b8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f5802b8a8a4fb94cd51a484e438f6ba2ba8d62c9))
* **i18n:** add locale files for some rtl languages ([#2415](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2415)) ([18c48b4](https://github.com/cotes2020/jekyll-theme-chirpy/commit/18c48b4c49f896eeeeb52a8de1dca715add70c6a))
### Bug Fixes
* avoid unconfigured social options in sidebar ([#2507](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2507)) ([5f8ec7f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5f8ec7ffd3b23998bad48c110e809576fe5daf80))
* correct GoatCounter pageviews extraction ([#2420](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2420)) ([c706799](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c706799f9b2e724dee9a3b891dea72dfa587929e))
* resolve discrepancy in lqip between post and main page ([#2453](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2453)) ([1bac96a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1bac96a8e1ae23a7a48f2b7d249bfbfd5d9bfe50))
* restore blurry animation for homepage LQIP ([#2551](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2551)) ([221ca9f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/221ca9f52b55b103900832f3c03ad2ecc4415bcc))
* **search:** restore full-text search for posts with description ([#2557](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2557)) ([604528e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/604528e3ce11ec0278e83f41105ed5949362bb54))
## [7.3.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.3.0...v7.3.1) (2025-07-26)
### Bug Fixes
* escape special JSON characters in search results ([#2481](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2481)) ([7615d72](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7615d72e9300a1514ef2fc8ec941ab2974ba7eb4))
## [7.3.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.2.4...v7.3.0) (2025-05-18)
### Features
* **i18n:** add Catalan Spanish locale translation ([#2349](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2349)) ([167c98c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/167c98c781d0607c90ede8fc73eb43dffeea6abd))
* **i18n:** add Dutch locale ([#2076](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2076)) ([981ddba](https://github.com/cotes2020/jekyll-theme-chirpy/commit/981ddba30e57934f9056b8d468f0d17db131e1e8))
* **i18n:** add Japanese locale ([#2295](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2295)) ([571c90f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/571c90f13011eb91d0e1392218f3953060b920c9))
* **i18n:** add persian language ([#2238](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2238)) ([7d4d35c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7d4d35cd10109e78d60fbb6b25a9b205f780ad63))
### Bug Fixes
* avoid `mathjax` loading failure on page refresh ([#2389](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2389)) ([401e2af](https://github.com/cotes2020/jekyll-theme-chirpy/commit/401e2af0f8a173d8437e03027c7aff558e8c0bde))
* improve accuracy of moving `img` element classes ([#2399](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2399)) ([d0f8f95](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d0f8f9553e41536eb84ae2fdd3f3bc9d13f7ef8c))
* prevent the search bar from moving when focused ([#2336](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2336)) ([f744929](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f7449299e88c71da2104f0007f2db23a8fa798be))
* recognize global theme mode ([#2357](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2357)) ([7708adb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7708adbf30e6dea51a84311b86bc224739f656f6))
* **search:** avoid missing spaces between paragraphs in search results ([#2199](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2199)) ([0eb7efa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0eb7efa7f53508bf6b48eb9d773d5c5047c3c525))
* **ui:** fix incomplete border color on hover for tags ([#2359](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2359)) ([c626447](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c62644759cb4e0e07f7ee6eb9503ef69be62371b))
### Improvements
* **seo:** improve accessibility and aligns with best practices ([#2289](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2289)) ([54d4d59](https://github.com/cotes2020/jekyll-theme-chirpy/commit/54d4d59d22ac543a14bfbd9bb3d6fb6756056041))
## [7.2.4](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.2.3...v7.2.4) (2024-12-21)
### Bug Fixes
* toc not visible when switching from mobile to desktop mode ([#2139](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2139)) ([32051da](https://github.com/cotes2020/jekyll-theme-chirpy/commit/32051dad03cb8f60fa4206969377b9674f9a3f0c))
* **ui:** left borderline of TOC is notched ([#2140](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2140)) ([8a4d0bc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8a4d0bc4ee9e142a11401cad80bc9605878f121d))
## [7.2.3](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.2.2...v7.2.3) (2024-12-15)
### Bug Fixes
* refreshing mermaid theme may fail ([#2113](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2113)) ([2f00d41](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2f00d41861f1b06c2ff7fa4e67e14e647c3c34b0))
* **ui:** gap between TOC entries is inconsistent ([#2119](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2119)) ([1b4e318](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1b4e318dc1cd57da812e11bf69ebb06083c213fc))
* **ui:** slow script loading hides TOC fade-up effect in desktop ([#2120](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2120)) ([e0c3faf](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e0c3fafa470eb12bd04ffdf198018bc28b6de20d))
## [7.2.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.2.1...v7.2.2) (2024-12-06)
### Bug Fixes
* js files in subdirectories are excluded from the site output ([#2101](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2101)) ([f55cc31](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f55cc31dbd0e7455328c80c7ef38186ad8e54099))
## [7.2.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.2.0...v7.2.1) (2024-12-05)
### Bug Fixes
* **build:** exclude `purgecss.js` from output files ([#2090](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2090)) ([976e1a1](https://github.com/cotes2020/jekyll-theme-chirpy/commit/976e1a184b3dbe08991e8a50db4d5d7f8a0b7090))
* correct the import condition for theme script ([#2075](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2075)) ([a16aa7d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/a16aa7d41e3c3cb28649bfa1361e8bcb91b9ca47))
* ensure pageviews are fetched after DOM is loaded ([#2071](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2071)) ([b4019f3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b4019f3517e4a3284df51567d29938cb12bf3acc))
* **toc:** resume fade up animation in desktop mode ([#2085](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2085)) ([8280adb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8280adb901b9d15cc1bc18009553aae8746121d8))
## [7.2.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.1.1...v7.2.0) (2024-11-28)
### Features
* show toc on mobile screens ([#1964](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1964)) ([8a064a5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8a064a5e5a95cd22aa654f7c80da09d107262508))
* support vertical scrolling for toc in desktop mode ([#2064](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2064)) ([5265b03](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5265b039741555943f9a6f0451287aefb6810f28))
### Bug Fixes
* pagination error when pinned posts exceed the page size ([#1965](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1965)) ([93f616b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/93f616b25d7ed6c4f090c50c8663f8c1f59947f4))
### Improvements
* modular sass architecture ([#2052](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2052)) ([35c794c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/35c794cf5896565430389f35c660b88a93cebb17))
* speed up page rendering and jekyll build process ([#2034](https://github.com/cotes2020/jekyll-theme-chirpy/issues/2034)) ([65f960c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/65f960c31a734b5306a8b919040c3aae9b783efd))
## [7.1.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.1.0...v7.1.1) (2024-09-23)
### Bug Fixes
* **i18n:** correct fr-FR translations ([#1949](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1949)) ([367262e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/367262e74d1005bddf1328bb2b3a2b9e152c0086))
* **pwa:** site baseurl not passed to `app.js` ([#1955](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1955)) ([5a63244](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5a63244721d21b1ad3a0ae83420723a2f0379e8b))
## [7.1.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.0.1...v7.1.0) (2024-08-27)
### Features
* add Bluesky social links ([#1759](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1759)) ([0102aba](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0102abae062be24ec289fb7facb11950aca79e3f))
* add Reddit social option ([#1836](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1836)) ([8673e13](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8673e1335f0771eac364d0a2866f27476d61a58b))
* add Threads social links ([#1837](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1837)) ([e3a78b6](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e3a78b6243f7056105d72185bb6e94b436834e5b))
* **analytics:** add fathom analytics ([#1913](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1913)) ([befc4ce](https://github.com/cotes2020/jekyll-theme-chirpy/commit/befc4ce9c5026f67f99bce66e223d056229f0bdb))
* **dev:** add vscode tasks ([#1843](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1843)) ([e4db1a1](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e4db1a176f3f69f676cbc0bf27b1d5a657ece05e))
* **dev:** support vscode dev-container ([#1781](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1781)) ([1e3d4a6](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1e3d4a6323ba3eed06a57f8bf1b2edefd890b127))
* **ui:** improve block quote layout ([80bd792](https://github.com/cotes2020/jekyll-theme-chirpy/commit/80bd7928a02c75c843a550bd377d11b574e8bfda))
* **ui:** improve visibility of inline code ([#1831](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1831)) ([c876731](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c876731901784a72ef9d2e9e2936df65ddff5f61))
* **ui:** make `info-prompt` icon looks like the letter "i" ([#1835](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1835)) ([a07a57e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/a07a57ec922249d3a22da56fbcb30d83eadef728))
* **ui:** set `` font to 'Lato' ([64c7262](https://github.com/cotes2020/jekyll-theme-chirpy/commit/64c7262245e878534971a2e3a2630b614daf72f3))
### Bug Fixes
* adapt the giscus localization parameter ([#1810](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1810)) ([0709854](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0709854dc8f6099d38c2578967a02f73b4be0dc8))
* avoid caching pageviews data ([#1849](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1849)) ([979f86c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/979f86cf64e1fcace4231fb070c7e6398fd4e5ec))
* remove extra dual-mode images from lightbox ([#1883](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1883)) ([5c5910f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5c5910f1fc661ec3dce203ac961c7f64f1991895))
## [7.0.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v7.0.0...v7.0.1) (2024-05-18)
### Bug Fixes
* **analytics:** goatcounter pv greater than 1K cannot be converted to numbers ([#1762](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1762)) ([33a1fa7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/33a1fa7cae2181625e2f335708d59de4dd20ee7d))
* audio/video path apply variable `media_subpath` ([#1745](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1745)) ([00a27a1](https://github.com/cotes2020/jekyll-theme-chirpy/commit/00a27a1b85f665d0642b77babd54c6903fbdeb22))
## [7.0.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.5...v7.0.0) (2024-05-11)
### ⚠ BREAKING CHANGES
* optimize the resource hints (#1717)
* rename media-url file and related parameters (#1651)
* rename comment setting parameter (#1563)
* **analytics:** add post pageviews for GoatCounter (#1543)
### Features
* add cloudflare web analytics ([#1723](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1723)) ([c17fba4](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c17fba44f53767c9dfaa8d92cfc6e275e5977f8a))
* add support for embed video files ([#1558](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1558)) ([9592146](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9592146ca392236e69ee358412ecc32ef1662127))
* add support for giscus strict title matching ([#1614](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1614)) ([700fd5b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/700fd5bad7272dd950f861e8550215cd8fafb413))
* **analytics:** add post pageviews for GoatCounter ([#1543](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1543)) ([b641b3f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b641b3f1f2e54bcfe96d8dff46d4f94186492d98))
* **analytics:** add Umami and Matomo tracking codes ([#1658](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1658)) ([61bdca2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/61bdca2db45179cd0d1b4b885a4c4864e3ffa3c1))
* change site verification settings ([#1561](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1561)) ([e436387](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e4363871b5be0608d2b92b8aff482825a8044c1b))
* **deps:** move `MathJax` configuration to a separate file ([#1670](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1670)) ([44f552c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/44f552cbcee83d037de0e59496bf6bb19eea2691))
* display theme version in footer ([#1611](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1611)) ([8349314](https://github.com/cotes2020/jekyll-theme-chirpy/commit/834931486dc3e5ed544ce4ff47cd1b2bc45f42fd))
* **i18n:** allow `page.lang` to override `site.lang` ([#1586](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1586)) ([547b95c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/547b95cc7ae35018dadcc01b6eb1dc8c8943e67e))
* make post description customizable ([#1602](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1602)) ([f865336](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f865336c896e0db34edf8482a53e0e5d8f07ff95))
* **media:** support audio and video tag with multi sources ([#1618](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1618)) ([23be416](https://github.com/cotes2020/jekyll-theme-chirpy/commit/23be4162b3f8598db14dc5b39726932ccf2cdc23))
### Bug Fixes
* make TOC title and entries visible at the same time ([#1711](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1711)) ([e0950fc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e0950fc973d029dc65d0bc1bd68f3d11242527c8))
* mode toggle not outlined when receiving keyboard focus ([#1690](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1690)) ([cd37f63](https://github.com/cotes2020/jekyll-theme-chirpy/commit/cd37f63a0144e0499ea991d3309da064ad5eccea))
* prevent footnote back arrow from becoming an emoji ([#1716](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1716)) ([8608147](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8608147fb5037804695d93496c62f96b9c41e9cd))
* **pwa:** skip range requests in service worker ([#1672](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1672)) ([76d58fe](https://github.com/cotes2020/jekyll-theme-chirpy/commit/76d58fe0ffdc4bd1df35b60815e97560c3564700))
* search result prompt is empty ([#1583](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1583)) ([8a2afae](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8a2afae6cab8fc9639be0a866b71699c8a80084c))
* use `https` for Weibo sharing URL ([#1612](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1612)) ([8e5fbb7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8e5fbb7a74d04a4b3cdde69bcc821f8ccd1a3bc0))
### Improvements
* improve \
visibility in dark mode ([#1565](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1565)) ([4ddd5c4](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4ddd5c437046a1e70cf396113e2351c452a25493))
* lean bootstrap javascript ([#1734](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1734)) ([ddb48ed](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ddb48eda52827aae16aff720212d7b6d2d8647f9))
* rename comment setting parameter ([#1563](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1563)) ([f8390d4](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f8390d4384600fb015728b1b186570fa58ca216f))
* replace jQuery with Vanilla JS ([#1681](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1681)) ([fe7afa3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/fe7afa379f0af0ca98a207f85bdc0fa98575b1ad))
* simplify mode toggle script ([#1692](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1692)) ([d4a6d64](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d4a6d640bd6d4ab185faf96c0255369a9903ee1d))
* tree shaking Bootstrap CSS ([#1736](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1736)) ([363a3d9](https://github.com/cotes2020/jekyll-theme-chirpy/commit/363a3d936bbd688fa4f28527e85ef7dd3fe3a79b))
### Changes
* optimize the resource hints ([#1717](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1717)) ([dcb0add](https://github.com/cotes2020/jekyll-theme-chirpy/commit/dcb0add47bf1adf92215514f1ccfa4661d5215be))
* rename media-url file and related parameters ([#1651](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1651)) ([9f8aeaa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9f8aeaadbfef9967a9b0a9dd323d8bed46e14d9f))
## [6.5.5](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.4...v6.5.5) (2024-03-23)
### Bug Fixes
* **post:** correct the image URLs ([#1627](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1627)) ([2d649aa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2d649aae0e40a24db1ab0d46fa474294e96cb135))
## [6.5.4](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.3...v6.5.4) (2024-03-22)
### Bug Fixes
* correct the attribute for the Twitter social image ([#1615](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1615)) ([cfe44f2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/cfe44f204bcec8e05f498512ec50878e626a124f))
* **seo:** correct social preview image path inside `` tag ([#1623](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1623)) ([74cf57a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/74cf57aaacf6674057e6f33240a22f4888cfe88f))
## [6.5.3](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.2...v6.5.3) (2024-03-07)
### Changes
* replace `polyfill.io` with `cdnjs` hosted link ([#1598](https://github.com/cotes2020/jekyll-theme-chirpy/pull/1598)) ([75a3d73](https://github.com/cotes2020/jekyll-theme-chirpy/commit/75a3d7399b257256a09d602cbe01062fe1cdf68d))
## [6.5.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.1...v6.5.2) (2024-02-29)
### Bug Fixes
* correct the base URL parameter name ([#1576](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1576)) ([19d6baf](https://github.com/cotes2020/jekyll-theme-chirpy/commit/19d6bafbe1a60614e0d63b961bc73c342a9f6f33)), closes [#1553](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1553)
## [6.5.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.5.0...v6.5.1) (2024-02-26)
### Bug Fixes
* correct the generation of relative resource paths ([#1553](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1553)) ([89b9625](https://github.com/cotes2020/jekyll-theme-chirpy/commit/89b962557a56ccc13eba3c9c20b4270ee9d30042))
## [6.5.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.4.2...v6.5.0) (2024-02-14)
### Features
* add `pwa.cache.*` option to precisely control caching ([#1501](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1501)) ([1127c43](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1127c43823aac4db7fd80d5bb706ae7b1e129dc6))
* add analytics support for GoatCounter ([#1526](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1526)) ([90693ff](https://github.com/cotes2020/jekyll-theme-chirpy/commit/90693ff95e72ca4b5135a7b454a6ab521b995b3e))
### Bug Fixes
* correct the Twitter Card in social share preview ([#1498](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1498)) ([74f1662](https://github.com/cotes2020/jekyll-theme-chirpy/commit/74f16623c9c4877ef36ac52e8b69c19d1d9a82ba))
* missing "/" at the end of URLs for categories and tags in breadcrumb ([#1495](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1495)) ([02e296e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/02e296ed75b7906b2d112c67f9054f5d71919de9))
### Improvements
* allow no social links to be configured ([#1494](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1494)) ([4facf5b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4facf5b390eeba612ca439f3354c5d2d881aac56))
* allow TOC to start at heading 3 ([#1512](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1512)) ([bbbb66b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bbbb66b489a3bf2b878947336fe894e8ea2ae3f5))
* enable equation numbering in MathJax ([#1520](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1520)) ([c13ec31](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c13ec311636d5e057c6895e353e1c1a4e570f582))
## [6.4.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.4.1...v6.4.2) (2024-01-13)
### Bug Fixes
* resume the `blockquote` display type ([#1480](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1480)) ([c7cfde0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c7cfde093020c73ca9a1b83437eb600379e05918)), closes [#1449](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1449)
## [6.4.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.4.0...v6.4.1) (2024-01-10)
### Bug Fixes
* `og:image` URL is incorrect ([#1468](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1468)) ([b2d1cb6](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b2d1cb68db659270aac537d2aa8d4b806fa6991d)), closes [#1463](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1463)
## [6.4.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.3.1...v6.4.0) (2024-01-10)
### Features
* add bilibili embed video support ([#1406](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1406)) ([4a2b89d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4a2b89d0b698d672486349131a89025fa47afcb6))
* add site-wide social preview image settings ([#1463](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1463)) ([241bb4d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/241bb4df7878cff7f82014df660874a1dcddba76))
### Bug Fixes
* image float breaks quotes and prompts ([#1449](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1449)) ([ea2d238](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ea2d238bd8adc018256862e05a5092311c87a671)), closes [#1441](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1441)
* url-less authors should not have empty links ([#1410](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1410)) ([2a4fbf6](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2a4fbf6a7925da610a75c498116da7cf9ba857d7)), closes [#1403](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1403)
### Improvements
* include the latest posts in the "Recently Updated" list ([#1456](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1456)) ([82d8f2d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/82d8f2db984711f334f55b6af5098ec16770e824))
## [6.3.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.3.0...v6.3.1) (2023-11-12)
### Bug Fixes
* **home:** responsive gap at the bottom of preview image ([1a977a8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1a977a87a0da1cff35d0896cf9265c31034841a6))
## [6.3.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.2.3...v6.3.0) (2023-11-10)
### Features
* add Mastodon sharing link ([#1344](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1344)) ([2bf87e0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2bf87e0de7928f325811e1bb96cfcaefdf6cf66a)), closes [#1324](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1324)
### Bug Fixes
* **home:** crop the preview image that doesn't match 1.91:1 ([#1325](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1325)) ([5810bcd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5810bcd1d7b83e111017831fa82c368a6b15c7cd))
* resume lazy loading for Twitch videos ([#1326](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1326)) ([9f174d9](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9f174d9088e5c83a5e0c4630336cea65e199c553)), closes [#1267](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1267)
## [6.2.3](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.2.2...v6.2.3) (2023-10-10)
### Bug Fixes
* avoid `utterances` initialization failure ([#1234](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1234)) ([b34661e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b34661efd72e8697fd5b30ba7e55c86c7dd10338))
* **home:** avoid LQIP dirty data passing to the next post ([#1278](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1278)) ([109725d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/109725d2dc56e329c60a876e9ce4094513fd36a5))
* **posts:** code snippet clipboard tooltip missing title ([#1246](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1246)) ([726085c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/726085c6478e7a9dc2cc57189b2dcbc85d90f048))
* **posts:** resume target highlighting for superscripts and footnotes ([#1253](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1253)) ([0465a98](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0465a985dc5262fa2043540f4eddafa251f917a3))
### Improvements
* **comments:** lazy load `giscus` ([#1254](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1254)) ([e9c9206](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e9c920641b9c97594fa078ea89747d77eb7e7493))
* **core:** replace `lazysizes` with browser-level lazy loading ([#1267](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1267)) ([bf3a34d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bf3a34d0544b49fcf40f57080c4d6b4ff44750c4))
* **layout:** improve margins for tail block ([#1243](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1243)) ([13a3c3c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/13a3c3c906bb6c5a38314ea27b6cf3767df94b27))
* **layout:** optimize the main block height calculation ([#1249](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1249)) ([73e171b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/73e171b0fbce4a542e2141d7e2b1144450571ce1))
* **pwa:** enhance cache privacy protection ([#1275](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1275)) ([2d56597](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2d56597571aaafa92251d192861ea69cce3e83d2))
* **ui:** standardize metadata text styles ([#1295](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1295)) ([2574118](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2574118f40a956184705f87dea4d88e7c246a055))
* **ux:** render background color before loading preview image ([#1298](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1298)) ([42bf39e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/42bf39e21c9a497aecc3e9b4549e2fc3ba4a1e4a))
## [6.2.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.2.1...v6.2.2) (2023-09-10)
### Bug Fixes
* **sidebar:** contact icons not stacking ([#1224](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1224)) ([273b389](https://github.com/cotes2020/jekyll-theme-chirpy/commit/273b389c512f13693ed6cdf57d256ac21deae97c))
## [6.2.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.2.0...v6.2.1) (2023-09-10)
### Bug Fixes
* **pwa:** installation failure caused by outdated cache entries ([4da7406](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4da7406dfea112a4a2b1db5615ecf2672be6694f))
## [6.2.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.1.0...v6.2.0) (2023-09-10)
### Features
* **layout:** center the footer ([41b8f9f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/41b8f9f519e5f5f69e9a123b38b06bade2271a82))
* **posts:** render heading 4 in TOC ([#1023](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1023)) ([229c2a2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/229c2a2e2b109fc2eca85be548f1dd97234e44c4))
* **ui:** redesign the pagination button on home page ([62bcd60](https://github.com/cotes2020/jekyll-theme-chirpy/commit/62bcd601fcadc602c81672b1d4b937231396c3c0))
* **ui:** update the twitter icon ([#1221](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1221)) ([aff7566](https://github.com/cotes2020/jekyll-theme-chirpy/commit/aff75667749769644f990d3dc9b0720c7d96d14d))
### Improvements
* **core:** speed up the Jekyll build times ([#1163](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1163)) ([0d4103d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0d4103d47bc9cff93918bb09a2957737cc3c9fe0))
* refactor using semantic HTML ([#1207](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1207)) ([505e314](https://github.com/cotes2020/jekyll-theme-chirpy/commit/505e314a3142c332e39365fbe2dac23df1bf0abe)), closes [#1196](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1196)
* **ui:** improve code snippet design ([4f86b04](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4f86b04a8487ebbf4a6d0d70b0c3ece79e9269f3))
* **ui:** improve web accessibility ([#447](https://github.com/cotes2020/jekyll-theme-chirpy/issues/447)) ([37c9764](https://github.com/cotes2020/jekyll-theme-chirpy/commit/37c976499ead51c1d88e8e8213366240a72adebc))
## [6.1.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.0.0...v6.1.0) (2023-07-02)
### Features
* **i18n:** add Thai locale file ([#1087](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1087)) ([a60e907](https://github.com/cotes2020/jekyll-theme-chirpy/commit/a60e90791d24811caff78e21c71dc85d6a729438))
### Bug Fixes
* missing xml escape for `alt` of preview image ([#1113](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1113)) ([8b0fbf5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8b0fbf5a834276f273274e4d614edd71e339cbb0))
* the cached image is covered by shimmer ([#1100](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1100)) ([df8ff54](https://github.com/cotes2020/jekyll-theme-chirpy/commit/df8ff546ec1c8d21a3d25e0124665001fcf756f3))
* **ui:** min-height of `page` layout exceeds the mobile screen ([73af591](https://github.com/cotes2020/jekyll-theme-chirpy/commit/73af59194ab935d38b89d298fea0e96e13be7cb7))
* **webfont:** resume semi-bold of font family `Source Sans Pro` ([c4da99c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c4da99c7ea5d6e32b1f1b815d7d8d6ae7b0f55de))
### Improvements
* **build:** use `jekyll-include-cache` plugin to reduce build time ([#1098](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1098)) ([4fe145e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4fe145e9809ee1b370d9891135939534751462d0)), closes [#1094](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1094)
* CJK characters of the "Search Cancel" button will wrap ([#1105](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1105)) ([b6d1992](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b6d1992f85ec543220e826087dcc89870e7e2c00))
* **ui:** avoid blank space at the bottom of the homepage preview image ([ce2f6f5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ce2f6f5abef7a8b874e08d1f18c1fd002650dbf1))
* **ui:** improve hover color of sidebar nav items in light mode ([728094d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/728094d1ba67a1e7c0a11e1c6c69bf87af9a767b))
## [6.0.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v6.0.0...v6.0.1) (2023-05-19)
### Bug Fixes
* **home:** preview image missing `[alt]` and `img_path` ([#1044](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1044)) ([aba9468](https://github.com/cotes2020/jekyll-theme-chirpy/commit/aba9468b5332802db961166889d4c4a84e404a2c))
* **layout:** restore the margin bottom of the main area ([#1047](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1047)) ([eb40f51](https://github.com/cotes2020/jekyll-theme-chirpy/commit/eb40f51c84b011a7c301279527f544ad27efd5eb))
* **post, page:** image link loses shimmer effect ([#1046](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1046)) ([3bd881d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/3bd881da70d685d10659f47bfe0e79cd02e7af92))
* **typography:** long string for update-list is not truncated ([#1050](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1050)) ([a51d31c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/a51d31c55a37fbe034f0b0f699f4df0b6a14ba8f)), closes [#1049](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1049)
## [6.0.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.6.1...v6.0.0) (2023-05-16)
### ⚠ BREAKING CHANGES
* rename assets origin configuration files
### Features
* add a hook to insert custom metadata in `head` tag ([#1015](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1015)) ([fe20341](https://github.com/cotes2020/jekyll-theme-chirpy/commit/fe203417d993508eedf5b9044fe53c4a566e44f9))
* **i18n:** add sl-SI.yml with slovenian translations ([#989](https://github.com/cotes2020/jekyll-theme-chirpy/issues/989)) ([42a700a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/42a700aa37889faa32d7ec1f6776ce4b9d845dc4))
* **i18n:** add Traditional Chinese (Taiwan) localization file ([#961](https://github.com/cotes2020/jekyll-theme-chirpy/issues/961)) ([d97f95f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d97f95fca0bcd450ea50709ffba0217f7e65d339))
* **i18n:** added Swedish localization file ([#969](https://github.com/cotes2020/jekyll-theme-chirpy/issues/969)) ([fe70479](https://github.com/cotes2020/jekyll-theme-chirpy/commit/fe7047959e3694c6e603e764ded30dacd49e6aa9))
* support hiding the modification date of a post ([#1020](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1020)) ([8da583d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8da583d403456f6460ec1a6ebcbb0c2ca8127ff6))
* **ui:** improve code snippet design ([6d99f5c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6d99f5cc36a69e5ccff51f81ba448c798d92e12e))
* **ui:** improve the design for top bar ([83f1c34](https://github.com/cotes2020/jekyll-theme-chirpy/commit/83f1c34f92d85f3953ca9c9818be5399962bf1c9))
* **ui:** new design footer content layout ([3210c59](https://github.com/cotes2020/jekyll-theme-chirpy/commit/3210c59466150dc04b4e4bdfc1ffd0e38adcff43))
* **ui:** redesign the sidebar ([83bbe4a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/83bbe4ac939edfd1706e68c080562e3462f83519))
* **ui:** show preview image in home page ([97b8dfe](https://github.com/cotes2020/jekyll-theme-chirpy/commit/97b8dfeed6ce7677f6472e28dc3b03f3c2968b12))
### Bug Fixes
* parameter parsing error in image URL ([#1022](https://github.com/cotes2020/jekyll-theme-chirpy/issues/1022)) ([ee88cec](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ee88cec270ea5938f98913a3edf28a684cfbd6c0))
* **rss:** double quotes in the post title will break the XML structure ([#965](https://github.com/cotes2020/jekyll-theme-chirpy/issues/965)) ([1719d81](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1719d81d00b32b107c35b3903089be84a9b28a6c))
### refactor
* rename assets origin configuration files ([c283e77](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c283e7782fa9562d82d9855fd280a573fd58c75f))
### Improvements
* **assets:** reduce HTTP requests to CDN ([9d97120](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9d971201978e993a9af337d9cd5396a1ea225f00))
* calculate heading font size dynamically ([#983](https://github.com/cotes2020/jekyll-theme-chirpy/issues/983)) ([52f5ee9](https://github.com/cotes2020/jekyll-theme-chirpy/commit/52f5ee9cd3f92a6e8f25eaa203831546cda85db6))
* **i18n:** set the global default locales to "en" ([#979](https://github.com/cotes2020/jekyll-theme-chirpy/issues/979)) ([61fdbcb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/61fdbcb83a3601ecae62ec230602b94a5eb832e1))
* **tools:** avoid initialization interruption in single branch forks ([#992](https://github.com/cotes2020/jekyll-theme-chirpy/issues/992)) ([e90461a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e90461aa3c81633863db6a12c5924ddba33bd08e))
* **ui:** improve categories color in dark mode ([414dd13](https://github.com/cotes2020/jekyll-theme-chirpy/commit/414dd132aed70f4bd96cb712d00eacc82d2753e9))
* **ui:** improve hover effect for post preview cards ([7626e4d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7626e4d00544346a46b6e5ff2f3a99d234defe09))
* **ui:** improve hover effect of trending tags ([34499f0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/34499f0c927ce8fea3705dc2f0f0e6805cabda43))
* **ui:** improve inline code in light mode ([e38309f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e38309f3bd1302ffe60b682136b6efaf96f4d9ae))
* **ui:** improve related posts design ([2918da9](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2918da9f29465618d557c082ff3a2f23d7519049))
* **ui:** improve the color of prompts in dark mode ([8cbbcfa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8cbbcfa26da0addd88affada23a65770250f2404))
* **ui:** lighten the link color in light-mode ([7c23a4e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7c23a4ebc53b9e231c214e04f8ac0803cbcdb720))
* **ui:** mute the marker in lists ([0c80552](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0c80552d772b874e2a161f1270294faa3af18d4a))
* **ui:** uniform the muted text color ([aadf939](https://github.com/cotes2020/jekyll-theme-chirpy/commit/aadf9393d5c7f7528d453c4e68eba4f5cbb85bd9))
* **ux:** improve LQIP fade in effect ([003e7b6](https://github.com/cotes2020/jekyll-theme-chirpy/commit/003e7b60c93988a7bfae4c03a8346d4f8a5f0bb6))
## [5.6.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.6.0...v5.6.1) (2023-03-30)
### Bug Fixes
* **deps:** `tocbot` has no initialization detection ([#957](https://github.com/cotes2020/jekyll-theme-chirpy/issues/957)) ([8225174](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8225174cb5e02fda7b3cc548ec821c876b0a5139))
* mode-toggle leads to Disqus loading failure ([#945](https://github.com/cotes2020/jekyll-theme-chirpy/issues/945)) ([6fec411](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6fec411c18ca5689c467c7b216ddeda02df23623))
* pageviews not updated immediately ([8b4f99c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8b4f99c87f9a9227f47e84fb39d7b0f551d6f4dd))
## [5.6.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.2...v5.6.0) (2023-03-17)
### Features
* change TOC plugin to `tocbot` ([#774](https://github.com/cotes2020/jekyll-theme-chirpy/issues/774)) ([02b7bd5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/02b7bd5095a2affe5b4c5ed7b5b182baaf642ff3))
* **i18n:** add Greek Language Support. ([#903](https://github.com/cotes2020/jekyll-theme-chirpy/issues/903)) ([712a9b2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/712a9b22401ce591cf4c0bb03fbdd1693fee30bb))
* **ux:** turn home page posts into clickable cards ([#895](https://github.com/cotes2020/jekyll-theme-chirpy/issues/895)) ([b85f633](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b85f6330dea666350631c4461b742cdb54c5f052))
### Bug Fixes
* css selector string escaping vulnerability ([#888](https://github.com/cotes2020/jekyll-theme-chirpy/issues/888)) ([5c6ec9d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5c6ec9d06b6571e2c0efe6652078442dca8af477))
* mathematics cannot scroll horizontally ([#760](https://github.com/cotes2020/jekyll-theme-chirpy/issues/760)) ([4681df7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4681df715118a37ae1e91b588de0adb67f4e331a))
* notch status bar doesn't match theme color ([#918](https://github.com/cotes2020/jekyll-theme-chirpy/issues/918)) ([820ba62](https://github.com/cotes2020/jekyll-theme-chirpy/commit/820ba62e9e939090523a7077d01d01bd78ec84eb))
* some console snippets will be incompletely copied ([e8e4901](https://github.com/cotes2020/jekyll-theme-chirpy/commit/e8e4901e340dd7e5fc5f656dd3c7bcd6c97b886a))
## [5.5.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.1...v5.5.2) (2023-01-30)
### Bug Fixes
* position of prompt icon is incorrect in paragraph on mobile ([5df953f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5df953f6c877e2aa3f1f4981c97a0b8007abe6d4))
## [5.5.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.5.0...v5.5.1) (2023-01-29)
### Bug Fixes
* the icon position of the prompts in the list is incorrect ([0c9558d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0c9558de8a01e9ab795778f351a8bbf4d6b21763))
## [5.5.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.4.0...v5.5.0) (2023-01-29)
### Features
* **i18n:** add Arabic translation ([#857](https://github.com/cotes2020/jekyll-theme-chirpy/issues/857)) ([765af53](https://github.com/cotes2020/jekyll-theme-chirpy/commit/765af53b77e5c63804784d5728f5970ae274c2c7))
* **i18n:** add Czech language ([#833](https://github.com/cotes2020/jekyll-theme-chirpy/issues/833)) ([98d48f5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/98d48f5da412276d4a0c99cd01a87b19349bc6bc))
* **i18n:** add Finnish translations ([#843](https://github.com/cotes2020/jekyll-theme-chirpy/issues/843)) ([d6d0318](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d6d03183eaf94b44e037cc48b6e1c47cee183f6e))
* **i18n:** add Italian translation ([#850](https://github.com/cotes2020/jekyll-theme-chirpy/issues/850)) ([9a011e1](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9a011e14d66195d8b2fb9ec62f3e60a3e56cd032))
### Bug Fixes
* copy command line incomplete(`.gp` part) ([41ed331](https://github.com/cotes2020/jekyll-theme-chirpy/commit/41ed33145639415148aec8e85edc7a6fd0de0ca3))
* correct encoding of spaces in share URLs ([#835](https://github.com/cotes2020/jekyll-theme-chirpy/issues/835)) ([f2d2858](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f2d285844e6e2979f2b0eec1d20073d3c05b6c0c))
* post's image would cover the PWA update alert ([bd374dd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bd374dd383c50f89c8f018ecb4e25772eeb8f6d8))
* prompt with nested blockquotes renders incorrectly ([#846](https://github.com/cotes2020/jekyll-theme-chirpy/issues/846)) ([babb4a0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/babb4a0c5a58ceb2e4093bc465670accdd526c18))
## [5.4.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.2...v5.4.0) (2022-12-27)
### Features
* add `rel="me"` to Mastodon sidebar contact links for verification ([#807](https://github.com/cotes2020/jekyll-theme-chirpy/issues/807)) ([d2190c7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d2190c726f61c8c9732b88b4aecf699dc8bc7deb))
* add embed video support ([ed6dc53](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ed6dc539eff7003a3765bcd8c31ae5e91a863d65))
* add shimmer background when image loads ([ab16fdc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ab16fdc7fc26811130b98a1773beb62bff6182e8))
* set preview image ratio to 1.91 : 1 ([4b6ccbc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4b6ccbcbccce27b9fcb035812efefe4eb69301cf))
* support dark and light mode images ([#481](https://github.com/cotes2020/jekyll-theme-chirpy/issues/481)) ([9306c7b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9306c7b39ecf9d9146bc1a25eebedc38eb2c3dd6))
* support LQIP for images ([bffaf63](https://github.com/cotes2020/jekyll-theme-chirpy/commit/bffaf6374f265cec96ef743d42b46fbec3b59797))
### Bug Fixes
* `hreflang` tag attribute of feed misses `site.alt_lang` ([7651d28](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7651d2851b4bb7d8f0d068b62c036c89a1089bbc))
* `og:image` will be incorrect if the image uses a cross-domain URL ([8de1abd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/8de1abda6be3633982392178731431b0ddb1b52b))
* refactoring error when the image URL contains parameters ([ec98f07](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ec98f07aca0b80a9c07fbcdc8e0d7d66dba98ed2))
* spaces in post title are encoded when sharing ([7efd2f8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7efd2f8aa2ea1c3aeb7d740bf9a018881c26fe65))
### Improvements
* **cdn:** optimize cache policy for static assets ([7fb0ee0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/7fb0ee0bedb63eee3f90a49c6d7fb8b5d78c9830))
## [5.3.2](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.1...v5.3.2) (2022-11-22)
### Bug Fixes
* `mermaid` occasionally fails to initialize ([#536](https://github.com/cotes2020/jekyll-theme-chirpy/issues/536)) ([48f14e3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/48f14e39ac81bbfb3b9913ea3ee789d775b2d1ae))
* **comment:** disqus doesn't follow theme mode switching ([b0d5956](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b0d5956f5a0ed894984d6b1754efeba04d8bc966))
* restore full-text search ([#741](https://github.com/cotes2020/jekyll-theme-chirpy/issues/741)) ([6774e0e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6774e0e1fb37cf467b14be481347412713763f05))
* the image URL in the SEO-related tags is incomplete ([#754](https://github.com/cotes2020/jekyll-theme-chirpy/issues/754)) ([f6e9a3f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f6e9a3fccf7ab34db71f8aefaf86fdcc05861076))
## [5.3.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.3.0...v5.3.1) (2022-10-25)
### Bug Fixes
* 404 page missing title in tablet/desktop view ([5511b28](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5511b2883fd5a395fddfb642588d00c122f18da7))
* prompt content overflows horizontally ([#705](https://github.com/cotes2020/jekyll-theme-chirpy/issues/705)) ([fb13e32](https://github.com/cotes2020/jekyll-theme-chirpy/commit/fb13e3219b5eca0d2e4f86a1ecabfab75240369f))
* **tools:** multiple configuration files will fail the test ([80cb0b3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/80cb0b371754e96772a7907877a8ce196398ba3d))
### Improvements
* **layout:** improve the min-height of main content ([#674](https://github.com/cotes2020/jekyll-theme-chirpy/issues/674)) ([49bb93c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/49bb93cc0c89ad9cfaad5edcf9cb28c3d5134575))
* modify checkbox icon with `Liquid` ([1fd665b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/1fd665bf4990c26ae23635c511c5abc9640184d1))
* optimize the extra padding in lists ([#703](https://github.com/cotes2020/jekyll-theme-chirpy/issues/703)) ([39da11e](https://github.com/cotes2020/jekyll-theme-chirpy/commit/39da11e3f3685f49321757576d2b87a48bf25db5)), closes [#702](https://github.com/cotes2020/jekyll-theme-chirpy/issues/702)
* **posts:** improve core block bottom padding ([d2fb98b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d2fb98b3e57f2f6c3fc3816551cd0721731adf40))
* truncate post content for search results ([647eea8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/647eea8dbd716f9d3cb8330c3139fa753903f51d))
* **typography:** optimize the line height of post content ([eac3f9b](https://github.com/cotes2020/jekyll-theme-chirpy/commit/eac3f9b434ca77e3dc64eea9cedea7b93e7b306b))
### Others
* **giscus:** add `reactions-enabled` option ([#712](https://github.com/cotes2020/jekyll-theme-chirpy/issues/712)) ([70662a0](https://github.com/cotes2020/jekyll-theme-chirpy/commit/70662a0365e6b9378602dc0a57462ddad5aebcf5))
* **locale:** restore options for changing date format ([#716](https://github.com/cotes2020/jekyll-theme-chirpy/issues/716)) ([f904e8c](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f904e8cd48c343cc31e25859d9d50bfe2c056f41))
* remove site config option `prefer_datetime_locale` ([6852ceb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6852ceb280927ff4e753a3e1131f2b396d9807d0))
## [5.3.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.2.1...v5.3.0) (2022-09-23)
### Features
* add multiple authors to a post ([#677](https://github.com/cotes2020/jekyll-theme-chirpy/issues/677)) ([f1d9e99](https://github.com/cotes2020/jekyll-theme-chirpy/commit/f1d9e99bc02d3cd0a6b0cd1beac545f0cc7a24f8)), closes [#675](https://github.com/cotes2020/jekyll-theme-chirpy/issues/675)
* **i18n:** add Bulgarian support ([#612](https://github.com/cotes2020/jekyll-theme-chirpy/issues/612)) ([2fed338](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2fed338ce6d078bf528c9717201fbc475f88cd22))
* **i18n:** add German locale file ([#663](https://github.com/cotes2020/jekyll-theme-chirpy/issues/663)) ([940b281](https://github.com/cotes2020/jekyll-theme-chirpy/commit/940b2810e95065e30600ae8d5e4612e7183da60e))
* **i18n:** add Hungarian locale file ([#597](https://github.com/cotes2020/jekyll-theme-chirpy/issues/597), [#598](https://github.com/cotes2020/jekyll-theme-chirpy/issues/598)) ([b032977](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b0329775fc24d0323e5cc04cda46ece8b4531802))
* **i18n:** add Turkish language ([#631](https://github.com/cotes2020/jekyll-theme-chirpy/issues/631)) ([ad137fa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/ad137fa2945b1870b9c1dd5e9212a5f4af7c3580))
### Bug Fixes
* add missing color to linkedin icon for share list ([#683](https://github.com/cotes2020/jekyll-theme-chirpy/issues/683)) ([0dcd39d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0dcd39d491c9c49e4acf7f75f83fe6e1d1839e37))
* code contains spaces in headings ([#644](https://github.com/cotes2020/jekyll-theme-chirpy/issues/644)) ([3fa1bf3](https://github.com/cotes2020/jekyll-theme-chirpy/commit/3fa1bf305451f645a7f3aa93863b076463c8f165))
* correct spelling of `panel` ([#686](https://github.com/cotes2020/jekyll-theme-chirpy/issues/686)) ([b288587](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b288587c1c3d113a1c52c2d25fb46cddda348961))
* correct the i18n for tab titles ([0c5b697](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0c5b697fd3b283b6a5c926742b61ed49d8688c18))
* the `code` doesn't wrap inside the prompt ([#626](https://github.com/cotes2020/jekyll-theme-chirpy/issues/626)) ([378b65a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/378b65a0617787813519dde74d6f741f255eff3d))
## [5.2.1](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.2.0...v5.2.1) (2022-06-17)
### Bug Fixes
* exclude CHANGELOG from output ([971fe03](https://github.com/cotes2020/jekyll-theme-chirpy/commit/971fe03ec329ae49e7d60fe3af6101cfbd1acd6c))
* **PWA:** sometimes update notification is not triggered ([96af729](https://github.com/cotes2020/jekyll-theme-chirpy/commit/96af7291ea5b2c5ed6372e7b6f7725e67c69f1ba))
## [5.2.0](https://github.com/cotes2020/jekyll-theme-chirpy/compare/v5.1.0...v5.2.0) (2022-06-09)
### Features
* add es-ES support to locales ([#533](https://github.com/cotes2020/jekyll-theme-chirpy/issues/533)) ([efe75ad](https://github.com/cotes2020/jekyll-theme-chirpy/commit/efe75adf2784956afb7a0b67f6634b146d9cb03b))
* add fr-FR support to locales ([#582](https://github.com/cotes2020/jekyll-theme-chirpy/issues/582)) ([94e8144](https://github.com/cotes2020/jekyll-theme-chirpy/commit/94e81447afa457b1a6b7e8f487c47502803556d7))
* add Vietnamese locale ([#517](https://github.com/cotes2020/jekyll-theme-chirpy/issues/517)) ([171463d](https://github.com/cotes2020/jekyll-theme-chirpy/commit/171463d76da9b7bc25dd327b8f0a868ea79e388b))
* add pt-BR support to locales ([c2c503f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/c2c503f63336884282b6bda4ec0703d6ae76771b))
* add option to turn off PWA ([#527](https://github.com/cotes2020/jekyll-theme-chirpy/issues/527)) ([106c981](https://github.com/cotes2020/jekyll-theme-chirpy/commit/106c981bac71e7434204a77e1f0c9c61d6eb1509))
* **PWA:** add Service Worker update notification ([d127183](https://github.com/cotes2020/jekyll-theme-chirpy/commit/d127183b9774f6321e409acdb66bf8a85d8814be))
* support showing description of preview image ([2bd6efa](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2bd6efa95a174ac44e30a3af1e57e6f40d6e0e3a))
### Bug Fixes
* alt is not a valid attribute for 'a' tag ([58928db](https://github.com/cotes2020/jekyll-theme-chirpy/commit/58928dbc9068db4e4cda4371eeae1865920dce6a))
* assets URL is missing `baseurl` in self-hosted mode ([#591](https://github.com/cotes2020/jekyll-theme-chirpy/issues/591)) ([54124d5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/54124d5134995fce52e4c2fc0a5d4d1743d6264d))
* correct the `twitter:creator` of Twitter summary card ([96a16c8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/96a16c868ede51e7dfa412de63ffa1e5a49add7f))
* correctly URL encode share links ([4c1c8d8](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4c1c8d8b0eacecbbaa2d522bbdd6430f350ff760)), closes [#496](https://github.com/cotes2020/jekyll-theme-chirpy/issues/496)
* follow paginate_path config for pagination ([6900d9f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6900d9f2bc9380cbda4babf611c6eeff345291af))
* force checkout of `gh-pages` branch ([#544](https://github.com/cotes2020/jekyll-theme-chirpy/issues/544)) ([5402523](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5402523ae52a3740bcc15df0b226b2612644945d))
* horizontal scroll for long equations ([#545](https://github.com/cotes2020/jekyll-theme-chirpy/issues/545)) ([30787fc](https://github.com/cotes2020/jekyll-theme-chirpy/commit/30787fc4cf151e955bb7afc26dfd859f1a06fce6))
* p is not allowed in span ([4f590e2](https://github.com/cotes2020/jekyll-theme-chirpy/commit/4f590e2bba0639751771211bc0d357828ae70404))
* remove whitespace from avatar URL ([#537](https://github.com/cotes2020/jekyll-theme-chirpy/issues/537)) ([0542b51](https://github.com/cotes2020/jekyll-theme-chirpy/commit/0542b5149c8287dca60e37f46ee36f31b43455e4))
* resume the preview image SEO tag ([#529](https://github.com/cotes2020/jekyll-theme-chirpy/issues/529)) ([b8d1bcd](https://github.com/cotes2020/jekyll-theme-chirpy/commit/b8d1bcd3dea0abd1afef7ef154a4501fbb18938d))
* script code should be in head or body, not in between ([2103191](https://github.com/cotes2020/jekyll-theme-chirpy/commit/2103191b2faf714a8e4418c7c347a1f942b51af8))
* spurious header closing tags ([59e9557](https://github.com/cotes2020/jekyll-theme-chirpy/commit/59e955745f02f9b57c65af70b0979cd4a98bf53f))
* table bypass refactoring when it contains IAL ([#519](https://github.com/cotes2020/jekyll-theme-chirpy/issues/519)) ([5d85ccb](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5d85ccb9943aac88dbbefebe1c2234cdcbae5c53))
* **theme mode:** `SCSS` syntax error ([#588](https://github.com/cotes2020/jekyll-theme-chirpy/issues/588)) ([76a1b6a](https://github.com/cotes2020/jekyll-theme-chirpy/commit/76a1b6a068c369138422dcd18ba08ec8cc3749a6))
* use `jsonify` to generate valid json ([#521](https://github.com/cotes2020/jekyll-theme-chirpy/issues/521)) ([dd9d5a7](https://github.com/cotes2020/jekyll-theme-chirpy/commit/dd9d5a7207b746342d07176d8969dc4f2c380bf2))
* when the `site.img_cdn` is set to the local path, the preview-image path loses the `baseurl` ([9cefe58](https://github.com/cotes2020/jekyll-theme-chirpy/commit/9cefe58993d9ea3a3a28424e7ffd8e0911567c5c))
### Improvements
* avoid post pageviews from shifting while loading ([135a16f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/135a16f13ee783d9308669ff9a824847a73c951c))
* avoid the layout shift for post datetime ([6d35f5f](https://github.com/cotes2020/jekyll-theme-chirpy/commit/6d35f5f8da044cfad071628bb53776de03efaae4))
* **categories:** support singular and plural forms of locale ([#595](https://github.com/cotes2020/jekyll-theme-chirpy/issues/595)) ([35cadf9](https://github.com/cotes2020/jekyll-theme-chirpy/commit/35cadf969dd0161ee62503e242c545f006f7072b))
* improve the responsive design for ultrawide screens ([#540](https://github.com/cotes2020/jekyll-theme-chirpy/issues/540)) ([5d6e8c5](https://github.com/cotes2020/jekyll-theme-chirpy/commit/5d6e8c5ef6aa71b4d2600c5305f6e8ba540557f7))
================================================
FILE: docs/CODE_OF_CONDUCT.md
================================================
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as
contributors and maintainers pledge to making participation in our project and
our community a harassment-free experience for everyone, regardless of age, body
size, disability, ethnicity, sex characteristics, gender identity and expression,
level of experience, education, socio-economic status, nationality, personal
appearance, race, religion, or sexual identity and orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment include:
* Using welcoming and inclusive language
* Being respectful of differing viewpoints and experiences
* Gracefully accepting constructive criticism
* Focusing on what is best for the community
* Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
* The use of sexualized language or imagery and unwelcome sexual attention or advances
* Trolling, insulting/derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or electronic address, without explicit permission
* Other conduct which could reasonably be considered inappropriate in a
professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable
behavior and are expected to take appropriate and fair corrective action in
response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or
reject comments, commits, code, wiki edits, issues, and other contributions
that are not aligned to this Code of Conduct, or to ban temporarily or
permanently any contributor for other behaviors that they deem inappropriate,
threatening, offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces
when an individual is representing the project or its community. Examples of
representing a project or community include using an official project e-mail
address, posting via an official social media account, or acting as an appointed
representative at an online or offline event. Representation of a project may be
further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported by contacting the project team at `cotes.chung@gmail.com`. All
complaints will be reviewed and investigated and will result in a response that
is deemed necessary and appropriate to the circumstances. The project team is
obligated to maintain confidentiality with regard to the reporter of an incident.
Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good
faith may face temporary or permanent repercussions as determined by other
members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
available at
For answers to common questions about this code of conduct, see
[homepage]: https://www.contributor-covenant.org
================================================
FILE: docs/CONTRIBUTING.md
================================================
# Contributing Guidelines
_First of all, thank you for considering contributing to this project_ ! :tada:
There are many ways to contribute, from writing tutorials or blog posts, improving the documentation, submitting bug
reports and feature requests, or writing code that can be incorporated into the project. In order to make a good
experience for both contributors and maintainers, please start with the "[General Rules](#general-rules)"
before taking further action.
## Table of Contents
- [General Rules](#general-rules)
- [Questions and Requests for Help](#questions-and-requests-for-help)
- [Reporting a Bug](#reporting-a-bug)
- [Suggesting a New Feature](#suggesting-a-new-feature)
- [Contributing Code/Documentation](#contributing-codedocumentation)
- [Helpful Resources](#helpful-resources)
## General Rules
All types of contributions (_pull requests_, _issues_, and _discussions_) should follow these rules:
- You should read through the [Wiki][wiki] to understand the project features and how to use it properly. This is to
respect the time of the project's developers and
maintainers and to save their energy for other problems that really need to be resolved.
- Use the [latest release version][latest-ver]. If your contribution involves code/documentation changes, update to the
latest version of the default (`master`) branch.
- Avoid making duplicate contributions by searching for existing [issues][issues] / [discussions][discus] /
[pull requests][pr], but don't leave any unhelpful comments such as "I have the same problem". Prefer using
[reactions][gh-reactions] if you simply want to "+1" an existing issue.
- DO NOT email or tweet the
project developers and maintainers directly, everything about the project should be left on GitHub.
**Tip**: If you are new to the open-source community, then please read through
"[How To Ask Questions The Smart Way][ext-reading]" before contributing.
## Questions and Requests for Help
We expect every reasonable question you ask to be answered appropriately. If you want a quick and timely response,
please ask questions at [Jekyll Talk][jekyll-talk] and [StackOverflow][stack-overflow], where there are tons of
enthusiastic geeks who will positively answer your challenging questions.
If you can't get an answer in any of the above ways, then create a new [discussion][discus]. As long as it is not a
duplicate and [RTFM][rtfm] / [STFW][stfw] issue, we will respond as soon as possible.
## Reporting a Bug
A great way to contribute to the project is to send a detailed issue when you encounter a problem. We always appreciate
a well-written, thorough bug report.
1. Please figure out why the bug occurred, or locate the module in the project that caused this bug. Otherwise, there is
a high probability that you are using/setting it incorrectly.
2. If the issue is caused by you modifying the project code or some configuration of Jekyll, then please DO NOT
report such "bugs".
Chirpy is an open-source project, but that doesn't mean we will maintain other specific forks (such as yours).
You can learn about Jekyll and modern Web development to solve problems caused by custom modifications.
3. Make good use of your browser's incognito mode to troubleshoot if the problem is caused by caching.
4. As a last option, you can create a new [Bug Report][bug-report] following the template to describe the details.
If possible, providing a demo that reproduces the error will help us troubleshoot faster.
## Suggesting a New Feature
Feature requests are welcome! While we will consider all requests, we cannot guarantee your request will be accepted.
We want to avoid chaos in the UI design and therefore do not accept requests for changes like color schemes,
fontfamilies, typography, and so on. We want to avoid [feature creep][feat-creep] and focus only on the core features.
If accepted, we cannot make any commitments regarding the timeline for implementation and release. However, you are
welcome to submit a pull request to help!
## Contributing Code/Documentation
If your request is about an enhancement, it is recommended to first submit a
[Feature Request][feat-request] to discuss whether your idea fits the project.
See also: "[Suggesting a New Feature](#suggesting-a-new-feature)". Other than that, you can start the PR process.
1. Fork this project on GitHub and clone your repository locally.
2. Setting up the [development & test environments][dev-env].
3. Creating a new branch from the default branch and give it a descriptive name (e.g. `add-a-new-feat` or `fix-a-bug`).
When development is complete, create a [Conventional Commit][cc] with Git.
4. Submitting a [Pull Request][gh-pr].
## Helpful Resources
- [Code of conduct](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CODE_OF_CONDUCT.md)
- [Security policy](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/SECURITY.md)
- [How To Ask Questions The Smart Way][ext-reading]
[latest-ver]: https://github.com/cotes2020/jekyll-theme-chirpy/releases/latest
[wiki]: https://github.com/cotes2020/jekyll-theme-chirpy/wiki
[issues]: https://github.com/cotes2020/jekyll-theme-chirpy/issues?q=is%3Aissue
[pr]: https://github.com/cotes2020/jekyll-theme-chirpy/pulls
[discus]: https://github.com/cotes2020/jekyll-theme-chirpy/discussions
[ext-reading]: http://www.catb.org/~esr/faqs/smart-questions.html
[jekyll-talk]: https://talk.jekyllrb.com/
[stack-overflow]: https://stackoverflow.com/questions/tagged/jekyll
[rtfm]: https://en.wikipedia.org/wiki/RTFM
[stfw]: https://www.webster-dictionary.org/definition/STFW
[gh-reactions]: https://github.blog/2016-03-10-add-reactions-to-pull-requests-issues-and-comments/
[bug-report]: https://github.com/cotes2020/jekyll-theme-chirpy/issues/new?assignees=&labels=&projects=&template=bug_report.yml
[feat-request]: https://github.com/cotes2020/jekyll-theme-chirpy/issues/new?assignees=&labels=enhancement&projects=&template=feature_request.yml
[feat-creep]: https://en.wikipedia.org/wiki/Feature_creep
[dev-env]: https://github.com/cotes2020/jekyll-theme-chirpy/wiki/Development-&-Test-Environments
[cc]: https://www.conventionalcommits.org/
[gh-pr]: https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/about-pull-requests
================================================
FILE: docs/SECURITY.md
================================================
# Security Policy
## Supported Versions
| Version | Supported |
| :--------- | :-------: |
| >= `7.0.0` | ✓ |
| <= `6.0.0` | ✗ |
## Reporting a Vulnerability
If you find a vulnerability, please report it to `cotes.chung@gmail.com`.
We will try our best to respond within a week. Thank you for your time!
================================================
FILE: eslint.config.js
================================================
import { defineConfig, globalIgnores } from 'eslint/config';
import js from '@eslint/js';
import globals from 'globals';
export default defineConfig([
globalIgnores(['assets/*', 'node_modules/*', '_site/*']),
js.configs.recommended,
{
rules: {
semi: ['error', 'always'],
quotes: ['error', 'single']
},
languageOptions: {
globals: {
...globals.browser,
...globals.node
}
}
},
{
files: ['_javascript/**/*.js'],
languageOptions: {
globals: {
...globals.serviceworker,
ClipboardJS: 'readonly',
GLightbox: 'readonly',
Theme: 'readonly',
dayjs: 'readonly',
mermaid: 'readonly',
tocbot: 'readonly',
swconf: 'readonly'
}
}
}
]);
================================================
FILE: index.html
================================================
---
layout: home
# Index page
---
================================================
FILE: jekyll-theme-chirpy.gemspec
================================================
# frozen_string_literal: true
Gem::Specification.new do |spec|
spec.name = "jekyll-theme-chirpy"
spec.version = "7.5.0"
spec.authors = ["Cotes Chung"]
spec.email = ["cotes.chung@gmail.com"]
spec.summary = "A minimal, responsive, and feature-rich Jekyll theme for technical writing."
spec.homepage = "https://github.com/cotes2020/jekyll-theme-chirpy"
spec.license = "MIT"
spec.files = `git ls-files -z`.split("\x0").select { |f|
f.match(%r!^((_(includes|layouts|sass|(data\/(locales|origin)))|assets)\/|README|LICENSE)!i)
}
spec.metadata = {
"bug_tracker_uri" => "https://github.com/cotes2020/jekyll-theme-chirpy/issues",
"documentation_uri" => "https://github.com/cotes2020/jekyll-theme-chirpy/#readme",
"homepage_uri" => "https://cotes2020.github.io/chirpy-demo",
"source_code_uri" => "https://github.com/cotes2020/jekyll-theme-chirpy",
"wiki_uri" => "https://github.com/cotes2020/jekyll-theme-chirpy/wiki",
"plugin_type" => "theme"
}
spec.required_ruby_version = "~> 3.1"
spec.add_runtime_dependency "jekyll", "~> 4.3"
spec.add_runtime_dependency "jekyll-paginate", "~> 1.1"
spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.8"
spec.add_runtime_dependency "jekyll-archives", "~> 2.2"
spec.add_runtime_dependency "jekyll-sitemap", "~> 1.4"
spec.add_runtime_dependency "jekyll-include-cache", "~> 0.2"
end
================================================
FILE: package.json
================================================
{
"name": "jekyll-theme-chirpy",
"version": "7.5.0",
"description": "A minimal, responsive, and feature-rich Jekyll theme for technical writing.",
"repository": {
"type": "git",
"url": "git+https://github.com/cotes2020/jekyll-theme-chirpy.git"
},
"author": "Cotes Chung",
"license": "MIT",
"since": 2019,
"bugs": {
"url": "https://github.com/cotes2020/jekyll-theme-chirpy/issues"
},
"homepage": "https://github.com/cotes2020/jekyll-theme-chirpy/",
"type": "module",
"scripts": {
"build": "concurrently npm:build:*",
"build:css": "node purgecss.js",
"build:js": "rollup -c --bundleConfigAsCjs --environment BUILD:production",
"watch:js": "rollup -c --bundleConfigAsCjs -w",
"lint:js": "eslint",
"lint:scss": "stylelint _sass/**/*.scss",
"lint:fix:scss": "npm run lint:scss -- --fix",
"test": "npm run lint:js && npm run lint:scss",
"prepare": "husky"
},
"dependencies": {
"@popperjs/core": "^2.11.8",
"bootstrap": "^5.3.8"
},
"devDependencies": {
"@babel/core": "^7.29.0",
"@babel/plugin-transform-class-properties": "^7.28.6",
"@babel/plugin-transform-private-methods": "^7.28.6",
"@babel/preset-env": "^7.29.0",
"@commitlint/cli": "^20.4.4",
"@commitlint/config-conventional": "^20.4.4",
"@eslint/js": "^10.0.0",
"@rollup/plugin-babel": "^7.0.0",
"@rollup/plugin-node-resolve": "^16.0.3",
"@rollup/plugin-terser": "^1.0.0",
"@semantic-release/changelog": "^6.0.3",
"@semantic-release/exec": "^7.1.0",
"@semantic-release/git": "^10.0.1",
"concurrently": "^9.2.1",
"conventional-changelog-conventionalcommits": "^9.3.0",
"eslint": "^10.0.3",
"globals": "^17.4.0",
"husky": "^9.1.7",
"purgecss": "^8.0.0",
"rollup": "^4.59.0",
"semantic-release": "^25.0.3",
"stylelint": "^17.4.0",
"stylelint-config-standard-scss": "^17.0.0"
},
"prettier": {
"trailingComma": "none"
},
"browserslist": [
"last 2 versions",
"> 0.2%",
"not dead"
],
"commitlint": {
"extends": [
"@commitlint/config-conventional"
],
"rules": {
"body-max-line-length": [
0,
"always"
]
}
},
"release": {
"branches": [
"production"
],
"plugins": [
[
"@semantic-release/commit-analyzer",
{
"preset": "conventionalcommits"
}
],
[
"@semantic-release/release-notes-generator",
{
"preset": "conventionalcommits",
"presetConfig": {
"types": [
{
"type": "feat",
"section": "Features"
},
{
"type": "fix",
"section": "Bug Fixes"
},
{
"type": "perf",
"section": "Improvements"
},
{
"type": "refactor",
"section": "Changes",
"hidden": true
}
]
}
}
],
[
"@semantic-release/changelog",
{
"changelogFile": "docs/CHANGELOG.md",
"changelogTitle": "# Changelog"
}
],
[
"@semantic-release/npm",
{
"npmPublish": false
}
],
[
"@semantic-release/exec",
{
"prepareCmd": "bash tools/release.sh --prepare",
"publishCmd": "bash tools/release.sh"
}
],
[
"@semantic-release/git",
{
"assets": [
"docs",
"package.json",
"*.gemspec"
],
"message": "chore(release): ${nextRelease.version}\n\n${nextRelease.notes}"
}
],
"@semantic-release/github"
]
}
}
================================================
FILE: purgecss.js
================================================
import { promises as fs } from 'fs';
import { PurgeCSS } from 'purgecss';
const DIST_PATH = '_sass/vendors';
const output = `${DIST_PATH}/_bootstrap.scss`;
const config = {
content: ['_includes/**/*.html', '_layouts/**/*.html', '_javascript/**/*.js'],
css: ['node_modules/bootstrap/dist/css/bootstrap.min.css'],
keyframes: true,
variables: true,
// The `safelist` should be changed appropriately for future development
safelist: {
standard: [/^collaps/, /^w-/, 'shadow', 'border', 'kbd'],
greedy: [/^col-/, /tooltip/]
}
};
function main() {
fs.rm(DIST_PATH, { recursive: true, force: true })
.then(() => fs.mkdir(DIST_PATH))
.then(() => new PurgeCSS().purge(config))
.then((result) => {
return fs.writeFile(output, result[0].css);
})
.catch((err) => {
console.error('Error during PurgeCSS process:', err);
});
}
main();
================================================
FILE: rollup.config.js
================================================
import babel from '@rollup/plugin-babel';
import terser from '@rollup/plugin-terser';
import { nodeResolve } from '@rollup/plugin-node-resolve';
import fs from 'fs';
import pkg from './package.json';
const SRC_DEFAULT = '_javascript';
const SRC_PWA = `${SRC_DEFAULT}/pwa`;
const DIST = 'assets/js/dist';
const banner = `/*!
* ${pkg.name} v${pkg.version} | © ${pkg.since} ${pkg.author} | ${pkg.license} Licensed | ${pkg.homepage}
*/`;
const frontmatter = '---\npermalink: /:basename\n---\n';
const isProd = process.env.BUILD === 'production';
let hasWatched = false;
function cleanup() {
fs.rmSync(DIST, { recursive: true, force: true });
console.log(`> Directory "${DIST}" has been cleaned.`);
}
function insertFrontmatter() {
return {
name: 'insert-frontmatter',
generateBundle(_, bundle) {
for (const chunkOrAsset of Object.values(bundle)) {
if (chunkOrAsset.type === 'chunk') {
chunkOrAsset.code = frontmatter + chunkOrAsset.code;
}
}
}
};
}
function build(
filename,
{ src = SRC_DEFAULT, jekyll = false, outputName = null } = {}
) {
const input = `${src}/${filename}.js`;
const shouldWatch = hasWatched ? false : true;
if (!hasWatched) {
hasWatched = true;
}
return {
input,
output: {
file: `${DIST}/${filename}.min.js`,
format: 'iife',
...(outputName !== null && { name: outputName }),
banner,
sourcemap: !isProd && !jekyll
},
...(shouldWatch && { watch: { include: `${SRC_DEFAULT}/**/*.js` } }),
plugins: [
babel({
babelHelpers: 'bundled',
presets: ['@babel/env'],
plugins: [
'@babel/plugin-transform-class-properties',
'@babel/plugin-transform-private-methods'
]
}),
nodeResolve(),
isProd && terser(),
jekyll && insertFrontmatter()
]
};
}
cleanup();
export default [
build('commons'),
build('home'),
build('categories'),
build('page'),
build('post'),
build('misc'),
build('theme', { outputName: 'Theme' }),
build('app', { src: SRC_PWA, jekyll: true }),
build('sw', { src: SRC_PWA, jekyll: true })
];
================================================
FILE: tools/init.sh
================================================
#!/usr/bin/env bash
#
# Init the environment for new user.
set -eu
# CLI Dependencies
CLI=("git" "npm")
ACTIONS_WORKFLOW=pages-deploy.yml
RELEASE_HASH=$(git log --grep="chore(release):" -1 --pretty="%H")
# temporary file suffixes that make `sed -i` compatible with BSD and Linux
TEMP_SUFFIX="to-delete"
_no_gh=false
help() {
echo "Usage:"
echo
echo " bash /path/to/init [options]"
echo
echo "Options:"
echo " --no-gh Do not deploy to Github."
echo " -h, --help Print this help information."
}
# BSD and GNU compatible sed
_sedi() {
regex=$1
file=$2
sed -i.$TEMP_SUFFIX -E "$regex" "$file"
rm -f "$file".$TEMP_SUFFIX
}
_check_cli() {
for i in "${!CLI[@]}"; do
cli="${CLI[$i]}"
if ! command -v "$cli" &>/dev/null; then
echo "Command '$cli' not found! Hint: you should install it."
exit 1
fi
done
}
_check_status() {
if [[ -n $(git status . -s) ]]; then
echo "Error: Commit unstaged files first, and then run this tool again."
exit 1
fi
}
_check_init() {
if [[ $(git rev-parse HEAD^1) == "$RELEASE_HASH" ]]; then
echo "Already initialized."
exit 0
fi
}
check_env() {
_check_cli
_check_status
_check_init
}
reset_latest() {
git reset --hard "$RELEASE_HASH"
git clean -fd
git submodule update --init --recursive
}
init_files() {
if $_no_gh; then
rm -rf .github
else
## Change the files of `.github/`
temp="$(mktemp -d)"
find .github/workflows -type f -name "*$ACTIONS_WORKFLOW*" -exec mv {} "$temp/$ACTIONS_WORKFLOW" \;
rm -rf .github && mkdir -p .github/workflows
mv "$temp/$ACTIONS_WORKFLOW" .github/workflows/"$ACTIONS_WORKFLOW"
rm -rf "$temp"
fi
# Cleanup image settings in site config
_sedi "s/(^timezone:).*/\1/;s/(^.*cdn:).*/\1/;s/(^avatar:).*/\1/" _config.yml
# remove the other files
rm -rf tools/init.sh tools/release.sh _posts/*
# build assets
npm i && npm run build
# track the CSS/JS output
_sedi "/^_sass\/vendors/d" .gitignore
_sedi "/^assets\/js\/dist/d" .gitignore
}
commit() {
git add -A
git commit -m "chore: initialize the environment" -q
echo -e "\n> Initialization successful!\n"
}
main() {
check_env
reset_latest
init_files
commit
}
while (($#)); do
opt="$1"
case $opt in
--no-gh)
_no_gh=true
shift
;;
-h | --help)
help
exit 0
;;
*)
# unknown option
help
exit 1
;;
esac
done
main
================================================
FILE: tools/release.sh
================================================
#!/usr/bin/env bash
#
# Requires: Git, NPM and RubyGems
set -eu
opt_pre=false # option for bump gem version
opt_pkg=false # option for building gem package
MAIN_BRANCH="master"
RELEASE_BRANCH="production"
GEM_SPEC="jekyll-theme-chirpy.gemspec"
NODE_SPEC="package.json"
CHANGELOG="docs/CHANGELOG.md"
CONFIG="_config.yml"
CSS_DIST="_sass/vendors"
JS_DIST="assets/js/dist"
FILES=(
"$GEM_SPEC"
"$NODE_SPEC"
"$CHANGELOG"
"$CONFIG"
)
TOOLS=(
"git"
"npm"
"gem"
)
help() {
echo -e "A tool to release new version Chirpy gem.\nThis tool will:"
echo " 1. Build a new gem and publish it to RubyGems.org"
echo " 2. Merge the release branch into the default branch"
echo
echo "Usage:"
echo " bash $0 [options]"
echo
echo "Options:"
echo " --prepare Preparation for release"
echo " -p, --package Build a gem package only, for local packaging in case of auto-publishing failure"
echo " -h, --help Display this help message"
}
_check_cli() {
for i in "${!TOOLS[@]}"; do
cli="${TOOLS[$i]}"
if ! command -v "$cli" &>/dev/null; then
echo "> Command '$cli' not found!"
exit 1
fi
done
}
_check_git() {
$opt_pre || (
# ensure that changes have been committed
if [[ -n $(git status . -s) ]]; then
echo "> Abort: Commit the staged files first, and then run this tool again."
exit 1
fi
)
$opt_pkg || (
if [[ "$(git branch --show-current)" != "$RELEASE_BRANCH" ]]; then
echo "> Abort: Please run the tool in the '$RELEASE_BRANCH' branch."
exit 1
fi
)
}
_check_src() {
for i in "${!FILES[@]}"; do
_src="${FILES[$i]}"
if [[ ! -f $_src && ! -d $_src ]]; then
echo -e "> Error: Missing file \"$_src\"!\n"
exit 1
fi
done
}
init() {
_check_cli
_check_git
_check_src
echo -e "> npm install\n"
npm i
}
## Bump new version to gem-spec file
_bump_version() {
_version="$(grep '"version":' "$NODE_SPEC" | sed 's/.*: "//;s/".*//')"
sed -i "s/[[:digit:]]\+\.[[:digit:]]\+\.[[:digit:]]\+/$_version/" "$GEM_SPEC"
echo "> Bump gem version to $_version"
}
_improve_changelog() {
# Replace multiple empty lines with a single empty line
sed -i '/^$/N;/^\n$/D' "$CHANGELOG"
# Escape left angle brackets of HTML tag in the changelog as they break the markdown structure. e.g., '
'
sed -i -E 's/\s(<[a-z])/ \\\1/g' "$CHANGELOG"
}
prepare() {
_bump_version
_improve_changelog
}
## Build a Gem package
build_gem() {
# Remove unnecessary theme settings
sed -i -E "s/(^timezone:).*/\1/;s/(^cdn:).*/\1/;s/(^avatar:).*/\1/" $CONFIG
rm -f ./*.gem
npm run build
# add CSS/JS distribution files to gem package
git add "$CSS_DIST" "$JS_DIST" -f
echo -e "\n> gem build $GEM_SPEC\n"
gem build "$GEM_SPEC"
echo -e "\n> Resume file changes ...\n"
git reset
git checkout .
}
# Push the gem to RubyGems.org (using $GEM_HOST_API_KEY)
push_gem() {
gem push ./*.gem
}
## Merge the release branch into the default branch
merge() {
git fetch origin "$MAIN_BRANCH"
git checkout -b "$MAIN_BRANCH" origin/"$MAIN_BRANCH"
git merge --no-ff --no-edit "$RELEASE_BRANCH" || (
git merge --abort
echo -e "\n> Conflict detected. Aborting merge.\n"
exit 0
)
git push origin "$MAIN_BRANCH"
}
main() {
init
if $opt_pre; then
prepare
exit 0
fi
build_gem
$opt_pkg && exit 0
push_gem
merge
}
while (($#)); do
opt="$1"
case $opt in
--prepare)
opt_pre=true
shift
;;
-p | --package)
opt_pkg=true
shift
;;
-h | --help)
help
exit 0
;;
*)
# unknown option
help
exit 1
;;
esac
done
main
================================================
FILE: tools/run.sh
================================================
#!/usr/bin/env bash
#
# Run jekyll serve and then launch the site
prod=false
command="bundle exec jekyll s -l"
host="127.0.0.1"
help() {
echo "Usage:"
echo
echo " bash /path/to/run [options]"
echo
echo "Options:"
echo " -H, --host [HOST] Host to bind to."
echo " -p, --production Run Jekyll in 'production' mode."
echo " -h, --help Print this help information."
}
while (($#)); do
opt="$1"
case $opt in
-H | --host)
host="$2"
shift 2
;;
-p | --production)
prod=true
shift
;;
-h | --help)
help
exit 0
;;
*)
echo -e "> Unknown option: '$opt'\n"
help
exit 1
;;
esac
done
command="$command -H $host"
if $prod; then
command="JEKYLL_ENV=production $command"
fi
if [ -e /proc/1/cgroup ] && grep -q docker /proc/1/cgroup; then
command="$command --force_polling"
fi
echo -e "\n> $command\n"
eval "$command"
================================================
FILE: tools/test.sh
================================================
#!/usr/bin/env bash
#
# Build and test the site content
#
# Requirement: html-proofer, jekyll
#
# Usage: See help information
set -eu
SITE_DIR="_site"
_config="_config.yml"
_baseurl=""
help() {
echo "Build and test the site content"
echo
echo "Usage:"
echo
echo " bash $0 [options]"
echo
echo "Options:"
echo ' -c, --config "" Specify config file(s)'
echo " -h, --help Print this information."
}
read_baseurl() {
if [[ $_config == *","* ]]; then
# multiple config
IFS=","
read -ra config_array <<<"$_config"
# reverse loop the config files
for ((i = ${#config_array[@]} - 1; i >= 0; i--)); do
_tmp_baseurl="$(grep '^baseurl:' "${config_array[i]}" | sed "s/.*: *//;s/['\"]//g;s/#.*//")"
if [[ -n $_tmp_baseurl ]]; then
_baseurl="$_tmp_baseurl"
break
fi
done
else
# single config
_baseurl="$(grep '^baseurl:' "$_config" | sed "s/.*: *//;s/['\"]//g;s/#.*//")"
fi
}
main() {
# clean up
if [[ -d $SITE_DIR ]]; then
rm -rf "$SITE_DIR"
fi
read_baseurl
# build
JEKYLL_ENV=production bundle exec jekyll b \
-d "$SITE_DIR$_baseurl" -c "$_config"
# test
bundle exec htmlproofer "$SITE_DIR" \
--disable-external \
--ignore-urls "/^http:\/\/127.0.0.1/,/^http:\/\/0.0.0.0/,/^http:\/\/localhost/"
}
while (($#)); do
opt="$1"
case $opt in
-c | --config)
_config="$2"
shift
shift
;;
-h | --help)
help
exit 0
;;
*)
# unknown option
help
exit 1
;;
esac
done
main