Merge branch 'feature/improve-meta-display'
# Conflicts: # _sass/addon/commons.scss
This commit is contained in:
commit
cf8dae9454
23 changed files with 170 additions and 128 deletions
|
@ -59,7 +59,8 @@ not_found:
|
||||||
# ----- Posts related labels -----
|
# ----- Posts related labels -----
|
||||||
|
|
||||||
post:
|
post:
|
||||||
published: 'on'
|
written_by: By
|
||||||
|
posted: Posted
|
||||||
updated: Updated
|
updated: Updated
|
||||||
timeago:
|
timeago:
|
||||||
day: days ago
|
day: days ago
|
||||||
|
|
|
@ -59,7 +59,8 @@ not_found:
|
||||||
# ----- Posts related labels -----
|
# ----- Posts related labels -----
|
||||||
|
|
||||||
post:
|
post:
|
||||||
published: "pada"
|
written_by: Oleh
|
||||||
|
posted: Diterbitkan
|
||||||
updated: Diperbarui
|
updated: Diperbarui
|
||||||
timeago:
|
timeago:
|
||||||
day: hari yang lalu
|
day: hari yang lalu
|
||||||
|
|
|
@ -58,7 +58,8 @@ not_found:
|
||||||
# ----- Posts related labels -----
|
# ----- Posts related labels -----
|
||||||
|
|
||||||
post:
|
post:
|
||||||
published: 发表于
|
written_by: 作者
|
||||||
|
posted: 发表于
|
||||||
updated: 更新于
|
updated: 更新于
|
||||||
timeago:
|
timeago:
|
||||||
day: 天前
|
day: 天前
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<footer class="d-flex w-100 justify-content-center">
|
<footer class="d-flex w-100 justify-content-center">
|
||||||
<div class="d-flex justify-content-between align-items-center">
|
<div class="d-flex justify-content-between align-items-center text-muted">
|
||||||
<div class="footer-left">
|
<div class="footer-left">
|
||||||
<p class="mb-0">
|
<p class="mb-0">
|
||||||
© {{ 'now' | date: "%Y" }}
|
© {{ 'now' | date: "%Y" }}
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
<!-- layout specified -->
|
<!-- layout specified -->
|
||||||
|
|
||||||
{% if page.layout == 'home' or page.layout == 'post' %}
|
{% if page.layout == 'post' %}
|
||||||
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
||||||
<!-- pv-report needs countup.js -->
|
<!-- pv-report needs countup.js -->
|
||||||
<script async src="https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js"></script>
|
<script async src="https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js"></script>
|
||||||
|
|
|
@ -22,9 +22,9 @@
|
||||||
<!-- return element -->
|
<!-- return element -->
|
||||||
<span class="readtime" data-toggle="tooltip" data-placement="bottom"
|
<span class="readtime" data-toggle="tooltip" data-placement="bottom"
|
||||||
title="{{ words }} {{ site.data.locales[lang].post.words }}">
|
title="{{ words }} {{ site.data.locales[lang].post.words }}">
|
||||||
{{- read_time -}}{{" "}}{{- site.data.locales[lang].post.read_time.unit -}}
|
<em>{{- read_time -}}{{" "}}{{- site.data.locales[lang].post.read_time.unit -}}</em>
|
||||||
{%- if include.prompt -%}
|
{%- if include.prompt -%}
|
||||||
{% assign _prompt_words = read_prompt | number_of_words: 'auto' %}
|
{%- assign _prompt_words = read_prompt | number_of_words: 'auto' -%}
|
||||||
{% unless _prompt_words > 1 %}{{" "}}{% endunless %}{{ read_prompt }}
|
{%- unless _prompt_words > 1 -%}{{ " " }}{%- endunless -%}{{ read_prompt }}
|
||||||
{%- endif -%}
|
{%- endif -%}
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -1,27 +1,26 @@
|
||||||
<!--
|
<!--
|
||||||
Date format snippet
|
Date format snippet
|
||||||
See: /assets/js/_utils/timeage.js
|
See: ${JS_ROOT}/utils/timeago.js
|
||||||
-->
|
-->
|
||||||
|
|
||||||
{% assign tooltip_df = site.data.locales[lang].date_format.tooltip %}
|
{% assign tooltip_df = site.data.locales[lang].date_format.tooltip %}
|
||||||
{% assign post_long_df = site.data.locales[lang].date_format.post.long %}
|
{% assign post_long_df = site.data.locales[lang].date_format.post.long %}
|
||||||
{% assign post_short_df = site.data.locales[lang].date_format.post.short %}
|
{% assign post_short_df = site.data.locales[lang].date_format.post.short %}
|
||||||
|
|
||||||
{% if include.preposition %}
|
<em class="timeago{% if include.class %} {{ include.class }}{% endif %}"
|
||||||
{{ include.preposition }}
|
date="{{ include.date }}"
|
||||||
{% endif %}
|
{% if include.tooltip %}
|
||||||
<span class="timeago {% if include.class %}{{ include.class }}{% endif %}"
|
data-toggle="tooltip"
|
||||||
{% if include.tooltip %}
|
data-placement="bottom"
|
||||||
data-toggle="tooltip"
|
title="{{ include.date | date: tooltip_df }}"
|
||||||
data-placement="bottom"
|
{% endif %}>
|
||||||
title="{{ include.date | date: tooltip_df }}"
|
|
||||||
{% endif %}>
|
|
||||||
{%- assign this_year = site.time | date: "%Y" -%}
|
{%- assign this_year = site.time | date: "%Y" -%}
|
||||||
{%- assign post_year = include.date | date: "%Y" -%}
|
{%- assign post_year = include.date | date: "%Y" -%}
|
||||||
|
|
||||||
{%- if post_year == this_year -%}
|
{%- if post_year == this_year -%}
|
||||||
{{ include.date | date: post_short_df }}
|
{{ include.date | date: post_short_df }}
|
||||||
{%- else -%}
|
{%- else -%}
|
||||||
{{ include.date | date: post_long_df }}
|
{{ include.date | date: post_long_df }}
|
||||||
{%- endif -%}
|
{%- endif -%}
|
||||||
<i class="unloaded">{{ include.date | date_to_xmlschema }}</i>
|
</em>
|
||||||
</span>
|
|
||||||
|
|
|
@ -3,11 +3,8 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
|
|
||||||
const timeagoElem = $(".timeago");
|
const timeagoElem = $(".timeago");
|
||||||
|
let tasks = timeagoElem.length;
|
||||||
let toRefresh = timeagoElem.length;
|
|
||||||
|
|
||||||
let intervalId = void 0;
|
let intervalId = void 0;
|
||||||
|
|
||||||
const dPrompt = $("meta[name=day-prompt]").attr("content");
|
const dPrompt = $("meta[name=day-prompt]").attr("content");
|
||||||
|
@ -15,20 +12,19 @@ $(function() {
|
||||||
const minPrompt = $("meta[name=minute-prompt]").attr("content");
|
const minPrompt = $("meta[name=minute-prompt]").attr("content");
|
||||||
const justnowPrompt = $("meta[name=justnow-prompt]").attr("content");
|
const justnowPrompt = $("meta[name=justnow-prompt]").attr("content");
|
||||||
|
|
||||||
function timeago(isoDate, dateStr) {
|
function timeago(date, initDate) {
|
||||||
let now = new Date();
|
let now = new Date();
|
||||||
let past = new Date(isoDate);
|
let past = new Date(date);
|
||||||
|
|
||||||
if (past.getFullYear() !== now.getFullYear()
|
if (past.getFullYear() !== now.getFullYear()
|
||||||
|| past.getMonth() !== now.getMonth()) {
|
|| past.getMonth() !== now.getMonth()) {
|
||||||
return dateStr;
|
return initDate;
|
||||||
}
|
}
|
||||||
|
|
||||||
let seconds = Math.floor((now - past) / 1000);
|
let seconds = Math.floor((now - past) / 1000);
|
||||||
|
|
||||||
let day = Math.floor(seconds / 86400);
|
let day = Math.floor(seconds / 86400);
|
||||||
if (day >= 1) {
|
if (day >= 1) {
|
||||||
toRefresh -= 1;
|
|
||||||
return ` ${day} ${dPrompt}`;
|
return ` ${day} ${dPrompt}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -47,22 +43,30 @@ $(function() {
|
||||||
|
|
||||||
function updateTimeago() {
|
function updateTimeago() {
|
||||||
$(".timeago").each(function() {
|
$(".timeago").each(function() {
|
||||||
if ($(this).children("i").length > 0) {
|
if ($(this)[0].hasAttribute("date") === false) {
|
||||||
let dateStr = $(this).clone().children().remove().end().text();
|
tasks -= 1;
|
||||||
let node = $(this).children("i");
|
return;
|
||||||
let iosDate = node.text(); /* ISO Date: "YYYY-MM-DDTHH:MM:SSZ" */
|
|
||||||
$(this).text(timeago(iosDate, dateStr));
|
|
||||||
$(this).append(node);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let date = $(this).attr("date");
|
||||||
|
let initDate = $(this).text();
|
||||||
|
let relativeDate = timeago(date, initDate);
|
||||||
|
|
||||||
|
if (relativeDate === initDate) {
|
||||||
|
$(this).removeAttr("date");
|
||||||
|
} else {
|
||||||
|
$(this).text(relativeDate);
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
if (toRefresh === 0 && typeof intervalId !== "undefined") {
|
if (tasks === 0 && typeof intervalId !== "undefined") {
|
||||||
clearInterval(intervalId); /* stop interval */
|
clearInterval(intervalId); /* stop interval */
|
||||||
}
|
}
|
||||||
return toRefresh;
|
return tasks;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (toRefresh === 0) {
|
if (tasks === 0) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -57,9 +57,9 @@ layout: page
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="post-meta text-muted d-flex justify-content-between">
|
<div class="post-meta text-muted d-flex">
|
||||||
|
|
||||||
<div>
|
<div class="mr-auto">
|
||||||
<!-- posted date -->
|
<!-- posted date -->
|
||||||
<i class="far fa-calendar fa-fw"></i>
|
<i class="far fa-calendar fa-fw"></i>
|
||||||
{% include timeago.html date=post.date tooltip=true %}
|
{% include timeago.html date=post.date tooltip=true %}
|
||||||
|
@ -68,12 +68,15 @@ layout: page
|
||||||
<i class="far fa-clock fa-fw"></i>
|
<i class="far fa-clock fa-fw"></i>
|
||||||
{% include read-time.html content=post.content %}
|
{% include read-time.html content=post.content %}
|
||||||
|
|
||||||
<!-- page views -->
|
<!-- categories -->
|
||||||
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
{% if post.categories.size > 0 %}
|
||||||
<i class="far fa-eye fa-fw"></i>
|
<i class="far fa-folder-open fa-fw"></i>
|
||||||
<span id="pv_{{-post.title-}}" class="pageviews">
|
<span>
|
||||||
<i class="fas fa-spinner fa-spin fa-fw"></i>
|
{% for category in post.categories %}
|
||||||
</span>
|
{{ category }}
|
||||||
|
{%- unless forloop.last -%},{%- endunless -%}
|
||||||
|
{% endfor %}
|
||||||
|
</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -22,37 +22,60 @@ tail_includes:
|
||||||
|
|
||||||
<h1 data-toc-skip>{{ page.title }}</h1>
|
<h1 data-toc-skip>{{ page.title }}</h1>
|
||||||
|
|
||||||
<div class="post-meta text-muted d-flex flex-column">
|
<div class="post-meta text-muted">
|
||||||
<!-- Published date and author -->
|
|
||||||
|
<!-- author -->
|
||||||
<div>
|
<div>
|
||||||
<span class="semi-bold">
|
{% capture author_name %}{{ page.author.name | default: site.social.name }}{% endcapture %}
|
||||||
{{ page.author | default: site.social.name }}
|
{% assign author_link = nil %}
|
||||||
</span>
|
|
||||||
{% capture _preposition %}{{ site.data.locales[lang].post.published }}{% endcapture %}
|
{% if page.author.link %}
|
||||||
{% include timeago.html date=page.date tooltip=true preposition=_preposition %}
|
{% assign author_link = page.author.link %}
|
||||||
|
{% elsif author_name == site.social.name %}
|
||||||
|
{% assign author_link = site.social.links[0] %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{{ site.data.locales[lang].post.written_by }}
|
||||||
|
<em>
|
||||||
|
{% if author_link %}
|
||||||
|
<a href="{{ author_link }}">{{ author_name }}</a>
|
||||||
|
{% else %}
|
||||||
|
{{ author_name }}
|
||||||
|
{% endif %}
|
||||||
|
</em>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="d-flex">
|
||||||
<!-- lastmod -->
|
<div>
|
||||||
{% if page.last_modified_at %}
|
<!-- published date -->
|
||||||
|
<span>
|
||||||
|
{{ site.data.locales[lang].post.posted }}
|
||||||
|
{% include timeago.html date=page.date tooltip=true %}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<!-- lastmod date -->
|
||||||
|
{% if page.last_modified_at %}
|
||||||
<span>
|
<span>
|
||||||
{{ site.data.locales[lang].post.updated }}
|
{{ site.data.locales[lang].post.updated }}
|
||||||
{% include timeago.html date=page.last_modified_at class="lastmod" tooltip=true %}
|
{% include timeago.html date=page.last_modified_at tooltip=true %}
|
||||||
</span>
|
</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<!-- read time -->
|
<!-- read time -->
|
||||||
{% include read-time.html content=content prompt=true %}
|
{% include read-time.html content=content prompt=true %}
|
||||||
|
|
||||||
<!-- page views -->
|
<!-- page views -->
|
||||||
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
||||||
<span id="pv" class="pageviews">
|
<span>
|
||||||
<i class="fas fa-spinner fa-spin fa-fw"></i>
|
<em id="pv" class="pageviews">
|
||||||
|
<i class="fas fa-spinner fa-spin fa-fw"></i>
|
||||||
|
</em>
|
||||||
|
{{ site.data.locales[lang].post.pageview_measure }}
|
||||||
</span>
|
</span>
|
||||||
{{ site.data.locales[lang].post.pageview_measure }}
|
{% endif %}
|
||||||
{% endif %}
|
</div>
|
||||||
|
|
||||||
</div>
|
</div> <!-- .d-flex -->
|
||||||
|
|
||||||
</div> <!-- .post-meta -->
|
</div> <!-- .post-meta -->
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
---
|
---
|
||||||
title: Text and Typography
|
title: Text and Typography
|
||||||
author: Cotes Chung
|
author:
|
||||||
|
name: Cotes Chung
|
||||||
|
link: https://github.com/cotes2020
|
||||||
date: 2019-08-08 11:33:00 +0800
|
date: 2019-08-08 11:33:00 +0800
|
||||||
categories: [Blogging, Demo]
|
categories: [Blogging, Demo]
|
||||||
tags: [typography]
|
tags: [typography]
|
||||||
|
|
|
@ -1,15 +1,19 @@
|
||||||
---
|
---
|
||||||
title: Writing a New Post
|
title: Writing a New Post
|
||||||
author: Cotes Chung
|
author:
|
||||||
|
name: Cotes Chung
|
||||||
|
link: https://github.com/cotes2020
|
||||||
date: 2019-08-08 14:10:00 +0800
|
date: 2019-08-08 14:10:00 +0800
|
||||||
categories: [Blogging, Tutorial]
|
categories: [Blogging, Tutorial]
|
||||||
tags: [writing]
|
tags: [writing]
|
||||||
render_with_liquid: false
|
render_with_liquid: false
|
||||||
---
|
---
|
||||||
|
|
||||||
|
This post will guide you how to write a post on _Chirpy_ theme. Even if you have previous experience with Jekyll, this article is worth reading, because many features require specific variables to be set.
|
||||||
|
|
||||||
## Naming and Path
|
## Naming and Path
|
||||||
|
|
||||||
Create a new file named `YYYY-MM-DD-TITLE.EXTENSION` and put it in the `_posts/` of the root directory. Please note that the `EXTENSION` must be one of `md` and `markdown`.
|
Create a new file named `YYYY-MM-DD-TITLE.EXTENSION` and put it in the `_posts` of the root directory. Please note that the `EXTENSION` must be one of `md` and `markdown`. 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
|
## Front Matter
|
||||||
|
|
||||||
|
@ -24,9 +28,9 @@ tags: [TAG] # TAG names should always be lowercase
|
||||||
---
|
---
|
||||||
```
|
```
|
||||||
|
|
||||||
> **Note**: The posts' ***layout*** has been set to `post` by default, so there is no need to add the variable ***layout*** in the Front Matter block.
|
> **Note**: 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.
|
||||||
|
|
||||||
### Timezone of date
|
### Timezone of Date
|
||||||
|
|
||||||
In order to accurately record the release date of a post, you should not only set up the `timezone` of `_config.yml` but also provide the post's timezone in variable `date` of its Front Matter block. Format: `+/-TTTT`, e.g. `+0800`.
|
In order to accurately record the release date of a post, you should not only set up the `timezone` of `_config.yml` but also provide the post's timezone in variable `date` of its Front Matter block. Format: `+/-TTTT`, e.g. `+0800`.
|
||||||
|
|
||||||
|
@ -38,6 +42,17 @@ The `categories` of each post are designed to contain up to two elements, and th
|
||||||
categories: [Animal, Insect]
|
categories: [Animal, Insect]
|
||||||
tags: [bee]
|
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:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
author:
|
||||||
|
name: Full Name
|
||||||
|
url: https://example.com
|
||||||
|
---
|
||||||
|
```
|
||||||
|
|
||||||
## Table of Contents
|
## Table of Contents
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
---
|
---
|
||||||
title: Getting Started
|
title: Getting Started
|
||||||
author: Cotes Chung
|
author:
|
||||||
|
name: Cotes Chung
|
||||||
|
link: https://github.com/cotes2020
|
||||||
date: 2019-08-09 20:55:00 +0800
|
date: 2019-08-09 20:55:00 +0800
|
||||||
categories: [Blogging, Tutorial]
|
categories: [Blogging, Tutorial]
|
||||||
tags: [getting started]
|
tags: [getting started]
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
---
|
---
|
||||||
title: Customize the Favicon
|
title: Customize the Favicon
|
||||||
author: Cotes Chung
|
author:
|
||||||
|
name: Cotes Chung
|
||||||
|
link: https://github.com/cotes2020
|
||||||
date: 2019-08-11 00:34:00 +0800
|
date: 2019-08-11 00:34:00 +0800
|
||||||
categories: [Blogging, Tutorial]
|
categories: [Blogging, Tutorial]
|
||||||
tags: [favicon]
|
tags: [favicon]
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
---
|
---
|
||||||
title: Enable Google Page Views
|
title: Enable Google Page Views
|
||||||
author: Dinesh Prasanth Moluguwan Krishnamoorthy
|
author:
|
||||||
|
name: Dinesh Prasanth Moluguwan Krishnamoorthy
|
||||||
|
link: https://github.com/SilleBille
|
||||||
date: 2021-01-03 18:32:00 -0500
|
date: 2021-01-03 18:32:00 -0500
|
||||||
categories: [Blogging, Tutorial]
|
categories: [Blogging, Tutorial]
|
||||||
tags: [google analytics, pageviews]
|
tags: [google analytics, pageviews]
|
||||||
|
|
|
@ -116,8 +116,6 @@ footer {
|
||||||
padding: 0 1rem;
|
padding: 0 1rem;
|
||||||
height: $footer-height;
|
height: $footer-height;
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
color: #7a7b7d;
|
|
||||||
background-color: var(--footer-bg-color);
|
|
||||||
|
|
||||||
> div.d-flex {
|
> div.d-flex {
|
||||||
line-height: 1.2rem;
|
line-height: 1.2rem;
|
||||||
|
@ -132,7 +130,7 @@ footer {
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: var(--footer-link);
|
@extend %text-color;
|
||||||
|
|
||||||
&:link {
|
&:link {
|
||||||
@include no-text-decoration;
|
@include no-text-decoration;
|
||||||
|
@ -367,10 +365,6 @@ img[data-src] {
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
em { // MarkDown italic
|
|
||||||
padding-right: 0.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
&.img-link {
|
&.img-link {
|
||||||
@extend %no-cursor;
|
@extend %no-cursor;
|
||||||
|
@ -389,7 +383,6 @@ img[data-src] {
|
||||||
@extend %link-hover;
|
@extend %link-hover;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
} // a
|
} // a
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -403,8 +396,6 @@ img[data-src] {
|
||||||
word-spacing: 1px;
|
word-spacing: 1px;
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@extend %link-underline;
|
|
||||||
|
|
||||||
&:not(:last-child) {
|
&:not(:last-child) {
|
||||||
margin-right: 2px;
|
margin-right: 2px;
|
||||||
}
|
}
|
||||||
|
@ -413,6 +404,10 @@ img[data-src] {
|
||||||
@extend %link-hover;
|
@extend %link-hover;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
em {
|
||||||
|
@extend %normal-font-style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-content {
|
.post-content {
|
||||||
|
@ -533,10 +528,6 @@ img[data-src] {
|
||||||
|
|
||||||
/* --- Effects classes --- */
|
/* --- Effects classes --- */
|
||||||
|
|
||||||
.semi-bold {
|
|
||||||
font-weight: 600 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.loaded {
|
.loaded {
|
||||||
display: block !important;
|
display: block !important;
|
||||||
|
|
||||||
|
|
|
@ -63,6 +63,10 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
%normal-font-style {
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
/* ---------- scss mixin --------- */
|
/* ---------- scss mixin --------- */
|
||||||
|
|
||||||
@mixin no-text-decoration {
|
@mixin no-text-decoration {
|
||||||
|
@ -88,10 +92,6 @@
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin semi-bold {
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {
|
@mixin label($font-size: 1rem, $font-weight: 600, $color: var(--label-color)) {
|
||||||
color: $color;
|
color: $color;
|
||||||
font-size: $font-size;
|
font-size: $font-size;
|
||||||
|
|
|
@ -83,10 +83,6 @@
|
||||||
--timeline-color: rgb(63, 65, 68);
|
--timeline-color: rgb(63, 65, 68);
|
||||||
--timeline-year-dot-color: var(--timeline-color);
|
--timeline-year-dot-color: var(--timeline-color);
|
||||||
|
|
||||||
/* Footer */
|
|
||||||
--footer-bg-color: var(--main-wrapper-bg);
|
|
||||||
--footer-link: rgb(171, 171, 171);
|
|
||||||
|
|
||||||
.post-content img {
|
.post-content img {
|
||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
@ -138,7 +134,6 @@
|
||||||
rgb(39, 39, 45),
|
rgb(39, 39, 45),
|
||||||
rgb(26, 26, 30)
|
rgb(26, 26, 30)
|
||||||
);
|
);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
color-scheme: dark;
|
color-scheme: dark;
|
||||||
|
|
|
@ -75,7 +75,4 @@
|
||||||
--timeline-node-bg: #c2c6cc;
|
--timeline-node-bg: #c2c6cc;
|
||||||
--timeline-year-dot-color: #ffffff;
|
--timeline-year-dot-color: #ffffff;
|
||||||
|
|
||||||
/* Footer */
|
|
||||||
--footer-bg-color: #ffffff;
|
|
||||||
--footer-link: #424242;
|
|
||||||
} // light-scheme
|
} // light-scheme
|
||||||
|
|
|
@ -74,10 +74,14 @@
|
||||||
.post-meta {
|
.post-meta {
|
||||||
i {
|
i {
|
||||||
font-size: 0.73rem;
|
font-size: 0.73rem;
|
||||||
|
|
||||||
|
&:not(:first-child) {
|
||||||
|
margin-left: 1.2rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
span:not(:last-child) {
|
em {
|
||||||
margin-right: 1.2rem;
|
@extend %normal-font-style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -16,17 +16,26 @@
|
||||||
border-color: var(--btn-border-color);
|
border-color: var(--btn-border-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin dot($pl: 0.2rem, $pr: 0.4rem) {
|
@mixin dot($pl: 0.25rem, $pr: 0.25rem) {
|
||||||
content: "\2022";
|
content: "\2022";
|
||||||
color: rgba(158, 158, 158, 0.8);
|
|
||||||
padding-left: $pl;
|
padding-left: $pl;
|
||||||
padding-right: $pr;
|
padding-right: $pr;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
%text-color {
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
|
||||||
h1 + .post-meta {
|
h1 + .post-meta {
|
||||||
> div:nth-child(2) {
|
span + span::before {
|
||||||
> span:not(:first-child)::before {
|
@include dot;
|
||||||
@include dot;
|
}
|
||||||
|
|
||||||
|
em {
|
||||||
|
@extend %text-color;
|
||||||
|
|
||||||
|
a {
|
||||||
|
@extend %text-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -45,6 +54,10 @@ img.preview-img {
|
||||||
margin-top: 6rem;
|
margin-top: 6rem;
|
||||||
border-bottom: 1px double var(--main-border-color);
|
border-bottom: 1px double var(--main-border-color);
|
||||||
font-size: 0.85rem;
|
font-size: 0.85rem;
|
||||||
|
|
||||||
|
.post-meta a {
|
||||||
|
@extend %link-underline;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-tags {
|
.post-tags {
|
||||||
|
@ -166,6 +179,10 @@ nav[data-toggle=toc] {
|
||||||
@include label(1.1rem, 600);
|
@include label(1.1rem, 600);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
em {
|
||||||
|
@extend %normal-font-style;
|
||||||
|
}
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
border-color: var(--card-border-color);
|
border-color: var(--card-border-color);
|
||||||
background-color: var(--card-bg);
|
background-color: var(--card-bg);
|
||||||
|
@ -175,7 +192,7 @@ nav[data-toggle=toc] {
|
||||||
transition: all 0.3s ease-in-out;
|
transition: all 0.3s ease-in-out;
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
color: var(--text-color);
|
@extend %text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
@ -309,7 +326,7 @@ nav[data-toggle=toc] {
|
||||||
line-height: 1.2rem;
|
line-height: 1.2rem;
|
||||||
|
|
||||||
> a {
|
> a {
|
||||||
font-weight: 600;
|
color: var(--text-color);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
@extend %link-hover;
|
@extend %link-hover;
|
||||||
|
@ -343,23 +360,6 @@ nav[data-toggle=toc] {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media all and (min-width: 768px) {
|
|
||||||
#core-wrapper {
|
|
||||||
h1 + .post-meta {
|
|
||||||
> div:not(:first-child)::before {
|
|
||||||
@include dot(0.5rem, 0.2rem);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.flex-column {
|
|
||||||
-webkit-box-orient: horizontal !important;
|
|
||||||
-webkit-box-direction: normal !important;
|
|
||||||
-ms-flex-direction: row !important;
|
|
||||||
flex-direction: row !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} // .post
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide SideBar and TOC */
|
/* Hide SideBar and TOC */
|
||||||
@media all and (max-width: 830px) {
|
@media all and (max-width: 830px) {
|
||||||
.post-navigation {
|
.post-navigation {
|
||||||
|
|
2
assets/js/dist/home.min.js
vendored
2
assets/js/dist/home.min.js
vendored
|
@ -3,4 +3,4 @@
|
||||||
* © 2019 Cotes Chung
|
* © 2019 Cotes Chung
|
||||||
* MIT Licensed
|
* MIT Licensed
|
||||||
*/
|
*/
|
||||||
$(function(){$(window).scroll(()=>{50<$(this).scrollTop()&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){$("#mode-toggle-wrapper").keyup(e=>{13===e.keyCode&&flipMode()})}),$(function(){const e=$("#sidebar-trigger"),t=$("#search-trigger"),o=$("#search-cancel"),a=$("#search-cleaner"),n=$("#main"),l=$("#topbar-title"),s=$("#search-wrapper"),r=$("#search-result-wrapper"),d=$("#search-results"),i=$("#search-input"),c=$("#search-hints"),u=function(){let e=0;return{block(){e=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(e)},getOffset(){return e}}}(),p={on(){e.addClass("unloaded"),l.addClass("unloaded"),t.addClass("unloaded"),s.addClass("d-flex"),o.addClass("loaded")},off(){o.removeClass("loaded"),s.removeClass("d-flex"),e.removeClass("unloaded"),l.removeClass("unloaded"),t.removeClass("unloaded")}},h=function(){let e=!1;return{on(){e||(u.block(),r.removeClass("unloaded"),n.addClass("unloaded"),e=!0)},off(){e&&(d.empty(),c.hasClass("unloaded")&&c.removeClass("unloaded"),r.addClass("unloaded"),a.removeClass("visible"),n.removeClass("unloaded"),u.release(),i.val(""),e=!1)},isVisible(){return e}}}();function f(){return o.hasClass("loaded")}t.click(function(){p.on(),h.on(),i.focus()}),o.click(function(){p.off(),h.off()}),i.focus(function(){s.addClass("input-focus")}),i.focusout(function(){s.removeClass("input-focus")}),i.on("keyup",function(e){8===e.keyCode&&""===i.val()?f()?c.removeClass("unloaded"):h.off():""!==i.val()&&(h.on(),a.hasClass("visible")||a.addClass("visible"),f()&&c.addClass("unloaded"))}),a.on("click",function(){i.val(""),f()?(c.removeClass("unloaded"),d.empty()):h.off(),i.focus(),a.removeClass("visible")})}),$(function(){var e=function(){const e="sidebar-display";let t=!1;const o=$("body");return{toggle(){!1===t?o.attr(e,""):o.removeAttr(e),t=!t}}}();$("#sidebar-trigger").click(e.toggle),$("#mask").click(e.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const t=$("#topbar-wrapper"),o=$("#toc-wrapper"),a=$(".access"),n=$("#search-input");let l,s=0;const r=t.outerHeight();$(window).scroll(function(e){$("#topbar-title").is(":hidden")&&(l=!0)}),setInterval(function(){l&&(function(){var e=$(this).scrollTop();Math.abs(s-e)<=5||(e>s&&e>r?(t.removeClass("topbar-down").addClass("topbar-up"),0<o.length&&o.removeClass("topbar-down"),0<a.length&&a.removeClass("topbar-down"),n.is(":focus")&&n.blur()):e+$(window).height()<$(document).height()&&(t.removeClass("topbar-up").addClass("topbar-down"),0<o.length&&o.addClass("topbar-down"),0<a.length&&a.addClass("topbar-down")),s=e)}(),l=!1)},250)}),$(function(){const e=$("#topbar-title"),t=$("div.post>h1"),o=e.text().trim();let a=(0<t.length?t:$("h1")).text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(a)&&(a=a.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){return!($("#post-list").length||t.is(":hidden")||e.is(":hidden")||$("#sidebar.sidebar-expand").length)&&void(95<=$(this).scrollTop()?e.text()!==a&&e.text(a):e.text()!==o&&e.text(o))}),e.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){let n=$(".timeago").length,e=void 0;const l=$("meta[name=day-prompt]").attr("content"),s=$("meta[name=hour-prompt]").attr("content"),r=$("meta[name=minute-prompt]").attr("content"),d=$("meta[name=justnow-prompt]").attr("content");function t(){return $(".timeago").each(function(){if(0<$(this).children("i").length){var t=$(this).clone().children().remove().end().text();let e=$(this).children("i");var o=e.text();$(this).text(function(e,t){let o=new Date,a=new Date(e);return a.getFullYear()!==o.getFullYear()||a.getMonth()!==o.getMonth()?t:(e=Math.floor((o-a)/1e3),1<=(t=Math.floor(e/86400))?(--n,` ${t} `+l):1<=(t=Math.floor(e/3600))?` ${t} `+s:1<=(e=Math.floor(e/60))?` ${e} `+r:d)}(o,t)),$(this).append(e)}}),0===n&&void 0!==e&&clearInterval(e),n}0!==n&&0<t()&&(e=setInterval(t,6e4))});
|
$(function(){$(window).scroll(()=>{50<$(this).scrollTop()&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){$("#mode-toggle-wrapper").keyup(t=>{13===t.keyCode&&flipMode()})}),$(function(){const t=$("#sidebar-trigger"),e=$("#search-trigger"),o=$("#search-cancel"),a=$("#search-cleaner"),s=$("#main"),n=$("#topbar-title"),l=$("#search-wrapper"),r=$("#search-result-wrapper"),d=$("#search-results"),i=$("#search-input"),c=$("#search-hints"),u=function(){let t=0;return{block(){t=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(t)},getOffset(){return t}}}(),p={on(){t.addClass("unloaded"),n.addClass("unloaded"),e.addClass("unloaded"),l.addClass("d-flex"),o.addClass("loaded")},off(){o.removeClass("loaded"),l.removeClass("d-flex"),t.removeClass("unloaded"),n.removeClass("unloaded"),e.removeClass("unloaded")}},f=function(){let t=!1;return{on(){t||(u.block(),r.removeClass("unloaded"),s.addClass("unloaded"),t=!0)},off(){t&&(d.empty(),c.hasClass("unloaded")&&c.removeClass("unloaded"),r.addClass("unloaded"),a.removeClass("visible"),s.removeClass("unloaded"),u.release(),i.val(""),t=!1)},isVisible(){return t}}}();function h(){return o.hasClass("loaded")}e.click(function(){p.on(),f.on(),i.focus()}),o.click(function(){p.off(),f.off()}),i.focus(function(){l.addClass("input-focus")}),i.focusout(function(){l.removeClass("input-focus")}),i.on("keyup",function(t){8===t.keyCode&&""===i.val()?h()?c.removeClass("unloaded"):f.off():""!==i.val()&&(f.on(),a.hasClass("visible")||a.addClass("visible"),h()&&c.addClass("unloaded"))}),a.on("click",function(){i.val(""),h()?(c.removeClass("unloaded"),d.empty()):f.off(),i.focus(),a.removeClass("visible")})}),$(function(){var t=function(){const t="sidebar-display";let e=!1;const o=$("body");return{toggle(){!1===e?o.attr(t,""):o.removeAttr(t),e=!e}}}();$("#sidebar-trigger").click(t.toggle),$("#mask").click(t.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const e=$("#topbar-wrapper"),o=$("#toc-wrapper"),a=$(".access"),s=$("#search-input");let n,l=0;const r=e.outerHeight();$(window).scroll(function(t){$("#topbar-title").is(":hidden")&&(n=!0)}),setInterval(function(){n&&(function(){var t=$(this).scrollTop();Math.abs(l-t)<=5||(t>l&&t>r?(e.removeClass("topbar-down").addClass("topbar-up"),0<o.length&&o.removeClass("topbar-down"),0<a.length&&a.removeClass("topbar-down"),s.is(":focus")&&s.blur()):t+$(window).height()<$(document).height()&&(e.removeClass("topbar-up").addClass("topbar-down"),0<o.length&&o.addClass("topbar-down"),0<a.length&&a.addClass("topbar-down")),l=t)}(),n=!1)},250)}),$(function(){const t=$("#topbar-title"),e=$("div.post>h1"),o=t.text().trim();let a=(0<e.length?e:$("h1")).text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(a)&&(a=a.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){return!($("#post-list").length||e.is(":hidden")||t.is(":hidden")||$("#sidebar.sidebar-expand").length)&&void(95<=$(this).scrollTop()?t.text()!==a&&t.text(a):t.text()!==o&&t.text(o))}),t.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){let o=$(".timeago").length,t=void 0;const s=$("meta[name=day-prompt]").attr("content"),n=$("meta[name=hour-prompt]").attr("content"),l=$("meta[name=minute-prompt]").attr("content"),r=$("meta[name=justnow-prompt]").attr("content");function e(){return $(".timeago").each(function(){var t,e;!1!==$(this)[0].hasAttribute("date")?(e=function(t,e){let o=new Date,a=new Date(t);return a.getFullYear()!==o.getFullYear()||a.getMonth()!==o.getMonth()?e:(t=Math.floor((o-a)/1e3),1<=(e=Math.floor(t/86400))?` ${e} `+s:1<=(e=Math.floor(t/3600))?` ${e} `+n:1<=(t=Math.floor(t/60))?` ${t} `+l:r)}($(this).attr("date"),t=$(this).text()))===t?$(this).removeAttr("date"):$(this).text(e):--o}),0===o&&void 0!==t&&clearInterval(t),o}0!==o&&0<e()&&(t=setInterval(e,6e4))});
|
2
assets/js/dist/post.min.js
vendored
2
assets/js/dist/post.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue