95 lines
3.5 KiB
Twig
95 lines
3.5 KiB
Twig
{% extends "layout.twig" %}
|
|
|
|
{% block title %}Slim Blog{% endblock %}
|
|
|
|
{% block meta %}
|
|
<meta name="description" content="{% if activeCategory %}Articles de la catégorie {{ activeCategory.name }} — {% endif %}Slim Blog, un blog propulsé par Slim 4.">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="Slim Blog">
|
|
<meta property="og:description" content="Un blog propulsé par Slim 4.">
|
|
<meta property="og:url" content="{{ app_url }}/">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
|
|
<form method="get" action="/" class="search-bar">
|
|
{% if activeCategory %}
|
|
<input type="hidden" name="categorie" value="{{ activeCategory.slug }}">
|
|
{% endif %}
|
|
<input type="search" name="q" value="{{ searchQuery }}"
|
|
placeholder="Rechercher un article…" class="search-bar__input" aria-label="Recherche">
|
|
<button type="submit" class="search-bar__btn">Rechercher</button>
|
|
{% if searchQuery %}
|
|
<a href="/{% if activeCategory %}?categorie={{ activeCategory.slug }}{% endif %}" class="search-bar__reset">✕</a>
|
|
{% endif %}
|
|
</form>
|
|
|
|
{% if searchQuery %}
|
|
<p class="search-bar__info">
|
|
{% if posts is not empty %}
|
|
{{ posts|length }} résultat{{ posts|length > 1 ? 's' : '' }} pour « {{ searchQuery }} »
|
|
{% else %}
|
|
Aucun résultat pour « {{ searchQuery }} »
|
|
{% endif %}
|
|
</p>
|
|
{% endif %}
|
|
|
|
{% if categories is not empty %}
|
|
<nav class="category-filter">
|
|
<a href="/"
|
|
class="category-filter__item{% if activeCategory is null %} category-filter__item--active{% endif %}">
|
|
Tous
|
|
</a>
|
|
{% for category in categories %}
|
|
<a href="/?categorie={{ category.slug }}"
|
|
class="category-filter__item{% if activeCategory and activeCategory.id == category.id %} category-filter__item--active{% endif %}">
|
|
{{ category.name }}
|
|
</a>
|
|
{% endfor %}
|
|
</nav>
|
|
{% endif %}
|
|
|
|
<div class="card-list card-list--contained">
|
|
{% for post in posts %}
|
|
{% set thumb = post_thumbnail(post) %}
|
|
<article class="card">
|
|
|
|
<a href="{{ post_url(post) }}" class="card__thumb-link" tabindex="-1" aria-hidden="true">
|
|
{% if thumb %}
|
|
<img class="card__thumb" src="{{ thumb }}" alt="">
|
|
{% else %}
|
|
<span class="card__initials" aria-hidden="true">{{ post_initials(post) }}</span>
|
|
{% endif %}
|
|
</a>
|
|
|
|
<div class="card__content">
|
|
<div class="card__body">
|
|
<h2 class="card__title">
|
|
<a href="{{ post_url(post) }}" class="card__title-link">{{ post.title }}</a>
|
|
</h2>
|
|
|
|
<div class="card__meta">
|
|
<small>
|
|
Publié le {{ post.createdAt|date("d/m/Y à H:i") }}
|
|
par <strong>{{ post.authorUsername ?? 'inconnu' }}</strong>
|
|
</small>
|
|
{% if post.categoryName %}
|
|
<a href="/?categorie={{ post.categorySlug }}" class="badge badge--category">{{ post.categoryName }}</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<p class="card__excerpt">{{ post_excerpt(post) }}</p>
|
|
</div>
|
|
|
|
<div class="card__actions">
|
|
<a href="{{ post_url(post) }}" class="card__actions-link">Lire la suite →</a>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
{% else %}
|
|
<p>Aucun article publié{% if searchQuery %} pour « {{ searchQuery }} »{% elseif activeCategory %} dans cette catégorie{% endif %}.</p>
|
|
{% endfor %}
|
|
</div>
|
|
{% endblock %}
|