inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2026-09-09 18:02:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-10253] Screen Reader: Search: Search control is focused multiple times and incorrectly announced by SR (#4846)

Browse Source
This commit is contained in:
dominikiwanekhyland
2025-10-14 14:54:37 +02:00
committed by GitHub
parent 4fed9ff6a9
commit 0d10c0d11a
2 changed files with 11 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
projects/aca-content/src/lib/components/search/search-input/search-input.component.html
+4 -2
View File
@@ -1,4 +1,5 @@
<button class="app-search-container" <div class="app-search-container"
role="search"
[matMenuTriggerFor]="searchOptionsMenu" [matMenuTriggerFor]="searchOptionsMenu"
(menuOpened)="onMenuOpened()" (menuOpened)="onMenuOpened()"
(menuClosed)="syncInputValues()" (menuClosed)="syncInputValues()"
@@ -9,6 +10,7 @@
</button> </button>
<input <input
class="app-search-input"
matInput matInput
[attr.aria-label]="'SEARCH.INPUT.ARIA-LABEL' | translate" [attr.aria-label]="'SEARCH.INPUT.ARIA-LABEL' | translate"
[type]="'text'" [type]="'text'"
@@ -30,7 +32,7 @@
</button> </button>
</div> </div>
</mat-form-field> </mat-form-field>
</button> </div>
<mat-menu #searchOptionsMenu="matMenu" [overlapTrigger]="true" class="app-search-options-menu"> <mat-menu #searchOptionsMenu="matMenu" [overlapTrigger]="true" class="app-search-options-menu">
<div (keydown.tab)="$event.stopPropagation()" (keydown.shift.tab)="$event.stopPropagation()" tabindex=0> <div (keydown.tab)="$event.stopPropagation()" (keydown.shift.tab)="$event.stopPropagation()" tabindex=0>
projects/aca-content/src/lib/components/search/search-input/search-input.component.scss
+7
View File
@@ -22,6 +22,13 @@ $search-border-radius: 4px;
display: none; display: none;
} }
} }
.app-search-input {
&:focus-within {
outline: 2px solid var(--theme-blue-button-color);
border-radius: 4px;
}
}
} }
.app-search-options-menu { .app-search-options-menu {