Class MarbleBrand
Brand color in Marble is a declarative knob: a data-brand attribute
on the document root that overrides the primary seed
(--zk-color-primary). Because every container / on-container / filled
(-fill) partner, the state-layer overlays, the focus ring and
--zk-color-inverse-primary all derive from that seed via
oklch(from …), flipping the one attribute re-derives a coherent palette.
See doc/spec/brand-override.md and tokens/_colors.css.
Whole-app only. Unlike MarbleDensity — whose size tokens are
re-pointed as literals so the attribute works at any scope — the brand presets
override only the seed and rely on the oklch(from …) derivations, which
are declared at :root. A data-brand placed on a descendant would
not re-derive the containers there (they resolved at :root and
inherit frozen), so this helper deliberately exposes a single whole-app method.
A brand is an app-wide identity, not a per-region concern.
When to use this vs. the library property. This API is for runtime
switching (a user picking a brand). For a fixed whole-app brand, prefer the
org.zkoss.theme.marble.brand library property in zk.xml — a preset
name or a #rgb/#rrggbb seed, rendered with the page. The property
applies only when ZK renders the whole HTML document (a top-level ZUL page); a
.zhtml page, a <?page complete="true"?> page or an included page owns
its <html> tag, so put data-brand or the seed there instead. A static
:root { --zk-color-primary: #…; } rule loaded after the theme CSS (the
brand-override.md recipe) also works. Calling apply(Brand) on page
load runs after the first paint and can cause a brief color flash (FOUC).
- Since:
- 11.0.0
-
Nested Class Summary
Nested Classes -
Method Summary
Modifier and TypeMethodDescriptionstatic voidapply(MarbleBrand.Brand brand) Applies the brand to the whole application by settingdata-brandon the document root (<html>).
-
Method Details
-
apply
Applies the brand to the whole application by settingdata-brandon the document root (<html>). Covers body-appended popups (menus, modal windows, notifications) too, since they inherit from the root.MarbleBrand.Brand.DEFAULTremoves the attribute so the base:rootseed (Marble blue) takes over again. The root is not a ZK component, so this goes throughClients.evalJavaScript(String)and must run within an active ZK execution (e.g. inside an event listener or MVVM command).- Parameters:
brand- the brand to apply; nevernull.
-