Replace duration by live info

This commit is contained in:
Chocobozzz 2021-05-05 11:30:16 +02:00
parent 20c72fc6d5
commit aab8cb0891
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
1 changed files with 13 additions and 3 deletions

View File

@ -5,7 +5,8 @@
<a class="img" :title="watchVideoMessage" target="_blank" rel="nofollow noreferrer noopener" v-bind:href="video.url">
<img v-bind:src="getVideoThumbnailUrl()" alt="">
<span class="duration">{{ formattedDuration }}</span>
<span v-if="video.isLive" class="live-info" v-translate>LIVE</span>
<span v-else class="duration">{{ formattedDuration }}</span>
</a>
</div>
@ -80,18 +81,27 @@
border-radius: 3px;
}
.duration {
.duration,
.live-info {
position: absolute;
padding: 2px 5px;
right: 5px;
bottom: 5px;
display: inline-block;
background-color: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 11px;
border-radius: 3px;
}
.duration {
background-color: rgba(0, 0, 0, 0.7);
}
.live-info {
background-color: rgba(224, 8, 8 ,.8);
font-weight: $font-semibold;
}
@media screen and (max-width: $small-view) {
--thumbnail-width: calc(100% + 10px);
--thumbnail-height: auto;