j1-template 2020.0.14 → 2020.0.19

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 32b117b61d1bc55bc4e03e17d78ac607bacaf47d2721235787cf44998247b020
-  data.tar.gz: 998a2d0eb0a45fd92ae74e6fb9ca718e7c61f20b666ab3fe43512a311cb3aed4
+  metadata.gz: f88309f8b818139934a8e812428ed7b8bb4257a2dd0a2c22c8dd78e8c79d41c9
+  data.tar.gz: 1848a6d5e9e8e38460b0acb9d49992ef6de6ae9aa0f356a00d49a8644ae6bc5f
 SHA512:
-  metadata.gz: c7e4fcdafa0fbb01fc8fb3db7d45168cff2481882adc8dea8736c0e989b955daacec8e20ed415435c3c6bf32954dbeccad64b653b37392113a9bfd4d0c5724eb
-  data.tar.gz: 64e9701aa56089462d06b89e7fab4f366de7b2ef013ff8b475f5c7cc1cfe406c6c18b728372f1ea608b358d1df3691b978ab27d1cf19dc6f654f79207fe96d4c
+  metadata.gz: cf7b33dde227d1d7f8a8cc69a766f02f27ff44ca1ff34f9039b4f2941450787253dd6ef5b75f297c18778169607a7b414cb3e1e5aa9ba007af9a19a87945ef7e
+  data.tar.gz: eb6ebe9544cf9535521b5f7afebc55d21654fe7993e38af28a354c94134429195ffd92397688b5023c110dc6edc84477f68a4e8880ab191fe375ddb8c5f09e48

data/_includes/themes/j1/blocks/footer/boxes/about_box.proc

@@ -33,11 +33,11 @@
 <!-- [INFO   ] [about_box.proc                     ] [ place about box ] -->
 <div class="col-md-{{footer_box_width_md}}">
   <!-- div class="heading-footer"><h2 class="notoc">{{title}}</h2></div -->
-  <h2 class="g-text-upper g-color-white-opacity-0_9 g-font-size-18 g-font-weight-500 g-mb-0">{{title}}</h2>
+  <h2 class="text-uppercase g-color-white-opacity-0_9 g-font-size-18 mb-0">{{title}}</h2>
   <p class="tagline mb-0">
     <large>{{tagline}}</large>
   </p>
-  <div class="d-inline-block g-width-50 g-height-2 g-bg-primary g-mb-5"></div>
+  <div class="d-inline-block g-width-50 g-height-2 bg-primary mb-1"></div>
   {% if justify %}
     <p class="lead text-justify">{{text}}</p>
   {% else %}

data/_includes/themes/j1/blocks/footer/boxes/links_box.proc

@@ -32,18 +32,18 @@
 <!-- [INFO   ] [links_box.proc                     ] [ place links box ] -->
 <div class="col-md-{{footer_box_width_md}}">
   <!-- div class="heading-footer"><h2 class="notoc">{{title}}</h2></div -->
-  <h2 class="g-text-upper g-color-white-opacity-0_9 g-font-size-18 g-font-weight-500 g-mb-0">{{title}}</h2>
+  <h2 class="text-uppercase g-color-white-opacity-0_9 g-font-size-18 mb-0">{{title}}</h2>
   <p class="tagline mb-0">
     <large>{{tagline}}</large>
   </p>
-  <div class="d-inline-block g-width-50 g-height-2 g-bg-primary g-mb-5"></div>
+  <div class="d-inline-block g-width-50 g-height-2 bg-primary mb-1"></div>
 
   <ul class="list-unstyled footer-link-list">
     {% for property in links %}
       {% comment %} <!-- proc - property.link: {{ property.link }} --> {% endcomment %}
       <li>
         <a href="{{property.link.href}}" target="_blank" rel="noopener noreferrer">{{property.link.title}}</a>
-        <div style="color: #555;"><small>{{property.link.tagline}}</small></div>
+        <div style="color: rgba(255, 255, 255, 0.4);"><small>{{property.link.tagline}}</small></div>
       </li>
     {% endfor %}
   </ul>

data/_includes/themes/j1/blocks/footer/boxes/news_box.proc

