WIP : Indicate to users how "trending" works (#1458)

* Get the INTERVAL_DAYS const in the video-trending component

* Change Trending section title

* Add a tooltip to explain how trending section works

* Minor CSS fix for the my-feed popover next to the titlepage

3 files changed, 7 insertions, 2 deletions

diff --git a/client/src/app/shared/video/abstract-video-list.html b/client/src/app/shared/video/abstract-video-list.html
index 29492351b..1f97bc389 100644
--- a/client/src/app/shared/video/abstract-video-list.html
+++ b/client/src/app/shared/video/abstract-video-list.html
@@ -1,8 +1,11 @@
 <div [ngClass]="{ 'margin-content': marginContent }">
   <div class="videos-header">
     <div *ngIf="titlePage" class="title-page title-page-single">
-      {{ titlePage }}
+      <div placement="bottom" [ngbTooltip]="titleTooltip" container="body">
+        {{ titlePage }}
+      </div>
     </div>
+
     <my-feed [syndicationItems]="syndicationItems"></my-feed>
 
     <div class="moderation-block" *ngIf="displayModerationBlock">
diff --git a/client/src/app/shared/video/abstract-video-list.scss b/client/src/app/shared/video/abstract-video-list.scss
index 9fb3fd4d6..292ede698 100644
--- a/client/src/app/shared/video/abstract-video-list.scss
+++ b/client/src/app/shared/video/abstract-video-list.scss
@@ -19,8 +19,8 @@
 
   my-feed {
     display: inline-block;
-    position: relative;
     top: 1px;
+    min-width: 60px;
   }
 
   .moderation-block {
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index d234c8bfa..d74384293 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -39,6 +39,8 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
   ownerDisplayType: OwnerDisplayType = 'account'
   firstLoadedPage: number
   displayModerationBlock = false
+  trendingDays: number
+  titleTooltip: string
 
   protected baseVideoWidth = 215
   protected baseVideoHeight = 205