docs: mark inline-journal-feed plan complete
This commit is contained in:
@@ -2,6 +2,8 @@
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Status:** ✅ Complete (2026-06-20)
|
||||
|
||||
**Goal:** Replace click-through journal entry cards with fully inline posts (photo strip + full text) across the trip page, dailies page, and home page.
|
||||
|
||||
**Architecture:** Each journal entry becomes an `<article class="journal-post">` block that renders all its images in a CSS scroll-snap strip with dot indicators, followed by the full body text. The `id`, `data-type`, `data-lat`, `data-lng` attributes stay on the root so map targeting, filter JS, and flash animation continue to work. Story cards in all three feeds are unchanged.
|
||||
@@ -46,7 +48,7 @@ Add all new `.journal-post` CSS and the photo-strip dot-sync JS. Remove CSS clas
|
||||
**Interfaces:**
|
||||
- Produces: `.journal-post`, `.journal-post-header`, `.journal-post-title`, `.journal-post-meta`, `.journal-post-permalink`, `.journal-post-location`, `.journal-post-weather`, `.journal-photo-strip`, `.journal-photo-slide`, `.journal-photo-dots`, `.journal-photo-dot.is-active`, `.journal-post-body`, `.journal-post.is-highlighted` — all usable by Tasks 2–4
|
||||
|
||||
- [ ] **Step 1: Add `.journal-post` CSS block to `style.css`**
|
||||
- [x] **Step 1: Add `.journal-post` CSS block to `style.css`**
|
||||
|
||||
In `user/themes/intotheeast/css/style.css`, find the line:
|
||||
|
||||
@@ -160,7 +162,7 @@ Insert the following block **before** that comment:
|
||||
|
||||
```
|
||||
|
||||
- [ ] **Step 2: Remove journal-card-only CSS rules from `style.css`**
|
||||
- [x] **Step 2: Remove journal-card-only CSS rules from `style.css`**
|
||||
|
||||
These rules are only used by the old journal entry card. Story cards do not use them. Remove each block exactly as shown.
|
||||
|
||||
@@ -260,7 +262,7 @@ Replace with:
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 3: Add dot-sync JS to `base.html.twig`**
|
||||
- [x] **Step 3: Add dot-sync JS to `base.html.twig`**
|
||||
|
||||
In `user/themes/intotheeast/templates/partials/base.html.twig`, find:
|
||||
|
||||
@@ -289,7 +291,7 @@ Replace with:
|
||||
</body>
|
||||
```
|
||||
|
||||
- [ ] **Step 4: Run existing tests to confirm nothing broke**
|
||||
- [x] **Step 4: Run existing tests to confirm nothing broke**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -298,7 +300,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.sp
|
||||
|
||||
Expected: all existing tests pass (M7 still passes because `trip.html.twig` has not changed yet — the JS still adds `is-highlighted` to `.entry-card` elements, and the old M7 selector `.entry-card.is-highlighted` finds the element).
|
||||
|
||||
- [ ] **Step 5: Commit user subrepo**
|
||||
- [x] **Step 5: Commit user subrepo**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Projects/travel-blog-intotheeast/user
|
||||
@@ -320,7 +322,7 @@ Replace the journal entry card in `dailies.html.twig` with the new `.journal-pos
|
||||
- Consumes: `.journal-post` CSS from Task 1
|
||||
- Produces: `/trips/japan-korea-2026/dailies` renders `.journal-post` blocks; T1 and T2 pass with new selectors
|
||||
|
||||
- [ ] **Step 1: Update T1 and T2 tests to their new selectors**
|
||||
- [x] **Step 1: Update T1 and T2 tests to their new selectors**
|
||||
|
||||
In `tests/ui/dailies.spec.js`, make the following changes:
|
||||
|
||||
@@ -371,7 +373,7 @@ Replace with:
|
||||
});
|
||||
```
|
||||
|
||||
- [ ] **Step 2: Run T1 and T2 to verify they fail**
|
||||
- [x] **Step 2: Run T1 and T2 to verify they fail**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -380,7 +382,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js -g "T1:|T2:"
|
||||
|
||||
Expected: FAIL — `.journal-post` selector finds no elements (the page still renders `.entry-card`).
|
||||
|
||||
- [ ] **Step 3: Add `weather_icons` map and replace journal card in `dailies.html.twig`**
|
||||
- [x] **Step 3: Add `weather_icons` map and replace journal card in `dailies.html.twig`**
|
||||
|
||||
In `user/themes/intotheeast/templates/dailies.html.twig`, find the line:
|
||||
|
||||
@@ -487,7 +489,7 @@ The exact text to find and replace is the old journal branch. The old branch sta
|
||||
</a>
|
||||
```
|
||||
|
||||
- [ ] **Step 4: Run T1 and T2 to verify they pass**
|
||||
- [x] **Step 4: Run T1 and T2 to verify they pass**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -496,7 +498,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js -g "T1:|T2:"
|
||||
|
||||
Expected: PASS.
|
||||
|
||||
- [ ] **Step 5: Run the full suite to check no regressions**
|
||||
- [x] **Step 5: Run the full suite to check no regressions**
|
||||
|
||||
```bash
|
||||
npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.spec.js tests/ui/trip-filter.spec.js tests/ui/stories.spec.js
|
||||
@@ -504,7 +506,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.sp
|
||||
|
||||
Expected: all pass.
|
||||
|
||||
- [ ] **Step 6: Commit**
|
||||
- [x] **Step 6: Commit**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Projects/travel-blog-intotheeast/user
|
||||
@@ -530,7 +532,7 @@ Replace the journal entry card in `trip.html.twig` with the `.journal-post` bloc
|
||||
- Consumes: `.journal-post` CSS and `.journal-post.is-highlighted` from Task 1; journal-post HTML pattern from Task 2
|
||||
- Produces: `/trips/japan-korea-2026` renders `.journal-post` blocks; M7 passes with `.journal-post.is-highlighted`
|
||||
|
||||
- [ ] **Step 1: Update M7 to the new selector**
|
||||
- [x] **Step 1: Update M7 to the new selector**
|
||||
|
||||
In `tests/ui/maps.spec.js`, find:
|
||||
|
||||
@@ -546,7 +548,7 @@ Replace with:
|
||||
await expect(page.locator('.journal-post.is-highlighted')).toBeVisible({ timeout: 1500 });
|
||||
```
|
||||
|
||||
- [ ] **Step 2: Run M7 to verify it fails**
|
||||
- [x] **Step 2: Run M7 to verify it fails**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -555,7 +557,7 @@ npx playwright test --project=chromium tests/ui/maps.spec.js -g "M7:"
|
||||
|
||||
Expected: FAIL — `.journal-post.is-highlighted` not found (trip.html.twig still renders `<a class="entry-card">`).
|
||||
|
||||
- [ ] **Step 3: Replace journal card in `trip.html.twig`**
|
||||
- [x] **Step 3: Replace journal card in `trip.html.twig`**
|
||||
|
||||
In `user/themes/intotheeast/templates/trip.html.twig`, find and replace the journal branch of the `{% if item.type == 'journal' %}` block. The old branch to replace is:
|
||||
|
||||
@@ -655,7 +657,7 @@ Replace with:
|
||||
</article>
|
||||
```
|
||||
|
||||
- [ ] **Step 4: Run M7 to verify it passes**
|
||||
- [x] **Step 4: Run M7 to verify it passes**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -664,7 +666,7 @@ npx playwright test --project=chromium tests/ui/maps.spec.js -g "M7:"
|
||||
|
||||
Expected: PASS.
|
||||
|
||||
- [ ] **Step 5: Run full suite**
|
||||
- [x] **Step 5: Run full suite**
|
||||
|
||||
```bash
|
||||
npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.spec.js tests/ui/trip-filter.spec.js tests/ui/stories.spec.js
|
||||
@@ -672,7 +674,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.sp
|
||||
|
||||
Expected: all pass.
|
||||
|
||||
- [ ] **Step 6: Commit**
|
||||
- [x] **Step 6: Commit**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Projects/travel-blog-intotheeast/user
|
||||
@@ -697,7 +699,7 @@ Replace the journal entry card in `home.html.twig` and add a minimal home page t
|
||||
**Interfaces:**
|
||||
- Consumes: `.journal-post` CSS from Task 1; journal-post HTML pattern from Task 2
|
||||
|
||||
- [ ] **Step 1: Write the failing H1 test**
|
||||
- [x] **Step 1: Write the failing H1 test**
|
||||
|
||||
Create `tests/ui/home.spec.js`:
|
||||
|
||||
@@ -714,7 +716,7 @@ test('H1: home page shows at least one inline journal-post block', async ({ page
|
||||
});
|
||||
```
|
||||
|
||||
- [ ] **Step 2: Run H1 to verify it fails**
|
||||
- [x] **Step 2: Run H1 to verify it fails**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -723,7 +725,7 @@ npx playwright test --project=chromium tests/ui/home.spec.js
|
||||
|
||||
Expected: FAIL — `.journal-post` not found (home page still renders `<a class="entry-card">`).
|
||||
|
||||
- [ ] **Step 3: Replace journal card in `home.html.twig`**
|
||||
- [x] **Step 3: Replace journal card in `home.html.twig`**
|
||||
|
||||
In `user/themes/intotheeast/templates/home.html.twig`, find the journal branch:
|
||||
|
||||
@@ -825,7 +827,7 @@ Replace with:
|
||||
|
||||
Note: `home.html.twig` journal posts do **not** include `data-type` (the home page has no filter bar) — this matches the existing `<a class="entry-card">` on home which also had no `data-type`.
|
||||
|
||||
- [ ] **Step 4: Run H1 to verify it passes**
|
||||
- [x] **Step 4: Run H1 to verify it passes**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Nextcloud/Projects/travel-blog-intotheeast
|
||||
@@ -834,7 +836,7 @@ npx playwright test --project=chromium tests/ui/home.spec.js
|
||||
|
||||
Expected: PASS.
|
||||
|
||||
- [ ] **Step 5: Run the full suite**
|
||||
- [x] **Step 5: Run the full suite**
|
||||
|
||||
```bash
|
||||
npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.spec.js tests/ui/trip-filter.spec.js tests/ui/stories.spec.js tests/ui/home.spec.js
|
||||
@@ -842,7 +844,7 @@ npx playwright test --project=chromium tests/ui/dailies.spec.js tests/ui/maps.sp
|
||||
|
||||
Expected: all pass.
|
||||
|
||||
- [ ] **Step 6: Commit**
|
||||
- [x] **Step 6: Commit**
|
||||
|
||||
```bash
|
||||
cd /home/mischa/Projects/travel-blog-intotheeast/user
|
||||
|
||||
Reference in New Issue
Block a user