blog.html in jekyll-theme-centos-0.2.0

- old
+ new
@@ -1,61 +1,55 @@
 ---
 layout: default
 ---
 
-<main class="page">
-  <div class="row">
+<main class="blog">
 
-    <div class="col">
-      <ol class="breadcrumb">
-        <li class="breadcrumb-item"><a href="/">Home</a></li>
-        <li class="breadcrumb-item active">{{ page.title | capitalize }}</li>
-      </ol>
-    </div>
+  <ol class="blog__breadcrumb">
+    <li class="blog__breadcrumb__item"><a href="/">Home</a></li>
+    <li class="blog__breadcrumb__item abreadcrumb-item--active">{{ page.title | capitalize }}</li>
+  </ol>
 
-    <div class="col text-right">
-      <a href="{{ "/feed.xml" | relative_url }}"><button type="button" class="btn btn-light"><i class="fas fa-rss"></i></button></a>
-    </div>
-
-  </div>
-
-  <div class="row">
-    <div class="blog">
+  <section class="blog__entries">
       {%- if site.posts.size > 0 -%}
-      <div class="d-flex align-content-start flex-wrap align-content-stretch">
+      <div class="blog__entries__card">
         {%- for post in paginator.posts -%}
-        <div class="card">
-          <a href="{{ post.url | relative_url }}">
-          <div class="card-body">
+        <div class="blog__entries__card__item">
             {%- assign date_format = site.date_format | default: "%b %-d, %Y" -%}
             {%- if post.image -%}
-            <img class="card-img-top" src="{{ post.image }}" alt="{{ post.title | escape }}">
+            <a href="{{ post.url | relative_url }}"><img class="blog__entries__card__item__image" src="{{ post.image }}" alt="{{ post.title | escape }}"></a>
             {%- endif -%}
-            <h5 class="card-title">{{ post.title | escape }}</h5>
-            <p class="card-date">{{ post.date | date: date_format }}</p>
+            <a href="{{ post.url | relative_url }}"><h4 class="blog__entries__card__item__title">{{ post.title | escape }}</h4></a>
+            <p class="blog__entries__card__item__date">{{ post.date | date: date_format }}</p>
             {%- if site.show_excerpts -%}
-            <p class="card-excerpt">{{ sponsor.excerpt }}</p>
+            <p class="blog__entries__card__item__excerpt">{{ sponsor.excerpt }}</p>
             {%- endif -%}
           </div>
-        </a>
-        </div>
         {% endfor %}
       </div>
       {%- endif -%}
+  </section>
 
-      {% if paginator.total_pages > 1 %}
-      <div class="paginator">
-        {% if paginator.previous_page %}
-        <span class="newer">
-          <a href="{{ paginator.previous_page_path }}"><i class="fas fa-arrow-left"></i> Newer</a>
-        </span>
-        {% endif %}
-        {% if paginator.next_page %}
-        <span class="older">
-          <a href="{{ paginator.next_page_path }}"> Older <i class="fas fa-arrow-right"></i></a>
-        </span>
-        {% endif %}
-      </div>
-      {% endif %}
+  {% if paginator.total_pages > 1 %}
+  <nav class="blog__navbar">
+    {% if paginator.previous_page %}
+    <div class="blog__navbar__newer">
+    {% else %}
+    <div class="blog__navbar__newer--disabled">
+    {% endif %}
+    <a href="{{ paginator.previous_page_path }}"><button type="button" class="btn btn-light" data-toggle="tooltip" data-placement="top" title="Newer Posts"><i class="fas fa-arrow-left"></i></button></a>
     </div>
+    <div class="blog__navbar__feeds">
+      <a href="{{ "/feed.xml" | relative_url }}"><button type="button" class="btn btn-light" data-toggle="tooltip" data-placement="top" title="RSS"><i class="fas fa-rss"></i></button></a>
+    </div>
+    {% if paginator.next_page %}
+    <div class="blog__navbar__older">
+    {% else %}
+    <div class="blog__navbar__older--disabled">
+    {% endif %}
+    <a href="{{ paginator.next_page_path }}"><button type="button" class="btn btn-light" data-toggle="tooltip" data-placement="top" title="Older Posts"><i class="fas fa-arrow-right"></i></button></a>
+    </div>
   </div>
+  {% endif %}
+  </nav>
+
 </main>