PLT-6098 Added Manage Teams modal to System Console users list (#5914)

* Added Manage Teams modal to System Console users list

* Localized ManageTeamsModal

* Fixed borders between Manage Teams list items

* Updated appearance of ManageTeamsModal

* Fixed admin being redirected from system console when removing self from a team

* Sorted teams in ManageTeamsModal

* Updated Manage Teams styling

1 files changed, 70 insertions, 0 deletions

diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss
index bf8aba6cc..a39e1c20a 100644
--- a/webapp/sass/routes/_admin-console.scss
+++ b/webapp/sass/routes/_admin-console.scss
@@ -501,3 +501,73 @@
         width: 200px
     }
 }
+
+.manage-teams {
+    .manage-teams__user {
+        align-items: center;
+        border-bottom-color: lightgray;
+        border-bottom-style: solid;
+        border-bottom-width: 1px;
+        display: flex;
+        padding-bottom: 15px;
+    }
+
+    .manage-teams__profile-picture {
+        border-radius: 20px;
+        height: 40px;
+        width: 40px;
+    }
+
+    .manage-teams__info {
+        flex: 1;
+        margin-left: 10px;
+        overflow: hidden;
+        white-space: nowrap;
+
+        .manage-teams__name {
+            font-weight: bold;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+
+        .manage-teams__email {
+            opacity: 0.5;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+    }
+
+    .manage-teams__system-admin {
+        margin-left: 10px;
+        opacity: 0.5;
+        padding-right: 10px;
+    }
+
+    .manage-teams__team {
+        align-items: center;
+        display: flex;
+        padding: 10px;
+    }
+
+    .manage-teams__team + .manage-teams__team {
+        border-top-color: lightgray;
+        border-top-style: solid;
+        border-top-width: 1px;
+    }
+
+    .manage-teams__team-name {
+        flex: 1;
+        font-weight: bold;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    .manage-teams__team-actions {
+        margin-left: 10px;
+
+        // Override default react-bootstrap style
+        .dropdown-toggle {
+            @include box-shadow(none);
+        }
+    }
+}