FIX: correctly account for ipad footer nav height (#20334)

This code also removes duplicated code in chat which doesn’t seem necessary anymore.

app/assets/stylesheets/common/base/discourse.scss

@@ -67,6 +67,7 @@ body {
   background-attachment: fixed;
   background-size: cover;
   min-height: 100%;
+  box-sizing: border-box;
 
   @include clearfix;
 }

plugins/chat/assets/stylesheets/common/common.scss

@@ -606,7 +606,8 @@ html.has-full-page-chat {
     #main-outlet-wrapper {
       // restrict the row height, including when virtual keyboard is open
       grid-template-rows: calc(
-        var(--chat-vh, 1vh) * 100 - var(--header-offset)
+        var(--chat-vh, 1vh) * 100 - var(--header-offset, 0px) -
+          var(--footer-nav-height, 0px)
       );
       .sidebar-wrapper {
         // prevents sidebar from overflowing behind the virtual keyboard
@@ -614,16 +615,6 @@ html.has-full-page-chat {
       }
     }
 
-    // iPad webview
-    .footer-nav-ipad {
-      #main-outlet-wrapper {
-        // restrict the row height, including when virtual keyboard is open
-        grid-template-rows: calc(
-          var(--chat-vh, 1vh) * 100 - calc(var(--header-offset))
-        );
-      }
-    }
-
     .full-page-chat,
     .chat-live-pane,
     #main-outlet {

plugins/chat/assets/stylesheets/mobile/mobile.scss

@@ -92,13 +92,6 @@ html.has-full-page-chat {
   }
 }
 
-html.has-full-page-chat body {
-  #main-outlet-wrapper {
-    // restricts the height of the page
-    grid-template-rows: calc(var(--chat-vh, 1vh) * 100 - var(--header-offset));
-  }
-}
-
 .chat-message-separator {
   margin-left: 0;
 }