8 files changed, 56 insertions, 121 deletions
diff --git a/app/server-health/controllers/inventory-overview-controller.html b/app/server-health/controllers/inventory-overview-controller.html
index c70c5da..24c70b0 100644
--- a/app/server-health/controllers/inventory-overview-controller.html
+++ b/app/server-health/controllers/inventory-overview-controller.html
@@ -6,7 +6,7 @@
   <div class="row column">
     <div class="page-header">
       <h2 class="inline">All hardware in the system</h2>
-      <a ng-href="data:text/json;charset=utf-8,{{originalData}}" class="inline btn-export float-right"  download="export_inventory.json" ng-show="hardwares.length">Export</a>
+      <a ng-href="data:text/json;charset=utf-8,{{originalData}}" class="btn  btn-tertiary float-right"  download="export_inventory.json" ng-show="hardwares.length"><icon file="icon-export.svg"></icon>Export</a>
     </div>
   </div>
   <div class="row column">
diff --git a/app/server-health/controllers/log-controller.html b/app/server-health/controllers/log-controller.html
index 34a2ec3..3b164bd 100644
--- a/app/server-health/controllers/log-controller.html
+++ b/app/server-health/controllers/log-controller.html
@@ -46,21 +46,21 @@
             </p>
           </div>
           <div class="inline__confirm-buttons">
-            <button class="btn-primary" ng-click="accept()">Yes</button>
-            <button class="btn-primary" ng-click="confirm = false">No</button>
+            <button class="btn  btn-primary" ng-click="accept()">Yes</button>
+            <button class="btn  btn-primary" ng-click="confirm = false">No</button>
           </div>
         </div>
         <p class="inline" ng-show="selectedEvents.length"><span class="event__select-count">{{selectedEvents.length}}</span> Events are selected</p>
         <p class="inline" ng-hide="selectedEvents.length"><span class="event__select-count">{{filteredLogs.length}}</span> Events are logged</p>
         <!-- when logs are selected, this text changes to show how many logs are checked -->
         <div class="event__actions">
-          <button class="inline btn-delete" ng-class="{'disabled': (!selectedEvents.length && !all)}" ng-disabled="!selectedEvents.length && !all" ng-click="confirm= ! confirm">
-            <img class="event__icon" src="../../assets/images/icon-trashcan-white.svg" alt="">Delete
+          <button class="btn  btn-tertiary" ng-class="{'disabled': (!selectedEvents.length && !all)}" ng-disabled="!selectedEvents.length && !all" ng-click="confirm= ! confirm">
+            <icon file="icon-trashcan.svg"></icon>Delete
           </button>
-          <button class="inline btn-resolve" ng-class="{'disabled': ((selectedEvents|unResolvedCount) == 0)}" ng-click="resolve()" ng-disabled="(selectedEvents|unResolvedCount) == 0">
-            <img class="event__icon" src="../../assets/images/icon-check-white.svg" alt="">Mark as resolved
+          <button class="btn  btn-tertiary" ng-class="{'disabled': ((selectedEvents|unResolvedCount) == 0)}" ng-click="resolve()" ng-disabled="(selectedEvents|unResolvedCount) == 0">
+            <icon file="icon-check.svg"></icon>Mark as resolved
           </button>
-          <a ng-href="data:text/json;charset=utf-8,{{export_data}}" class="inline btn-export"  ng-class="{'disabled': (!selectedEvents.length && !all)}" download="{{export_name}}">Export</a>
+          <a ng-href="data:text/json;charset=utf-8,{{export_data}}" class="btn  btn-tertiary"  ng-class="{'disabled': (!selectedEvents.length && !all)}" download="{{export_name}}"><icon file="icon-export.svg"></icon>Export</a>
         </div>
       </div>
     </div>
diff --git a/app/server-health/controllers/sensors-overview-controller.html b/app/server-health/controllers/sensors-overview-controller.html
index 5a6f95a..90bdcc2 100644
--- a/app/server-health/controllers/sensors-overview-controller.html
+++ b/app/server-health/controllers/sensors-overview-controller.html
@@ -6,7 +6,7 @@
   <section class="row column">
     <div class="page-header">
       <h2 class="inline">All sensors present in the system</h2>
-      <a ng-href="data:text/json;charset=utf-8,{{export_data}}" class="inline btn-export float-right" download="{{export_name}}">Export</a>
+      <a ng-href="data:text/json;charset=utf-8,{{export_data}}" class="btn btn-tertiary float-right" download="{{export_name}}"><icon file="icon-export.svg"></icon>Export</a>
     </div>
   </section>
   <section class="row column">
@@ -23,16 +23,16 @@
 
     <div class="toggle-filter">
       <p class="content-label">FILTER BY SEVERITY</p>
