Merge pull request #163 from raphink/colors

Use more standard colors for Puppet run states

puppetboard/static/css/puppetboard.css

@@ -36,6 +36,55 @@ th.tablesorter-headerDesc::after {
   display: block;
 }
 
+.ui.label.status {
+  color: white;
+  text-shadow: 0 0 1px;
+}
+
+.ui.header.failed, .ui.line.failed {
+  color: #AA4643;
+}
+
+.ui.label.failed {
+  background-color: #AA4643;
+}
+
+.ui.header.changed, .ui.line.changed {
+  color: #4572A7;
+}
+
+.ui.label.changed {
+  background-color: #4572A7;
+}
+
+.ui.header.unreported {
+  color: #3D96AE;
+}
+
+.ui.label.unreported {
+  background-color: #3D96AE;
+}
+
+.ui.header.noop {
+  color: #DB843D;
+}
+
+.ui.label.noop {
+  background-color: #DB843D;
+}
+
+.ui.label.unchanged {
+  background-color: #89A54E;
+}
+
+.ui.line.skipped {
+  color: orange;
+}
+
+.ui.label.skipped {
+  background-color: orange;
+}
+
 .count {
   width: 14%;
   text-align: center;

puppetboard/templates/_macros.html

@@ -150,13 +150,15 @@
 {% macro status_counts(caller, status, node_name, events, current_env, unreported_time=False, report_hash=False) -%}
   <a class="ui small status label
     {% if status == 'failed' -%}
-      red
+      failed
     {% elif status == 'changed' -%}
-      green
+      changed
     {% elif status == 'unreported' -%}
-      black
+      unreported
     {% elif status == 'noop' -%}
-      blue
+      noop
+    {% elif status == 'unchanged' -%}
+      unchanged
     {% endif -%}
   " href="
     {% if report_hash -%}
@@ -170,9 +172,9 @@
   {% if status == 'unreported' %}
     <span class="ui small label status"> {{ unreported_time }} </span>
   {% else %}
-    {% if events['failures'] %}<span class="ui small count label red">{{events['failures']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
+    {% if events['failures'] %}<span class="ui small count label failed">{{events['failures']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
-    {% if events['successes'] %}<span class="ui small count label green">{{events['successes']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
+    {% if events['successes'] %}<span class="ui small count label changed">{{events['successes']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
-    {% if events['skips'] %}<span class="ui small count label orange">{{events['skips']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
+    {% if events['skips'] %}<span class="ui small count label skipped">{{events['skips']}}</span>{% else %}<span class="ui small count label">0</span>{% endif%}
   {% endif %}
 {%- endmacro %}
 {% macro render_pagination(pagination) -%}

puppetboard/templates/index.html

@@ -8,7 +8,7 @@
   <div class="four column row">
     <div class="column">
       <a href="{{url_for('nodes', env=current_env, status='failed')}}">
-        <h1 class="ui red header no-margin-bottom">
+        <h1 class="ui failed header no-margin-bottom">
           {{stats['failed']}}
           <small>{% if stats['failed']== 1 %} node {% else %} nodes {% endif %}</small>
         </h1>
@@ -17,7 +17,7 @@
     </div>
     <div class="column">
       <a href="{{url_for('nodes', env=current_env, status='noop')}}">
-        <h1 class="ui header purple no-margin-bottom">
+        <h1 class="ui header noop no-margin-bottom">
           {{stats['noop']}}
           <small>{% if stats['noop']== 1 %} node {% else %} nodes {% endif %}</small>
         </h1>
@@ -26,7 +26,7 @@
     </div>
     <div class="column">
       <a href="{{url_for('nodes', env=current_env, status='changed')}}">
-        <h1 class="ui header green no-margin-bottom">
+        <h1 class="ui header changed no-margin-bottom">
           {{stats['changed']}}
           <small>{% if stats['changed']== 1 %} node {% else %} nodes {% endif %}</small>
         </h1>
@@ -35,7 +35,7 @@
     </div>
     <div class="column">
       <a href="{{url_for('nodes', env=current_env, status='unreported')}}">
-        <h1 class="ui header black no-margin-bottom">
+        <h1 class="ui header unreported no-margin-bottom">
           {{ stats['unreported'] }}
           <small>{% if stats['unreported']== 1 %} node {% else %} nodes {% endif %}</small>
         </h1>

puppetboard/templates/report.html

@@ -39,9 +39,11 @@
   <tbody>
     {% for event in events %}
     {% if not event.failed and event.item['old'] != event.item['new'] %}
-      <tr id='event-{{loop.index}}' class='positive'>
+      <tr id='event-{{loop.index}}' class='ui line changed'>
     {% elif event.failed %}
-      <tr id='event-{{loop.index}}' class='error'>
+      <tr id='event-{{loop.index}}' class='ui line failed'>
+    {% else %}
+      <tr id='event-{{loop.index}}' class='ui line {{event.status}}'>
     {% endif %}
       <td>{{event.item['type']}}[{{event.item['title']}}]</td>
       <td>{{event.status}}</td>