Skip to content

DTEC 03/2026 — Full UI Redesign #826

@phoebus-84

Description

@phoebus-84

DTEC 03/2026 — Full UI Redesign

Implementation of the new DTEC visual design system across the entire Interfacer GUI, based on the Figma/React prototype delivered in March 2026.

Branch: dtec_new_layout
Prototype reference: React Router 7 SPA (DTEC _ 03_2026)

Epics

# Epic Status
1 Design System Foundation ✅ Done
2 Navigation & Layout Redesign ✅ Done
3 Catalog Pages (Designs, Products, Services) ✅ Done
4 Detail Pages (Design, Product, Service) ✅ Done
5 Profile Page Redesign ✅ Done
6 Creation Forms Redesign ✅ Done
7–9 Shared Components, Responsive, Testing ✅ Done
CXO Prototype vs Localhost visual review & polish ✅ Done

Key Technical Decisions

  • All design tokens use --ifr-* CSS custom properties for easy theming
  • Entity types (Design, Product, Service, DPP, Machine) have consistent color coding
  • i18n: all UI strings wrapped in t() via next-i18next
  • Cards and detail pages adapt footer/sidebar content based on entity type
  • Product Passport (DPP) section renders from metadata.dpp when available
  • Star counts use useSocial hook — displays 0 until backend populates follower data
  • Fonts: IBM Plex Sans (body) + Space Grotesk (headings)

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions