Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-10-08 05:47:50 +02:00
Code Issues Projects Releases Wiki Activity

[PM-12718] Vault item - keyboard focus (#11338)

Browse Source 
* refactor vault-list-item to be a button so it is keyboard accessible

- an anchor tag without an `href` isn't included in the tab order

* allow bit-item-content focus state to be visible

- cdk-virtual-scroll-viewport applied certain styles that hid overflow. Because each bit-item-group isn't a scroll container for vault items, these should be safe to alter.
This commit is contained in:
Nick Krantz 2024-10-01 09:44:30 -05:00 committed by GitHub
parent 6e7c83305e
commit f2339b0586
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/browser/src/vault/popup/components/vault-v2/vault-list-items-container/vault-list-items-container.component.html
View File

@ -17,10 +17,14 @@
{{ description }} {{ description }}
</div> </div>
<bit-item-group> <bit-item-group>
<cdk-virtual-scroll-viewport [itemSize]="ItemHeight"> <cdk-virtual-scroll-viewport
[itemSize]="ItemHeight"
class="tw-overflow-visible [&>.cdk-virtual-scroll-content-wrapper]:[contain:layout_style]"
>
<bit-item *cdkVirtualFor="let cipher of ciphers"> <bit-item *cdkVirtualFor="let cipher of ciphers">
<a <button
bit-item-content bit-item-content
type="button"
(click)="onViewCipher(cipher)" (click)="onViewCipher(cipher)"
[appA11yTitle]="'viewItemTitle' | i18n: cipher.name" [appA11yTitle]="'viewItemTitle' | i18n: cipher.name"
class="{{ ItemHeightClass }}" class="{{ ItemHeightClass }}"
@ -40,7 +44,7 @@
[appA11yTitle]="'attachments' | i18n" [appA11yTitle]="'attachments' | i18n"
></i> ></i>
<span slot="secondary">{{ cipher.subTitle }}</span> <span slot="secondary">{{ cipher.subTitle }}</span>
</a> </button>
<ng-container slot="end"> <ng-container slot="end">
<bit-item-action *ngIf="showAutofillButton"> <bit-item-action *ngIf="showAutofillButton">
<button <button