-      <button class="inline first btn-primary" ng-click="toggleSeverityAll()"
+      <button class="btn" ng-click="toggleSeverityAll()"
           ng-class="selectedSeverity.all ? 'btn-primary' : 'btn-secondary'">All
       </button>
-      <button class="inline " ng-click="toggleSeverity('critical')"
+      <button class="btn" ng-click="toggleSeverity('critical')"
           ng-class="selectedSeverity.critical ? 'btn-primary' : 'btn-secondary'">Critical
       </button>
-      <button class="inline" ng-click="toggleSeverity('warning')"
+      <button class="btn" ng-click="toggleSeverity('warning')"
           ng-class="selectedSeverity.warning ? 'btn-primary' : 'btn-secondary'">Warning
       </button>
-      <button class="inline" ng-click="toggleSeverity('normal')"
+      <button class="btn" ng-click="toggleSeverity('normal')"
           ng-class="selectedSeverity.normal ? 'btn-primary' : 'btn-secondary'">Normal
       </button>
     </div>
diff --git a/app/server-health/directives/remote-logging-server-modal.html b/app/server-health/directives/remote-logging-server-modal.html
index eba57af..89f8c75 100644
--- a/app/server-health/directives/remote-logging-server-modal.html
+++ b/app/server-health/directives/remote-logging-server-modal.html
@@ -1,5 +1,7 @@
 <div role="dialog" class="uib-modal__content  remote-logging-server__modal">
-  <button type="button" class="icon  icon__close  float-right" ng-click="$close()"></button>
+  <button type="button" class="btn  btn--close  float-right" ng-click="$close()">
+    <icon file="icon-close.svg"></icon>
+  </button>
   <div class="modal-header">
     <h2 class="modal-title" id="dialog_label">{{activeModalProps.title}}</h2>
   </div>
@@ -29,10 +31,10 @@
       {{remoteServer.hostname}}?</p>
     </div>
     <div class="modal-footer">
-      <button class="button btn-secondary" ng-click="$close()" type="button">
+      <button class="btn btn-secondary" ng-click="$close()" type="button">
         Cancel
       </button>
-      <button class="button btn-primary" type="submit"
+      <button class="btn btn-primary" type="submit"
         ng-click="$close(activeModal)" ng-disabled="form.$invalid"
         ng-class="{'disabled': form.$invalid}">
         {{activeModalProps.actionLabel}}
diff --git a/app/server-health/directives/remote-logging-server.html b/app/server-health/directives/remote-logging-server.html
index 28fc313..c0edf5a 100644
--- a/app/server-health/directives/remote-logging-server.html
+++ b/app/server-health/directives/remote-logging-server.html
@@ -1,7 +1,7 @@
 <p class="content-label">Remote Logging Server</p>
 <div ng-if="!loadError && !remoteServer">
-  <button ng-click="initModal(0)" class="modal__trigger">
-    <span class="icon  icon__plus"></span>
+  <button ng-click="initModal(0)" class="btn  btn-tertiary  modal__trigger">
+    <icon file="icon-plus.svg"></icon>
     Add server
   </button>
 </div>
@@ -9,11 +9,11 @@
   <p class="inline remote-logging-server__details">
     {{remoteServer.hostname}}
   </p>
-  <button ng-click="initModal(1)" class="modal__trigger">
-    <span class="icon icon__edit"></span>
+  <button ng-click="initModal(1)" class="btn  btn-tertiary  modal__trigger">
+    <icon file="icon-edit.svg"></icon>
   </button>
-  <button ng-click="initModal(2)" class="modal__trigger">
-    <span class="icon icon__delete"></span>
+  <button ng-click="initModal(2)" class="btn  btn-tertiary  modal__trigger">
+    <icon file="icon-trashcan.svg"></icon>
   </button>
 </div>
 <div class="text-right" ng-if="loadError">
