fix issue with elements not accessible with Keyboard navigation

This commit is contained in:
Giuseppe Digilio
2021-06-24 12:49:41 +02:00
parent 4b6a0d8aa2
commit 56487a44f3
3 changed files with 8 additions and 8 deletions

View File

@@ -15,7 +15,7 @@
[cdkDragDisabled]="dragDisabled" [cdkDragDisabled]="dragDisabled"
[cdkDragPreviewClass]="'ds-submission-reorder-dragging'"> [cdkDragPreviewClass]="'ds-submission-reorder-dragging'">
<!-- Item content --> <!-- Item content -->
<i class="drag-icon fas fa-grip-vertical fa-fw" [class.invisible]="dragDisabled"></i> <i class="drag-icon fas fa-grip-vertical fa-fw" [class.invisible]="dragDisabled" tabindex="0"></i>
<ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container> <ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container>
<ds-dynamic-form-control-container *ngFor="let _model of groupModel.group" <ds-dynamic-form-control-container *ngFor="let _model of groupModel.group"
[bindId]="false" [bindId]="false"

View File

@@ -2,7 +2,7 @@
<button <button
class="btn btn-link" class="btn btn-link"
type="button" type="button"
tabindex="-1" tabindex="0"
[disabled]="disabled" [disabled]="disabled"
(click)="toggleUp()"> (click)="toggleUp()">
<span class="chevron"></span> <span class="chevron"></span>
@@ -27,7 +27,7 @@
<button <button
class="btn btn-link" class="btn btn-link"
type="button" type="button"
tabindex="-1" tabindex="0"
[disabled]="disabled" [disabled]="disabled"
(click)="toggleDown()"> (click)="toggleDown()">
<span class="chevron bottom"></span> <span class="chevron bottom"></span>

View File

@@ -18,13 +18,13 @@
[uploader]="uploader" [uploader]="uploader"
(fileOver)="fileOverBase($event)" (fileOver)="fileOverBase($event)"
class="well ds-base-drop-zone mt-1 mb-3 text-muted"> class="well ds-base-drop-zone mt-1 mb-3 text-muted">
<p class="text-center m-0 p-0 d-flex justify-content-center align-items-center" *ngIf="uploader?.queue?.length === 0"> <div class="text-center m-0 p-2 d-flex justify-content-center align-items-center" *ngIf="uploader?.queue?.length === 0">
<span><i class="fas fa-cloud-upload" aria-hidden="true"></i> {{dropMsg | translate}} {{'uploader.or' | translate}}</span> <span><i class="fas fa-upload" aria-hidden="true"></i> {{dropMsg | translate}} {{'uploader.or' | translate}}</span>
<label class="btn btn-link m-0 p-0 ml-1"> <label for="inputFileUploader" class="btn btn-link m-0 p-0 ml-1" tabindex="0" (keyup.enter)="$event.stopImmediatePropagation(); fileInput.click()">
<input class="d-none" type="file" ng2FileSelect [uploader]="uploader" multiple /> <input #fileInput id="inputFileUploader" class="d-none" type="file" role="button" ng2FileSelect [uploader]="uploader" multiple tabindex="0" />
{{'uploader.browse' | translate}} {{'uploader.browse' | translate}}
</label> </label>
</p> </div>
<div *ngIf="(isOverBaseDropZone | async) || uploader?.queue?.length !== 0"> <div *ngIf="(isOverBaseDropZone | async) || uploader?.queue?.length !== 0">
<div class="m-1"> <div class="m-1">
<div class="upload-item-top"> <div class="upload-item-top">