Use table toolbar styles for events filter

Author: spadgett

Diff for: app/styles/_tables.less

@@ -29,6 +29,9 @@
 }
 
 .events .data-toolbar {
+  .form-group {
+    margin-bottom: 0;
+  }
   .search-pf {
     margin-bottom: 10px;
     width: 100%;

Diff for: app/views/directives/events.html

@@ -2,37 +2,39 @@
   Loading...
 </div>
 <div ng-if="events" class="events">
-  <div class="data-toolbar">
-    <form role="form" class="search-pf has-button">
-      <div class="form-group filter-controls has-clear">
-        <div class="search-pf-input-group">
-          <label for="events-filter" class="sr-only">Filter</label>
-          <input type="search"
-                 placeholder="Filter by keyword"
-                 class="form-control"
-                 id="events-filter"
-                 ng-model="filter.text"
-                 autocorrect="off"
-                 autocapitalize="off"
-                 spellcheck="false">
-          <button
-              type="button"
-              class="clear"
-              aria-hidden="true"
-              ng-if="filter.text"
-              ng-click="filter.text = ''">
-              <span class="pficon pficon-close"></span>
-          </button>
+  <div class="table-filter-extension">
+    <div class="data-toolbar">
+      <form role="form" class="search-pf has-button">
+        <div class="form-group filter-controls has-clear">
+          <div class="search-pf-input-group">
+            <label for="events-filter" class="sr-only">Filter</label>
+            <input type="search"
+                   placeholder="Filter by keyword"
+                   class="form-control"
+                   id="events-filter"
+                   ng-model="filter.text"
+                   autocorrect="off"
+                   autocapitalize="off"
+                   spellcheck="false">
+            <button
+                type="button"
+                class="clear"
+                aria-hidden="true"
+                ng-if="filter.text"
+                ng-click="filter.text = ''">
+                <span class="pficon pficon-close"></span>
+            </button>
+          </div>
         </div>
+      </form>
+      <div class="vertical-divider"></div>
+      <div class="sort-group">
+        <span class="sort-label">Sort by</span>
+        <div pf-sort config="sortConfig" class="sort-controls"></div>
       </div>
-    </form>
-    <div class="vertical-divider"></div>
-    <div class="sort-group">
-      <span class="sort-label">Sort by</span>
-      <div pf-sort config="sortConfig" class="sort-controls"></div>
     </div>
   </div>
-  <table class="table table-bordered table-condensed table-mobile table-hover table-layout-fixed events-table" ng-class="{ 'table-empty': (filteredEvents | hashSize) === 0 }">
+  <table class="table table-bordered table-condensed table-mobile table-hover table-layout-fixed events-table">
     <thead>
       <tr>
         <th id="time">Time</th>

Diff for: dist/scripts/templates.js

@@ -6867,6 +6867,7 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "Loading...\n" +
     "</div>\n" +
     "<div ng-if=\"events\" class=\"events\">\n" +
+    "<div class=\"table-filter-extension\">\n" +
     "<div class=\"data-toolbar\">\n" +
     "<form role=\"form\" class=\"search-pf has-button\">\n" +
     "<div class=\"form-group filter-controls has-clear\">\n" +
@@ -6885,7 +6886,8 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "<div pf-sort config=\"sortConfig\" class=\"sort-controls\"></div>\n" +
     "</div>\n" +
     "</div>\n" +
-    "<table class=\"table table-bordered table-condensed table-mobile table-hover table-layout-fixed events-table\" ng-class=\"{ 'table-empty': (filteredEvents | hashSize) === 0 }\">\n" +
+    "</div>\n" +
+    "<table class=\"table table-bordered table-condensed table-mobile table-hover table-layout-fixed events-table\">\n" +
     "<thead>\n" +
     "<tr>\n" +
     "<th id=\"time\">Time</th>\n" +