Merge pull request #426 from Soroosh/archive

Add blog archive page

_layouts/archive.liquid

@@ -0,0 +1,33 @@
+---
+layout: page
+---
+
+<div class="home">
+ <div id="archive">
+ {% assign postsByYear = site.posts | group_by_exp:"post", "post.date | date: '%Y'" %}
+ <ul class="archive-clouds">
+ {% for year in postsByYear %}
+ <a href="#archive-{{ year.name | cgi_escape }}" class="archive-anchor">
+ <li>
+ {{ year.name | cgi_escape }} ({{year.items.size}})
+ </li>
+ </a>
+ {% endfor %}
+ </ul>
+ {% for year in postsByYear %}
+ <div class="archive-group">
+ <h4 id="archive-{{year.name}}" class="title">{{ year.name }} ({{year.items.size}})</h4>
+ <div class="items">
+ {% for post in year.items %}
+ <a href="{{ post.url | relative_url }}" class="archive-post-link">
+ <div class="item">
+ <p class="meta">{{ post.date | date: site.data.language.str_date_format | default: '%B %-d, %Y' }}</p>
+ <p class="title">{{ post.title }}</p>
+ </div>
+ </a>
+ {% endfor %}
+ </div>
+ </div>
+ {% endfor %}
+ </div>
+</div>

_sass/layouts/_categories.scss

@@ -1,4 +1,6 @@
+#archive,
 #categories {
+ .archive-clouds,
  .category-clouds {
  margin: 30px 0 30px;
 
@@ -30,12 +32,14 @@
  color: var(--header-text);
  }
 
+ .archive-anchor:hover,
  .category-anchor:hover {
  text-decoration: none !important;
  filter: none;
  }
  }
 
+ .archive-group,
  .category-group {
  padding: 15px 0 10px;
 
@@ -71,6 +75,7 @@
  height: 100%;
  }
 
+ .archive-post-link:hover,
  .category-post-link:hover {
  text-decoration: none;
 

pages/archive.md

@@ -0,0 +1,9 @@
+---
+layout: archive
+title: "Blog Archive"
+permalink: /archive/
+hide: true
+excluded: true
+icon: "fa-archive"
+position: 6
+---