Skip to content

SV UI Redesign Look & Feel: Component: Layout - #6383

Open
puneetfinoa wants to merge 3 commits into
canton-network:mainfrom
Finoa-Consensus-Services:puneetfinoa/sv-ui/2594
Open

SV UI Redesign Look & Feel: Component: Layout#6383
puneetfinoa wants to merge 3 commits into
canton-network:mainfrom
Finoa-Consensus-Services:puneetfinoa/sv-ui/2594

Conversation

@puneetfinoa

Copy link
Copy Markdown
Contributor

Fixes #2594

Implements the SV Layout shell used on every page — network banner, brand
wordmark, top navigation pills, and logout — aligned with the Figma Navigation
component.

Figma: https://www.figma.com/design/sXdsHZtM5c7xXQWckd6Ob8/supervalidator?node-id=605-1442

Changes:

  • Replace the shared Header with SvNavigationShell under apps/sv only
  • Add network banner, Termina brand wordmark, nav pills (active border, Governance badge, Delegate Election alert), and logout
  • Align spacing/typography with Figma Dev Mode
  • Add layout tokens and Termina font assets for the wordmark

Out of scope / follow-ups:

  • Per-network banner colors (DevNet #C6B2FF, MainNet #F8FDCD) — still TestNet cyan for all
  • Delegate Election alert gated to TestNet only (currently always on)

Screenshot:
Screenshot 2026-07-10 at 13 47 40

Pull Request Checklist

Cluster Testing

  • If a cluster test is required, comment /cluster_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
  • If an upgrade test is required, comment /upgrade_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
  • If a hard-migration test is required (from the latest release), comment /hdm_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
  • If a logical synchronizer upgrade test is required (from canton-3.5), comment /lsu_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.

PR Guidelines

  • Include any change that might be observable by our partners or affect their deployment in the release notes.
  • Specify fixed issues with Fixes #n, and mention issues worked on using #n
  • Include a screenshot for frontend-related PRs - see README or use your favorite screenshot tool

Merge Guidelines

  • Make the git commit message look sensible when squash-merging on GitHub (most likely: just copy your PR description).

@pawelperek-da

Copy link
Copy Markdown
Contributor

I talked with the design team about the TerminaTest situation, it seems legally questionable to use it on prod. Let's escalate it tomorrow.

@puneetfinoa

Copy link
Copy Markdown
Contributor Author

I talked with the design team about the TerminaTest situation, it seems legally questionable to use it on prod. Let's escalate it tomorrow.

Hi @pawelperek-da as per discussions over slack group, I have replaced the Termina font with Inter

Replace the shared Header with SvNavigationShell under apps/sv only:
network banner, Termina brand wordmark, top nav pills with badge/alert
support, and logout. Align spacing and typography with Figma Dev Mode
(brand-to-nav gap, nav pill spacing, line-heights, content offset) and
add layout tokens plus Termina font assets for the wordmark and logout.

Signed-off-by: Puneet Bharti <puneet.bharti@finoa.io>
Drop the Fort Foundry TerminaTest assets and SV-local @font-face wiring; use Inter for the layout brand wordmark until a production-licensed Termina is available.

Signed-off-by: Puneet Bharti <puneet.bharti@finoa.io>
… Operations")

Signed-off-by: Puneet Bharti <puneet.bharti@finoa.io>
@puneetfinoa
puneetfinoa force-pushed the puneetfinoa/sv-ui/2594 branch from e5b5de6 to 36fea0c Compare July 28, 2026 13:47
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.

SV UI Redesign Look & Feel: Component: Layout

6 participants