From 248707e90342d08ab1ae5a15482de0896638de34 Mon Sep 17 00:00:00 2001
From: linuxitux <linuxito@openmailbox.org>
Date: Mon, 12 Jun 2017 10:52:08 -0400
Subject: [PATCH] F L A T

---
 rendergraph.js |  2 +-
 sere.js        | 33 ++++++++++++++++++++++++++++++---
 template.css   | 28 ++++++++++++++++------------
 3 files changed, 47 insertions(+), 16 deletions(-)

diff --git a/rendergraph.js b/rendergraph.js
index f79fc24..7534b1d 100644
--- a/rendergraph.js
+++ b/rendergraph.js
@@ -1,6 +1,6 @@
 var rendergraph = function() {
 
-	var colorlist = ['#f00','#0f0','#00f'],
+	var colorlist = ['#3bbe7c','#f1a62f','#e13545'],
 		valuemarkerspacing = 30,
 		timemarkerspacing = 150,
 		timemarkerwidth = 80,
diff --git a/sere.js b/sere.js
index 492b56b..a081589 100644
--- a/sere.js
+++ b/sere.js
@@ -101,6 +101,7 @@ function drawClock(canvas,value,width) {
   var endAnglei = null;
 
   var colors = [];
+/*
   colors.push('#18ff00');
   colors.push('#42ff00');
   colors.push('#6cff00');
@@ -116,6 +117,32 @@ function drawClock(canvas,value,width) {
   colors.push('#ff4000');
   colors.push('#ff2500');
   colors.push('#ff1800');
+*/
+
+  colors.push('#3bbe7c');
+  colors.push('#f7e930');
+  colors.push('#f1a62f');
+  colors.push('#e13545');
+/*
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+  colors.push('#');
+*/
 
   var startColor = null;
   var endColor = null;
@@ -174,8 +201,8 @@ function drawClock(canvas,value,width) {
   // Draw clock hand
   canvas.beginPath();
   canvas.arc(cx,cy-maxy*0.05,maxy*0.025,2*Math.PI,false);
-  canvas.fillStyle='black';
-  canvas.strokeStyle='black';
+  canvas.fillStyle='#231f20';
+  canvas.strokeStyle='#231f20';
   canvas.lineWidth = maxy*0.05;
   canvas.fill();
   canvas.stroke();
@@ -187,7 +214,7 @@ function drawClock(canvas,value,width) {
   dx = -(radius*1.3) * Math.sin(angle);
   dy = (radius*1.3) * Math.cos(angle);
   canvas.lineTo(cx+dx,cy+dy-maxy*0.03);
-  canvas.strokeStyle = 'black';
+  canvas.strokeStyle = '#231f20';
   canvas.stroke();
 
 }
diff --git a/template.css b/template.css
index f5fe212..2956d05 100644
--- a/template.css
+++ b/template.css
@@ -1,7 +1,7 @@
 body {
 font-family: Verdana;
 margin: 0;
-background-color: #f0f0f0;
+background-color: #DADFE1;
 font-size: 100%;
 }
 
@@ -9,8 +9,8 @@ h1 {
 font-size: 1.3em;
 font-weight: 100;
 text-align: center;
-color: #eee;
-background-color: #222;
+color: #ececec;
+background-color: #1BBC9B;
 padding: 5px;
 margin: 0;
 }
@@ -19,12 +19,12 @@ h2 {
 font-size: 1.1em;
 font-weight: 100;
 text-align: center;
-color: #aaa;
 margin: 0;
+color: #666;
 }
 
 a, a:link, a:visited, a:hover, a:active {
-color: #00f;
+color: #1BBC9B;
 }
 
 a {
@@ -54,7 +54,7 @@ h3, h4 {
 font-weight: 300;
 font-size: 1em;
 text-align: center;
-color: #666;
+color: #1BBC9B;
 }
 
 h3 {
@@ -79,15 +79,19 @@ text-align: center;
 }
 
 .metrics, .small-metrics {
+/*
 -webkit-border-radius: 5px;
 border-radius: 5px;
 -webkit-box-shadow: 0 0 5px 0 #bbb;
 box-shadow: 0 0 5px 0 #bbb;
+*/
 margin: 5px;
 display: inline-block;
 vertical-align: top;
-background-color: #fafafa;
+background-color: #ECECEC;
+/*
 border: 1px solid #bbb;
+*/
 max-width: 280px;
 min-width: 140px;
 }
@@ -116,6 +120,7 @@ word-wrap: break-word;
 font-size: .75em;
 width: 280px;
 text-align: left;
+color: #6C7A89;
 }
 
 .netunit {
@@ -149,15 +154,15 @@ text-align: left;
 }
 
 .psleeping {
-color: #999;
+color: #6C7A89;
 }
 
 .pwaiting {
-color: #fb0;
+color: #f1a62f;
 }
 
 .prunning {
-color: #f00;
+color: #e13545;
 }
 
 .uptime {
@@ -185,14 +190,13 @@ font-size: 0.75em;
 	height: 360px;
 	position: relative;
 	z-index: 50;
-    margin-bottom: 50px;
+    margin-bottom: 100px;
 }
 
 .graph h2 {
 border: 0;
 font-size: 1.3em;
 margin-top: 10px;
-color: #666;
 }
 
 /* -- graph axis lines and value markers -- */