From 9b43ef47fe4fae18f93cc3f305c5818ce24d2e13 Mon Sep 17 00:00:00 2001
From: Phillip Tarrant <ptarrant@gmail.com>
Date: Thu, 27 Aug 2020 20:01:41 -0400
Subject: [PATCH] adding colors to dashboard based on cpu/mem load

---
 app/frontend/templates/panel/dashboard.html | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/app/frontend/templates/panel/dashboard.html b/app/frontend/templates/panel/dashboard.html
index 6d1abeb3..e8283454 100644
--- a/app/frontend/templates/panel/dashboard.html
+++ b/app/frontend/templates/panel/dashboard.html
@@ -132,15 +132,30 @@
 
                   <td>
                     <div class="progress" data-toggle="tooltip" data-placement="top" title="{{server['stats'][0]['cpu']}}">
-                      <div class="progress-bar bg-success" role="progressbar" style="width: {{server['stats'][0]['cpu']}}%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
-
+                      <div class="progress-bar
+                      {% if server['stats'][0]['cpu'] <= 33 %}
+                      bg-success
+                      {% elif 34 <= server['stats'][0]['cpu'] <= 66 %}
+                      bg-warning
+                      {% else %}
+                      bg-danger
+                      {% end %}
+                      " role="progressbar" style="width: {{server['stats'][0]['cpu']}}%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
                     </div>
                     {{server['stats'][0]['cpu']}}%
                   </td>
 
                   <td>
                     <div class="progress" data-toggle="tooltip" data-placement="top" title="{{server['stats'][0]['mem']}}">
-                      <div class="progress-bar bg-success" role="progressbar" style="width: {{server['stats'][0]['mem_percent']}}%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
+                      <div class="progress-bar
+                      {% if server['stats'][0]['mem_percent'] <= 33 %}
+                      bg-success
+                      {% elif 34 <= server['stats'][0]['mem_percent'] <= 66 %}
+                      bg-warning
+                      {% else %}
+                      bg-danger
+                      {% end %}
+                      " role="progressbar" style="width: {{server['stats'][0]['mem_percent']}}%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
                     </div>
                     {{server['stats'][0]['mem_percent']}}% - {{server['stats'][0]['mem']}}
                   </td>