@@ -39,11 +39,11 @@
 <!-- [INFO   ] [news_box.proc                      ] [ place news box ] -->
 <div class="col-md-{{footer_box_width_md}}">
   <!-- div class="heading-footer"><h2 class="notoc">{{title}}</h2></div -->
-  <h2 class="g-text-upper g-color-white-opacity-0_9 g-font-size-18 g-font-weight-500 g-mb-0">{{title}}</h2>
+  <h2 class="text-uppercase g-color-white-opacity-0_9 g-font-size-18 mb-0">{{title}}</h2>
   <p class="tagline mb-0">
     <large>{{tagline}}</large>
   </p>
-  <div class="d-inline-block g-width-50 g-height-2 g-bg-primary g-mb-5"></div>
+  <div class="d-inline-block g-width-50 g-height-2 bg-primary mb-1"></div>
 
     <ul class="list-unstyled link-news">
     {% for post in posts %}

data/_includes/themes/j1/layouts/content_generator_blog_archive.html

@@ -68,17 +68,18 @@
   <!-- split page to place a sidebar e.g. the document TOC -->
   <!-- no sidebar, mr-* disabled -->
   <!-- div class="container mr-5 mb-5" -->
-  <div class="container mb-5">
-    <div class="row">
+  <!-- div class="container mb-5" -->
+    <!-- div class="row" -->
 
       <!-- main class="col-md-9 col-xs-12 r-text-{{rtext_size}} js-toc-content" -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
+      <main class="container r-text-{{rtext_size}} js-toc-content mb-5">
 
         {% comment %} Blog Navigator
         ------------------------------------------------------------------------ {% endcomment %}
-        <!-- Content placed by blog_archive_content.html -->
-        <div id="blog_navigator" class="row">
-          <div class="col-md-12" role="main">
+        <!-- Content placed by layouts/content_generator_blog_archive.html -->
+        <!-- div id="blog_navigator" class="row" -->
+        <div id="blog_navigator">
+          <!-- div class="col-md-12" role="main" -->
 
             <div id="article_navigator">
 
@@ -99,7 +100,8 @@
                   <h2 id="post-headline" class="mt-4">Navigator</h2>
                 </div> -->
 
-                <nav class="paginator ml-3">
+                <!-- nav class="paginator ml-3" -->
+                <nav class="paginator">
                   <ul class="pagination raised-z0">
 
                     <li class="page-item"><a class="page-link" href="{{category_view}}" title="View by Category">By Category</a></li>
@@ -134,7 +136,8 @@
                 {% comment %} Display pagination links if any
                 ---------------------------------------------------------------- {% endcomment %}
                 {% if paginator.total_pages > 1 %}
-                <nav class="paginator ml-3">
+                <!-- nav class="paginator ml-3" -->
+                <nav class="paginator">
                   <ul class="pagination raised-z0">
                     {% if paginator.previous_page %}
                       {% if paginator.previous_page > 1 %}
@@ -160,7 +163,8 @@
                 </nav>
                 {% endif %}
 
-                <div class="view-description ml-3 mb-3">
+                <!-- div class="view-description ml-3 mb-3" -->
+                <div class="view-description mb-3">
                   {{article_previewer_description}}
                 </div>
 
@@ -189,7 +193,7 @@
             {% comment %} End Article Previewer
             -------------------------------------------------------------------- {% endcomment %}
 
-          </div> <!-- end col-md-12 -->
+          <!-- /div --> <!-- end col-md-12 -->
         </div> <!-- end row blog_navigator -->
 
         <!-- End Content placed by blog_archive_content.html -->
@@ -222,6 +226,7 @@
 
         var dependencies_blog_generator = setInterval(function() {
           if ( j1.adapter.themer.getState() == 'finished' ) {
+            // [INFO   ] [j1.content_generator_blog_archive        ] [ {{page.title}} - save the current page to cookieUserState cookie: {{ browser_page_url }} ]
             var cookie_names                = j1.getCookieNames();
             const user_state_cookie_name    = cookie_names.user_session;
             var user_state                  = j1.readCookie(user_state_cookie_name);
@@ -231,10 +236,6 @@
               name: user_state_cookie_name,
               data: user_state
             });
-            /* Set default colors */
-            var bg_primary  = j1.getStyleValue('bg-primary', 'background-color');
-            /* Set color of timeline bullet */
-            $('head').append('<style>.tmicon { background: ' +bg_primary+ ' !important; }</style>');
             // clear interval checking
             clearInterval(dependencies_blog_generator);
             }
