PLT-6595 (Client): Elasticsearch indexing system console UI (#6991)

* PLT-6595: System Console for Elasticsearch Job Management.

* Fixing UI issues

* Fixing colors

* ESLint Fixes.

* Update test snapshots.

* Fixing cancel button

* Fix review comments.

* Config capitalisation.

* Review fixes.

3 files changed, 50 insertions, 4 deletions

diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss
index 9e8c74484..4fe45d9b8 100644
--- a/webapp/sass/routes/_admin-console.scss
+++ b/webapp/sass/routes/_admin-console.scss
@@ -289,6 +289,22 @@
     .admin-console-header {
         border-bottom: 1px solid alpha-color($black, .1);
     }
+
+    .status-icon-unknown {
+        color: gray;
+    }
+
+    .status-icon-success {
+        color: #69c169;
+    }
+
+    .status-icon-warning {
+        color: #eac262;
+    }
+
+    .status-icon-error {
+        color: #ea6262;
+    }
 }
 
 .brand-img {
@@ -476,10 +492,6 @@
     margin-top: -15px;
 }
 
-.reload-config {
-    margin-bottom: 50px !important;
-}
-
 .recycle-db {
     margin-top: 50px !important;
 }
diff --git a/webapp/sass/utils/_modifiers.scss b/webapp/sass/utils/_modifiers.scss
new file mode 100644
index 000000000..aa89fc107
--- /dev/null
+++ b/webapp/sass/utils/_modifiers.scss
@@ -0,0 +1,33 @@
+@charset 'UTF-8';
+
+.margin--right {
+    margin-right: 5px;
+
+    &.x2 {
+        margin-right: 10px;
+    }
+}
+
+.margin--left {
+    margin-left: 5px;
+
+    &.x2 {
+        margin-left: 10px;
+    }
+}
+
+.padding--right {
+    padding-right: 5px;
+
+    &.x2 {
+        padding-right: 10px;
+    }
+}
+
+.padding--left {
+    padding-left: 5px;
+
+    &.x2 {
+        padding-left: 10px;
+    }
+}
diff --git a/webapp/sass/utils/_module.scss b/webapp/sass/utils/_module.scss
index 5dddcaef7..5cf2a85be 100644
--- a/webapp/sass/utils/_module.scss
+++ b/webapp/sass/utils/_module.scss
@@ -3,3 +3,4 @@
 @import 'functions';
 @import 'mixins';
 @import 'animations';
+@import 'modifiers';