Added a search box to the nav header for the mobile view.

mattermost · Nov 29, 2016 · 94db8a5 · 94db8a5
1 parent ad73c24
commit 94db8a5
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/source/myscript.js b/source/myscript.js
@@ -7,7 +7,11 @@ $(document).ready(function(){
 
 	$('header .search__icon').on('click', function (){
 		$("header .header__links").hide();
-		$("header .header__searchbar").slideToggle();
+		$("header .header__searchbar").slideToggle(400, function() {
+			if($(this).is(':visible')) {
+				$(this).find("input[type=text]").focus();
+			}
+		});
 	});
 
 	if($('.wy-menu-vertical li.current>a').length){

diff --git a/source/theme.css b/source/theme.css
@@ -261,11 +261,6 @@ header .header__links {
 	padding: 0 5px 0 0;
 }
 
-header .header__searchbar {
-	float: left;
-	padding: 0 5px 0 0;
-}
-
 header .header__links li {
 	float: left;
 	display: block;
@@ -284,13 +279,23 @@ header .header__links li a {
 	border-top: 3px solid transparent;
 }
 
+header .header__searchbar {
+	display: none;
+	float: left;
+	padding: 0 5px 0 0;
+}
+
 @media (max-width: 768px){
+<<<<<<< HEAD
 	header .links__icon {
 		display: block;
 	}
 	.wy-nav-top {
 		display: none;
 	}
+=======
+
+>>>>>>> c8fd417... Added a search box to the nav header for the mobile view.
 	.wy-side-nav-search {
 		position: relative;
 	}
@@ -333,8 +338,12 @@ header .header__links li a {
 	header .header__searchbar input[type="text"] {
 		width: 100%;
 		border-radius: 50px;
+		border: 1px solid #ddd;
 		padding: 6px 12px;
 	}
+	header .header__searchbar input:focus {
+		outline: none;
+	}
 	header .header__links {
 		border-bottom: 1px solid #ccc;
 		display: none;