#85 - clean up styles in search interface

src/app/components/search/Search.component.html

@@ -1,4 +1,4 @@
-<div class="container" style="display: flex; flex-direction: column; height: 100%;">
+<div [ngClass]="'container' + (isDark() ? ' dark' : '')" style="display: flex; flex-direction: column; height: 100%;">
     <ion-header class="search-header">
         <ion-input
             placeholder="Start typing to search..."

src/app/components/search/Search.component.scss

@@ -12,10 +12,11 @@
 
   .type {
     padding: 5px 20px;
+    border: 1px solid rgba(0,0,0,0);
+    border-radius: 30px;
 
     &.current-type {
       border: 1px solid #ccc;
-      border-radius: 30px;
     }
 
     &:hover {
@@ -145,3 +146,9 @@
     }
   }
 }
+
+.container.dark {
+  .types {
+    color: #eeeeee;
+  }
+}

src/app/components/search/Search.component.ts

@@ -73,6 +73,10 @@ export class SearchComponent implements OnInit {
         await this.ionModalController.dismiss();
     }
 
+    public isDark() {
+        return document.body.classList.contains('dark');
+    }
+
     filterView(name: string) {
         this.selectedType = name;
         this.results.next((this.allResults.getValue() || []).filter(x => {