[HOLD for payment 2024-04-05] Support light mode on help.expensify.com and match user's system preferences

[sakluger]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Slack conversation: https://expensify.slack.com/archives/C02QSAC6BJ8/p1709831844030329

Problem

Our help site (help.expensify.com) contains many large blocks of text. Currently we only support dark mode for the help site, but it's difficult for many people (including me) to read large blocks of light text on a dark background. Here's an example of what this looks like today:

Proposed solution

Let's support light mode on our help site. Instead of adding a togglable setting, we can just match the user's system preferences for light mode vs dark mode.

@shawnborton gives some suggestions and advice around implementation in the Slack thread.

[melvin-bot]

Triggered auto assignment to @Christinadobrzyn (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details.

[melvin-bot]

⚠️ It looks like this issue is labelled as a New Feature but not tied to any GitHub Project. Keep in mind that all new features should be tied to GitHub Projects in order to properly track external CAP software time ⚠️

[rushatgabhane]

Support for CSS prefers-color-scheme looks good. Going forward with it https://caniuse.com/prefers-color-scheme

[melvin-bot]

Triggered auto assignment to @tylerkaraszewski, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.4.57-5 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• [HelpDot] Add light mode #38107

If no regressions arise, payment will be issued on 2024-04-05. 🎊

For reference, here are some details about the assignees on this issue:

• @rushatgabhane requires payment through NewDot Manual Requests

[melvin-bot]

BugZero Checklist: The PR adding this new feature has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@rushatgabhane] Please propose regression test steps to ensure the new feature will work correctly on production in further releases.
• [@sakluger] Link the GH issue for creating/updating the regression test once above steps have been agreed upon.

[melvin-bot]

Payment Summary

Upwork Job

• Reviewer: @rushatgabhane owed $250 via NewDot

BugZero Checklist (@sakluger)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants//hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[sakluger]

Looks great, thanks again @rushatgabhane! Feel free to request via NewDot using the payment summary above.