Add tooltips to filter bar pill actions (#17364)

* Add tooltips to filter bar pills

* Fix invert button label
This commit is contained in:
Tim Roes 2018-03-24 19:36:31 +01:00 committed by GitHub
parent ae8c05e77e
commit 1968a1b1cf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -27,6 +27,8 @@
ng-focus="pill.activateActions()"
ng-blur="pill.deactivateActions()"
aria-label="{{pill.filter.meta.disabled ? 'Enable filter' : 'Disable filter'}}"
tooltip="{{pill.filter.meta.disabled ? 'Enable filter' : 'Disable filter'}}"
tooltip-append-to-body="true"
>
<span ng-show="pill.filter.meta.disabled" class="fa fa-fw fa-square-o disabled"></span>
<span ng-hide="pill.filter.meta.disabled" class="fa fa-fw fa-check-square-o enabled"></span>
@ -39,6 +41,8 @@
ng-focus="pill.activateActions()"
ng-blur="pill.deactivateActions()"
aria-label="{{pill.filter.$state.store == 'globalState' ? 'Unpin filter' : 'Pin filter'}}"
tooltip="{{pill.filter.$state.store == 'globalState' ? 'Unpin filter' : 'Pin filter'}}"
tooltip-append-to-body="true"
>
<span ng-show="pill.filter.$state.store == 'globalState'" class="fa fa-fw fa-thumb-tack pinned"></span>
<span ng-hide="pill.filter.$state.store == 'globalState'" class="fa fa-fw fa-thumb-tack fa-rotate-270 unpinned"></span>
@ -50,7 +54,9 @@
data-test-subj="invertFilter-{{ pill.filter.meta.key }}"
ng-focus="pill.activateActions()"
ng-blur="pill.deactivateActions()"
aria-label="Invert filter"
aria-label="{{pill.filter.meta.negate ? 'Include matches' : 'Exclude matches'}}"
tooltip="{{pill.filter.meta.negate ? 'Include matches' : 'Exclude matches'}}"
tooltip-append-to-body="true"
>
<span ng-show="pill.filter.meta.negate" class="fa fa-fw fa-search-plus negative"></span>
<span ng-hide="pill.filter.meta.negate" class="fa fa-fw fa-search-minus positive"></span>
@ -62,6 +68,8 @@
ng-focus="pill.activateActions()"
ng-blur="pill.deactivateActions()"
aria-label="Remove filter"
tooltip="Remove filter"
tooltip-append-to-body="true"
>
<span class="fa fa-fw fa-trash" data-test-subj="removeFilter-{{ pill.filter.meta.key }}"></span>
</button>
@ -73,6 +81,8 @@
ng-focus="pill.activateActions()"
ng-blur="pill.deactivateActions()"
aria-label="Edit filter"
tooltip="Edit filter"
tooltip-append-to-body="true"
data-test-subj="editFilter"
>
<span