OpenCloud
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix video filter pastille accessibility

pull/6449/head
Chocobozzz 2024-06-10 11:46:26 +02:00
parent f027bdb4b0
commit 77c002f07f
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
2 changed files with 18 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
client/src/app/shared/shared-video-miniature/video-filters-header.component.html
View File

@ -23,8 +23,8 @@
<my-global-icon iconName="chevrons-up"></my-global-icon>
</button>
<button
*ngFor="let activeFilter of filters.getActiveFilters()" (click)="resetFilter(activeFilter.key, activeFilter.canRemove)"
<div
*ngFor="let activeFilter of filters.getActiveFilters()"
class="active-filter pastille button-unstyle" [ngClass]="{ 'can-remove': activeFilter.canRemove }" [title]="getFilterTitle(activeFilter.canRemove)"
>
<span>
@ -33,9 +33,15 @@
<ng-container *ngIf="activeFilter.value">: {{ activeFilter.value }}</ng-container>
</span>
<my-global-icon *ngIf="activeFilter.canRemove" iconName="cross"></my-global-icon>
<button
*ngIf="activeFilter.canRemove" type="button" class="remove-button"
(click)="resetFilter(activeFilter.key, activeFilter.canRemove)"
i18n-title title="Remove this filter"
>
<my-global-icon iconName="cross"></my-global-icon>
</button>
</div>
</div>
<ng-select
class="sort"

7
client/src/app/shared/shared-video-miniature/video-filters-header.component.scss
View File

@ -94,13 +94,18 @@
opacity: 0.9;
}
my-global-icon {
> .remove-button {
@include margin-left(10px);
border: 0;
padding: 0;
my-global-icon {
width: 16px;
color: pvar(--greyForegroundColor);
}
}
}
.sort {
min-width: 250px;