add docsearch

docs/_includes/footer.html

@@ -35,17 +35,17 @@
 <script src="{{ site.baseurl }}/assets/js/ie10-viewport-bug-workaround.js"></script>
 <script src="{{ site.baseurl }}/assets/js/ie-emulation-modes-warning.js"></script>
 
-<script src="{{ site.baseurl }}/assets/js/vendor/jekyll-search.min.js"></script>
-
+{% if page.layout == "docs" %}
+<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
 <script>
-SimpleJekyllSearch.init({
-  searchInput: document.getElementById('search-input'),
-  resultsContainer: document.getElementById('search-results'),
-  searchResultTemplate: '<a class="dropdown-item" href="{url}">{title}</a>',
-  noResultsText: '<div class="dropdown-item no-results">Sorry, there are no results for that search.</div>',
-  json: '{{ site.baseurl }}/search.json'
-})
+  docsearch({
+    apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
+    indexName: 'bootstrap-v4',
+    inputSelector: '#search-input',
+    debug: true // Set debug to true if you want to inspect the dropdown
+  });
 </script>
+{% endif %}
 
 <script>
 Holder.addTheme('gray', {

docs/_includes/header.html

@@ -19,6 +19,9 @@
 {% endif %}
 
 <!-- Documentation extras -->
+{% if page.layout == "docs" %}
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
+{% endif %}
 <link href="{{ site.baseurl }}/assets/css/docs.min.css" rel="stylesheet">
 
 <!-- Favicons -->