jekyll-theme-yat 1.3.0 → 1.4.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5e50a9c1dc813ef81f78d8657642ed0ad82e058b2a3d37431c2a2baf17ed99af
-  data.tar.gz: 1280a0e558630797445e27b4852262aa3809b2f3d2ff60154b6a966fce34fd23
+  metadata.gz: e9f0c62601b83931b57a178d48a0e69d63210c27f65575a6e6e07c930b6338db
+  data.tar.gz: 1e5ff363a662f19b9b2743350a4f2809e157818db7933e1c461d071fa7b9a718
 SHA512:
-  metadata.gz: 351e0b176594ebbbe3d70f05c91f0abd6d2b2d6d79e246050dfea541dc7335f3e88d999d7cd419c486fd92664819ee587f103615304269208db1f081984f3f82
-  data.tar.gz: 076e94ae4d9b3c4c40af4f3fe66e08452d043e9423820f4684b5eb95f8b3a1c0488fe2cf0c851f8540cda31b0007471d8d302d9f1f1b0757df7c2bcb91a323f5
+  metadata.gz: 7e6e43e2802b0a5a870e6b930ac57d6d7eb5e24aadf9ef0b3a4f2baf88ab8d71f06bd5cdb8dae5f47947b32f11265e548b111b88cadec1798412c83a3a8d08f3
+  data.tar.gz: a3b1c644e0df40f4907fd1d9185450768d36a305dcd09b6cc2631c145c99873b73e976110acc4efd5c773af599dde0c4f3407b67e7bd7913f7aa0a1a90486ca2

data/README.md

@@ -1,11 +1,21 @@
 # jekyll-theme-yat
