[GitHub] [airflow] ashb commented on a change in pull request #11583: UX Enhancement: Add button to clear search query from DAG search

[GitBox <gi...@apache.org>]

ashb commented on a change in pull request #11583:
URL: https://github.com/apache/airflow/pull/11583#discussion_r506534125



##########
File path: airflow/www/templates/airflow/dags.html
##########
@@ -60,9 +60,12 @@ <h2>DAGs</h2>
         </div>
         <div class="col-sm-4">
           <form id="search_form" class="form-inline">
-            <div class="form-group" style="width: 100%;">
+            <div class="form-group search-input" style="width: 100%;">
               <label for="dag_query" class="sr-only">Search DAGs</label>
-              <input type="search" id="dag_query" class="typeahead form-control" data-provide="typeahead" style="width:100%;" value="{{search_query}}" autocomplete="off" placeholder="Search DAGs">
+              <input type="search" id="dag_query" class="typeahead form-control search-input__input" data-provide="typeahead" style="width:100%;" value="{{search_query}}" autocomplete="off" placeholder="Search DAGs">
+              {% if search_query %}
+                <button type="reset" class="btn btn-default btn-sm material-icons search-input__clear-btn">cancel</button>

Review comment:
       ```suggestion
                   <button type="reset" class="btn btn-default btn-sm material-icons search-input__clear-btn">Clear DAG Search Term</button>
   ```
   
   Might make it better if someone tries using a TTS browser?




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org