Side now flips strictly by slot index (even=left, odd=right) instead
of by strand. With strand-driven side assignment, several consecutive
same-strand projects would stack on one side and overlap vertically.
Belt: SLOT_HEIGHT trimmed to 140 (was 180). Same-side cards are now
2×140 = 280 px apart centre-to-centre. Suspenders: card .slide gets
max-height: 230 px so a runaway title can never grow past that
budget. Together they guarantee a ≥50 px gap on same-side cards.
Strand identity remains visible via stripe colour, badge, and node
fill — the L/R position is no longer a strand signal.
Helix section for 3 seeded projects now renders at 560 px (was 960).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Each project's node now sits at the rung centre (x = CX) instead of at
its strand's instantaneous extreme. The "line in between" the strands
becomes the natural place for the project marker — true to the
base-pair metaphor — and frees Y positions from having to coincide
with strand-peak intervals.
What this unlocks
- Slot Y is decoupled from the wave period. SLOT_HEIGHT drops from
240 → 180 and the wave period from SLOT_HEIGHT*2 → a fixed 320,
giving the helix a denser twist without re-spacing the cards.
- Cards pack tighter (TOP/BOTTOM padding 120 → 80, summary clamp
3 → 2 lines, padding shaved). 3 projects now fit in ~620 px of
helix section instead of ~960 px — empty space goes away.
Visual additions
- Per-project base-pair: a prominent strand-coloured line at each
node's Y, drawn from strand A's x to strand B's x. This is the
rung the node sits on.
- Connector dash line continues from the node centre outward to the
card edge.
Side mapping
- Strand identity is now purely the card's side + stripe + badge:
A → left, B → right. (Previously the side followed the strand's
instantaneous extreme, which gave inconsistent groupings.)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Identity refresh aligned to Waterschap Brabantse Delta.
Brand
- HELIX → R&D-lab everywhere user-facing (SITE.name; literal "HELIX"s
swept across routes, app.html, login, error messages, seed).
- New tagline: "Projects, innovations, and every strand between."
- Site description updated.
Palette (sourced from the official WSBD-logo.svg)
- Primary #0d4f9e, secondary #1fa0db, accent #bed137 — added as
--wbd-blue / --wbd-cyan / --wbd-lime CSS vars and as wbd.* in
tailwind.config.js. helix.* aliases now point to the WBD palette.
- Strand A (Projects) → #1fa0db cyan. Strand B (Innovations) → #bed137 lime.
- Body vignette + scroll-bar + legend dots repainted accordingly.
Composite logo
- New 24px nav glyph + favicon.svg: WBD-style tilted-square mark in WBD
blues at the centre, helix strands (lime + cyan) wrapping it, lime
"active site" dot at the crossing. Says "R&D-lab × Brabantse Delta"
in one mark.
Lab-slide cards (VerticalHelix)
- Frosted-glass surface (backdrop-filter blur+saturate).
- Thick 5px strand-coloured stripe on the helix-facing edge (gradient,
glowing shadow). Slide rounds the stripe corners; the rest is square.
- Slide header has the strand badge and a monospace serial number
(01/03 etc) — lab-specimen feel.
- Dashed footer rule + "Open detail →" CTA.
- Inline link chips (Gitea / Dashboard / Demo / Docs / Paper / Video)
with inline SVG icons + short labels. Hover lights up in the strand
colour. Capped at 5 visible, "+N" overflow indicator.
- Real <a> chips inside the card without nested <a>: overlay-link
pattern (transparent slide-link absolute fills the card, chips sit on
z-index: 2 above it).
Server load
- + Page now fetches each project's links in one Drizzle relational
query (db.query.projects.findMany with: { links }), capped at 12.
- + Form: strand picker (Project / Innovation radios) reads + persists
the new column.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Reshape the landing so each project anchors to a slot on one of the two
helix strands. Strand A = Projects (durable, in-production), strand B =
Innovations (experiments, prototypes). Cards alternate L/R based on the
strand's instantaneous position at the slot — strand identity is shown
by colour + badge, not by side.
Schema
- ALTER projects ADD strand TEXT NOT NULL DEFAULT 'A' CHECK ('A','B').
Generated as drizzle/0001_*.sql.
Component
- New VerticalHelix.svelte replaces Helix.svelte on the landing.
- Slot Y = 120 + i * 240; period = 480, so each strand is at an extreme
at every slot. Node sits at the strand's actual x; card hugs that side.
- Pulsing node halos and animated gradient stops give "alive" feeling
without moving the strand geometry — projects stay anchored.
- prefers-reduced-motion disables the pulse.
- <760px: SVG hides, cards stack full-width.
Authoring
- /projects/new form gets a Project / Innovation radio picker.
- Seed adds an "DNA Scout" example on strand B so the helix renders with
both strands populated on first boot.
Landing
- Hero shrinks (60vh, no helix backdrop) and gains a strand legend.
- Top 12 projects bind to the helix; "See all N →" appears if there's
more.
- Posts band becomes compact (3 most recent), below the helix.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Dockerfile: npm ci (uses package-lock for reproducible installs)
- CMD now: migrate → seed (idempotent) → start. Gated by SEED_ON_BOOT.
- docker-compose: name: helix, healthcheck on /, OAuth env defaults to empty
so `docker compose up` works without a .env (public pages render; sign-in
fails until OAuth is configured).
- README: explicit "Run it locally — two ways" section. Docker first
(production-like), native Node second. Documents port-conflict workaround
and Gitea OAuth setup.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