+[![Gem Version](https://badge.fury.io/rb/jekyll-theme-yat.svg)](http://badge.fury.io/rb/jekyll-theme-yat)
+[![License: MIT](https://img.shields.io/badge/License-MIT-brightgreen.svg)](https://opensource.org/licenses/MIT)
+[![Donate (Liberapay)](http://img.shields.io/liberapay/goal/jeffreytse.svg?logo=liberapay)](https://liberapay.com/jeffreytse)
+[![Donate (Patreon)](https://img.shields.io/badge/support-patreon-F96854.svg?style=flat-square)](https://patreon.com/jeffreytse)
+<a href="https://ko-fi.com/jeffreytse">
+  <img height="20" src="https://www.ko-fi.com/img/githubbutton_sm.svg"
+    alt="Donate (Ko-fi)" />
+</a>
 
-Welcome to your new Jekyll theme! In this directory, you'll find the files you need to be able to package up your theme into a gem. Put your layouts in `_layouts`, your includes in `_includes`, your sass files in `_sass` and any other assets in `assets`.
+Hey, nice to meet you, you found this Jekyll theme. Here the yet another theme is a modern theme, and it's quiet clear, clean and neat for writers and posts.
 
-To experiment with this code, add some sample content and run `bundle exec jekyll serve` – this directory is setup just like a Jekyll site!
 
-TODO: Delete this and the text above, and describe your gem
+<p align="center">
 
+  <img src="https://user-images.githubusercontent.com/9413601/87244819-c34ada80-c472-11ea-9c67-5827dd55d3c7.png" alt="demo-screenshot" width="720px" style="box-shadow: 0px 0px 18px 5px #f2f2f2" />
+
+</p>
 
 ## Installation
 
@@ -31,11 +41,12 @@ Or install it yourself as:
 
 ## Usage
 
-TODO: Write usage instructions here. Describe your available layouts, includes, sass and/or assets.
+Add or update your available layouts, includes, sass and/or assets.
 
-## Contributing
+GitHub Pages runs in `safe` mode and only allows [a set of whitelisted plugins](https://pages.github.com/versions/).
+To use the third-party gem in GitHub Pages without limitation:
 
-Bug reports and pull requests are welcome on GitHub at https://github.com/jeffreytse/jekyll-theme-yat. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
+* Here is a GitHub Action named [jekyll-deploy-action](https://github.com/jeffreytse/jekyll-deploy-action) for Jekyll site deployment conveniently. 👍
 
 ## Development
 
@@ -46,7 +57,12 @@ Your theme is setup just like a normal Jekyll site! To test your theme, run `bun
 When your theme is released, only the files in `_data`, `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
 To add a custom directory to your theme-gem, please edit the regexp in `jekyll-theme-yat.gemspec` accordingly.
 
-## License
+## Contributing
 
-The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+Issues and Pull Requests are greatly appreciated. If you've never contributed to an open source project before I'm more than happy to walk you through how to create a pull request.
+
+You can start by [opening an issue](https://github.com/jeffreytse/jekyll-theme-yat/issues/new) describing the problem that you're looking to resolve and we'll go from there.
+
+## License
 
+This theme is licensed under the [MIT license](https://opensource.org/licenses/mit-license.php) © JeffreyTse.

data/_data/translate_langs.yml

@@ -13,10 +13,6 @@
   img: https://www.countryflags.io/cn/flat/64.png
   text: Chinese(Simple)
 
-- lang: zh-TW
-  img: https://www.countryflags.io/tw/flat/64.png
-  text: Chinese(Traditional)
-
 - lang: ja
   img: https://www.countryflags.io/jp/flat/64.png
   text: Japan

data/_includes/extensions/comments/gitment.html

@@ -1,6 +1,6 @@
   <div id="gitment_thread"></div>
-  <link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
-  <script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theme-next/theme-next-gitment@1/default.css"/>
+  <script src="https://cdn.jsdelivr.net/gh/theme-next/theme-next-gitment@1/gitment.browser.js"></script>
   <script>
     var gitment = new Gitment({
       id: '{{ page.id }}',

data/_includes/functions/get_reading_time.html

@@ -0,0 +1,41 @@
+{% if include.article %}
+  {% assign article = include.article %}
+{% endif %}
+
+{% if include.speed %}
+  {% assign speed = include.speed %}
+{% else %}
+  {% assign speed = 160 %}
+{% endif %}
+
+{% assign total_mins = article
+  | number_of_words
+  | divided_by: speed
+  | at_least: 1 %}
+
+{% assign hours = total_mins | divided_by: 60 %}
+{% assign mins = total_mins | modulo: 60 %}
+
+{% assign return = "About" %}
+
+{% if hours > 0 %}
+  {% assign unit = "hour" %}
+  {% if hours > 1 %}
+    {% assign unit = unit | append: "s" %}
+  {% endif %}
+  {% assign return = return
+    | append: " "
+    | append: hours
+    | append: " "
+    | append: unit %}
+{% endif %}
+
+{% assign unit = "min" %}
+{% if mins > 1 %}
+  {% assign unit = unit | append: "s" %}
+{% endif %}
+{% assign return = return
+  | append: " "
+  | append: mins
+  | append: " "
+  | append: unit %}

data/_includes/head.html

@@ -6,10 +6,17 @@
   {%- seo -%}
   <link rel="shortcut icon" href="{{ site.favicon }}">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/typeface-noto-sans@0.0.72/index.min.css">
+  <link rel="stylesheet"
+        href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/styles/default.min.css">
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/highlight.min.js"></script>
+  <!-- and it's easy to individually load additional languages -->
+  <script charset="UTF-8"
+          src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/languages/go.min.js"></script>
   <link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
   <script src="{{ "/assets/js/main.js" | relative_url }}"></script>
   {%- feed_meta -%}
   {%- if jekyll.environment == 'production' and site.google_analytics -%}
-    {%- include extensions/google-analytics.html -%}
+  {%- include extensions/google-analytics.html -%}
   {%- endif -%}
 </head>

data/_includes/sidebar/article-menu.html

@@ -7,7 +7,7 @@
 </style>
 
 <div class="post-menu">
-  <div class="post-menu-title">Contents</div>
+  <div class="post-menu-title">TOC</div>
   <div class="post-menu-content"></div>
 </div>
 
@@ -49,7 +49,8 @@
         var headerHeight = headerTop + headerHeight + 20;
         if (headingRect.top <= headerHeight) {
           var id = 'h-' + h.getAttribute('id');
-          var curActive = menuContent.querySelector('a[href="#' + id  + '"]');
+          var a = menuContent.querySelector('a[href="#' + id  + '"]');
+          var curActive = a.parentNode;
           if (curActive) {
             curActive.classList.add('active');
           }

data/_includes/views/banner.html

@@ -19,20 +19,9 @@
 {% assign subheading = return %}
 
 {% if banner %}
-
-  {% assign auto_banner = true %}
-  {% assign array = banner | split: '/' %}
-  {% assign protocol = array[0]  %}
-
-  {% if array.size > 1 and (protocol == '' or protocol == 'http:' or protocol == 'https:') %}
-    {% assign auto_banner = false %}
-  {% endif %}
-
   <section class="page-banner">
     <div class="page-banner-img">
-      {%- if auto_banner == false -%}
-        <div style="background-image: url({{ banner }})"></div>
-      {%- endif  -%}
+      <div style="background-image: url({{ banner }})"></div>
     </div>
     <div class="wrapper">
       <div class="page-banner-inner">
@@ -48,36 +37,14 @@
             <h1 class="page-banner-heading">
               {{ heading | default: page.title | escape }}
             </h1>
-            <h3 class="page-banner-subheading">
+            <h2 class="page-banner-subheading">
               {{ subheading | default: page.subtitle | escape }}
-            </h3>
+            </h2>
           </div>
 
         {%- endif -%}
       </div>
     </div>
   </section>
-
-  {%- if auto_banner -%}
-
-    {%- assign selector = ".page-banner-img" -%}
-
-    {%- if banner == "default" -%}
-
-      {%- assign heading = page.heading | default: page.title | escape -%}
-      {%- assign subheading = page.subheading | default: page.subtitle | escape -%}
-      {%- assign seed = page.date | append: heading | append: subheading -%}
-
-    {%- else -%}
-
-      {%- assign seed = 'theme-' | append: banner -%}
-
-    {%- endif -%}
-
-    {%- assign zoom = 1.5 -%}
-    {%- include extensions/trianglify.html -%}
-
-  {%- endif -%}
-
 {%- endif -%}
 

data/_includes/views/header.html

@@ -7,7 +7,7 @@
 {%- include functions.html func='log' level='debug' msg='Get header_transparent value' -%}
 {% assign name = 'header_transparent' %}
 {%- include functions.html func='get_value' -%}
-{% assign header_transparent = return %}
+{% assign header_transparent = return | default: true %}
 
 {%- if banner and header_transparent -%}
   {%- assign header_transparent_class = "site-header-transparent" -%}
@@ -39,9 +39,7 @@
             {%- for path in page_paths -%}
               {%- assign my_page = site.pages | where: "path", path | first -%}
               {%- if my_page.title -%}
-              <a class="page-link" href="{{ my_page.url | relative_url }}">
-                {{ my_page.title | upcase | escape }}
-              </a>
+              <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | upcase | escape }}</a>
               {%- endif -%}
             {%- endfor -%}
 

data/_includes/views/pagination.html

@@ -11,16 +11,29 @@
     {%- for post in paginator.posts -%}
     <li>
       {%- assign date_format = site.yat.date_format | default: "%b %-d, %Y" -%}
-      <span class="post-meta">{{ post.date | date: date_format }}</span>
-      <h3>
+
+      {% assign article = post.content %}
+      {%- include functions.html func='get_reading_time' -%}
+      {% assign reading_time = return %}
+
+      <h2 class="post-title">
         {%- assign post_url = post.url | relative_url -%}
         <a class="post-link" href="{{ post_url }}">
           {{ post.title | escape }}
         </a>
-      </h3>
+      </h2>
+      <div class="post-meta">
+        <span class="post-date"><i class="fa fa-calendar"></i> {{ post.date | date: date_format }}</span>
+        <span class="post-reading-time left-vsplit"><i class="fa fa-clock-o"></i> {{ reading_time }}</span>
+      </div>
       <p class="post-excerpt">
         {{ post.content | strip_html | truncatewords: 50 }}
       </p>
+      <div class="post-tags">
+        {%- for tag in post.tags -%}
+        <a class="post-tag" href="/tags.html#{{tag}}">#{{tag}}</a>
+        {%- endfor -%}
+      </div>
     </li>
     {%- endfor -%}
   </ul>

data/_includes/views/paginator.html

@@ -3,19 +3,23 @@
 {% endif %}
 
 {% if paginator.posts.size > 0 %}
-  <div class="pagination">
+  <div class="paginator">
+    <span class="previous">
     {% if paginator.previous_page %}
-      <a href="{{ paginator.previous_page_path }}">&laquo; Prev</a>
+      <a href="{{ paginator.previous_page_path }}">Prev</a>
     {% else %}
-      <span>&laquo; Prev</span>
+      <span>Prev</span>
     {% endif %}
+    </span>
 
-    <span> {{ paginator.page }}/{{ paginator.total_pages }}</span>
+    <span class="indicator"> {{ paginator.page }}/{{ paginator.total_pages }}</span>
 
+    <span class="next">
     {% if paginator.next_page %}
-      <a href="{{ paginator.next_page_path }}">Next &raquo;</a>
+      <a href="{{ paginator.next_page_path }}">Next</a>
     {% else %}
-      <span>Next &raquo;</span>
+      <span>Next</span>
     {% endif %}
+    </span>
   </div>
 {% endif %}

data/_includes/views/post-header.html

@@ -1,11 +1,25 @@
 <header class="post-header">
   <h1 class="post-title p-name" itemprop="name headline">{{ heading | default: page.title | escape }}</h1>
-  <h3>{{ subheading | default: page.subtitle | escape }}</h3>
+  <h3 class="post-subtitle">{{ subheading | default: page.subtitle | escape }}</h3>
 
   <p class="post-meta">
     <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
       {%- assign date_format = site.yat.date_format | default: "%b %-d, %Y" -%}
-      {{ page.date | date: date_format }}
+      <i class="fa fa-calendar"></i> {{ page.date | date: date_format }}
     </time>
+
+    {% assign article = page.content %}
+    {%- include functions.html func='get_reading_time' -%}
+    {% assign reading_time = return %}
+    <span class="post-reading-time left-vsplit"><i class="fa fa-clock-o"></i> {{ reading_time }}</span>
   </p>
+
+  {%- if page.tags.size > 0 -%}
+  <div class="post-tags">
+    {%- for tag in page.tags -%}
+    <a class="post-tag" href="/tags.html#{{tag}}">#{{tag}}</a>
+    {%- endfor -%}
+  </div>
+  {%- endif -%}
+
 </header>

data/_layouts/post.html

@@ -1,7 +1,8 @@
 ---
 layout: framework
-banner: 'default'
+banner:
 banner_html: post-header.html
+hidden: []
 sidebar:
   - article-menu
 ---
@@ -13,39 +14,64 @@ sidebar:
     {%- include functions.html func='get_value' -%}
     {%- assign banner = return -%}
 
-    {%- if banner == nil -%}
+    {%- assign name = 'hidden' -%}
+    {%- include functions.html func='get_value' -%}
+    {%- assign hidden = return -%}
+
+    {%- assign result = hidden | where_exp: "item", "item == 'header'" -%}
+    {%- if banner == nil and result.size == 0 -%}
     {%- include views/post-header.html -%}
     {%- endif -%}
 
     {%- include views/article.html -%}
 
+    {%- assign result = hidden | where_exp: "item", "item == 'navigator'" -%}
+    {%- if result.size == 0 -%}
     <div class="post-nav">
       {%- if page.previous -%}
-      <a href="{{ page.previous.url }}" title="{{ page.previous.title | escape }}">&laquo; Prev</a>
+        <a class="previous" href="{{ page.previous.url }}" title="{{
+          page.previous.title | escape }}">{{ page.previous.title | escape | truncatewords: 6 }}</a>
       {%- else -%}
       <span></span>
       {%- endif -%}
 
       {%- if page.next -%}
-      <a href="{{ page.next.url }}" title="{{ page.next.title | escape }}">Next &raquo;</a>
+        <a class="next" href="{{ page.next.url }}" title="{{ page.next.title | escape }}">{{ page.next.title | escape | truncatewords: 6 }}</a>
       {%- else -%}
       <span></span>
       {%- endif -%}
     </div>
-
-    {%- if page.comments != false -%}
-
-    {%- if site.disqus.shortname -%}
-    {%- include extensions/comments/disqus.html -%}
     {%- endif -%}
 
-    {%- if site.gitment.username -%}
-    {%- include extensions/comments/gitment.html -%}
+    {%- assign result = hidden | where_exp: "item", "item == 'related_posts'" -%}
+    {%- if result.size == 0 -%}
+    <div class="post-related">
+      <div>Related Articles</div>
+      <ul>
+        {% assign posts = site[page.collection] | sample:4 %}
+        {%- for post in posts -%}
+        <li><a class="post-link" href="{{post.url}}" title="{{ page.next.title | escape }}">{{ post.title | escape | truncatewords: 12 }}</a></li>
+        {%- endfor -%}
+      </ul>
+    </div>
     {%- endif -%}
 
+    {%- assign result = hidden | where_exp: "item", "item == 'comments'" -%}
+    {%- if result.size == 0 -%}
+    <div class="post-comments">
+      {%- if page.comments != false -%}
+
+      {%- if site.disqus.shortname -%}
+      {%- include extensions/comments/disqus.html -%}
+      {%- endif -%}
+
+      {%- if site.gitment.username -%}
+      {%- include extensions/comments/gitment.html -%}
+      {%- endif -%}
+
+      {%- endif -%}
+    </div>
     {%- endif -%}
 
   </section>
 </div>
-
-

data/_sass/misc/article-menu.scss

@@ -7,40 +7,54 @@
   max-width: 250px;
 
   .post-menu-title {
-    font-size: $base-font-size * 1.35;
-    margin-bottom: 6px;
+    font-size: $base-font-size * 1.5;
+    margin-bottom: 14px;
     font-weight: 600;
-    color: #4e4e4e;
-
-    &:before {
-      content: '\f02e';
-      margin-right: 5px;
-      font-size: $base-font-size * 1.15;
-    }
+    color: #222;
   }
 
   .post-menu-content {
     ul {
+      border-left: 1px solid #e9ecef;
+      $indent: $base-font-size / 4;
+      $active-bgcolor: #ecebec;
+
       @for $i from 2 to 7 {
         .h-h#{$i} {
-          padding-left: ($i - 2) * $base-font-size * 0.9;
-          font-size: (7 - $i) + $base-font-size * 0.9;
+          padding-inline-start: $indent + ($i - 2) * $base-font-size * 1.3;
+          font-size: $base-font-size * 1.2;
+          line-height: 1.4;
         }
       }
 
       a {
         display: flex;
-        padding: 0px 8px;
+        padding: 2px 8px;
+        color: darken($text-color, 10%);
 
         * {
           pointer-events: none;
         }
+
+        &:hover {
+          text-decoration: none;
+          color: lighten($text-color, 20%)!important;
+        }
       }
 
       .active {
-        color: white;
-        background: mix(invert($theme-color), darkorange);
+        background-color: $active-bgcolor;
         transition: background 0.5s;
+        border-left: 2px solid #202020;
+        margin-left: -2px;
+
+        &:hover {
+          background-color: lighten($active-bgcolor, 2%);
+        }
+
+        a {
+          color: #121416;
+        }
       }
     }
   }