[Mobile Payments] Make Preparing Reader background one color

[joshheald]

Closes: #8222

Description

On the Preparing Reader modal, the borders of the hosting controller view can be bigger than the spinner view itself – this is the case on iPad.

It was observed that in dark mode, this shows with two black bars, above and below the spinner.

This changes the background specifier to be on the hosting controller’s view, not the spinner contained within it, which corrects the background color issue.

Testing instructions

1. On an iPad with dark mode enabled
2. Navigate to Menu > Payments > Collect Payment
3. Go through the payment flow and select Card on the payment method screen
4. Wait to connect to a reader: once this is done, you will briefly see the Preparing reader screen
5. Observe that there are no black bars at the top and bottom of the spinner

Screenshots

ipad-spinner-background-fixed.-.01.mp4

---

• I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

[joshheald]

@koke I've put it as 11.5, but could go in 11.4 if we're quick. Not a big deal either way.

@jostnes @JorgeMucientes added you as optional reviewers since you found the issue in beta testing.

[wpmobilebot]

You can test the changes from this Pull Request by:

• Clicking here or scanning the QR code below to access App Center
• Then installing the build number pr8223-6925775 on your iPhone

If you need access to App Center, please ask a maintainer to add you.

[koke]

It feels slightly odd to set the background on the view from the outside, but I guess it works well enough 😅