diff --git a/client/src/app/shared/misc/help.component.html b/client/src/app/shared/misc/help.component.html
index 956095996..bacbe9cdb 100644
--- a/client/src/app/shared/misc/help.component.html
+++ b/client/src/app/shared/misc/help.component.html
@@ -12,4 +12,7 @@
-
+
diff --git a/client/src/app/shared/misc/help.component.scss b/client/src/app/shared/misc/help.component.scss
index 5fe6b7366..b8bf3a7a5 100644
--- a/client/src/app/shared/misc/help.component.scss
+++ b/client/src/app/shared/misc/help.component.scss
@@ -18,6 +18,7 @@
.tooltip-inner {
text-align: left;
padding: 10px;
+ max-width: 300px;
font-size: 13px;
font-family: $main-fonts;
diff --git a/client/src/app/shared/misc/help.component.ts b/client/src/app/shared/misc/help.component.ts
index b8530e1d4..a4a223cd6 100644
--- a/client/src/app/shared/misc/help.component.ts
+++ b/client/src/app/shared/misc/help.component.ts
@@ -1,4 +1,6 @@
-import { Component, Input, OnInit } from '@angular/core'
+import { Component, ElementRef, HostListener, Input, OnInit, ViewChild } from '@angular/core'
+import { MarkdownService } from '@app/videos/shared'
+import { TooltipDirective } from 'ngx-bootstrap/tooltip'
@Component({
selector: 'my-help',
@@ -7,6 +9,7 @@ import { Component, Input, OnInit } from '@angular/core'
})
export class HelpComponent implements OnInit {
+ @ViewChild('tooltipDirective') tooltipDirective: TooltipDirective
@Input() preHtml = ''
@Input() postHtml = ''
@Input() customHtml = ''
@@ -14,6 +17,8 @@ export class HelpComponent implements OnInit {
mainHtml = ''
+ constructor (private elementRef: ElementRef) { }
+
ngOnInit () {
if (this.helpType === 'custom') {
this.mainHtml = this.customHtml
@@ -21,26 +26,44 @@ export class HelpComponent implements OnInit {
}
if (this.helpType === 'markdownText') {
- this.mainHtml = 'Markdown compatible.
' +
- 'Supports:' +
- '