feat: trip page — entry counts, merged feed, sticky sidebar index

This commit is contained in:
2026-06-19 15:45:06 +02:00
parent a78236bf3b
commit b66f1cdb2d
+122 -12
View File
@@ -1,8 +1,22 @@
{% extends 'partials/base.html.twig' %} {% extends 'partials/base.html.twig' %}
{% block content %} {% block content %}
{% set tracker_page = grav.pages.find(page.route ~ '/dailies') %} {% set dailies_page = grav.pages.find(page.route ~ '/dailies') %}
{% set entries = tracker_page ? tracker_page.children.published() : [] %} {% set stories_page = grav.pages.find(page.route ~ '/stories') %}
{% set journal_entries = dailies_page ? dailies_page.children.published() : [] %}
{% set story_entries = stories_page ? stories_page.children.published() : [] %}
{% set all_items = [] %}
{% for e in journal_entries %}
{% set all_items = all_items|merge([{'type': 'journal', 'page': e, 'date': e.date}]) %}
{% endfor %}
{% for s in story_entries %}
{% set all_items = all_items|merge([{'type': 'story', 'page': s, 'date': s.date}]) %}
{% endfor %}
{% set all_items = all_items|sort((a, b) => a.date < b.date ? 1 : -1) %}
{% set journal_count = journal_entries|length %}
{% set story_count = story_entries|length %}
<div class="trip-hero"> <div class="trip-hero">
<h1>{{ page.title }}</h1> <h1>{{ page.title }}</h1>
@@ -12,6 +26,10 @@
{% if page.header.date_end %}{{ page.header.date_end|date('d M Y') }}{% endif %} {% if page.header.date_end %}{{ page.header.date_end|date('d M Y') }}{% endif %}
</p> </p>
{% endif %} {% endif %}
<p class="trip-counts">
{{ journal_count }} journal {{ journal_count == 1 ? 'entry' : 'entries' }}
{% if story_count > 0 %} · {{ story_count }} {{ story_count == 1 ? 'story' : 'stories' }}{% endif %}
</p>
</div> </div>
<nav class="trip-nav"> <nav class="trip-nav">
@@ -21,16 +39,108 @@
<a href="{{ page.route }}/stories">Stories</a> <a href="{{ page.route }}/stories">Stories</a>
</nav> </nav>
{% if entries|length > 0 %} <div class="trip-layout">
<section class="trip-recent"> <div class="trip-feed">
<h2>Recent entries</h2> <div class="feed">
{% for entry in entries|slice(0, 3) %} {% if all_items|length > 0 %}
<a href="{{ entry.url }}"> {% for item in all_items %}
<span>{{ entry.date|date('d M Y') }}</span> {% set entry = item.page %}
{{ entry.title }} {% set hero = null %}
{% if entry.header.location_city %} · {{ entry.header.location_city }}{% endif %} {% if entry.header.hero_image and entry.media[entry.header.hero_image] is defined %}
{% set hero = entry.media[entry.header.hero_image] %}
{% elseif entry.media.images|length > 0 %}
{% set hero = entry.media.images|first %}
{% endif %}
{% if item.type == 'journal' %}
<article class="entry-card" id="entry-{{ entry.slug }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %}
<div class="entry-card-photo">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
<div class="entry-card-photo-overlay">
<time class="entry-date-overlay" datetime="{{ entry.date|date('Y-m-d') }}">
{{ entry.date|date('d M Y')|upper }}
</time>
{% if entry.header.location_city or entry.header.location_country %}
<span class="entry-location-overlay">
📍
{% if entry.header.location_city %}{{ entry.header.location_city|slice(0,20) }}{% endif %}
{% if entry.header.location_city and entry.header.location_country %}, {% endif %}
{% if entry.header.location_country %}{{ entry.header.location_country }}{% endif %}
</span>
{% endif %}
</div>
</div>
{% else %}
<div class="entry-card-textmeta">
<time class="entry-date-plain" datetime="{{ entry.date|date('Y-m-d') }}">
{{ entry.date|date('d M Y')|upper }}
</time>
{% if entry.header.location_city or entry.header.location_country %}
<span class="entry-location-plain">
{%- set _loc = [] -%}
{%- if entry.header.location_city -%}{%- set _loc = _loc|merge([entry.header.location_city]) -%}{%- endif -%}
{%- if entry.header.location_country -%}{%- set _loc = _loc|merge([entry.header.location_country]) -%}{%- endif -%}
📍 {{ _loc|join(', ') }}
</span>
{% endif %}
</div>
{% endif %}
<div class="entry-card-body">
<h2 class="entry-title">{{ entry.title }}</h2>
<p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p>
<span class="entry-read-more">Read entry →</span>
</div>
</a> </a>
</article>
{% else %}
<article class="entry-card entry-card--story" id="entry-{{ entry.slug }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %}
<div class="entry-card-photo entry-card-photo--story">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
</div>
{% endif %}
<div class="entry-card-body">
<span class="story-badge">✦ Story</span>
<h2 class="entry-title">{{ entry.title }}</h2>
</div>
</a>
</article>
{% endif %}
{% endfor %} {% endfor %}
</section> {% else %}
{% endif %} <p class="feed-empty">No entries yet. The journey is about to begin.</p>
{% endif %}
</div>
</div>
<aside class="trip-sidebar">
{% if journal_entries|length > 0 %}
<div class="trip-sidebar-section">
<h3 class="trip-sidebar-heading">Journal</h3>
<ul class="trip-sidebar-list">
{% for e in journal_entries %}
<li>
<a href="#entry-{{ e.slug }}" class="trip-sidebar-link">
<span class="trip-sidebar-date">{{ e.date|date('d M') }}</span>{{ e.title }}
</a>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% if story_entries|length > 0 %}
<div class="trip-sidebar-section">
<h3 class="trip-sidebar-heading">Stories</h3>
<ul class="trip-sidebar-list">
{% for s in story_entries %}
<li><a href="#entry-{{ s.slug }}" class="trip-sidebar-link">{{ s.title }}</a></li>
{% endfor %}
</ul>
</div>
{% endif %}
</aside>
</div>
{% endblock %} {% endblock %}