@@ -242,6 +243,8 @@
       });
       </script>
 
-    </div> <!-- end row -->
-  </div> <!-- end container -->
+    <!-- /div --> <!-- end row -->
+  <!-- /div --> <!-- end container -->
+
+
   <!-- [INFO   ] [j1.layout.content_generator_blog.html  ] [ end content ] -->

data/_includes/themes/j1/layouts/content_generator_collection.html

@@ -70,7 +70,7 @@
     ---------------------------------------------------------------------------- {% endcomment %}
     {% if sidebar == false %}
       <!-- FULL page - no sidebar for page toc -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
+      <main class="r-text-{{rtext_size}} js-toc-content">
 
         <!-- Include a pager at top position -->
         {% include {{pager}} %}
@@ -93,7 +93,7 @@
     {% else %}
       <!-- SPLIT page. Place a sidebar e.g. for the document toc -->
       <!-- main class="col-md-9 col-xs-12 r-text-{{rtext_size}} js-toc-content" -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
+      <main class="r-text-{{rtext_size}} js-toc-content">
 
         <!-- Include a pager at top position -->
         {% include {{pager}} %}

data/_includes/themes/j1/layouts/content_generator_page.html

@@ -30,78 +30,30 @@
 {% comment %} set config data
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign template_config   = site.data.template_settings %}
-{% assign toccer_defaults   = modules.defaults.toccer.defaults %}
-{% assign toccer_settings   = modules.toccer.settings %}
 
 {% comment %} set config options
 -------------------------------------------------------------------------------- {% endcomment %}
-{% assign toccer_options    = toccer_defaults | merge: toccer_settings %}
-{% assign tocbot_enabled    = toccer_options.enabled %}
-
 {% assign rtext             = site.data.template_settings.typography.rtext %}
 {% assign page_rtext        = page.rtext %}
 {% assign page_rtext_size   = page.rtext_size %}
 {% assign page_toccer       = page.toccer %}
 {% assign page_toc          = page.toc %}
 
-{% if tocbot_enabled and page_toc or page_toccer %}
-  {% assign sidebar  = true %}
-{% else %}
-  {% assign sidebar  = false %}
-{% endif %}
-
 {% if rtext %}
   {% assign rtext_size = site.data.template_settings.typography.rtext_size %}
 {% else %}
   {% assign rtext_size = 0 %}
 {% endif %}
 
-
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
-<!-- [INFO   ] [j1.layout.content_generator_page.html ] [ begin content ] -->
-<!-- div class="container mr-5 mb-5" -->
-<!-- no sidebar, mr-* disabled -->
-  <div class="container mb-5">
-  <div class="row">
-
-    {% if sidebar == false %}
-      <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ start main for full page ] -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
-        <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ begin place content ] -->
-        {{content}}
-      </main>
-      <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ end main for full page ] -->
-    {% else %}
-      <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ start main for split page (TOC) ] -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
-      <!-- main class="col-md-9 col-xs-12 r-text-{{rtext_size}} js-toc-content" -->
-        <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ begin place content ] -->
-        {{ content }}
-
-        {% comment %} Place additional headline for comments
-        ------------------------------------------------------------------------ {% endcomment %}
-        {% if page.comments %}
-        <h2 id="comments_leave_comment"> Leave a Comment </h2>
-        {% endif %}
-      </main>
-      <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ end main for split page (TOC) ] -->
-      {% comment %} Place Sidebar|Tocbot
-      -------------------------------------------------------------------------- {% endcomment %}
-      <!-- NOTE: BS or Tocbot Affix is not used anymore. Replaced by CSS style "sticky" -->
-      {% comment %} tocbot and page_navigation (not used anymore)
-      --------------------------------------------------------------------------
-      <aside class="col-md-3 d-none d-md-block sticky">
-        <div id="sidebar">
-          <div id="j1-toc-mgr" class="toc js-toc"></div>
-        </div>
-      </aside>
-      -------------------------------------------------------------------------- {% endcomment %}
-    {% endif %} <!-- endif sidebar -->
-
-  </div> <!-- end row -->
-</div> <!-- end container -->
-<!-- [INFO   ] [j1.layout.content_generator_page.html ] [ end place content ] -->
+<!-- [INFO   ] [j1.layout.content_generator_page.html ] [ start main for full page ] -->
+<main class="r-text-{{rtext_size}} js-toc-content">
+  <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ begin place content ] -->
+  {{content}}
+  <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ end place content ] -->
+</main>
+<!-- [INFO   ] [j1.layout.content_generator_page.html ] [ end main for full page ] -->
 
 {% comment %} Calc|Write the Back URL
 -------------------------------------------------------------------------------- {% endcomment %}
