From 1847c5219dd30a8695e7182e0b466baa47b96e5f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sybren=20A=2E=20St=C3=BCvel?= <sybren@blender.org>
Date: Fri, 15 Apr 2022 14:24:29 +0200
Subject: [PATCH] Web: fix unexpected scrollbar on Firefox

Firefox will still have an additional 1px vertical line at the bottom of
the page, even when `#app` should take 100% of the vertical space. This
causes a scrollbar to show up. Setting the height at `calc(100vh - 1px)`
solves this.
---
 web/app/src/App.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/web/app/src/App.vue b/web/app/src/App.vue
index 5c2e864d..971aa68a 100644
--- a/web/app/src/App.vue
+++ b/web/app/src/App.vue
@@ -135,8 +135,11 @@ export default {
   --grid-gap: 4px;
 }
 
+html,
 body {
+  height: calc(100vh - 1px);
   margin: 0;
+  padding: 0;
 
   color: #EEEEEE;
   background-color: #222222;
@@ -149,7 +152,7 @@ body {
 
   display: grid;
   width: 100%;
-  height: 100vh;
+  height: 100%;
   grid-template-columns: 1fr 1fr 1fr;
   grid-template-rows: var(--header-height) 1fr var(--footer-height);
   grid-gap: var(--grid-gap);