From 3f6102cf6d7dcb958ff6ac8bbd1f246434a3b828 Mon Sep 17 00:00:00 2001
From: bunker-admin <admin@thebunkerops.ca>
Date: Mon, 18 May 2026 14:16:25 -0600
Subject: [PATCH] docs: refresh DEV_WORKFLOW for 5-image build + tweak campaign
 card layout

- DEV_WORKFLOW.md: reflect that build-and-push.sh now produces 5 images
  (api, admin, media-api, nginx, ccp-agent), not 4.
- CampaignsListPage: move card title below cover photo instead of
  overlaying it, so titles remain legible when no cover image is set.

Bunker Admin
---
 DEV_WORKFLOW.md                              | 12 ++++----
 admin/src/pages/public/CampaignsListPage.tsx | 29 ++++----------------
 2 files changed, 12 insertions(+), 29 deletions(-)

diff --git a/DEV_WORKFLOW.md b/DEV_WORKFLOW.md
index 1fde0fc..0640a43 100644
--- a/DEV_WORKFLOW.md
+++ b/DEV_WORKFLOW.md
@@ -33,8 +33,9 @@ All three methods share the same Gitea container registry at `gitea.bnkops.com/a
  │  BUILD & PUBLISH                                                │
  │                                                                  │
  │  Step 1: ./scripts/build-and-push.sh                            │
- │          Builds 4 production images, pushes to Gitea registry   │
- │          (api, admin, media-api, nginx) tagged :SHA + :latest   │
+ │          Builds 5 production images, pushes to Gitea registry   │
+ │          (api, admin, media-api, nginx, ccp-agent)              │
+ │          tagged :SHA + :latest                                  │
  │                                                                  │
  │  Step 2: ./scripts/mirror-images.sh          (run once/rarely)  │
  │          Mirrors 36 third-party images to Gitea registry        │
@@ -98,7 +99,7 @@ After code changes are tested locally:
 ./scripts/build-and-push.sh
 ```
 
-This builds **4 services** with multi-stage Dockerfiles (production target, no dev dependencies), tags each image with `:SHA` and `:latest`, and pushes to `gitea.bnkops.com/admin/changemaker-{service}`:
+This builds **5 services** with multi-stage Dockerfiles (production target, no dev dependencies), tags each image with `:SHA` and `:latest`, and pushes to `gitea.bnkops.com/admin/changemaker-{service}`:
 
 | Service | Dockerfile | What it produces |
 |---------|-----------|-----------------|
@@ -106,6 +107,7 @@ This builds **4 services** with multi-stage Dockerfiles (production target, no d
 | `admin` | `admin/Dockerfile` | Nginx serving React build output |
 | `media-api` | `api/Dockerfile.media` | Fastify + FFmpeg (compiled JS) |
 | `nginx` | `nginx/Dockerfile` | Nginx with `envsubst` domain templating |
+| `ccp-agent` | `../changemaker-control-panel/agent/Dockerfile` | Remote management agent (sibling repo) |
 
 ```bash
 # Build specific services only
@@ -269,7 +271,7 @@ docker compose logs -f api                            # Watch API logs
 docker compose exec api npx prisma migrate dev        # Create migration
 
 # ── Build & Publish ──
-./scripts/build-and-push.sh                           # Build + push 4 images
+./scripts/build-and-push.sh                           # Build + push 5 images
 ./scripts/mirror-images.sh                            # Mirror 36 third-party images
 git tag --sort=-v:refname | head -3                   # Check latest version tags
 ./scripts/build-release.sh --tag vX.Y.Z --upload      # Package + upload release
@@ -310,7 +312,7 @@ There are **two separate Gitea tokens** with different purposes. Using the wrong
    # Check commits since the last tag
    git log $(git tag --sort=-v:refname | head -1)..HEAD --oneline
    ```
-4. [ ] `./scripts/build-and-push.sh` — builds and pushes 4 production images
+4. [ ] `./scripts/build-and-push.sh` — builds and pushes 5 production images
 5. [ ] `./scripts/mirror-images.sh` — only if third-party versions changed
 6. [ ] `./scripts/build-release.sh --tag vX.Y.Z --upload` — packages and uploads tarball
 7. [ ] **Add release notes** (via Gitea web UI or API):
diff --git a/admin/src/pages/public/CampaignsListPage.tsx b/admin/src/pages/public/CampaignsListPage.tsx
index 73a10dc..35fa491 100644
--- a/admin/src/pages/public/CampaignsListPage.tsx
+++ b/admin/src/pages/public/CampaignsListPage.tsx
@@ -451,7 +451,7 @@ export default function CampaignsListPage() {
                   styles={{ body: { padding: 0, display: 'flex', flexDirection: 'column', height: '100%' } }}
                 >
                   <Link to={`/campaign/${campaign.slug}`} style={{ display: 'block', flex: 1, padding: 20 }}>
-                    {campaign.coverPhoto ? (
+                    {campaign.coverPhoto && (
                       <div
                         style={{
                           height: 140,
@@ -459,31 +459,12 @@ export default function CampaignsListPage() {
                           backgroundImage: `url(${campaign.coverPhoto})`,
                           backgroundSize: 'cover',
                           backgroundPosition: 'center',
-                          display: 'flex',
-                          alignItems: 'center',
-                          justifyContent: 'center',
                         }}
-                      >
-                        <Title level={4} style={{ color: '#fff', margin: 0, textShadow: '0 2px 8px rgba(0,0,0,0.6)', textAlign: 'center', padding: '0 16px' }} ellipsis={{ rows: 2 }}>
-                          {campaign.title}
-                        </Title>
-                      </div>
-                    ) : (
-                      <div
-                        style={{
-                          height: 140,
-                          margin: '-20px -20px 16px -20px',
-                          background: `linear-gradient(135deg, ${token.colorPrimaryBg} 0%, ${colorBgContainer} 100%)`,
-                          display: 'flex',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                        }}
-                      >
-                        <Title level={4} style={{ color: '#fff', margin: 0, textAlign: 'center', padding: '0 16px' }} ellipsis={{ rows: 2 }}>
-                          {campaign.title}
-                        </Title>
-                      </div>
+                      />
                     )}
+                    <Title level={4} style={{ color: '#fff', margin: '0 0 12px', fontSize: isMobile ? 18 : 17, lineHeight: 1.35 }} ellipsis={{ rows: 2 }}>
+                      {campaign.title}
+                    </Title>
                     {campaign.description && (
                       <Paragraph
                         style={{ color: 'rgba(255,255,255,0.55)', fontSize: isMobile ? 14 : 13, margin: '0 0 12px', lineHeight: 1.5 }}