Update HTML/CSS to accommodate mobile devices with notches

This commit is contained in:
Angry Toenail 2025-06-27 08:52:30 +01:00
parent f81f60e76f
commit c0b0ed6671
No known key found for this signature in database
2 changed files with 3 additions and 1 deletions

View file

@ -7,7 +7,7 @@
<link rel="apple-touch-icon" href="apple-touch-icon.png" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1"
content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover"
/>
<meta name="theme-color" content="%COLOR%" />
<link rel="manifest" crossorigin="use-credentials" href="manifest.json" />

View file

@ -61,6 +61,8 @@ body {
}
.main {
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
@include media-breakpoint-up(sm) {
padding-top: 0.5rem;
}