-
Notifications
You must be signed in to change notification settings - Fork 8
User story: enable EDS CSS variables in dev-portal #4317
Description
Story
As a Fusion app developer, I want the equinor/fusion-framework dev-portal to expose EDS CSS variables, so that local development and preview behavior matches the styling baseline used in hosted portal environments.
Context
The dev-portal is the primary local runtime for Fusion app development. If EDS CSS variables are not present there, developers can get misleading local rendering, miss styling regressions, or add temporary app-level workarounds that should not be necessary.
To keep local development aligned with real portal hosting, the dev-portal should provide the same EDS CSS variable baseline expected by apps and shared components.
Functional requirements
- Ensure the dev-portal loads and exposes the relevant EDS CSS variables during local app development.
- Keep dev-portal styling behavior aligned with the intended hosted portal baseline.
- Avoid requiring each app to inject or polyfill EDS variables manually during local development.
- Document the behavior so developers understand what styling primitives the dev-portal provides.
Scenarios
- Given an app running in the dev-portal, when it uses EDS CSS variables, then those variables resolve without extra app-specific setup.
- Given a component that renders correctly in the hosted portal because EDS variables are available, when it is viewed in the dev-portal, then it renders consistently there as well.
- Given a new app scaffolded on Fusion Framework, when it is run locally in the dev-portal, then developers can use EDS CSS variables without having to bootstrap host tokens manually.
Non-goals
- Forcing every app to migrate to EDS-based styling.
- Replacing app-specific themes that intentionally override host defaults.
- Addressing unrelated visual differences between dev and production runtimes.
Validation
- Verify apps running in the dev-portal can resolve EDS CSS variables from the host runtime.
- Verify local rendering matches portal-hosted expectations for components that depend on EDS variables.
- Verify the behavior in at least one cookbook so the support is exercised in a real framework example.
- Verify documentation explains the provided styling baseline and any intentional limitations.
Notes
Related issues: no clear duplicate found from a focused search for dev-portal css variables, EDS css variables, or design tokens in equinor/fusion-framework.
Related work:
- Companion story for
equinor/fusion-portalshould track the same capability in the hosted portal runtime so dev and hosted environments stay aligned.