feat: rich excerpt with image support (#125)

3 files changed, 35 insertions, 8 deletions

diff --git a/_includes/functions/get_article_excerpt.html b/_includes/functions/get_article_excerpt.html
index 2868b8d..b34a13f 100644
--- a/_includes/functions/get_article_excerpt.html
+++ b/_includes/functions/get_article_excerpt.html
@@ -12,7 +12,7 @@
   {% assign excerpt_size = include.params.excerpt_size %}
 {% else %}
   {% assign excerpt_size = excerpt_size
-    | default: site.excerpt_size
+    | default: site.excerpt.text_size
     | default: 350 %}
 {% endif %}
 
diff --git a/_includes/views/pagination-item.html b/_includes/views/pagination-item.html
index fff6541..791fcda 100644
--- a/_includes/views/pagination-item.html
+++ b/_includes/views/pagination-item.html
@@ -4,11 +4,29 @@
 {% assign lang = post.lang %}
 {%- include functions.html func='get_reading_time' -%}
 {% assign reading_time = return %}
+
 {%- include functions.html func='get_article_excerpt' -%}
 {% assign excerpt = return %}
 {%- assign post_url = post.url | relative_url -%}
 
-<li class="{{ post_item_class }}">
+{%- assign name = 'excerpt.image_width' -%}
+{%- include functions.html func='get_value' -%}
+{%- assign image_width = return | default: '38.2%' -%}
+
+{%- assign name = 'excerpt.image_height' -%}
+{%- include functions.html func='get_value' -%}
+{%- assign image_height = return | default: '160px' -%}
+
+{%- assign name = 'excerpt.default_image' -%}
+{%- include functions.html func='get_value' -%}
+{%- assign default_image = return -%}
+
+{%- assign post_image = post.banner.image
+  | default: post.banner
+  | default: default_image
+  | default: '/assets/images/default-image.jpeg' -%}
+
+<li class="post-item {{ post_item_class }}">
   <h2 class="post-title">
     <a class="post-link" href="{{ post_url }}">
       {{ post.title | escape }}
@@ -22,11 +40,16 @@
     {%- endif -%}
     <span class="post-reading-time left-vsplit"><i class="fa fa-clock-o"></i> {{ reading_time }}</span>
   </div>
-  <a class="post-excerpt" href="{{ post_url }}">
-    <p>
-    {{ excerpt }} <span class="read_more">Read More</span>
-    </p>
-  </a>
+  <div class="post-excerpt">
+    {%- if post_image -%}
+    <a  class="post-image" href="{{ post_url }}" style="flex: 0 1 {{ image_width }}">
+      <div style="background-image: url({{ post_image | relative_url }}); height: {{ image_height }}"></div>
+    </a>
+    {%- endif -%}
+    <a class="post-text" href="{{ post_url }}">
+      <p>{{ excerpt }} <span class="read_more">Read More</span></p>
+    </a>
+  </div>
   <div class="post-tags">
     {%- for tag in post.tags -%}
     <a class="post-tag" href="{{ '/tags.html ' | relative_url }}#{{tag}}">#{{tag}}</a>
diff --git a/_includes/views/pagination.html b/_includes/views/pagination.html
index 014df85..a9de074 100644
--- a/_includes/views/pagination.html
+++ b/_includes/views/pagination.html
@@ -4,10 +4,14 @@
   {%- assign paginator = site -%}
 {%- endif -%}
 
+{%- assign name = 'excerpt.image_style' -%}
+{%- include functions.html func='get_value' default='z' -%}
+{%- assign image_style = return | append: '-image-style' -%}
+
 {%- if paginator.posts.size > 0 -%}
 <div class="pagination">
   <!-- Post list links -->
-  <ul class="post-list">
+  <ul class="post-list {{ image_style }}">
     <!-- Top list item -->
     {%- if paginator == site or paginator.page == 1 -%}
       {%- assign post_item_class = "top-post" -%}