From 8a90adc44282e5a05e9689228a70fda3ee02714b Mon Sep 17 00:00:00 2001
From: Felix Breidenstein <felix@codemonauts.com>
Date: Tue, 20 Jul 2021 11:26:14 +0200
Subject: [PATCH] Set height on nested elements to avoid mutliple scrollbars

---
 popup.html   | 4 +++-
 src/popup.js | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)
diff --git a/popup.html b/popup.html
index e35fc80..80d69f7 100644
--- a/popup.html
+++ b/popup.html
@@ -45,6 +45,8 @@
 #main {
   font-size: 15px;
   padding-bottom: 5px;
+  height: 100%;
+  flex-direction: column;
 }
 #roleList {
   padding: 0;
@@ -97,7 +99,7 @@
 </style>
 </head>
 <body>
-<div style="display: flex">
+<div style="display: flex; height: 100%">
   <div class="mainPane" style="min-width: 280px">
     <div id="main" style="display: none">
       <div style="padding: 12px 6px 6px;">
diff --git a/src/popup.js b/src/popup.js
index 386dbf4..4471e6e 100644
--- a/src/popup.js
+++ b/src/popup.js
@@ -85,7 +85,7 @@ function main() {
         executeAction(tab.id, 'loadInfo', {}).then(userInfo => {
           if (userInfo) {
             loadFormList(url, userInfo, tab.id);
-            document.getElementById('main').style.display = 'block';
+            document.getElementById('main').style.display = 'flex';
           } else {
             const noMain = document.getElementById('noMain');
             const p = noMain.querySelector('p');
