chore: Add DisplayLG variant to Text component and updated homepage balance to use DisplayLG variant

[brianacnguyen]

Description

This PR

• Adds the DisplayLG variant to the Text component
• Updated homepage balance to use DisplayLG variant
• Updated show/hide icon to match design

Figma Link: https://www.figma.com/design/9e6RSJCvezaLqDQ3mtE5wB/MaWaSB?node-id=3127-19374&t=UoqfNNxzdgayOiQj-0

Changelog

CHANGELOG entry: Updated Portfolio Balance text style

Related issues

Fixes: https://github.com/MetaMask/MetaMask-planning/issues/5238

Manual testing steps

1. Go to Wallet
2. Check Balance text

Screenshots/Recordings

Before

After

iOS

Android

Storybook

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.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[amandaye0h]

Can you clarify if the after screenshot is from an iOS or Android build? Would it be possible to get an Android screenshot, just to make sure the fallback font isn't used?

[brianacnguyen]

Can you clarify if the after screenshot is from an iOS or Android build? Would it be possible to get an Android screenshot, just to make sure the fallback font isn't used?

It's iOS. I'll update the description with the Android screenshot in a little bit

[amandaye0h]

@brianacnguyen Looks like the fallback font is being displayed in the balance component for Android — can you make sure Geist is applied on Android?