Major styling update
This commit is contained in:
@ -3,41 +3,46 @@
|
||||
{%- set nextPost = collections.posts | getNextCollectionItem %}
|
||||
{%- if nextPost or previousPost %}
|
||||
<section class="links-nextprev">
|
||||
{%- if previousPost %}
|
||||
<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
|
||||
<a href="{{ previousPost.url }}" class="postlist-link">
|
||||
<div class="post-image-container">
|
||||
<img class="post-image" {% if previousPost.data.imageURL %} src="{{ previousPost.data.imageURL }}" alt="{{ previousPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
|
||||
</div>
|
||||
</a>
|
||||
<div class="post-copy">
|
||||
<h2>Read Next</h2>
|
||||
<div class="postlist-item-container">
|
||||
{%- if previousPost %}
|
||||
<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
|
||||
<a href="{{ previousPost.url }}" class="postlist-link">
|
||||
<h3>
|
||||
{% if previousPost.data.title %}<span>Previous Article:</span><br>{{ previousPost.data.title }}{% else %}<code>{{ previousPost.url }}</code>{% endif %}
|
||||
</h3>
|
||||
<div class="post-image-container">
|
||||
<img class="post-image" {% if previousPost.data.imageURL %} src="{{ previousPost.data.imageURL }}" alt="{{ previousPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
|
||||
</div>
|
||||
</a>
|
||||
<time class="postlist-date" datetime="{{ previousPost.date | htmlDateString }}">{{ previousPost.date | readableDate("LLLL yyyy") }}</time>
|
||||
{% if previousPost.data.synopsis %}<p>{{ previousPost.data.synopsis | truncate(150) | safe }}</p>{% else %}{{ previousPost.content | truncate(150) | safe }}{% endif %}
|
||||
</div>
|
||||
</article>
|
||||
|
||||
{% endif %}
|
||||
{%- if nextPost %}
|
||||
<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
|
||||
<a href="{{ nextPost.url }}" class="postlist-link">
|
||||
<div class="post-image-container">
|
||||
<img class="post-image" {% if nextPost.data.imageURL %} src="{{ nextPost.data.imageURL }}" alt="{{ nextPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
|
||||
<div class="post-copy">
|
||||
<a href="{{ previousPost.url }}" class="postlist-link">
|
||||
<p>Previous Article:</p>
|
||||
<h3>
|
||||
{% if previousPost.data.title %}{{ previousPost.data.title }}{% else %}<code>{{ previousPost.url }}</code>{% endif %}
|
||||
</h3>
|
||||
</a>
|
||||
<time class="postlist-date" datetime="{{ previousPost.date | htmlDateString }}">{{ previousPost.date | readableDate("LLLL yyyy") }}</time>
|
||||
{% if previousPost.data.synopsis %}<p>{{ previousPost.data.synopsis | truncate(105) | safe }}</p>{% else %}{{ previousPost.content | truncate(105) | safe }}{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
<div class="post-copy">
|
||||
</article>
|
||||
|
||||
{% endif %}
|
||||
{%- if nextPost %}
|
||||
<article class="postlist-item{% if post.url == url %} postlist-item-active{% endif %}">
|
||||
<a href="{{ nextPost.url }}" class="postlist-link">
|
||||
<h3>
|
||||
{% if nextPost.data.title %}<span>Next Article:</span><br>{{ nextPost.data.title }}{% else %}<code>{{ nextPost.url }}</code>{% endif %}
|
||||
</h3>
|
||||
<div class="post-image-container">
|
||||
<img class="post-image" {% if nextPost.data.imageURL %} src="{{ nextPost.data.imageURL }}" alt="{{ nextPost.data.imageAlt }}" {% else %} src="{{ metadata.defaultPostImageURL }}" alt="{{ metadata.defaultPostImageAlt }}"{% endif %}>
|
||||
</div>
|
||||
</a>
|
||||
<time class="postlist-date" datetime="{{ nextPost.date | htmlDateString }}">{{ nextPost.date | readableDate("LLLL yyyy") }}</time>
|
||||
{% if nextPost.data.synopsis %}<p>{{ nextPost.data.synopsis | truncate(150) | safe }}</p>{% else %}{{ nextPost.content | truncate(150) | safe }}{% endif %}
|
||||
</div>
|
||||
<div class="post-copy">
|
||||
<a href="{{ nextPost.url }}" class="postlist-link">
|
||||
<p>Next Article:</p>
|
||||
<h3>
|
||||
{% if nextPost.data.title %}{{ nextPost.data.title }}{% else %}<code>{{ nextPost.url }}</code>{% endif %}
|
||||
</h3>
|
||||
</a>
|
||||
<time class="postlist-date" datetime="{{ nextPost.date | htmlDateString }}">{{ nextPost.date | readableDate("LLLL yyyy") }}</time>
|
||||
{% if nextPost.data.synopsis %}<p>{{ nextPost.data.synopsis | truncate(105) | safe }}</p>{% else %}{{ nextPost.content | truncate(105) | safe }}{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
|
Reference in New Issue
Block a user