Merge pull request creativecommons#326 from creativecommons/update_all_series

update all series page

Author: Dhruvi16

themes/vocabulary_theme/templates/blog-series-list.html

@@ -1,8 +1,14 @@
 {% extends "layout.html" %}
-{% from "macros/categories.html" import render_categories %}
-{% block title %}{{ this.parent.children.get('entries').title }}{% endblock %}
-{% block header %}{{ this.parent.children.get('entries').title }}{% endblock %}
+
+{% from "macros/series.html" import render_series %}
+
 {% block body %}
-  <h2>All Series</h2>
-  {{ render_categories(this) }}
+<div class="all-series">
+  <div class="title">
+    <h1 class="container">All Series</h1>
+  </div>
+  <div class="series-list container">
+    {{ render_series(this) }}
+  </div>
+</div>
 {% endblock %}

themes/vocabulary_theme/templates/macros/series.html

@@ -0,0 +1,7 @@
+{% from "macros/posts.html" import render_posts %}
+
+{% macro render_series(series) %}
+  {% for serie in site.query(series.path) %}
+    <h4 class="series-link"><a class="link" href="{{ serie|url }}">{{ serie.name }}</a></h4>
+  {% endfor %}
+{% endmacro %}

webpack/sass/main.scss

@@ -223,3 +223,38 @@ a {
     @extend .padding-bottom-xxl;
   }
 }
+
+.all-series {
+  .title {
+    background-color: $color-lighter-gray;
+
+    .container {
+      @extend .padding-horizontal-big;
+      @extend .padding-bottom-xl;
+    }
+  }
+
+  .series-list {
+    @extend .padding-horizontal-big;
+    @extend .padding-top-xl;
+    @extend .padding-bottom-xxl;
+
+    .series-link {
+      .link {
+        @extend .has-color-dark-slate-gray;
+      }
+
+      @extend .padding-bottom-big;
+
+      &:not(:last-of-type)::after {
+        @extend .padding-top-big;
+
+        display: block;
+
+        content: '';
+
+        border-bottom:  0.1875rem solid $color-light-gray;
+      }
+    }
+  }
+}