GRN2-176: Create a role editor that allows admins to specify what permissions each role has (#709)

* Add roles editor

* Add colour selection ability to roles

* Add ability to assign roles to users in the UI

* Remove rolify and replace it with our own custom roles implemenation

* - Fix all existing roles functionality
- Fix super admins

* Fix bugs with new customers not have default roles

* Add can't create room setting

* Code improvements

* Fix migration

* Add tests for new methods

* Translate reserved role names

* Pull roles from saml/ldap

* Fix rspec

* Fix scrutinizer issues

* Fix email promoted/demoted tests

* Apply comments

* Redirect directly to the main room

* Add comments

app/assets/stylesheets/admins.scss

@@ -54,4 +54,29 @@
     height: 2rem;
     width: 2rem;
   }
+}
+
+.sort-disabled{
+  background: #e6e6e6 !important;
+  color: rgb(110, 118, 135) !important;
+  opacity: 0.75;
+  &:hover{
+    opacity: 0.9;
+  }
+}
+
+.form-disable{
+  background-color: #e6e6e6;
+}
+
+.role-colour-picker{
+  color: white !important;
+}
+
+.custom-role-tag{
+  color: white !important;
+}
+
+.user-role-tag{
+  color: white !important;
 }

app/assets/stylesheets/application.scss

@@ -32,6 +32,7 @@
 
 @import "tabler/variables";
 @import "bootstrap";
+@import "jquery-ui/sortable";
 @import "tabler-custom";
 
 @import "utilities/variables";

app/assets/stylesheets/users.scss

@@ -18,3 +18,7 @@
 // Place all the styles related to the Users controller here.
 // They will automatically be included in application.css.
 // You can use Sass (SCSS) here: http://sass-lang.com/
+
+.user-role-tag{
+    color: white !important;
+}

app/assets/stylesheets/utilities/_primary_themes.scss

@@ -85,6 +85,11 @@ a {
   &:hover {
     color: $primary-color !important;
     background-color: $primary-color-lighten !important;
+    &.sort-disabled {
+      background: #e6e6e6 !important;
+      color: rgb(110, 118, 135) !important;
+      opacity: 0.9;
+    }
   }
   &:active {
     background-color: $primary-color-lighten !important;
@@ -102,6 +107,12 @@ input:focus, select:focus {
   &, .list-group-item.active * {
     color: $primary-color !important;
   }
+
+  &.sort-disabled {
+    background: #e6e6e6 !important;
+    color: rgb(110, 118, 135) !important;
+    opacity: 0.9 !important;
+  }
 }
 
 .text-primary {