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;