45 lines
1.8 KiB
HTML
45 lines
1.8 KiB
HTML
---
|
|
layout: default
|
|
---
|
|
|
|
{% if paginator.page %}
|
|
{% assign offset = paginator.page | minus:1 | times:paginator.per_page %}
|
|
{% assign currentPage = paginator.page %}
|
|
{% else %}
|
|
{% assign offset = 0 %}
|
|
{% assign currentPage = 1 %}
|
|
{% endif %}
|
|
|
|
<div class="mdl-grid" id="js-post-container" data-page="{{ currentPage }}" data-total-pages="{{ paginator.total_pages }}">
|
|
{% for post in site.posts limit:site.paginate offset:offset %}
|
|
<article class="mdl-card mdl-shadow--2dp mdl-cell mdl-cell--4-col mdl-cell--4-col-desktop mdl-cell--4-col-tablet mdl-cell--12-col-phone">
|
|
<div class="mdl-card__title">
|
|
<h2 class="mdl-card__title-text">{{ post.title }}</h2>
|
|
</div>
|
|
<div class="mdl-card__supporting-text">
|
|
{{ post.excerpt }}
|
|
</div>
|
|
<button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored" onclick="location.href='{{ post.url | prepend: site.baseurl }}'">
|
|
<i class="material-icons">keyboard_arrow_right</i>
|
|
</button>
|
|
<div class="mdl-card__actions mdl-card--border">
|
|
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
|
|
{{ post.date | date: "%b %-d, %Y" }}
|
|
</a>
|
|
</div>
|
|
<div class="mdl-card__menu">
|
|
<button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
|
|
<i class="material-icons">share</i>
|
|
</button>
|
|
</div>
|
|
</article>
|
|
{% endfor %}
|
|
|
|
{% assign postCount = site.posts | size %}
|
|
{% assign postsCovered = site.paginate | plus:offset %}
|
|
{% if postsCovered < postCount %}
|
|
<button id="js-load-more">Load more posts</button>
|
|
{% endif %}
|
|
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
|
|
<script rel="javascript" src="{{ "/js/site.js" | prepend: site.baseurl }}"></script>
|
|
</div>
|