Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-08-21 22:23:52 +02:00
Code Issues Projects Releases Wiki Activity

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

Browse Source 
* Fix grouping of radiobutton inputs

* Add role=radiogroup

* Add aria-labelledBy to radio button groups
This commit is contained in:
Thomas Rittson 2022-04-21 23:51:00 +10:00 committed by GitHub
parent 1be62ac222
commit c0511f25ca
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/app/tools/generator.component.html
View File

@ -20,14 +20,14 @@
></div>
</div>
</div>
<div class="form-group">
<label class="d-block">{{ "whatWouldYouLikeToGenerate" | i18n }}</label>
<div class="form-group" role="radiogroup" aria-labelledby="typeHeading">
<label id="typeHeading" class="d-block">{{ "whatWouldYouLikeToGenerate" | i18n }}</label>
<div class="form-check form-check-inline" *ngFor="let o of typeOptions">
<input
class="form-check-input"
type="radio"
[(ngModel)]="type"
name="Type_{{ o.value }}"
name="Type"
id="type_{{ o.value }}"
[value]="o.value"
(change)="typeChanged()"
@ -39,14 +39,14 @@
</div>
</div>
<ng-container *ngIf="type === 'password'">
<div class="form-group">
<label class="d-block">{{ "passwordType" | i18n }}</label>
<div aria-labelledby="passwordTypeHeading" class="form-group" role="radiogroup">
<label id="passwordTypeHeading" class="d-block">{{ "passwordType" | i18n }}</label>
<div class="form-check form-check-inline" *ngFor="let o of passTypeOptions">
<input
class="form-check-input"
type="radio"
[(ngModel)]="passwordOptions.type"
name="PasswordType_{{ o.value }}"
name="PasswordType"
id="passwordType_{{ o.value }}"
[value]="o.value"
(change)="savePasswordOptions()"
@ -231,9 +231,9 @@
</div>
</ng-container>
<ng-container *ngIf="type === 'username'">
<div class="form-group">
<div aria-labelledby="usernameTypeHeading" class="form-group" role="radiogroup">
<div class="d-block">
<label>{{ "usernameType" | i18n }}</label>
<label id="usernameTypeHeading">{{ "usernameType" | i18n }}</label>
<a
class="ml-auto"
href="https://bitwarden.com/help/generator/#username-types"
@ -249,7 +249,7 @@
class="form-check-input"
type="radio"
[(ngModel)]="usernameOptions.type"
name="UsernameType_{{ o.value }}"
name="UsernameType"
id="usernameType_{{ o.value }}"
[value]="o.value"
(change)="saveUsernameOptions()"
@ -261,13 +261,13 @@
</label>
</div>
</div>
<div class="form-group" *ngIf="usernameOptions.type === 'forwarded'">
<div class="form-group" role="radiogroup" *ngIf="usernameOptions.type === 'forwarded'">
<div class="form-check form-check-inline" *ngFor="let o of forwardOptions">
<input
class="form-check-input"
type="radio"
[(ngModel)]="usernameOptions.forwardedService"
name="ForwardType_{{ o.value }}"
name="ForwardType"
id="forwardtype_{{ o.value }}"
[value]="o.value"
(change)="saveUsernameOptions()"