web/_layouts/home.html
Cotes Chung d9e1d84f08
refactor(deps): upgrade bootstrap from v4.6 to v5.2
- update class name of the spacing, font style, cards and toasts
- update attribute names &  tooltip usage
- remove custom smooth scroll
- syntax colors
2023-05-13 02:05:33 +08:00

102 lines
3 KiB
HTML

---
layout: page
refactor: true
---
{% include lang.html %}
{% assign pinned = site.posts | where: 'pin', 'true' %}
{% assign default = site.posts | where_exp: 'item', 'item.pin != true and item.hidden != true' %}
{% assign posts = '' | split: '' %}
<!-- Get pinned posts -->
{% assign offset = paginator.page | minus: 1 | times: paginator.per_page %}
{% assign pinned_num = pinned.size | minus: offset %}
{% if pinned_num > 0 %}
{% for i in (offset..pinned.size) limit: pinned_num %}
{% assign posts = posts | push: pinned[i] %}
{% endfor %}
{% else %}
{% assign pinned_num = 0 %}
{% endif %}
<!-- Get default posts -->
{% assign default_beg = offset | minus: pinned.size %}
{% if default_beg < 0 %}
{% assign default_beg = 0 %}
{% endif %}
{% assign default_num = paginator.posts | size | minus: pinned_num %}
{% assign default_end = default_beg | plus: default_num | minus: 1 %}
{% if default_num > 0 %}
{% for i in (default_beg..default_end) %}
{% assign posts = posts | push: default[i] %}
{% endfor %}
{% endif %}
<div id="post-list">
{% for post in posts %}
<a href="{{ post.url | relative_url }}" class="card-wrapper">
<div class="card post-preview flex-md-row-reverse">
{% if post.image %}
{% if post.image.lqip %}
{% capture lqip %}lqip="{{ post.image.lqip }}"{% endcapture %}
{% endif %}
<img src="{{ post.image.path | default: post.image }}" w="15" h="8" {{ lqip }}>
{% endif %}
<div class="card-body d-flex flex-column">
<h1 class="card-title my-2 mt-md-0">
{{ post.title }}
</h1>
<div class="card-text post-content mt-0 mb-2">
<p>
{% include no-linenos.html content=post.content %}
{{ content | markdownify | strip_html | truncate: 200 | escape }}
</p>
</div>
<div class="post-meta flex-grow-1 d-flex align-items-end">
<div class="me-auto">
<!-- posted date -->
<i class="far fa-calendar fa-fw me-1"></i>
{% include datetime.html date=post.date lang=lang %}
<!-- categories -->
{% if post.categories.size > 0 %}
<i class="far fa-folder-open fa-fw me-1"></i>
<span class="categories">
{% for category in post.categories %}
{{ category }}
{%- unless forloop.last -%},{%- endunless -%}
{% endfor %}
</span>
{% endif %}
</div>
{% if post.pin %}
<div class="pin ms-1">
<i class="fas fa-thumbtack fa-fw"></i>
<span>{{ site.data.locales[lang].post.pin_prompt }}</span>
</div>
{% endif %}
</div>
<!-- .post-meta -->
</div>
<!-- .card-body -->
</div>
</a>
{% endfor %}
</div>
<!-- #post-list -->
{% if paginator.total_pages > 1 %}
{% include post-paginator.html %}
{% endif %}