Merge branch 'feat/search' of https://github.com/s-pace/docs.nestjs.com…

… into s-pace-feat/search

src/app/homepage/header/header.component.html

@@ -42,6 +42,9 @@
   <ng-content></ng-content>
   <app-social-wrapper></app-social-wrapper>
   <div class="menu-wrapper">
+    <div class="search-wrapper">
+        <input id="q" />
+    </div>
     <ul>
       <li>
         <a

src/app/homepage/header/header.component.scss

@@ -281,3 +281,9 @@ header {
     display: none;
   }
 }
+
+.search-wrapper{
+  margin-right: 2em;
+  height: 100%;
+  display: inline-block;
+}

src/app/homepage/homepage.component.ts

@@ -58,6 +58,7 @@ export class HomepageComponent implements OnInit, OnDestroy, AfterViewInit {
 
   ngAfterViewInit() {
     this.checkWindowWidth(window.innerWidth);
+    this.contentRef.appendChild(this.createDocSearchScriptTag())
   }
 
   ngOnDestroy() {
@@ -141,4 +142,20 @@ export class HomepageComponent implements OnInit, OnDestroy, AfterViewInit {
     scriptTag.id = '_carbonads_js';
     return scriptTag;
   }
+
+  createDocSearchScriptTag(): HTMLScriptElement {
+    const scriptTag = document.createElement("script");
+    scriptTag.type = "text/javascript";
+    scriptTag.src = "https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js";
+    scriptTag.async = true
+    scriptTag.onload = () => {
+      (window as any).docsearch({
+        apiKey: '9ea53de1a6911255834352bbbe4d3417',
+        indexName: 'nestjs',
+        inputSelector: '#q',
+        debug: false // Set debug to true if you want to inspect the dropdown
+      })
+    };
+    return scriptTag
+  }
 }

src/index.html

@@ -60,6 +60,7 @@
       src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"
     ></script>
     <link href="assets/css/perfect-scrollbar.min.css" rel="stylesheet" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" />
 
     <script>
       (function(i, s, o, g, r, a, m) {