feat: add sort toggle to dailies and stories pages

dailies: reverse Twig output to ascending (matching trip default),
add feed-sort-bar above feed, add sort JS using [data-type] + appendChild.

stories: wrap heading in flex header row with sort button inline,
add sort JS targeting .story-card children of .stories-grid.

CSS: feed-sort-bar (right-aligned button above feed),
stories-listing__header (flex row, baseline-aligned), heading margin moved to header.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Vgmzx8VTTTmCskSpQtsLTr
This commit is contained in:
2026-06-21 22:27:11 +02:00
parent b6142cee44
commit f94880e758
3 changed files with 57 additions and 3 deletions
+13 -1
View File
@@ -911,6 +911,12 @@ body::after {
/* ── Trip page filter bar ────────────────────────────────────────────────────── */
.feed-sort-bar {
display: flex;
justify-content: flex-end;
margin-bottom: var(--space-4);
}
.trip-filter-bar {
display: flex;
align-items: center;
@@ -1738,12 +1744,18 @@ body::after {
/* ── Stories listing ──────────────────────────────────────── */
.stories-listing { padding: var(--space-10) 0; }
.stories-listing__header {
display: flex;
align-items: baseline;
justify-content: space-between;
margin-bottom: var(--space-10);
}
.stories-listing__heading {
font-family: var(--font-display);
font-size: var(--text-2xl);
font-weight: 400;
color: var(--color-ink);
margin-bottom: var(--space-10);
margin-bottom: 0;
}
.stories-grid {
display: grid;