Fixed accessibility issues on AccessControlFormContainerComponent

- Replaced invisible label in AccessControlArrayFormComponent that was only used for styling with span
- Fixed radio buttons not being part of a fieldset
- Fixed empty table header
This commit is contained in:
Alexandre Vryghem
2023-12-16 04:44:22 +01:00
committed by Tim Donohue
parent 949e55235a
commit 8b5cd79bdc
5 changed files with 20 additions and 16 deletions

View File

@@ -88,7 +88,7 @@
</div> </div>
<div> <div>
<label>&nbsp;</label> <span aria-hidden="true" class="mb-2 d-inline-block">&nbsp;</span>
<div class="input-group"> <div class="input-group">
<button type="button" class="btn btn-outline-danger" <button type="button" class="btn btn-outline-danger"

View File

@@ -23,10 +23,10 @@
</ui-switch> </ui-switch>
</div> </div>
<div class="row mt-3"> <fieldset class="row mt-3">
<div class="col-12 col-md-3"> <legend class="h4 col-12 col-md-3">
{{ 'access-control-mode' | translate }} {{ 'access-control-mode' | translate }}
</div> </legend>
<div class="col-12 col-md-8"> <div class="col-12 col-md-8">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" <input class="form-check-input" type="radio"
@@ -47,7 +47,7 @@
</label> </label>
</div> </div>
</div> </div>
</div> </fieldset>
</div> </div>
<div> <div>
@@ -78,10 +78,10 @@
</div> </div>
<div *ngIf="showLimitToSpecificBitstreams" class="row mt-3"> <div *ngIf="showLimitToSpecificBitstreams" class="row mt-3">
<div class="col-12"> <fieldset class="col-12">
<legend class="h4">
{{'access-control-limit-to-specific' | translate}} {{'access-control-limit-to-specific' | translate}}
</div> </legend>
<div class="col-12">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" <input class="form-check-input" type="radio"
name="changesLimit" id="processAll" value="all" name="changesLimit" id="processAll" value="all"
@@ -111,14 +111,14 @@
</label> </label>
</div> </div>
</div> </fieldset>
</div> </div>
</div> </div>
<div class="row mt-3"> <fieldset class="row mt-3">
<div class="col-12 col-md-3"> <legend class="h4 col-12 col-md-3">
{{'access-control-mode' | translate}} {{'access-control-mode' | translate}}
</div> </legend>
<div class="col-12 col-md-8"> <div class="col-12 col-md-8">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="radio" <input class="form-check-input" type="radio"
@@ -139,7 +139,7 @@
</label> </label>
</div> </div>
</div> </div>
</div> </fieldset>
<div> <div>
<h3 class="h4 mt-3">{{'access-control-access-conditions' | translate}}</h3> <h3 class="h4 mt-3">{{'access-control-access-conditions' | translate}}</h3>

View File

@@ -11,7 +11,7 @@
<table id="collection-select" class="table table-striped table-hover"> <table id="collection-select" class="table table-striped table-hover">
<thead> <thead>
<tr> <tr>
<th aria-hidden="true"></th> <th><span class="sr-only">{{'collection.select.table.selected' | translate}}</span></th>
<th scope="col">{{'collection.select.table.title' | translate}}</th> <th scope="col">{{'collection.select.table.title' | translate}}</th>
</tr> </tr>
</thead> </thead>

View File

@@ -11,7 +11,7 @@
<table id="item-select" class="table table-striped table-hover"> <table id="item-select" class="table table-striped table-hover">
<thead> <thead>
<tr> <tr>
<th aria-hidden="true"></th> <th><span class="sr-only">{{'item.select.table.selected' | translate}}</span></th>
<th *ngIf="!hideCollection" scope="col">{{'item.select.table.collection' | translate}}</th> <th *ngIf="!hideCollection" scope="col">{{'item.select.table.collection' | translate}}</th>
<th scope="col">{{'item.select.table.author' | translate}}</th> <th scope="col">{{'item.select.table.author' | translate}}</th>
<th scope="col">{{'item.select.table.title' | translate}}</th> <th scope="col">{{'item.select.table.title' | translate}}</th>

View File

@@ -1110,6 +1110,8 @@
"collection.select.empty": "No collections to show", "collection.select.empty": "No collections to show",
"collection.select.table.selected": "Selected collections",
"collection.select.table.select": "Select collection", "collection.select.table.select": "Select collection",
"collection.select.table.deselect": "Deselect collection", "collection.select.table.deselect": "Deselect collection",
@@ -2544,6 +2546,8 @@
"item.select.empty": "No items to show", "item.select.empty": "No items to show",
"item.select.table.selected": "Selected items",
"item.select.table.select": "Select item", "item.select.table.select": "Select item",
"item.select.table.deselect": "Deselect item", "item.select.table.deselect": "Deselect item",