Search empty results

app/partials/views/modules/search-result-table.jade

@@ -1,6 +1,7 @@
 section.search-result-table
 
 script(type="text/ng-template", id="search-issues")
+    div.search-result-table-container(ng-class="{'hidden': !issues.length}")
         div.search-result-table-header
             div.row.title
                 div.user-stories.width-4 Issues
@@ -15,7 +16,14 @@ script(type="text/ng-template", id="search-issues")
                 div.status.width-2(tg-listitem-issue-status="issue")
                 div.points.width-1(tg-listitem-assignedto="issue")
 
+    div.empty.empty-search-results(ng-class="{'hidden': issues.length}")
+                span.icon.icon-issues
+                span.title It looks like nothing was found with your search criteria.
+                span Maybe try one of the tabs above or search again
+
+
 script(type="text/ng-template", id="search-userstories")
+    div.search-result-table-container(ng-class="{'hidden': !userstories.length}")
         div.search-result-table-header
             div.row.title
                 div.user-stories.width-4 User Stories
@@ -30,7 +38,13 @@ script(type="text/ng-template", id="search-userstories")
                 div.status.width-2(tg-listitem-us-status="us")
                 div.points.width-1(tg-bo-bind="us.total_points")
 
+    div.empty.empty-search-results(ng-class="{'hidden': userstories.length}")
+                span.icon.icon-issues
+                span.title It looks like nothing was found with your search criteria.
+                span Maybe try one of the tabs above or search again
+
 script(type="text/ng-template", id="search-tasks")
+    div.search-result-table-container(ng-class="{'hidden': !tasks.length}")
         div.search-result-table-header
             div.row.title
                 div.user-stories.width-4 Task
@@ -45,7 +59,13 @@ script(type="text/ng-template", id="search-tasks")
                 div.status.width-2(tg-listitem-task-status="task")
                 div.points.width-1(tg-listitem-assignedto="task")
 
+    div.empty.empty-search-results(ng-class="{'hidden': tasks.length}")
+                span.icon.icon-issues
+                span.title It looks like nothing was found with your search criteria.
+                span Maybe try one of the tabs above or search again
+
 script(type="text/ng-template", id="search-wikipages")
+    div.search-result-table-container(ng-class="{'hidden': !wikipages.length}")
         div.search-result-table-header
             div.row.title
                 div.user-stories.width-4 Wiki page
@@ -55,3 +75,9 @@ script(type="text/ng-template", id="search-wikipages")
                     div.user-story-name
                         a(href="", tg-nav="project-wiki-page:project=project.slug,slug=wikipage.slug",
                             tg-bo-bind="wikipage.slug")
+
+    div.empty.empty-search-results(ng-class="{'hidden': wikipages.length}")
+                span.icon.icon-issues
+                span.title It looks like nothing was found with your search criteria.
+                span Maybe try one of the tabs above or search again
+

app/styles/modules/search/search-in.scss

@@ -1,7 +1,15 @@
 .search-in {
-    .icon {
+    input {
+        background: $grayer;
+        color: $white;
+        @include placeholder {
+            color: $gray-light;
+        }
+    }
+    .icon-search {
+        color: $gray-light;
         position: absolute;
-        right: 10px;
+        right: .7rem;
-        top: 6px;
+        top: .7rem;
     }
 }

app/styles/modules/search/search-result-table.scss

@@ -1,5 +1,11 @@
 .search-result-table {
 
+    .empty {
+        .title {
+            border: 0;
+        }
+    }
+
     .row {
         @include table-flex;
         padding: 20px;