From caf8dec568ba646fa4f3cb4fe4c7e3e716e8b094 Mon Sep 17 00:00:00 2001 From: Cotes Chung <11371340+cotes2020@users.noreply.github.com> Date: Tue, 7 Apr 2020 02:11:50 +0800 Subject: [PATCH] Update the post meta design. --- _data/{right.yml => rights.yml} | 10 +--- _includes/footer.html | 4 +- _includes/post-sharing.html | 2 +- _layouts/post.html | 70 ++++++++++++---------- _posts/2019-08-08-text-and-typography.md | 3 +- _posts/2019-08-08-write-a-new-post.md | 3 +- _posts/2019-08-09-getting-started.md | 1 + _posts/2019-08-11-customize-the-favicon.md | 3 +- assets/css/main.scss | 12 ++-- assets/css/post.scss | 23 +++++-- 10 files changed, 76 insertions(+), 55 deletions(-) rename _data/{right.yml => rights.yml} (64%) diff --git a/_data/right.yml b/_data/rights.yml similarity index 64% rename from _data/right.yml rename to _data/rights.yml index 50e5152..bedc283 100644 --- a/_data/right.yml +++ b/_data/rights.yml @@ -7,15 +7,11 @@ license: - link: "https://creativecommons.org/licenses/by/4.0/" - prompt: This post is licensed under name: CC BY 4.0 - icons: - - "fab fa-creative-commons" - - "fab fa-creative-commons-by" + link: "https://creativecommons.org/licenses/by/4.0/" brief: Some rights reserved. verbose: >- - The blog posts on this site are licensed - under the Creative Commons Attribution 4.0 International (CC BY 4.0) License. \ No newline at end of file + Except where otherwise noted, the blog posts on this site are licensed + under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author. \ No newline at end of file diff --git a/_includes/footer.html b/_includes/footer.html index 31da5a4..4620300 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -12,9 +12,9 @@

© {{ 'now' | date: "%Y" }} {{ site.social.name }}. - {% if site.data.right.brief %} + {% if site.data.rights.brief %} {{ site.data.right.brief }} + title="{{ site.data.rights.verbose }}">{{ site.data.rights.brief }} {% endif %}

diff --git a/_includes/post-sharing.html b/_includes/post-sharing.html index 24a0315..e4ddec2 100644 --- a/_includes/post-sharing.html +++ b/_includes/post-sharing.html @@ -8,7 +8,7 @@ -->
- {{ site.data.share.label }} + {{ site.data.share.label }} {% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %} {% assign url = page.url | relative_url | prepend: site.url %} diff --git a/_layouts/post.html b/_layouts/post.html index 4247531..dddb2e1 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -16,24 +16,42 @@ layout: default

{{ page.title }}

