Skip to content

feat(website): adopt the shared The Solid Chain sticky header - #167

Merged
robercano merged 1 commit into
mainfrom
feat/shared-tsc-header
Jul 23, 2026
Merged

feat(website): adopt the shared The Solid Chain sticky header#167
robercano merged 1 commit into
mainfrom
feat/shared-tsc-header

Conversation

@robercano-ghbot

Copy link
Copy Markdown
Collaborator

Summary

Normalizes the non-scrolling top chrome across The Solid Chain's family of sites —
thesolidchain.com, reCode, reDeFi, and reDeploy all share the same sticky header pattern
now: a corporate statusbar (row 1, verbatim across every site) and a product-specific
strip (row 2, per-product but same shape).

Row 1 was already added to this site in #166 (the shared statusbar: cream TSC mark linking
to thesolidchain.com, traffic dots, roberto@thesolidchain: ~, the online LED, uptime/region,
amber cursor) — reproduced verbatim from the reference implementation at
recode.thesolidchain.com (source: site/index.html in
robercano/reCode). That part needed no further changes here.

This PR finishes the job on row 2 (the product strip), bringing it in line with brand
book §08: glyph, bold product name, short context — the same shape as reCode's own subbar
(</> reCode — session replay …).

What changed (apps/website)

  • Topbar.tsx: reordered to glyph-first (^^ in lime #D6FF7A), then **reDeploy**,
    then a short tagline (— declarative, idempotent, verifiable deploys, sourced from the
    repo's own README/meta description) — ahead of the existing nav anchors
    (pipeline/studio/packages/github), which are preserved unchanged.
  • Judgment call: dropped the reDeploy-specific chevron-mark SVG that used to sit at the
    start of the topbar. The family brand mark already anchors the statusbar directly above it
    (row 1), so a second logo in row 2 of the same sticky header read as redundant rather than
    reinforcing. The site's own nav is real, useful, and unique to this app, so it stays — it
    just now sits after the brand-book-compliant strip instead of interleaved with it.
  • content.ts: centralized the glyph/tagline as TOPBAR, matching how NAV_LINKS and
    FOOTER are already content-driven (this repo keeps marketing copy out of JSX).
  • styles.css: dropped the now-unused .mark rule (the SVG it styled is gone), added
    .tagline (dim, same treatment as the rest of the muted topbar text), and bolded .chev
    to match the family's subbar glyph weight (700).
  • Tests: new Topbar.test.tsx asserts the row order (glyph → name → tagline) and that the
    nav anchors still resolve to the right hrefs; content.test.ts covers the new TOPBAR export.

Row 1's statusbar (from #166) is untouched — including its blinking amber cursor, which was
an intentional, already-reviewed refinement over the reference's static cursor (honors
prefers-reduced-motion), not something this PR revisits.

Verification

  • pnpm install --prefer-offline — clean, from the committed lockfile.
  • pnpm -F @redeploy/website typecheck — clean.
  • pnpm -F @redeploy/website lint — clean (0 warnings, --max-warnings=0).
  • pnpm -F @redeploy/website build (vite build) — succeeds.
  • pnpm -F @redeploy/website test — 28/28 passing (5 test files).
  • pnpm -F @redeploy/website coverage — 100% statements/functions/lines, 97.67% branches on
    the touched module — above the repo's 80% threshold.

Reference

  • Source of truth: site/index.html in robercano/reCode (the .hdr/.statusbar/.subbar
    block).
  • Reference implementation: recode.thesolidchain.com.

🤖 Generated with Claude Code

…ok spec

PR #166 already added the shared thesolidchain.com statusbar (row 1) above the
website's product topbar (row 2), sticky as one header. Row 2 itself didn't yet
follow the brand book §08 pattern used by the other family sites: glyph, then
the bold product name, then a short context blurb, ahead of any product nav.

- Topbar: reorder to glyph-first (`^^`), add a short tagline sourced from the
  README/meta description ("declarative, idempotent, verifiable deploys"),
  drop the reDeploy-specific chevron mark SVG — the family brand mark already
  anchors the statusbar row directly above it, so a second logo in row 2 read
  as redundant. The site's own nav anchors (pipeline/studio/packages/github)
  are preserved, now following the brand-row strip.
- content.ts: centralize the glyph/tagline as TOPBAR, matching how NAV_LINKS
  and FOOTER are already content-driven.
- styles.css: drop the now-unused .mark rule, add .tagline (dim) and bold the
  .chev glyph to match the family's subbar glyph weight.
- tests: new Topbar.test.tsx asserts the row order (glyph → name → tagline)
  and that nav anchors still resolve; content.test.ts covers the new TOPBAR
  export.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@robercano
robercano merged commit 26ffbc5 into main Jul 23, 2026
6 checks passed
robercano added a commit that referenced this pull request Jul 24, 2026
The shared-header rework (#166/#167) deliberately keeps only the family
mark + ASCII product row in the sticky header, which left the full
product logo (amber v1.9 iter32 frame + lime ^^ glyph) absent from the
page. Adds it as a BrandMark component centered above the hero headline,
verbatim from brand/products/tsc-redeploy.svg.

Co-authored-by: Roberto Cano <3525807+robercano@users.noreply.github.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants