Skip to content

Commit 1da8ebc

Browse files
cotes2020cotes2020
committed
Update the post meta design.
1 parent d0317a6 commit 1da8ebc

10 files changed

Lines changed: 76 additions & 55 deletions

_data/right.yml renamed to _data/rights.yml

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,11 @@
77

88

99
license:
10-
link: "https://creativecommons.org/licenses/by/4.0/"
11-
prompt: This post is licensed under
1210
name: CC BY 4.0
13-
icons:
14-
- "fab fa-creative-commons"
15-
- "fab fa-creative-commons-by"
11+
link: "https://creativecommons.org/licenses/by/4.0/"
1612

1713
brief: Some rights reserved.
1814

1915
verbose: >-
20-
The blog posts on this site are licensed
21-
under the Creative Commons Attribution 4.0 International (CC BY 4.0) License.
16+
Except where otherwise noted, the blog posts on this site are licensed
17+
under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.

‎_includes/footer.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@
1212
<p class="mb-0">
1313
© {{ 'now' | date: "%Y" }}
1414
<a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
15-
{% if site.data.right.brief %}
15+
{% if site.data.rights.brief %}
1616
<span data-toggle="tooltip" data-placement="top"
17-
title="{{ site.data.right.verbose }}">{{ site.data.right.brief }}</span>
17+
title="{{ site.data.rights.verbose }}">{{ site.data.rights.brief }}</span>
1818
{% endif %}
1919
</p>
2020
</div>

‎_includes/post-sharing.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
-->
99

1010
<div class="share-wrapper">
11-
<span class="share-label ml-1 mr-1">{{ site.data.share.label }}</span>
11+
<span class="share-label mr-1">{{ site.data.share.label }}</span>
1212
<span class="share-icons">
1313
{% capture title %}{{ page.title }} - {{ site.title }}{% endcapture %}
1414
{% assign url = page.url | relative_url | prepend: site.url %}

‎_layouts/post.html‎

Lines changed: 40 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -16,24 +16,42 @@
1616
<h1 data-toc-skip>{{ page.title }}</h1>
1717

1818
<div class="post-meta text-muted d-flex flex-column">
19-
<!-- Published Date and Categoreis -->
19+
<!-- Published date and author -->
2020
<div>
21+
Posted
2122
<span class="timeago" data-toggle="tooltip" data-placement="bottom"
2223
title="{{ page.date | date: site.data.date_format.tooltip }}">
2324
{{ page.date | date: site.data.date_format.post }}
2425
<i class="unloaded">{{ page.date | date_to_xmlschema }}</i>
2526
</span>
26-
{% if page.categories.size > 0 %}on{% endif %}
27-
{% for category in page.categories %}
28-
<a href='{{ site.baseurl }}/categories/{{ category | replace: ' ', '-' | downcase | url_encode }}/'>{{ category }}</a>
29-
{%- unless forloop.last -%}, {%- endunless -%}
30-
{% endfor %}
27+
by
28+
<span class="author">
29+
{% if page.author %}
30+
{{ page.author }}
31+
{% else%}
32+
{{ site.author }}
33+
{% endif %}
34+
</span>
35+
</div>
36+
37+
<!-- lastmod -->
38+
{% if page.seo.date_modified > page.date %}
39+
<div>
40+
Updated
41+
<span class="timeago lastmod"
42+
data-toggle="tooltip" data-placement="bottom"
43+
title="{{ page.seo.date_modified | date: site.data.date_format.tooltip }}">
44+
{{ page.seo.date_modified | date: site.data.date_format.post }}
45+
<i class="unloaded">{{ page.seo.date_modified | date_to_xmlschema}}</i>
46+
</span>
3147
</div>
48+
{% endif %}
3249

3350
<!-- page views -->
3451
{% if site.google_analytics.pv.enabled %}
3552
<div>
36-
<span id="pv" class="pageviews"><i class="fas fa-spinner fa-spin fa-fw"></i></span> views
53+
<span id="pv" class="pageviews"><i class="fas fa-spinner fa-spin fa-fw"></i></span>
54+
views
3755
</div>
3856
{% endif %}
3957

@@ -57,22 +75,21 @@ <h1 data-toc-skip>{{ page.title }}</h1>
5775
5876
<div class="post-tail-wrapper text-muted">
5977
60-
<!-- lastmod -->
61-
{% if page.seo.date_modified > page.date %}
62-
<div>
63-
Updated
64-
<span class="timeago lastmod"
65-
data-toggle="tooltip" data-placement="top"
66-
title="{{ page.seo.date_modified | date: site.data.date_format.tooltip }}">
67-
{{ page.seo.date_modified | date: site.data.date_format.post }}
68-
<i class="unloaded">{{ page.seo.date_modified | date_to_xmlschema}}</i>
69-
</span>
78+
<!-- categories -->
79+
{% if page.categories.size > 0 %}
80+
<div class="post-meta mb-3">
81+
<i class="far fa-folder-open fa-fw mr-1"></i>
82+
{% for category in page.categories %}
83+
<a href='{{ site.baseurl }}/categories/{{ category | replace: ' ', '-' | downcase | url_encode }}/'>{{ category }}</a>
84+
{%- unless forloop.last -%}, {%- endunless -%}
85+
{% endfor %}
7086
</div>
7187
{% endif %}
7288

