use focus-visible polyfill to improve keyboard navigation

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / video / video-miniature.component.html

<div class="video-miniature">
  <my-video-thumbnail [video]="video" [nsfw]="isVideoBlur()"></my-video-thumbnail>

  <div class="video-miniature-information">
    <a
      tabindex="-1"
      class="video-miniature-name"
      [routerLink]="[ '/videos/watch', video.uuid ]" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoBlur() }"
    >
      {{ video.name }}
    </a>

    <span i18n class="video-miniature-created-at-views">{{ video.publishedAt | myFromNow }} - {{ video.views | myNumberFormatter }} views</span>

    <a tabindex="-1" *ngIf="displayOwnerAccount()" class="video-miniature-account" [routerLink]="[ '/accounts', video.byAccount ]">
      {{ video.byAccount }}
    </a>
    <a tabindex="-1" *ngIf="displayOwnerVideoChannel()" class="video-miniature-channel" [routerLink]="[ '/video-channels', video.byVideoChannel ]">
      {{ video.byVideoChannel }}
    </a>
  </div>
</div>