Move status indicator code into a shared component

dashboard/src/style.css

@@ -83,12 +83,6 @@ footer > .p {
   margin: 4px;
 }
 
-
-/* TODO use pankow has-error everywhere instead*/
-.text-danger {
-  color: var(--pankow-color-danger);
-}
-
 .content {
   max-width: 1280px;
   width: 100%;
@@ -148,22 +142,22 @@ tr:hover .table-actions {
 
 /* status classes for circle indicators */
 .status-active {
-    color: #27CE65;
+  color: #27CE65;
 }
 
 .status-inactive {
-    color: #7c7c7c;
+  color: #7c7c7c;
 }
 
 .status-starting {
-    color: #f0ad4e;
+  color: #f0ad4e;
 }
 
 .status-error {
-    color: #ec534f;
+  color: #ec534f;
 }
 
-/* generic test modifiers */
+/* generic text modifiers */
 .text-success {
   color: #5CB85C;
 }
@@ -172,6 +166,10 @@ tr:hover .table-actions {
   color: #8a6d3b;
 }
 
+.text-danger {
+  color: var(--pankow-color-danger);
+}
+
 .text-bold {
   font-weight: bold;
 }