buzzert/Sybil-2
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Add fullscreen PWA support

Browse Source
This commit is contained in:
James Magahern
2026-05-30 00:32:57 -07:00
parent a6c2ec664b
commit 39014eee18
15 changed files with 114 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
web/src/index.css
View File

@@ -14,6 +14,10 @@
:root {
color-scheme: dark;
--safe-area-top: env(safe-area-inset-top, 0px);
--safe-area-right: env(safe-area-inset-right, 0px);
--safe-area-bottom: env(safe-area-inset-bottom, 0px);
--safe-area-left: env(safe-area-inset-left, 0px);
--background: 235 45% 4%;
--foreground: 258 36% 96%;
--muted: 246 30% 13%;
@@ -40,6 +44,15 @@ html,
body,
#app {
height: 100%;
width: 100%;
}
@supports (height: 100dvh) {
html,
body,
#app {
height: 100dvh;
}
}
body {
@@ -49,6 +62,8 @@ body {
linear-gradient(90deg, hsl(187 92% 49% / 0.08), transparent 24%, hsl(264 92% 59% / 0.12) 74%, transparent),
linear-gradient(180deg, hsl(250 60% 16% / 0.68), hsl(235 45% 4%) 48%, hsl(235 54% 3%));
font-family: "Inter", "Avenir Next", "Segoe UI", sans-serif;
overflow: hidden;
overscroll-behavior: none;
}
button,
@@ -78,6 +93,44 @@ textarea {
background-size: 48px 48px;
}
.app-safe-frame {
padding: var(--safe-area-top) var(--safe-area-right) var(--safe-area-bottom) var(--safe-area-left);
}
.app-safe-pad {
padding:
max(1rem, var(--safe-area-top))
max(1rem, var(--safe-area-right))
max(1rem, var(--safe-area-bottom))
max(1rem, var(--safe-area-left));
}
.app-search-safe-pad {
padding:
max(1.5rem, var(--safe-area-top))
max(0.75rem, var(--safe-area-right))
max(1.5rem, var(--safe-area-bottom))
max(0.75rem, var(--safe-area-left));
}
@media (min-width: 768px) {
.app-safe-frame {
padding:
max(0.5rem, var(--safe-area-top))
max(0.5rem, var(--safe-area-right))
max(0.5rem, var(--safe-area-bottom))
max(0.5rem, var(--safe-area-left));
}
.app-search-safe-pad {
padding:
max(1.5rem, var(--safe-area-top))
max(1.5rem, var(--safe-area-right))
max(1.5rem, var(--safe-area-bottom))
max(1.5rem, var(--safe-area-left));
}
}
.glass-panel {
background:
linear-gradient(180deg, hsl(243 42% 12% / 0.88), hsl(236 48% 5% / 0.92)),