diff --git a/client/src/app/+videos/+video-watch/video-watch.component.html b/client/src/app/+videos/+video-watch/video-watch.component.html
index bc1c302de..74c82fbfd 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.html
+++ b/client/src/app/+videos/+video-watch/video-watch.component.html
@@ -268,7 +268,7 @@
>{{ tag }}
-
+
Duration
{{ video.duration | myDurationFormatter }}
diff --git a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
index 0cb0f321b..be07844ab 100644
--- a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
+++ b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
@@ -26,7 +26,8 @@
-
{{ video.durationLabel }}
+
{{ video.durationLabel }}
+
LIVE
diff --git a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.scss b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.scss
index feff78a87..1b6151c89 100644
--- a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.scss
+++ b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.scss
@@ -20,7 +20,8 @@
.video-thumbnail-watch-later-overlay,
.video-thumbnail-label-overlay,
- .video-thumbnail-duration-overlay {
+ .video-thumbnail-duration-overlay,
+ .video-thumbnail-live-overlay {
@include static-thumbnail-overlay;
border-radius: 3px;
@@ -41,13 +42,20 @@
&.danger { background-color: red; }
}
- .video-thumbnail-duration-overlay {
+ .video-thumbnail-duration-overlay,
+ .video-thumbnail-live-overlay {
position: absolute;
padding: 0 3px;
right: 5px;
bottom: 5px;
}
+ .video-thumbnail-live-overlay {
+ background-color: rgba(224, 8, 8, 0.7);
+ color: #fff;
+ font-weight: $font-semibold;
+ }
+
.video-thumbnail-actions-overlay {
position: absolute;
display: flex;