Custom bootstrap tooltip with separate styles and directive (#345)

* Launch application scancodes (closes #328)

* simple directive to map bootstrap tooltip, add sample usage

* Custom bootstrap tooltip with separate styles and directive (closes #329)

* fix: linting issues

* fix: try to ignore stylelint for !important

* review: simple tooltip with html content and custom styles

* cleanup extra html tags for tooltip sample

shared/src/directives/index.ts

@@ -1 +1,2 @@
 export * from './cancelable';
+export * from './tooltip';

shared/src/directives/tooltip/index.ts

@@ -0,0 +1 @@
+export { TooltipDirective } from './tooltip.directive';

shared/src/directives/tooltip/tooltip.directive.ts

@@ -0,0 +1,25 @@
+import { Directive, ElementRef, AfterContentInit, Renderer2 } from '@angular/core';
+
+@Directive({
+    selector: '[data-toggle="tooltip"]'
+})
+export class TooltipDirective implements AfterContentInit {
+
+    private customTooltipTemplate = `
+        <div class="tooltip">
+            <div class="tooltip-arrow"></div>
+            <div class="tooltip-inner"></div>
+        </div>
+    `;
+
+    constructor(private elementRef: ElementRef, private renderer: Renderer2) { }
+
+    ngAfterContentInit() {
+        jQuery(this.elementRef.nativeElement).tooltip({
+            placement: 'top',
+            html: true,
+            template: this.customTooltipTemplate
+        });
+    }
+
+}