Fix broken flex modal layouts (#7343)

js-old/src/ui/AccountCard/accountCard.css

@@ -20,7 +20,6 @@
   background-color: rgba(0, 0, 0, 0.8);
   display: flex;
   flex-direction: row;
-  height: 100%;
   overflow: hidden;
   transition: transform ease-out 0.1s;
   transform: scale(1);

js-old/src/ui/Form/AddressSelect/addressSelect.css

@@ -105,9 +105,7 @@
 }
 
 .inputContainer {
-  display: flex;
+  justify-content: flex-start;
-  flex-direction: column;
-  flex: 1;
 
   .input {
     font-size: 1.5em;
@@ -134,8 +132,6 @@
 }
 
 .category {
-  display: flex;
-  flex-direction: column;
   margin: 0 0.5em;
   max-width: 35em;
 
@@ -149,12 +145,8 @@
   }
 
   .cards {
-    flex: 1;
     overflow: auto;
 
-    display: flex;
-    flex-direction: column;
-
     margin: 1em 0;
   }
 

js-old/src/ui/Form/AddressSelect/addressSelect.js

@@ -335,7 +335,7 @@ class AddressSelect extends Component {
 
       content = (
         <div className={ styles.cards }>
-          <div>{ cards }</div>
+          { cards }
         </div>
       );
     }

js-old/src/ui/Portal/portal.css

@@ -82,10 +82,9 @@ $popoverZ: 3600;
     /* but may well be) will scretch to non-visible areas.
     */
     &.small {
-      margin: 1.5em auto;
+      left: 50%;
-      max-width: 768px;
+      margin: 1.5em -384px;
-      position: relative;
+      width: 768px;
-      width: 75%;
     }
   }
 

js-old/src/ui/SelectionList/selectionList.css

@@ -19,7 +19,6 @@
   cursor: pointer;
   display: flex;
   flex: 1;
-  height: 100%;
   position: relative;
   width: 100%;
 
@@ -29,7 +28,6 @@
   }
 
   .content {
-    height: 100%;
     width: 100%;
 
     &:hover {