Appearance

Branding Colors Plugin ​

File Information ​

  • Path: app/plugins/branding-colors.client.ts
  • Purpose: Client-only application of default branding (primary/secondary CSS variables) on :root so a single source owns all --primary* variables until API branding overrides them
  • Client-only: Yes (.client.ts suffix); no-op on server

Overview ​

The plugin runs once on client load and calls useBrandingColors().applyBranding() with no arguments, which applies the default primary and secondary palettes to document.documentElement. When the user or workspace branding is loaded from the API, the application can call applyBrandingFromObject(branding) (or applyBranding(primary, secondary)) to override these values. This ensures there is always a consistent set of CSS variables and avoids FOUC or missing variables before API data arrives.

Behavior ​

  • Runs only in the browser.
  • Uses the useBrandingColors composable.
  • Defaults (from composable): primary #070E22, secondary #FFFFFF; primary-contrast is generated from primary for WCAG compliance.