@@ -111,7 +63,7 @@
   {% capture browser_page_url %}{{page.url}}{% endcapture %}
 {% endif %}
 
-<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current ArticleBrowser page to UserState cookie] -->
+<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current page to UserState cookie] -->
 <!-- script>
         var logger   = log4javascript.getLogger("j1.page.{{page.title|downcase}}.init");
         var cookieUserState = 'j1.user.state'

data/_includes/themes/j1/layouts/content_generator_post.html

@@ -79,7 +79,7 @@
   {% if sidebar == false %}
     <!-- FULL page - no sidebar for page toc -->
     <div class="row">
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
+      <main class="r-text-{{rtext_size}} js-toc-content">
         <!-- Include a pager at top position -->
         {% include {{pager}} %}
         <!-- div class="featured-headline" -->
@@ -93,6 +93,7 @@
         <nav class="nav bmd-layout-container custom-size-350 bmd-drawer-f-l">
 
           <header class="bmd-layout-header">
+            <!-- div class="navbar navbar-dark bg-primary raised-z2 mb-4" -->
             <div class="navbar navbar-dark bg-primary raised-z2 mb-4">
               <button class="bmd-drawer drawer-toggler animated fadeIn" type="button" data-toggle="drawer" data-target="#post_navigator">
                 <span class="mdi mdi-menu mdi-2x"></span>
@@ -138,7 +139,7 @@
     <!-- SPLIT page. Place a sidebar e.g. for the document toc -->
     <div class="row">
       <!-- main class="col-md-9 col-xs-12 r-text-{{rtext_size}} js-toc-content" -->
-      <main class="col-md-12 col-xs-12 r-text-{{rtext_size}} js-toc-content">
+      <main class="r-text-{{rtext_size}} js-toc-content">
 
         <!-- Include a pager at top position -->
         {% include {{pager}} %}
@@ -152,6 +153,7 @@
         <nav class="nav bmd-layout-container custom-size-350 bmd-drawer-f-l">
 
           <header class="bmd-layout-header">
+            <!-- div class="navbar navbar-dark bg-primary raised-z2 mb-4" -->
             <div class="navbar navbar-dark bg-primary raised-z2 mb-4">
               <button class="bmd-drawer drawer-toggler animated fadeIn" type="button" data-toggle="drawer" data-target="#post_navigator">
                 <span class="mdi mdi-menu mdi-2x"></span>

data/_includes/themes/j1/modules/navigator/procedures/topsearch.proc

@@ -108,7 +108,7 @@
           {% if search_heading_lead %}<div class="panel-heading lead">{{ search_heading_lead }}</div>{% endif %}
           {% if result_heading_lead %}<div class="panel-body"><p>{{ result_heading_lead }}</p></div>{% endif %}
           <div class="search-list-group">
-            <ul id="jss-results"></ul>
+            <ul id="jss-results" class="search-list-item"></ul>
           </div>
         </div>
       </div>

data/_includes/themes/j1/procedures/global/create_bs_button.proc

@@ -44,18 +44,18 @@
 {% assign button_type = include.button_type | strip | downcase %}
 
 {% comment %} Liquid procedures
---------------------------------------------------------------- {% endcomment %}
+-------------------------------------------------------------------------------- {% endcomment %}
 {% capture select_color     %}themes/{{site.template.name}}/procedures/global/select_color.proc{% endcapture %}
 
 
 {% comment %} Main
---------------------------------------------------------------- {% endcomment %}
+-------------------------------------------------------------------------------- {% endcomment %}
 
 {% case button_type %}
 
   {% when 'link' %}
   {% comment %} Create BS link button
-  ------------------------------------------------------------- {% endcomment %}
+  ------------------------------------------------------------------------------ {% endcomment %}
 
     {% for item in button_data %}
 
@@ -74,25 +74,25 @@
     {% endfor %}
 
     {% if button_href and button_target %}
-      {% capture bs_button_html %}<a href="{{button_href}}" target="{{ button_target }}" class="btn {{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
+      {% capture bs_button_html %}<a href="{{button_href}}" target="{{ button_target }}" class="{{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
     {% elsif button_href %}
-      {% capture bs_button_html %}<a href="{{button_href}}" class="btn {{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
+      {% capture bs_button_html %}<a href="{{button_href}}" class="{{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
     {% else %}
       {% capture bs_button_html %}<!-- INFO: No valid value for parameter href found. -->{% endcapture %}
     {% endif %}
 
   {% when 'input' %}
   {% comment %} Create BS link button
-  ------------------------------------------------------------- {% endcomment %}
+  ------------------------------------------------------------------------------ {% endcomment %}
 
   {% when 'submit' %}
   {% comment %} Create BS link button
-  ------------------------------------------------------------- {% endcomment %}
+  ------------------------------------------------------------------------------ {% endcomment %}
 
 
   {% when 'card' %}
   {% comment %} Create BS card button
-  ------------------------------------------------------------- {% endcomment %}
+  ------------------------------------------------------------------------------ {% endcomment %}
 
     {% for item in button_data %}
 
@@ -110,7 +110,7 @@
     {% endfor %}
 
     {% if button_href %}
-      {% capture bs_button_html %}<a href="{{button_href}}" class="btn {{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
+      {% capture bs_button_html %}<a href="{{button_href}}" class="{{button_class}}"><i class="{{icon_family}} {{icon_family}}-{{button_icon}} {{icon_family}}-{{button_icon_size}} {{icon_family}}-{{button_icon_color}} mr-1"></i> {{button_text}} </a>{% endcapture %}
     {% else %}
       {% capture bs_button_html %}<!-- INFO: No valid value for parameter href found. -->{% endcapture %}
     {% endif %}
@@ -119,7 +119,7 @@
 {% endcase %}
 
 {% comment %} Reset Liquid vars
---------------------------------------------------------------- {% endcomment %}
+-------------------------------------------------------------------------------- {% endcomment %}
 
 {% assign button_text       = nil %}
 {% assign button_class      = nil %}

data/_includes/themes/j1/procedures/posts/collate_timeline.proc

@@ -90,12 +90,13 @@
       <li class="{{blog_position}}">
         <div class="timeline-badge"><i class="tmicon rounded-x hidden-xs"></i></div>
 
-        <div class="timeline-panel">
+        <div class="card raised-z5 timeline-panel">
 
-          <div class="timeline-title">
-            <a href="{{post.url}}">
-              <h4 id="{{1000000 | rand}}" class="font-light">{{post.title}}</h4>
-            </a>
+          <!-- div class="timeline-title" -->
+          <div class="card-header bg-primary pt-4 pb-3">
+            <!-- a href="{{post.url}}" -->
+              <h3 id="{{1000000 | rand}}" class="md-white">{{post.title}}</h3>
+            <!-- /a -->
           </div>
 
           <!-- Collect icon data from frontmatter -->
@@ -139,13 +140,13 @@
                 <p class="card-subtitle text-muted">{{post.tagline}}</p>
               </div>
               <div class="timeline-excerpt mb-4">
-                {% assign excerpt = post.excerpt | truncatewords: 50 | strip_html | strip_newlines | strip %}
+                {% assign excerpt = post.excerpt|truncatewords: 50|replace:'...',' ...'|strip_html|strip_newlines|strip %}
                 <i class="timeline-icon {{icon_family}} {{icon_family}}-{{icon_name}} {{icon_family}}-{{icon_size}} {{icon_family}}-{{icon_color}}"></i>
                 {{excerpt}}
               </div>
               <div class="card-footer">
                 <a href="{{post.url}}#readmore"
-                   class="btn btn-primary btn-raised btn-flex mb-0">
+                   class="btn btn-secondary btn-raised btn-flex mb-0">
                    <i class="mdi mdi-eye mdi-lg mr-1" style="color:#FFFFFF;">
                    </i> Read · {{post.tagline}}
                 </a>
