Skip to content

feat: ✨ Integrate GBK theme into Solid Design System #2968

@karlbaumhauer

Description

@karlbaumhauer

Summary

Integrate the GBK theme, which was created proactively by a consuming product team, into the Solid Design System’s theming setup. As part of the integration, ensure brand compliance for the relevant brands, verify accessibility, and then publish the GBK theme alongside the existing themes under the Solid quality standards.

User Story

As a member of the Solid Design System team
I want to review, adapt, and integrate the GBK theme created by a consuming team, including brand and accessibility checks
So that product teams can use an officially approved, consistent, and brand-compliant GBK theme via the Solid Design System’s multi-theming capabilities.

Acceptance Criteria

  • The GBK theme is aligned with the Solid Design System guidelines (design tokens, color system, typography, spacing, states, component usage).
  • Brand stakeholders of the relevant brands have reviewed and approved the visual design (colors, brand assets, spacing, usage rules); the approval is documented.
  • An accessibility review (at least WCAG 2.2 AA) has been executed for the core Solid components with the GBK theme; identified issues are fixed or recorded with accepted exceptions.
  • The GBK theme is integrated into the Solid theming structure (tokens, variables, naming conventions, build/release setup) and is consistent with existing themes.
  • The GBK theme is selectable and usable through the official theming interface (e.g., theme selector / configuration) in the Solid component library / playground.
  • The GBK theme is documented in the Solid Design System documentation (including usage examples, known limitations, and migration notes for consuming teams).
  • The GBK theme is released together with the other themes under the Solid quality standards (including changelog / release note entry).

Motivation / Business Context

  • Consuming teams (including GBK) build digital products on top of the Solid Design System and require a brand-aligned theme within the shared multi-theming approach.
  • Themes created independently by product teams should go through a standardized onboarding and review process to ensure brand compliance, consistency, and reusability.
  • Central publication via the Solid Design System reduces maintenance effort, minimizes risk from unreviewed custom themes, and improves a consistent user experience across brands.

Technical Notes / Implementation Hints

  • Start from the existing GBK theme implementation in the consuming product team and refactor it into the Solid theme structure (design tokens, theme files, naming conventions).
  • Add or adapt automated checks (e.g., token linting, visual regression tests, automated accessibility checks for key components) for the GBK theme.
  • Expose the GBK theme in the Solid documentation / playground (e.g., Storybook or equivalent) so teams can preview and test it.
  • Ensure versioning and distribution of the GBK theme follow the existing Solid release process (e.g., npm package version, tags, release notes).

Open Questions

  • Which exact brand guidelines (documents / contacts) must be used for GBK for final approval?
  • Which components are considered “core” and must be covered by the initial accessibility review for GBK?

DoR

  • Item has business value
  • Item all subtasks have been estimated by the team
  • Item is clear and well-defined
  • Item dependencies have been identified

DoD

  • All subtasks have been closed

Metadata

Metadata

Labels

Projects

Status

🛠️ To be pre-refined

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions