]>
Commit | Line | Data |
---|---|---|
202f6b6c | 1 | <a |
25ae4f95 | 2 | [routerLink]="getVideoRouterLink()" [queryParams]="queryParams" |
b1d40cff | 3 | class="video-thumbnail" |
202f6b6c | 4 | > |
7738273b | 5 | <img alt="" [attr.aria-label]="video.name" [attr.src]="getImageUrl()" [ngClass]="{ 'blur-filter': nsfw }" /> |
202f6b6c | 6 | |
b7819090 C |
7 | <div *ngIf="displayWatchLaterPlaylist" class="video-thumbnail-actions-overlay"> |
8 | <ng-container *ngIf="inWatchLaterPlaylist !== true"> | |
9 | <div class="video-thumbnail-watch-later-overlay" placement="left" [ngbTooltip]="addToWatchLaterText" container="body" (click)="onWatchLaterClick($event)"> | |
29128b2f RK |
10 | <my-global-icon iconName="clock" [attr.aria-label]="addToWatchLaterText" role="button"></my-global-icon> |
11 | </div> | |
12 | </ng-container> | |
b7819090 C |
13 | |
14 | <ng-container *ngIf="inWatchLaterPlaylist === true"> | |
15 | <div class="video-thumbnail-watch-later-overlay" placement="left" [ngbTooltip]="addedToWatchLaterText" container="body" (click)="onWatchLaterClick($event)"> | |
29128b2f RK |
16 | <my-global-icon iconName="tick" [attr.aria-label]="addedToWatchLaterText" role="button"></my-global-icon> |
17 | </div> | |
18 | </ng-container> | |
19 | </div> | |
20 | ||
62eacb42 RK |
21 | <div class="video-thumbnail-label-overlay warning"><ng-content select="label-warning"></ng-content></div> |
22 | <div class="video-thumbnail-label-overlay danger"><ng-content select="label-danger"></ng-content></div> | |
23 | ||
830b4faf | 24 | <div class="video-thumbnail-duration-overlay">{{ video.durationLabel }}</div> |
6e46de09 | 25 | |
830b4faf C |
26 | <div class="play-overlay"> |
27 | <div class="icon"></div> | |
28 | </div> | |
1aabcae7 | 29 | |
6e46de09 C |
30 | <div class="progress-bar" *ngIf="video.userHistory?.currentTime"> |
31 | <div [ngStyle]="{ 'width.%': getProgressPercent() }"></div> | |
32 | </div> | |
202f6b6c | 33 | </a> |