vaultwarden
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

[PS-211] [PS-212] Make Generator page accessible (#2513) 

* Fix name attributes for radiobuttons in the same group

* Add role=radiogroup

* Add aria-labelledby

* Fix name
This commit is contained in:
Thomas Rittson 2022-04-21 23:49:13 +10:00 committed by GitHub
parent 58b39c613e
commit 4ed74416f4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 30 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/popup/generator/generator.component.html
View File

@ -66,13 +66,15 @@
</div> </div>
<div class="box"> <div class="box">
<div class="box-content"> <div class="box-content">
<div class="box-content-row"> <div class="box-content-row" role="radiogroup" aria-labelledby="typeHeading">
<label class="radio-header">{{ "whatWouldYouLikeToGenerate" | i18n }}</label> <label id="typeHeading" class="radio-header">{{
"whatWouldYouLikeToGenerate" | i18n
}}</label>
<div class="radio-group text-default" appBoxRow *ngFor="let o of typeOptions"> <div class="radio-group text-default" appBoxRow *ngFor="let o of typeOptions">
<input <input
type="radio" type="radio"
[(ngModel)]="type" [(ngModel)]="type"
name="Type_{{ o.value }}" name="Type"
id="type_{{ o.value }}" id="type_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="typeChanged()" (change)="typeChanged()"
@ -92,13 +94,13 @@
{{ "options" | i18n }} {{ "options" | i18n }}
</h2> </h2>
<div class="box-content"> <div class="box-content">
<div class="box-content-row"> <div class="box-content-row" role="radiogroup" aria-labelledby="passwordTypeHeading">
<label class="radio-header">{{ "passwordType" | i18n }}</label> <label id="passwordTypeHeading" class="radio-header">{{ "passwordType" | i18n }}</label>
<div class="radio-group text-default" appBoxRow *ngFor="let o of passTypeOptions"> <div class="radio-group text-default" appBoxRow *ngFor="let o of passTypeOptions">
<input <input
type="radio" type="radio"
[(ngModel)]="passwordOptions.type" [(ngModel)]="passwordOptions.type"
name="PasswordType_{{ o.value }}" name="PasswordType"
id="passwordtype_{{ o.value }}" id="passwordtype_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="savePasswordOptions()" (change)="savePasswordOptions()"
@ -279,8 +281,8 @@
{{ "options" | i18n }} {{ "options" | i18n }}
</h2> </h2>
<div class="box-content"> <div class="box-content">
<div class="box-content-row"> <div class="box-content-row" role="radiogroup" aria-labelledby="usernameTypeHeading">
<label class="radio-header"> <label id="usernameTypeHeading" class="radio-header">
{{ "usernameType" | i18n }} {{ "usernameType" | i18n }}
<a <a
href="https://bitwarden.com/help/generator/#username-types" href="https://bitwarden.com/help/generator/#username-types"
@ -299,7 +301,7 @@
<input <input
type="radio" type="radio"
[(ngModel)]="usernameOptions.type" [(ngModel)]="usernameOptions.type"
name="Type_{{ o.value }}" name="UsernameType"
id="type_{{ o.value }}" id="type_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="saveUsernameOptions()" (change)="saveUsernameOptions()"
@ -315,13 +317,13 @@
</div> </div>
<div class="box" *ngIf="usernameOptions.type === 'forwarded'"> <div class="box" *ngIf="usernameOptions.type === 'forwarded'">
<div class="box-content"> <div class="box-content">
<div class="box-content-row"> <div class="box-content-row" role="radiogroup" aria-labelledby="forwardTypeHeading">
<label class="radio-header">{{ "service" | i18n }}</label> <label id="forwardTypeHeading" class="radio-header">{{ "service" | i18n }}</label>
<div class="radio-group text-default" appBoxRow *ngFor="let o of forwardOptions"> <div class="radio-group text-default" appBoxRow *ngFor="let o of forwardOptions">
<input <input
type="radio" type="radio"
[(ngModel)]="usernameOptions.forwardedService" [(ngModel)]="usernameOptions.forwardedService"
name="ForwardType_{{ o.value }}" name="ForwardType"
id="forwardtype_{{ o.value }}" id="forwardtype_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="saveUsernameOptions()" (change)="saveUsernameOptions()"
@ -346,13 +348,18 @@
(blur)="saveUsernameOptions()" (blur)="saveUsernameOptions()"
/> />
</div> </div>
<div class="box-content-row" *ngIf="subaddressOptions.length > 1"> <div
<label class="radio-header">{{ "type" | i18n }}</label> class="box-content-row"
role="radiogroup"
aria-labelledby="subaddressTypeHeading"
*ngIf="subaddressOptions.length > 1"
>
<label id="subaddressTypeHeading" class="radio-header">{{ "type" | i18n }}</label>
<div class="radio-group text-default" appBoxRow *ngFor="let o of subaddressOptions"> <div class="radio-group text-default" appBoxRow *ngFor="let o of subaddressOptions">
<input <input
type="radio" type="radio"
[(ngModel)]="usernameOptions.subaddressType" [(ngModel)]="usernameOptions.subaddressType"
name="SubaddressType_{{ o.value }}" name="SubaddressType"
id="subaddresstype_{{ o.value }}" id="subaddresstype_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="saveUsernameOptions()" (change)="saveUsernameOptions()"
@ -388,13 +395,18 @@
(blur)="saveUsernameOptions()" (blur)="saveUsernameOptions()"
/> />
</div> </div>
<div class="box-content-row" *ngIf="catchallOptions.length > 1"> <div
<label class="radio-header">{{ "type" | i18n }}</label> class="box-content-row"
role="radiogroup"
aria-labelledby="catchallTypeHeading"
*ngIf="catchallOptions.length > 1"
>
<label id="catchallTypeHeading" class="radio-header">{{ "type" | i18n }}</label>
<div class="radio-group text-default" appBoxRow *ngFor="let o of catchallOptions"> <div class="radio-group text-default" appBoxRow *ngFor="let o of catchallOptions">
<input <input
type="radio" type="radio"
[(ngModel)]="usernameOptions.catchallType" [(ngModel)]="usernameOptions.catchallType"
name="CatchallType_{{ o.value }}" name="CatchallType"
id="catchalltype_{{ o.value }}" id="catchalltype_{{ o.value }}"
[value]="o.value" [value]="o.value"
(change)="saveUsernameOptions()" (change)="saveUsernameOptions()"