diff options
author | Dixsie Wolmers <dixsiew@gmail.com> | 2019-09-09 13:21:12 -0500 |
---|---|---|
committer | Gunnar Mills <gmills@us.ibm.com> | 2019-09-11 21:03:50 +0000 |
commit | db1e89edef8aca03f926a62e54390e5110d26a19 (patch) | |
tree | 63c4b9be10081472512d686a75fd9d3bebbabc7f /app/common/directives | |
parent | 383591afc2c5c327f1a7628056cc33e4b52f4a23 (diff) | |
download | phosphor-webui-db1e89edef8aca03f926a62e54390e5110d26a19.tar.gz phosphor-webui-db1e89edef8aca03f926a62e54390e5110d26a19.zip |
Fix filter bar clear filter button
Makes filter button screen reader friendly
and accessible.
- Adds icon directive for close icon
- Adds button type
- Icon is aria-hidden and uses an aria-label attribute with
the value set to clear filter
Tested:
- Filter inputs clear on close button click
Signed-off-by: Dixsie Wolmers <dixsiew@gmail.com>
Change-Id: Ifcbe603c2771156fe7a03359b144e0a0acd5e3f1
Diffstat (limited to 'app/common/directives')
-rw-r--r-- | app/common/directives/log-search-control.html | 4 |
1 files changed, 3 insertions, 1 deletions
diff --git a/app/common/directives/log-search-control.html b/app/common/directives/log-search-control.html index 1184bda..8ebaba3 100644 --- a/app/common/directives/log-search-control.html +++ b/app/common/directives/log-search-control.html @@ -4,7 +4,9 @@ <label for="content__search-input">Event Log Search</label> <input id="content__search-input" type="text" ng-model="customSearch" ng-keydown="doSearchOnEnter($event)"/> <div class="search-submit__wrapper"> - <button class="clear-input" ng-click="clear()">✕</button> + <button class="btn" type="button" aria-label="clear filter" ng-click="clear()"> + <icon file="icon-close.svg" aria-hidden="true"></icon> + </button> <input id="content__search-submit" type="submit" class="btn btn-primary content__search-submit" value="Filter" ng-click="doSearchOnClick()"/> </div> </div> |