From 59dc0bd6f3008bf162c3bfc2a5abc9ca836c337c Mon Sep 17 00:00:00 2001
From: diondiondion <mail@diondiondion.com>
Date: Tue, 17 Jun 2025 11:53:14 +0200
Subject: [PATCH] fix: Improve support for safe area insets (#35065)

---
 app/javascript/styles/mastodon/admin.scss      | 3 +++
 app/javascript/styles/mastodon/basics.scss     | 2 ++
 app/javascript/styles/mastodon/components.scss | 2 ++
 3 files changed, 7 insertions(+)

diff --git a/app/javascript/styles/mastodon/admin.scss b/app/javascript/styles/mastodon/admin.scss
index add030626..bc51163f1 100644
--- a/app/javascript/styles/mastodon/admin.scss
+++ b/app/javascript/styles/mastodon/admin.scss
@@ -9,8 +9,11 @@ $content-width: 840px;
 .admin-wrapper {
   display: flex;
   justify-content: center;
+  box-sizing: border-box;
   width: 100%;
   min-height: 100vh;
+  padding: env(safe-area-inset-top) env(safe-area-inset-right)
+    env(safe-area-inset-bottom) env(safe-area-inset-left);
 
   .icon {
     width: 16px;
diff --git a/app/javascript/styles/mastodon/basics.scss b/app/javascript/styles/mastodon/basics.scss
index 27b37b292..f7dd06e7b 100644
--- a/app/javascript/styles/mastodon/basics.scss
+++ b/app/javascript/styles/mastodon/basics.scss
@@ -50,6 +50,7 @@ body {
     padding: 0;
     padding-left: env(safe-area-inset-left);
     padding-right: env(safe-area-inset-right);
+    box-sizing: border-box;
 
     &.layout-single-column {
       height: auto;
@@ -61,6 +62,7 @@ body {
       position: absolute;
       width: 100%;
       height: 100%;
+      padding-bottom: env(safe-area-inset-bottom);
     }
 
     &.with-modals--active {
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index a7219b419..a49a73d0c 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -2817,12 +2817,14 @@ a.account__display-name {
   }
 
   &__panels {
+    box-sizing: border-box;
     display: flex;
     justify-content: center;
     gap: 16px;
     width: 100%;
     height: 100%;
     min-height: 100vh;
+    padding-bottom: env(safe-area-inset-bottom);
 
     &__pane {
       height: 100%;