Created attachment 411469 [details] Homescreened website changes theme, but top bar stays white The Twitter website allows users to control theme: light/dim/dark. Users like this control - it allows them to run Twitter at a different brightness from the OS. When the website is saved to homescreen, we'd like to be able to change the colour of the top bar of the phone, to match the site content. How can we do so?
I think you want <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">, no?
If that doesn't work, please reopen.
I tried it, but it didn't seem to have any effect. I connected Safari desktop devtools and tried just overriding directly with document.head.innerHTML="<meta content=\"black-translucent\" name=\"apple-mobile-web-app-status-bar-style\"/><meta name=\"apple-mobile-web-app-capable\" content=\"yes\"/>" It seemed to have no effect.
Works for me (on a iPhone with a notch, I wonder if it’s different on square screened phones). I’m also not 100% sure dynamic changes work, but they should. Regardless, this is a Safari behavior, not WebKit, so please file at bugreport.apple.com.
> bugreport.apple.com https://feedbackassistant.apple.com is the current URL.
<rdar://problem/71197609>