Background
Before any B and C variant-specific work can start, we need the core badge infrastructure in place: the location and the component itself.
Both donor recognition variants share the same badge icon (small filled heart, Wikipedia "W", red, top-right toolbar). Variant-specific popover content, animation, and instrumentation are handled in other sub-tasks of the parent Epic.
Figma Designs of A/B/C variants treatment
| Simple message | Delightful experience |
Requirements
- Experiment is enabled for JS only users.
- Variant (A) must not load badge CSS or JS – confirm via network waterfall.
- Badge must not shift the search icon or cause toolbar reflow. CSS scoped only to MinervaNeue. Badge container provided in MN skin in T425445.
- Hide the badge state persists T427311.
- Heart badge has been provided in assets task T425444.
Acceptance Criteria for Done
- Badge component exists and renders correctly for variants B and C; nothing renders for control A.
- Control A does not load badge JS or CSS (verified via network tab).
- No header bar reflow or CLS from badge mount (Lighthouse CLS delta < 0.1).









