quran / quran.com-frontend-next

Frontend build on next.js
https://quran.com
1.3k stars 380 forks source link

[bug]: Status Bar Color in Dark Mode #2173

Open mouhamaddev opened 2 weeks ago

mouhamaddev commented 2 weeks ago

Is there an existing issue for this?

Describe the bug

In dark mode, the status bar on iPhone currently appears white. This contrasts sharply with the rest of the dark theme and can be visually jarring. It would be more aesthetically consistent if the status bar were gray, matching the overall dark theme.

Expected Behavior: The status bar should be gray, blending with the dark theme of the website.

Actual Behavior: The status bar appears white, standing out against the dark background.

That’s how it may look like before and after the change:

Before After
IMG_0736 IMG_0740

Relevant log output

No response

Steps to reproduce

  1. Open quran.com on a mobile device
  2. Enable dark mode
  3. Look at the status bar

Environment (please complete the following information) and Add any other context about this bug

OS: iOS Browser: Safari Version: 17

Environment

Production(quran.com)