浏览代码

Add icon to clear the current search

John R. Supplee 4 年之前
父节点
当前提交
20a2ea3e7a
共有 2 个文件被更改,包括 9 次插入0 次删除
  1. 2 0
      client/components/main/globalSearch.jade
  2. 7 0
      client/components/main/globalSearch.js

+ 2 - 0
client/components/main/globalSearch.jade

@@ -32,6 +32,7 @@ template(name="globalSearch")
     .wrapper
       form.global-search-page.js-search-query-form
         input.global-search-query-input(
+          style="{# if hasResults.get #}display: inline-block;{#/if#}"
           id="global-search-input"
           type="text"
           name="searchQuery"
@@ -39,6 +40,7 @@ template(name="globalSearch")
           value="{{ query.get }}"
           autofocus dir="auto"
         )
+        a.js-new-search.fa.fa-eraser
       if searching.get
         +spinner
       else if hasResults.get

+ 7 - 0
client/components/main/globalSearch.js

@@ -249,6 +249,13 @@ class GlobalSearchComponent extends CardSearchPagedComponent {
           );
           document.getElementById('global-search-input').focus();
         },
+        'click .js-new-search'(evt) {
+          evt.preventDefault();
+          const input = document.getElementById('global-search-input');
+          input.value = '';
+          this.query.set('');
+          this.hasResults.set(false);
+        },
       },
     ];
   }