@@ -161,12 +162,12 @@
                 <p class="card-subtitle text-muted">{{post.tagline}}</p>
               </div>
               <div class="timeline-excerpt mb-4">
-                {% assign excerpt = post.excerpt | truncatewords: 50 | strip_html | strip_newlines | strip %}
+                {% assign excerpt = post.excerpt|truncatewords: 50|replace:'...',' ...'|strip_html|strip_newlines|strip %}
                 {{excerpt}}
               </div>
               <div class="card-footer">
                 <a href="{{post.url}}#readmore"
-                   class="btn btn-primary btn-raised btn-flex mb-0">
+                   class="btn btn-secondary btn-raised btn-flex mb-0">
                    <i class="mdi mdi-eye mdi-lg mr-1" style="color:#FFFFFF;">
                    </i> Read · {{post.tagline}}
                 </a>
@@ -174,50 +175,48 @@
             </div>
           {% else %}
             <!-- !place_icon && !place_image -->
-            <div class="timeline-body">
-              <div class="timeline-tagline">
+            <!-- div class="timeline-body" -->
+            <div class="card-body r-text-300">
+              <!-- div class="tagline">
                 <p class="card-subtitle text-muted">{{post.tagline}}</p>
-              </div>
-              <div class="timeline-excerpt mb-4">
-                {% assign excerpt = post.excerpt | truncatewords: 50 | strip_html | strip_newlines | strip %}
+              </div -->
+              <div class="excerpt">
+                {% assign excerpt = post.excerpt|truncatewords: 50|replace:'...',' ...'|strip_html|strip_newlines|strip %}
                 {{excerpt}}
               </div>
-              <div class="card-footer">
-                <a href="{{post.url}}#readmore"
-                   class="btn btn-primary btn-raised btn-flex mb-0">
-                   <i class="mdi mdi-eye mdi-lg mr-1" style="color:#FFFFFF;">
-                   </i> Read · {{post.tagline}}
-                </a>
-              </div>
             </div>
-          {% endif %}
-
-          <!-- Collect comment provider details -->
-          {% for sharing in builder_config.sharing_provider %}
-            {% assign provider      = sharing.provider %}
-            {% assign likes_count   = sharing.likes_count %}
-            {% assign comment_count = sharing.comment_count %}
-          {% endfor %}
-
-          <div class="timeline-footer">
-            <ul class="timeline-list-unstyled list-inline blog-info">
-              <li><i class="mdi mdi-calendar-blank mr-1"></i> {{post.date | date: "%Y %B, %e"}}</li>
+            <!-- Collect comment provider details -->
+            {% for sharing in builder_config.sharing_provider %}
+              {% assign provider      = sharing.provider %}
+              {% assign likes_count   = sharing.likes_count %}
+              {% assign comment_count = sharing.comment_count %}
+            {% endfor %}
+
+            <div class="card-body text-muted r-text-200">
+              <i class="mdi mdi-calendar-blank mr-1"></i> {{post.date | date: "%Y %B, %e"}}
               {% if comment_count %}
                 <!-- comment_count enabled  -->
                 <!-- <li><i class="mdi mdi-comment"></i> <a href="#"> 7 Comments</a></li> -->
                 <li><a href="#"><i class="mdi mdi-comment"></i> 7 Comments</a></li>
               {% endif %}
-            </ul>
-            {% if likes_count %}
-              <!-- likes_count enabled  -->
-              <a class="likes" href="#"><i class="mdi mdi-heart"></i> 239</a>
-            {% endif %}
-          </div>
+
+              {% if likes_count %}
+                <!-- likes_count enabled  -->
+                <li><a class="likes" href="#"><i class="mdi mdi-heart"></i> 239</a></li>
+              {% endif %}
+            </div>
+
+            <div class="card-footer r-text-200">
+              <a class="card-link md-blue font-weight-bold g-font-size-12 text-uppercase" href="{{post.url}}#readmore">
+                 Read · {{post.tagline}}
+              </a>
+            </div>
+          {% endif %}
         </div>
       </li>
       {% endfor %}
       <!-- final|last element placed as an empty list item -->
-      <li class="clearfix" style="float: none;"></li>
+      <li class="clearfix mb-0" style="float: none;"></li>
     </ul>
     <!-- End Timeline Collator -->
   {% endif %}