Update update alert color from app menu for light theme

[simonhong]

fix brave/brave-browser#38899

Brave light/dark themes:

Resolves

Submitter Checklist:

• I confirm that no security/privacy review is needed and no other type of reviews are needed, or that I have requested them
• There is a ticket for my issue
• Used Github auto-closing keywords in the PR description above
• Wrote a good PR/commit description
• Squashed any review feedback or "fixup" commits before merge, so that history is a record of what happened in the repo, not your PR
• Added appropriate labels (QA/Yes or QA/No; release-notes/include or release-notes/exclude; OS/...) to the associated issue
• Checked the PR locally:
  • npm run test -- brave_browser_tests, npm run test -- brave_unit_tests wiki
  • npm run presubmit wiki, npm run gn_check, npm run tslint
• Ran git rebase master (if needed)

Reviewer Checklist:

• A security review is not needed, or a link to one is included in the PR description
• New files have MPL-2.0 license header
• Adequate test coverage exists to prevent regressions
• Major classes, functions and non-trivial code blocks are well-commented
• Changes in component dependencies are properly reflected in gn
• Code follows the style guide
• Test plan is specified in PR before merging

After-merge Checklist:

• The associated issue milestone is set to the smallest version that the
  changes has landed on
• All relevant documentation has been updated, for instance:
  • https://github.com/brave/brave-browser/wiki/Deviations-from-Chromium-(features-we-disable-or-remove)
  • https://github.com/brave/brave-browser/wiki/Proxy-redirected-URLs
  • https://github.com/brave/brave-browser/wiki/Fingerprinting-Protections
  • https://github.com/brave/brave-browser/wiki/Brave%E2%80%99s-Use-of-Referral-Codes
  • https://github.com/brave/brave-browser/wiki/Web-Compatibility-Exceptions-in-Brave
  • https://github.com/brave/brave-browser/wiki/QA-Guide
  • https://github.com/brave/brave-browser/wiki/P3A

Test Plan:

See the linked issue

[simonhong]

@aguscruiz As I describe above, I set raw color(SkColorSetRGB(0xE2, 0xA5, 0x00)) w/o contrast adjusting on light theme.
This looks fine or need to adjust?

[aguscruiz]

Sorry, I don't think I follow completely.

So the problem is that if you adjust the color for contrast, they change to gray in light mode? Shouldn't it change to a darker shade of orange though?

I think we're missing contrast this way

Dark mode looks fine

[simonhong]

Sorry, I don't think I follow completely.

So the problem is that if you adjust the color for contrast, they change to gray in light mode? Shouldn't it change to a darker shade of orange though?

I think we're missing contrast this way

Dark mode looks fine

Updated and attached some screenshots. WDYT?

[aguscruiz]

It doesn't techincally pass the contrast checks, but I think it's way more readable now.
I was gonna suggest to make the contrast on light mode more noticeable, but maybe we can wait until the material color updates. I would like to use Nala colors for this

Current, with contrast of 2.72:1

Ideal contrast of 4.5:1:

[aguscruiz]

I have the design using Nala colors, but I don't know how it'll look if you use the current token set in Nala since it's not updated to material colors yet.

https://www.figma.com/design/H11ZOl6JMYbCTW4ZJXqR5V/%F0%9F%A6%81-Browser?node-id=6904-11703&t=Rs2fzFw8U7kMgCVc-1

[sangwoo108]

LGTM