1
0
Fork 0
mirror of https://github.com/Chocobozzz/PeerTube.git synced 2025-10-04 18:29:27 +02:00

Fix progress bar accessibility

This commit is contained in:
Chocobozzz 2024-09-19 14:42:21 +02:00
parent 51ce03e3cf
commit d96ec7da71
No known key found for this signature in database
GPG key ID: 583A612D890159BE
16 changed files with 179 additions and 151 deletions

View file

@ -1,14 +1,10 @@
<!-- Upload progress/cancel/error/success header -->
<div *ngIf="isUploading && !error" class="upload-progress-cancel">
<div class="progress" i18n-title title="Total uploaded">
<div
class="progress-bar" role="progressbar"
[style]="{ width: uploadPercents + '%' }" [attr.aria-valuenow]="uploadPercents" aria-valuemin="0" [attr.aria-valuemax]="100"
>
<span *ngIf="uploadPercents === 100 && uploaded === false" i18n>Processing…</span>
<span *ngIf="uploadPercents !== 100 || uploaded">{{ uploadPercents }}%</span>
</div>
</div>
<my-progress-bar
i18n-label label="Total uploaded" theme="green"
[value]="uploadPercents" [valueFormatted]="getUploadingLabel()"
>
</my-progress-bar>
<input
*ngIf="uploaded === false"
@ -17,11 +13,11 @@
</div>
<div *ngIf="error && enableRetryAfterError" class="upload-progress-retry">
<div class="progress">
<div class="progress-bar red" role="progressbar" [style]="{ width: '100%' }" [attr.aria-valuenow]="100" aria-valuemin="0" [attr.aria-valuemax]="100">
<span>{{ error }}</span>
</div>
</div>
<my-progress-bar
[label]="error" value="100" [valueFormatted]="error"
theme="red"
>
</my-progress-bar>
<input type="button" class="peertube-button grey-button ms-1" i18n-value="Retry failed upload" value="Retry" (click)="retry.emit()" />
<input type="button" class="peertube-button grey-button ms-1" i18n-value="Cancel ongoing upload" value="Cancel" (click)="cancel.emit()" />