improve new layout for post list

This commit is contained in:
Oscar Cortez 2015-07-11 16:05:02 -06:00
parent c55d91da8f
commit 1f45261161
7 changed files with 65 additions and 35 deletions

View file

@ -3,25 +3,24 @@ layout: default
---
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--12-col">
<h1 class="page-heading">Posts</h1>
<ul class="post-list">
{% for post in site.posts %}
<li>
<span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
<h2>
<a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
</h2>
</li>
{% endfor %}
</ul>
<p class="rss-subscribe">subscribe <a href="{{ "/feed.xml" | prepend: site.baseurl }}">via RSS</a></p>
{% for post in site.posts %}
<div 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" {{ post.url | prepend: site.baseurl }}>
<h2 class="mdl-card__title-text">{{ post.title }}</h2>
</div>
<div class="mdl-card__supporting-text">
{{ post.excerpt }}
</div>
<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>
</div>
{% endfor %}
</div>