Create TableFilter component

Global TableFilter component and TableFilterMixin can be used
with any table. The TableFilterMixin will return filtered
data with items that match any of the filter tags.

When the table search component is built, it should use the
BoostrapVue Table :filter prop.

- Filter by status added to Sensors table

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I57ebab1686b2d267383cb0e1be252627bf42c98c
diff --git a/src/assets/styles/_badge.scss b/src/assets/styles/_badge.scss
index 99c758a..68e7482 100644
--- a/src/assets/styles/_badge.scss
+++ b/src/assets/styles/_badge.scss
@@ -3,6 +3,14 @@
   // for pill variant because global $enable-rounded
   // Boostrap setting removes rounded pill style
   border-radius: 10rem;
+  fill: currentColor;
+  font-weight: 400;
+  .close {
+    font-size: 1em;
+    margin-left: $spacer/2;
+    font-weight: inherit;
+    color: inherit;
+  }
 }
 
 .badge-primary {
diff --git a/src/assets/styles/_dropdown.scss b/src/assets/styles/_dropdown.scss
new file mode 100644
index 0000000..0eb310f
--- /dev/null
+++ b/src/assets/styles/_dropdown.scss
@@ -0,0 +1,21 @@
+.dropdown-item {
+  padding-left: $spacer/2;
+}
+
+.b-dropdown-form {
+  padding: $spacer/2;
+  .form-group {
+    margin-bottom: $spacer/2;
+  }
+}
+
+.table-filter {
+  // Adding component style to global stylesheet because
+  // single-file component scoped styles aren't
+  // being applied to dynamically appended elements
+  // The overflow menu should be above the table
+  .dropdown-menu {
+    z-index: $zindex-dropdown + 1;
+    padding: 0;
+  }
+}
\ No newline at end of file
diff --git a/src/assets/styles/_obmc-custom.scss b/src/assets/styles/_obmc-custom.scss
index 544e585..4e0e1c5 100644
--- a/src/assets/styles/_obmc-custom.scss
+++ b/src/assets/styles/_obmc-custom.scss
@@ -42,6 +42,7 @@
 @import "./alerts";
 @import "./badge";
 @import "./buttons";
+@import "./dropdown";
 @import "./form-components";
 @import "./modal";
 @import "./table";