73-
<!-- Tags -->
89+
<!-- tags -->
7490
{% if page.tags.size > 0 %}
75-
<div class="pt-3">
91+
<div class="post-tags">
92+
<i class="fa fa-tags fa-fw mr-1"></i>
7693
{% for tag in page.tags %}
7794
<a href="{{ site.baseurl }}/tags/{{ tag | replace: ' ', '-' | downcase | url_encode }}/"
7895
class="post-tag no-text-decoration" >
@@ -84,18 +101,11 @@ <h1 data-toc-skip>{{ page.title }}</h1>
84101

85102
<div class="post-tail-bottom
86103
d-flex justify-content-between align-items-center pt-5 pb-2">
87-
88-
{% if site.data.right.license %}
104+
{% if site.data.rights.license %}
89105
<div class="license-wrapper">
90-
<span class="license-text ml-1 mr-1">
91-
{{ site.data.right.license.prompt }}
92-
<a href="{{ site.data.right.license.link }}">
93-
{{ site.data.right.license.name }}
94-
{% for icon in site.data.right.license.icons %}
95-
<i class="{{ icon }}"></i>
96-
{% endfor %}
97-
</a>
98-
</span>
106+
This post is licensed under
107+
<a href="{{ site.data.rights.license.link }}">{{ site.data.rights.license.name }}</a>
108+
by the author.
99109
</div>
100110
{% endif %}
101111

‎_posts/2019-08-08-text-and-typography.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
2-
title: "Text and Typography"
2+
title: Text and Typography
3+
author: Cotes Chung
34
date: 2019-08-08 11:33:00 +0800
45
categories: [Blogging, Demo]
56
tags: [typography]

‎_posts/2019-08-08-write-a-new-post.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
2-
title: "Writing a New Post"
2+
title: Writing a New Post
3+
author: Cotes Chung
34
date: 2019-08-08 14:10:00 +0800
45
categories: [Blogging, Tutorial]
56
tags: [writing]

‎_posts/2019-08-09-getting-started.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
22
title: Getting Started
3+
author: Cotes Chung
34
date: 2019-08-09 20:55:00 +0800
45
categories: [Blogging, Tutorial]
56
tags: [getting started]

‎_posts/2019-08-11-customize-the-favicon.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
2-
title: "Customize the Favicon"
2+
title: Customize the Favicon
3+
author: Cotes Chung
34
date: 2019-08-11 00:34:00 +0800
45
categories: [Blogging, Tutorial]
56
tags: [favicon]

‎assets/css/main.scss‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -752,9 +752,6 @@ a {
752752
@extend %no-bottom-border;
753753
}
754754
}
755-
.license-wrapper .license-text &:hover {
756-
@extend %link-hover;
757-
}
758755

759756
} // a
760757

@@ -857,13 +854,14 @@ table {
857854
min-width: 2rem;
858855
text-align: center;
859856
background: var(--tag-bg);
860-
border-radius: .34rem;
857+
border-radius: .3rem;
861858
padding: 0 .4rem;
862859
color: #818182;
863-
line-height: 1.6rem;
864-
&:not(:first-child) {
865-
margin-left: .2rem;
860+
line-height: 1.3rem;
861+
&:not(:last-child) {
862+
margin-right: .2rem;
866863
}
864+
867865
&:hover {
868866
@extend %tag-hover;
869867
border-bottom: none;

‎assets/css/post.scss‎

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
MIT License
99
*/
1010
@import "_addon/variables";
11+
@import "_addon/module";
1112

1213
$prompt-older: "{{ site.data.label.post.button.previous }}";
1314
$prompt-newer: "{{ site.data.label.post.button.next }}";
@@ -26,6 +27,10 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
2627
border-color: var(--btn-border-color);
2728
}
2829

30+
.author {
31+
font-weight: 600;
32+
}
33+
2934
.post img {
3035
margin-top: .5rem;
3136
margin-bottom: 1.5rem;
@@ -40,11 +45,15 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
4045
}
4146

4247
.post-tail-wrapper {
43-
margin-top: 5rem;
48+
margin-top: 4rem;
4449
border-bottom: 1px double var(--main-border-color);
4550
font-size: 0.85rem;
4651
}
4752

53+
.post-tags {
54+
line-height: 2rem;
55+
}
56+
4857
.post-navigation {
4958
padding-top: 3rem;
5059
padding-bottom: 2rem;
@@ -268,8 +277,11 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
268277

269278
.license-wrapper {
270279
line-height: 1.2rem;
271-
.license-text>a {
280+
>a {
272281
font-weight: 600;
282+
&:hover {
283+
@extend %link-hover;
284+
}
273285
}
274286
i {
275287
font-weight: 400;
@@ -282,10 +294,11 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
282294

283295
@media all and (max-width: 576px) {
284296
.post-tail-bottom {
285-
-ms-flex-wrap: wrap!important;
286-
flex-wrap: wrap!important;
297+
-ms-flex-wrap: wrap-reverse!important;
298+
flex-wrap: wrap-reverse!important;
287299
>div:first-child {
288-
margin-bottom: 1rem;
300+
width: 100%;
301+
margin-top: 1rem;
289302
}
290303
}
291304
}

0 commit comments

Comments
 (0)