diff --git a/app/server-health/styles/log.scss b/app/server-health/styles/log.scss
index 675dc26..c02d1c4 100644
--- a/app/server-health/styles/log.scss
+++ b/app/server-health/styles/log.scss
@@ -36,24 +36,16 @@
     margin-bottom: 3px;
   }
   .event__severity-filter {
-    float:left;
     margin-right: 2em;
     margin-bottom: 1em;
-    button {
-      margin: 0px -3px;
-      padding: .6em 2em;
-      font-size: .9em;
-      font-weight: 700;
-      border-radius: 0;
-      @media (min-width: 583px) {
-        &.last {
-          border-left: 0;
-        }
+    font-size: 0.9em;
+    .btn {
+      width: 100px;
+      float: left;
+      &:not(:first-of-type) {
+        border-left-width: 1px;
       }
     }
-    .btn-primary {
-      border: 2px solid $primebtn__bg;
-    }
   }
   .event__date-filter {
     margin-right: 1.5em;
@@ -110,11 +102,6 @@
   position: relative;
   overflow: hidden;
   .header__actions-bar {
-    .btn-export,
-    .btn-delete,
-    .btn-resolve {
-      color: $white;
-    }
     .event-log__col-check {
       text-align: left;
       max-width: 30px;
@@ -122,6 +109,12 @@
         margin-left: -6px;
       }
     }
+    .btn:not([disabled]):not(.disabled) {
+      color: $white;
+      svg {
+        fill: $white;
+      }
+    }
   }
   .inline__confirm {
     height: auto;
@@ -153,45 +146,6 @@
     }
   }
 
-  //Export log
-  .btn-export, .btn-meta-copy,
-  .btn-delete,
-  .btn-resolve {
-    color: black;
-    font-size: .9em;
-    font-weight: 700;
-    position: relative;
-    padding: 0 0 1em 2em;
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-  .btn-resolve.disabled:hover,
-  .btn-delete.disabled:hover{
-    cursor: default;
-    text-decoration: none;
-  }
-  .btn-export {
-    margin-top: 7px;
-    padding-bottom: 0;
-  }
-  .btn-export:before {
-    content: '\21E5';
-    position: absolute;
-    font-size: 1.7em;
-    vertical-align: middle;
-    transform: rotate(90deg);
-    display: inline-block;
-    left: 2px;
-    top: -5px;
-  }
-  .btn-meta-copy,
-  .btn-delete,
-  .btn-resolve {
-    margin-left: 5px;
-    padding: .5em .5em;
-  }
-
   // Single event log card
   .event-log__single-event {
     border: 1px solid $medgrey;
@@ -286,7 +240,6 @@
   .event__metadata-row {
     max-height: 0;
     overflow: hidden;
-    -webkit-transition: 0.5s linear max-height;
     transition: 0.5s linear max-height;
     &.active {
       max-height: 1000px;
@@ -315,7 +268,6 @@
     &::-webkit-scrollbar-thumb {
       border-radius: 4px;
       background-color: rgba(0, 0, 0, .5);
-      -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
     }
   }
 
@@ -343,23 +295,13 @@
       float: right;
       margin-top: -5px;
     }
-    .disabled {
-      opacity: 0.2;
-      pointer-events: none;
-      cursor: default;
-      text-decoration: none;
-    }
-    .disabled:hover {
-      text-decoration: none;
-    }
   }
-  .event__icon {
-    width: 20px;
-    height: 20px;
-    font-weight: normal;
-    margin-right: .5em;
-    margin-top: -3px;
-    display: inline-block;
+
+  .btn:not([disabled]):not(.disabled) {
+    color: $black;
+    svg {
+      fill: $black;
+    }
   }
 }
 
@@ -374,12 +316,8 @@
   float: right;
   .modal__trigger {
     padding: 0;
-    color: $primebtn__bg;
     .icon {
       margin: 0;
-      width: 20px;
-      height: 20px;
-      vertical-align: text-bottom;
     }
   }
 }
@@ -397,8 +335,14 @@
       margin-top: -30px;
     }
   }
+  .btn--close {
+    padding: 0;
+    svg {
+      height: 1.6em;
+    }
+  }
+  .modal-header {
+    display: block;
+  }
 }
 //end event-log__events
-
-
-
diff --git a/app/server-health/styles/sensors.scss b/app/server-health/styles/sensors.scss
index 041a1e5..6c81766 100644
--- a/app/server-health/styles/sensors.scss
+++ b/app/server-health/styles/sensors.scss
@@ -144,6 +144,7 @@ $title-minWidth: 210px;
 
   .toggle-filter {
     margin-bottom: 20px;
+    font-size: 0.9em;
   }
   .column, .columns {
     padding-left: 0px;
diff --git a/app/server-health/styles/syslog.scss b/app/server-health/styles/syslog.scss
index 1e517ea..788e775 100644
--- a/app/server-health/styles/syslog.scss
+++ b/app/server-health/styles/syslog.scss
@@ -40,25 +40,13 @@
     float:left;
     margin-right: 2em;
     margin-bottom: 1em;
-    button {
-      padding: .6em 2em;
-      margin: 0px -1px;
+    .btn {
+      width: 100px;
       font-size: .9em;
-      font-weight: 700;
-      border-radius: 0;
-      &.first,
-      &.last {
-        border-radius: 3px;
-      }
-      @media (min-width: 583px) {
-        &.last {
-          border-left: 0;
-        }
+      &:not(:first-of-type) {
+        border-left-width: 1px;
       }
     }
-    .btn-primary {
-      border: 2px solid $primebtn__bg;
-    }
   }
   .sys-log__date-filter {
     margin-right: 1em;