quick search

less/search.less

@@ -78,6 +78,13 @@
 	}
 }
 
+@media (max-width: @screen-xs-max) {
+	.quick-search-container {
+		left: 0px;
+		right: 0px;
+	}
+}
+
 .quick-search-results, .search-results {
 	.post-info {
 		font-size: 12px;

public/persona.js

@@ -192,7 +192,7 @@ $(document).ready(function () {
 			return;
 		}
 
-		require(['pulling', 'storage', 'alerts'], function (Pulling, Storage, alerts) {
+		require(['pulling', 'storage', 'alerts', 'search'], function (Pulling, Storage, alerts, search) {
 			if (!Pulling) {
 				return;
 			}
@@ -354,13 +354,23 @@ $(document).ready(function () {
 
 				searchButton.addClass('hidden');
 				searchInputEl.removeClass('hidden').focus();
-				searchInputEl.off('blur').on('blur', function () {
+				return false;
+			});
+			searchInputEl.on('blur', function () {
 				searchInputEl.addClass('hidden');
 				searchButton.removeClass('hidden');
 			});
-				return false;
+			search.enableQuickSearch({
+				searchElements: {
+					inputEl: searchInputEl,
+					resultEl: $('.navbar-header .navbar-search .quick-search-container'),
+				},
+				searchOptions: {
+					in: config.searchDefaultInQuick,
+				},
 			});
 
+
 			// add a checkbox in the user settings page
 			// so users can swap the sides the menus appear on
 

templates/partials/menu.tpl

@@ -18,6 +18,9 @@
 						<button class="btn btn-primary hidden" type="submit"></button>
 						<input type="text" class="hidden" name="in" value="{config.searchDefaultInQuick}" />
 					</form>
+					<div class="quick-search-container hidden">
+						<div class="quick-search-results-container"></div>
+					</div>
 				</div>
 				{{{ end }}}