- +
+ Posted {{ page.date | date: site.data.date_format.post }} {{ page.date | date_to_xmlschema }} - {% if page.categories.size > 0 %}on{% endif %} - {% for category in page.categories %} - {{ category }} - {%- unless forloop.last -%}, {%- endunless -%} - {% endfor %} + by + + {% if page.author %} + {{ page.author }} + {% else%} + {{ site.author }} + {% endif %} +
+ + {% if page.seo.date_modified > page.date %} +
+ Updated + + {{ page.seo.date_modified | date: site.data.date_format.post }} + {{ page.seo.date_modified | date_to_xmlschema}} + +
+ {% endif %} + {% if site.google_analytics.pv.enabled %}
- views + + views
{% endif %} @@ -57,22 +75,21 @@ layout: default
- - {% if page.seo.date_modified > page.date %} -
- Updated - - {{ page.seo.date_modified | date: site.data.date_format.post }} - {{ page.seo.date_modified | date_to_xmlschema}} - + + {% if page.categories.size > 0 %} +
+ + {% for category in page.categories %} + {{ category }} + {%- unless forloop.last -%}, {%- endunless -%} + {% endfor %}
{% endif %} - + {% if page.tags.size > 0 %} -
+
+ {% for tag in page.tags %} @@ -84,18 +101,11 @@ layout: default
- - {% if site.data.right.license %} + {% if site.data.rights.license %}
- - {{ site.data.right.license.prompt }} - - {{ site.data.right.license.name }} - {% for icon in site.data.right.license.icons %} - - {% endfor %} - - + This post is licensed under + {{ site.data.rights.license.name }} + by the author.
{% endif %} diff --git a/_posts/2019-08-08-text-and-typography.md b/_posts/2019-08-08-text-and-typography.md index 4d2938e..a149e8f 100644 --- a/_posts/2019-08-08-text-and-typography.md +++ b/_posts/2019-08-08-text-and-typography.md @@ -1,5 +1,6 @@ --- -title: "Text and Typography" +title: Text and Typography +author: Cotes Chung date: 2019-08-08 11:33:00 +0800 categories: [Blogging, Demo] tags: [typography] diff --git a/_posts/2019-08-08-write-a-new-post.md b/_posts/2019-08-08-write-a-new-post.md index 67dd2e9..138da40 100644 --- a/_posts/2019-08-08-write-a-new-post.md +++ b/_posts/2019-08-08-write-a-new-post.md @@ -1,5 +1,6 @@ --- -title: "Writing a New Post" +title: Writing a New Post +author: Cotes Chung date: 2019-08-08 14:10:00 +0800 categories: [Blogging, Tutorial] tags: [writing] diff --git a/_posts/2019-08-09-getting-started.md b/_posts/2019-08-09-getting-started.md index 579349e..6394475 100644 --- a/_posts/2019-08-09-getting-started.md +++ b/_posts/2019-08-09-getting-started.md @@ -1,5 +1,6 @@ --- title: Getting Started +author: Cotes Chung date: 2019-08-09 20:55:00 +0800 categories: [Blogging, Tutorial] tags: [getting started] diff --git a/_posts/2019-08-11-customize-the-favicon.md b/_posts/2019-08-11-customize-the-favicon.md index 457cf1d..ce34752 100644 --- a/_posts/2019-08-11-customize-the-favicon.md +++ b/_posts/2019-08-11-customize-the-favicon.md @@ -1,5 +1,6 @@ --- -title: "Customize the Favicon" +title: Customize the Favicon +author: Cotes Chung date: 2019-08-11 00:34:00 +0800 categories: [Blogging, Tutorial] tags: [favicon] diff --git a/assets/css/main.scss b/assets/css/main.scss index 8dd1670..7eaf102 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -752,9 +752,6 @@ a { @extend %no-bottom-border; } } - .license-wrapper .license-text &:hover { - @extend %link-hover; - } } // a @@ -857,13 +854,14 @@ table { min-width: 2rem; text-align: center; background: var(--tag-bg); - border-radius: .34rem; + border-radius: .3rem; padding: 0 .4rem; color: #818182; - line-height: 1.6rem; - &:not(:first-child) { - margin-left: .2rem; + line-height: 1.3rem; + &:not(:last-child) { + margin-right: .2rem; } + &:hover { @extend %tag-hover; border-bottom: none; diff --git a/assets/css/post.scss b/assets/css/post.scss index 0074761..40b216e 100644 --- a/assets/css/post.scss +++ b/assets/css/post.scss @@ -8,6 +8,7 @@ MIT License */ @import "_addon/variables"; +@import "_addon/module"; $prompt-older: "{{ site.data.label.post.button.previous }}"; $prompt-newer: "{{ site.data.label.post.button.next }}"; @@ -26,6 +27,10 @@ $prompt-newer: "{{ site.data.label.post.button.next }}"; border-color: var(--btn-border-color); } +.author { + font-weight: 600; +} + .post img { margin-top: .5rem; margin-bottom: 1.5rem; @@ -40,11 +45,15 @@ $prompt-newer: "{{ site.data.label.post.button.next }}"; } .post-tail-wrapper { - margin-top: 5rem; + margin-top: 4rem; border-bottom: 1px double var(--main-border-color); font-size: 0.85rem; } +.post-tags { + line-height: 2rem; +} + .post-navigation { padding-top: 3rem; padding-bottom: 2rem; @@ -268,8 +277,11 @@ $prompt-newer: "{{ site.data.label.post.button.next }}"; .license-wrapper { line-height: 1.2rem; - .license-text>a { + >a { font-weight: 600; + &:hover { + @extend %link-hover; + } } i { font-weight: 400; @@ -282,10 +294,11 @@ $prompt-newer: "{{ site.data.label.post.button.next }}"; @media all and (max-width: 576px) { .post-tail-bottom { - -ms-flex-wrap: wrap!important; - flex-wrap: wrap!important; + -ms-flex-wrap: wrap-reverse!important; + flex-wrap: wrap-reverse!important; >div:first-child { - margin-bottom: 1rem; + width: 100%; + margin-top: 1rem; } } }