add search form in top navbar

This commit is contained in:
FuXiaoHei 2014-04-11 22:41:41 +08:00
parent df000245d1
commit 555b6976a3
2 changed files with 39 additions and 7 deletions

View file

@ -67,6 +67,7 @@ html, body {
color: #EEE;
font-size: 100%;
height: 46px;
margin-top: 3px;
}
#nav-logo {
@ -81,10 +82,6 @@ html, body {
text-decoration: none;
}
.nav-item.navbar-right {
margin-top: 3px;
}
.nav-item.navbar-btn {
cursor: pointer;
margin-top: 8px;
@ -96,6 +93,28 @@ html, body {
margin: 0;
}
#nav-search-form {
width: 300px;
margin-top: 0;
}
#nav-search-form button {
margin-top: 0;
background-image: none;
background-color: #F6F6F6;
}
#nav-search-form input[type=search] {
background-color: #F6F6F6;
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
#nav-search-form input[type=search]:focus {
background-color: #FFF;
border-color: #D9D9D9;
}
/* gogits nav item active status */
#masthead .nav .active {
color: #fff;

View file

@ -1,9 +1,22 @@
<div class="masthead navbar" id="masthead">
<div class="container">
<nav class="nav">
<a id="nav-logo" class="nav-item{{if .PageIsHome}} active{{end}}" href="/"><img src="/img/favicon.png" alt="Gogs Logo" id="logo"></a>
<a class="nav-item{{if .PageIsUserDashboard}} active{{end}}" href="/">Dashboard</a>
<a class="nav-item{{if .PageIsHelp}} active{{end}}" href="https://github.com/gogits/gogs/wiki">Help</a>{{if .IsSigned}}
<a id="nav-logo" class="nav-item pull-left{{if .PageIsHome}} active{{end}}" href="/"><img src="/img/favicon.png" alt="Gogs Logo" id="logo"></a>
<a class="nav-item pull-left{{if .PageIsUserDashboard}} active{{end}}" href="/">Dashboard</a>
<a class="nav-item pull-left{{if .PageIsHelp}} active{{end}}" href="https://github.com/gogits/gogs/wiki">Help</a>{{if .IsSigned}}
<form class="nav-item pull-left{{if .PageIsNewRepo}} active{{end}}" id="nav-search-form">
<div class="input-group">
<div class="input-group-btn">
<button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">All Repositories <span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#">All Repositories</a></li>
<li class="divider"></li>
<li><a href="#">This Repository</a></li>
</ul>
</div>
<input type="search" class="form-control input-sm" name="q" placeholder="search code, commits and issues"/>
</div>
</form>
<a id="nav-out" class="nav-item navbar-right navbar-btn btn btn-danger" href="/user/logout/"><i class="fa fa-power-off fa-lg"></i></a>
<a id="nav-avatar" class="nav-item navbar-right{{if .PageIsUserProfile}} active{{end}}" href="{{.SignedUser.HomeLink}}" data-toggle="tooltip" data-placement="bottom" title="{{.SignedUserName}}">
<img src="{{.SignedUser.AvatarLink}}?s=28" alt="user-avatar" title="username"/>