Merge pull request #61 from lakhanmandloi/dev

 Issue #35 feat: Header fixes

_includes/header.html

@@ -1,7 +1,7 @@
 <header>
 	<div class="container">
 		<div class="row">
-			<div class="col-xs-8 col-sm-2 logo">
+			<div class="col-xs-8 col-sm-3 col-md-2 logo">
 				<a href="/" >
 					<img src="/img/sunbird-logo.png" alt="logo">
 				</a>
@@ -12,7 +12,7 @@
 					<i class="material-icons">menu</i>
 				</button>
 			</div>
-			<div class="col-xs-12 col-sm-6 text-right navbar main-menu">
+			<div class="col-xs-12 col-sm-5 col-md-6 text-right navbar main-menu">
 				<div class="navbar-header">
 					<div class="collapse navbar-collapse" id="mainNav" >
 						<ul class="nav navbar-nav">

_includes/search.html

@@ -1,10 +1,10 @@
 <div class="search-cover">
 	<form method="get" action="http://www.google.com/search" target="_blank">
-		<input type="text" value="" name="q" placeholder="Search ..."/ class="search-input">
+		<input type="text" value="" name="q" placeholder="Search"/ class="search-input" title="Enter keyword to search">
 		<input type="hidden" value="en" name="hl" />
 		<input type="hidden" name="sitesearch" value="http://www.sunbird.org" />
 		<input type="hidden" value="lang_en" name="lr" />
-		<button type="submit" onclick="submit()" class="search-btn">
+		<button type="submit" onclick="submit()" class="search-btn" title="Search">
 			<i class="fa fa-search"></i>
 		</button>
 	</form>

css/global.scss

@@ -79,3 +79,21 @@ iframe .btn.omega{background: #fb4b00;
     background: linear-gradient(45deg, #0d9474 0%, #2a6fa8 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d9474', endColorstr='#2a6fa8',GradientType=1 );
 }
+
+@media screen and (max-width:600px){
+.col-xxs-3{width:25% !important; padding-left:15px; padding-right:15px; position:relative; float:left;}
+.col-xxs-4{width:33.33% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxs-6{width:50% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxs-9{width:75% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxs-12{width:100% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+}
+@media screen and (max-width:480px){
+.col-xxxs-1{width:8.33% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-2{width:16.66% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-3{width:25% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-4{width:33.33% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-6{width:50% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-10{width:83.34% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-11{width:91.64% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+.col-xxxs-12{width:100% !important; padding-left:15px; padding-right:15px; position:relative;float:left;}
+}

css/header.scss

@@ -38,3 +38,5 @@ body > header {
 		padding:0;
 	}
 }
+.navbar{border:0;}
+.navbar-toggle{margin-right:0;}

css/searchbar.scss

@@ -1,6 +1,17 @@
 .search-cover{
-	padding-top:25px;
-	padding-bottom:10px;
+	padding:10px 0 10px 0;
+}
+@media screen and (min-width:480px){
+	.search-cover{
+		padding:0 0 10px 0;
+	}
+}
+
+@media screen and (min-width:768px){
+	.search-cover{
+		padding:25px 0 10px 0;
+		max-width:250px;
+	}
 }
 .search-btn{
 	height:25px;
@@ -25,4 +36,6 @@
 	border-radius:0;
 	vertical-align:middle;
 	color:#333;
+	width: calc(100% - 40px);
 }
+

css/style.scss

@@ -20,9 +20,6 @@
 @import "./get_started";
 @import "./owl";
 @import "./homepage";
-@import "./aboutpage";
-@import "./featurespage";
-@import "./contributepage";
 @import "./redoc";
 body{
 	font-family: "Roboto", Corbel, Avenir, "Lucida Grande", "Lucida Sans", sans-serif;