Description

The info icon (ⓘ) next to the "Your bonus" heading and in the mUSD conversion navbar was rendering in the default icon color (near-black/white), which didn't match the design spec. The design calls for a muted gray that de-emphasizes the info affordance relative to the heading text.

This PR updates both info icon instances to use the IconColor.IconAlternative design token so the icon renders in a medium gray that matches the Figma design in both light and dark modes.

Changelog

CHANGELOG entry: Fixed the info icon color next to the "Your bonus" heading and in the mUSD conversion navbar to match the design spec.

Related issues

Fixes: MUSD-650

Manual testing steps

Feature: mUSD "Your bonus" info icon color

  Scenario: user views the Your bonus section on the asset overview
    Given the user has an mUSD balance eligible for bonus display
    And the user is on the mUSD asset overview screen

    When the user scrolls to the "Your bonus" section
    Then the info icon next to "Your bonus" renders in a muted gray (IconAlternative)
    And the icon is clearly visible against both light and dark backgrounds

  Scenario: user views the mUSD conversion navbar
    Given the user is on the mUSD conversion flow

    When the conversion screen header renders
    Then the info icon in the navbar header renders in a muted gray (IconAlternative)
    And tapping the icon still opens the existing info tooltip/modal

Screenshots/Recordings

Before

Info icon rendered in the default dark color, indistinguishable from the heading text.

After

Info icon renders in muted gray (IconColor.IconAlternative), matching the Figma design.

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• I've completed the PR template to the best of my ability
• I've included tests if applicable
• I've documented my code using JSDoc format if applicable
• I've applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.