[HOLD for payment 2023-10-24] [$125] Bank Account - Some menu items left icon alignment is broken

[kbecciv]

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

---

Version Number: 1.3.84.1
Reproducible in staging?: y
Reproducible in production?: n
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @Pujan92
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1697378426782819

Action Performed:

1. Go to any workspace -> Click Bank account
2. On the bank account step observe the left icon for
   • Connect online with plaid
   • Connect manually

Expected Result:

Left icon should be aligned on same place for all menu items

Actual Result:

Left icon is misaligned for connect manually button

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

Recording.5003.mp4

MacOS: Desktop

View all open jobs on GitHub

[kbecciv]

Proposal by: @Pujan92
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1697378426782819

Proposal

Please re-state the problem that we are trying to solve in this issue.

Menu items left icon alignment is not consistent

What is the root cause of that problem?

It seems a regression from PR where left padding has been removed from cardMenuItem which we have used for this kind of buttons. Earlier we had the left padding of 8px.
https://github.com/Expensify/App/pull/26406/files#diff-8ab8ba45ab927f1430b8d1209d187e003a9cdfe476f809e4483ef64cdba253ebL3080

App/src/styles/styles.ts

Lines 3143 to 3144 in 0b06446

	cardMenuItem: {
	paddingLeft: 0,

What changes do you think we should make in order to solve the problem?

Correct the paddingLeft with 8px like the same it was earlier. Bcoz I see that class isn’t used in the offended PR. Might be changed unintentionally. cc: @pac-guerreiro
https://github.com/Expensify/App/assets/14358475/594432d1-70d6-4188-9093-6a52863fc471

[OSBotify]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open StagingDeployCash deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[melvin-bot]

Triggered auto assignment to @arosiclair (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[melvin-bot]

Unable to auto-create job on Upwork. The BZ team member should create it manually for this issue.

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @ntdiary (External)