3 files changed, 10 insertions, 9 deletions

diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
index 2eaf0dc70..0a8aa8fa4 100644
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss
@@ -5,7 +5,7 @@
 
 $iconSize: 16px;
 
-::ng-deep .title-page.title-page-single {
+::ng-deep my-video-list-header {
   display: flex;
   flex-grow: 1;
 }
diff --git a/client/src/app/shared/shared-video-miniature/video-list-header.component.html b/client/src/app/shared/shared-video-miniature/video-list-header.component.html
new file mode 100644
index 000000000..58db437b8
--- /dev/null
+++ b/client/src/app/shared/shared-video-miniature/video-list-header.component.html
@@ -0,0 +1,5 @@
+<h1 class="title-page title-page-single">
+  <div placement="bottom" [ngbTooltip]="data.titleTooltip" container="body">
+    {{ data.titlePage }}
+  </div>
+</h1>
\ No newline at end of file
diff --git a/client/src/app/shared/shared-video-miniature/video-list-header.component.ts b/client/src/app/shared/shared-video-miniature/video-list-header.component.ts
index a07248b96..67bbf7d7a 100644
--- a/client/src/app/shared/shared-video-miniature/video-list-header.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-list-header.component.ts
@@ -1,17 +1,13 @@
-import { Component, Inject } from '@angular/core'
+import { Component, Inject, ViewEncapsulation } from '@angular/core'
 
 export abstract class GenericHeaderComponent {
   constructor (@Inject('data') public data: any) {}
 }
 
 @Component({
-  selector: 'h1',
-  host: { 'class': 'title-page title-page-single' },
-  template: `
-<div placement="bottom" [ngbTooltip]="data.titleTooltip" container="body">
-  {{ data.titlePage }}
-</div>
-  `
+  selector: 'my-video-list-header',
+  encapsulation: ViewEncapsulation.None,
+  templateUrl: './video-list-header.component.html'
 })
 export class VideoListHeaderComponent extends GenericHeaderComponent {
   constructor (@Inject('data') public data: any) {