46 lines
1.8 KiB
Twig
46 lines
1.8 KiB
Twig
{% extends 'partials/base.html.twig' %}
|
||
|
||
{% block content %}
|
||
{% set stories = page.children.published().order('date', 'asc') %}
|
||
|
||
<div class="stories-listing">
|
||
<h1 class="stories-listing__heading">Stories</h1>
|
||
|
||
{% if stories|length > 0 %}
|
||
<div class="stories-grid">
|
||
{% for story in stories %}
|
||
{% set hero = null %}
|
||
{% if story.header.hero_image and story.media[story.header.hero_image] is defined %}
|
||
{% set hero = story.media[story.header.hero_image] %}
|
||
{% endif %}
|
||
|
||
{% set date_str = story.date|date('d M Y') %}
|
||
{% if story.header.end_date %}
|
||
{% set date_str = story.date|date('d M') ~ '–' ~ story.header.end_date|date('d M Y') %}
|
||
{% endif %}
|
||
|
||
<a class="story-card" href="{{ story.url }}">
|
||
{% if hero %}
|
||
<div class="story-card__photo">
|
||
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ story.title }}" loading="lazy">
|
||
</div>
|
||
{% else %}
|
||
<div class="story-card__photo story-card__photo--empty"></div>
|
||
{% endif %}
|
||
<div class="story-card__body">
|
||
<time class="story-card__date">{{ date_str }}</time>
|
||
{% if story.header.location_name %}
|
||
<span class="story-card__location">📍 {{ story.header.location_name }}{% if story.header.location_country %}, {{ story.header.location_country }}{% endif %}</span>
|
||
{% endif %}
|
||
<h2 class="story-card__title">{{ story.title }}</h2>
|
||
<span class="story-card__cta">Read story →</span>
|
||
</div>
|
||
</a>
|
||
{% endfor %}
|
||
</div>
|
||
{% else %}
|
||
<p class="stories-empty">No stories yet — check back soon.</p>
|
||
{% endif %}
|
||
</div>
|
||
{% endblock %}
|