Merge pull request #2318 from hmhealey/plt1090

PLT-1090 Refactored modals that display users

3 files changed, 56 insertions, 12 deletions

diff --git a/web/sass-files/sass/partials/_admin-console.scss b/web/sass-files/sass/partials/_admin-console.scss
index dc8b950e4..f782da36b 100644
--- a/web/sass-files/sass/partials/_admin-console.scss
+++ b/web/sass-files/sass/partials/_admin-console.scss
@@ -235,4 +235,12 @@
             }
         }
     }
+
+    .member-list-holder {
+        .member-role, .member-drop {
+            position: absolute;
+            right: 15px;
+            top: 8px;
+        }
+    }
 }
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index 09c366c77..ca83c77da 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -9,6 +9,7 @@
 }
 .more-table {
 	margin: 0;
+	table-layout: fixed;
 	p {
 		font-size: 0.9em;
 		overflow: hidden;
@@ -52,12 +53,6 @@
 				&.padding--equal {
 					padding: 8px;
 				}
-				&.td--action {
-					text-align: right;
-					padding: 8px 15px 8px 8px;
-					vertical-align: middle;
-					position: relative;
-				}
 			}
 		}
 	}
@@ -398,7 +393,6 @@
 		overflow-y: auto;
 		overflow-x: hidden;
 		margin-top: 10px;
-		max-height: 500px;
 		position: relative;
 	}
 
@@ -434,3 +428,50 @@
 		max-height: 150px;
 	}
 }
+
+.user-list {
+    display: flex;
+    flex-direction: column;
+
+    .profile-img {
+        width: 38px;
+        height: 38px;
+        flex-grow: 0;
+        flex-shrink: 0;
+    }
+
+    .user-list-item__details {
+        flex-grow: 1;
+        flex-shrink: 1;
+        overflow:hidden;
+        text-overflow: ellipsis;
+
+        .more-name {
+            white-space: nowrap;
+        }
+
+        .more-description {
+            white-space: nowrap;
+        }
+    }
+
+    .user-list-item__actions {
+        flex-grow: 0;
+        flex-shrink: 0;
+    }
+}
+
+.filtered-user-list {
+    display: flex;
+    flex-direction: column;
+
+    .filter-row {
+        flex-grow: 0;
+        flex-shrink: 0;
+    }
+
+    .user-list {
+        flex-grow: 1;
+        flex-shrink: 1;
+    }
+}
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 8508ce6fc..99b564fe5 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -399,10 +399,6 @@ h3 {
 }
 
 .member-role, .member-drop {
-    position:absolute;
-    right: 15px;
-    top: 8px;
-
     .fa {
         margin-right: 5px;
         @include opacity(0.5);
@@ -413,7 +409,6 @@ h3 {
         top: -50%;
         right: 110%;
     }
-
 }
 
 .member-invite {