Respect mobile Safari safe areas

This commit is contained in:
Federico Jaramillo Martinez
2026-05-07 16:47:27 +02:00
parent c4e82aabbe
commit b5b1814383
2 changed files with 3 additions and 2 deletions
+2 -1
View File
@@ -2,10 +2,11 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<title>Pi Web POC</title>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; }
body { min-height: 100dvh; }
</style>
</head>
<body>
+1 -1
View File
@@ -24,7 +24,7 @@ export interface CompletionItem {
}
export const appStyles = css`
:host { display: block; height: 100vh; color: #e6edf3; background: #0d1117; font: 14px system-ui, sans-serif; }
:host { display: block; height: 100dvh; box-sizing: border-box; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); color: #e6edf3; background: #0d1117; font: 14px system-ui, sans-serif; }
.shell { display: grid; grid-template-columns: 340px 1fr; height: 100%; min-height: 0; }
aside { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid #30363d; overflow: hidden; }
header { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 12px; border-bottom: 1px solid #30363d; }