better rendering of dialogs

src/App/App.css

@@ -59,21 +59,28 @@ button.active {
   color: black;
 }
 
+.modalOuter {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  text-align: center;
+
+  background-color: rgba(200,200,200,0.7);
+ /* backdrop-filter: blur(2px) */
+}
+
 .modalInner {
   position: relative;
-  top: 50%;
-  transform: translateY(-50%);
   text-align: center;
   display: inline-block;
   background-color: white;
+  max-height: 100vh;
+  overflow: auto;
 }
 
-.modalOuter {
-  width: 100%;
-  height: 100%;
-  position:absolute;
-  text-align: center;
-  background-color: rgba(200,200,200,0.7);
-  /* backdrop-filter: blur(2px) */
-}