Browse Source

fix: Status Bar Color Issue in PWA on iOS 18 (#1257)

#1256
Reported by @xK1t
pull/1199/head
Philip H. 8 months ago
committed by GitHub
parent
commit
ec202d8575
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 7
      src/www/css/app.css
  2. 3
      src/www/index.html

7
src/www/css/app.css

@ -63,9 +63,12 @@ html,
body { body {
margin: 0; margin: 0;
/* 1 */
line-height: inherit; line-height: inherit;
/* 2 */ padding-top: env(safe-area-inset-top);
padding-bottom: env(safe-area-inset-bottom);
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
box-sizing: border-box;
} }
/* /*

3
src/www/index.html

@ -10,6 +10,7 @@
<link rel="apple-touch-icon" href="./img/apple-touch-icon.png"> <link rel="apple-touch-icon" href="./img/apple-touch-icon.png">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"> <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
</head> </head>
<style> <style>
[v-cloak] { [v-cloak] {
@ -614,4 +615,4 @@
<script src="./js/app.js"></script> <script src="./js/app.js"></script>
</body> </body>
</html> </html>

Loading…
Cancel
Save