me/bbc-young-reporter
1
0
Fork 0
mirror of https://github.com/mgrove36/bbc-young-reporter.git synced 2026-03-03 03:17:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add list group for each year of articles on the navbar

Browse Source
This commit is contained in:
Matthew Grove
2019-02-05 20:25:51 +00:00
parent 3ede6835fb
commit cbe34aa100
3 changed files with 22 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
_includes/navbar.html
View File

@@ -14,17 +14,26 @@
</a> </a>
{% if site.categories.articles %} {% if site.categories.articles %}
<div class="mdc-list-group"> <div class="mdc-list-group">
<h3 class="mdc-list-group__subheader">Articles</h3> <h3 class="mdc-typography--headline7">Articles</h3>
{% for article in site.categories.articles %} {% for article in site.categories.articles %}
{% assign currentdate = article.date | date: "%Y" %} {% assign currentdate = article.date | date: "%Y" %}
{% if currentdate != date %} {% if currentdate != date %}
{% if article.url != site.categories.articles.first.url %}
</div>
{% endif %}
<div class="mdc-list-group">
<h3 class="mdc-list-group__subheader">{{ currentdate }}</h3> <h3 class="mdc-list-group__subheader">{{ currentdate }}</h3>
{% assign date = currentdate %} {% assign date = currentdate %}
{% endif %} {% endif %}
<a class="mdc-list-item" href="{{ page.url | relative_url }}" data-mdc-auto-init="MDCRipple"> <a class="mdc-list-item" href="{{ article.url | relative_url }}" data-mdc-auto-init="MDCRipple">
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">assignment</i> <i class="material-icons mdc-list-item__graphic" aria-hidden="true">assignment</i>
<span class="mdc-list-item__text">{{ article.title }}</span> <span class="mdc-list-item__text">{{ article.title }}</span>
</a> </a>
{% if currentdate != date %}
{% endif %}
{% if article.url == site.categories.articles.last.url %}
</div>
{% endif %}
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}

5
css/global.css
View File

@@ -18,6 +18,11 @@ a {
color: var(--mdc-theme-secondary); color: var(--mdc-theme-secondary);
} }
.mdc-list-group h3 {
margin: 20px 16px auto 16px;
font-weight: normal;
}
.mdc-drawer-app-content { .mdc-drawer-app-content {
flex: auto; flex: auto;
overflow: auto; overflow: auto;

7
css/mdc-card-list.css
View File

@@ -14,7 +14,7 @@
clear:left; clear:left;
width: 49%; width: 49%;
} }
.main-content .mdc-card:nth-of-type(4n){ .main-content .mdc-card:nth-of-type(even){
float:right; float:right;
clear:right; clear:right;
} }
@@ -23,3 +23,8 @@
clear: none; clear: none;
width: auto; width: auto;
} }
.main-content .mdc-card:nth-of-type(odd) ~ .mdc-card:last-of-type {
float: none;
clear: both;
width: auto;
}