(refs #865)Apply the flat style to box headers

This commit is contained in:
Naoki Takezoe
2015-08-08 13:32:42 +09:00
parent 74ed3bf6a0
commit bb10365b8b
10 changed files with 119 additions and 180 deletions

View File

@@ -3,7 +3,6 @@
<div class="container">
<div class="row-fluid">
<div class="span3">
<div class="box">
<ul class="nav nav-tabs nav-stacked side-menu" id="system-admin-menu-container">
<li@if(active=="users"){ class="active"}>
<a href="@path/admin/users">User Management</a>
@@ -19,7 +18,6 @@
</li>
</ul>
</div>
</div>
<div class="span9">
@body
</div>

View File

@@ -24,56 +24,48 @@
@if(loginAccount.isEmpty){
@signinform(settings)
} else {
<table class="table table-bordered">
<tr>
<th class="metal">
<div class="box-header">
<div class="pull-right">
<a href="@path/new" class="btn btn-success btn-mini">New repository</a>
</div>
Your repositories (@userRepositories.size)
</th>
</tr>
</div>
@if(userRepositories.isEmpty){
<tr>
<td>No repositories</td>
</tr>
<div class="box-content-bottom">
No repositories
</div>
} else {
<div class="box-content-bottom" style="padding: 0px;">
@userRepositories.map { repository =>
<tr>
<td>
<div class="box-content-row">
@helper.html.repositoryicon(repository, false)
@if(repository.owner == loginAccount.get.userName){
<a href="@url(repository)"><span class="strong">@repository.name</span></a>
} else {
<a href="@url(repository)">@repository.owner/<span class="strong">@repository.name</span></a>
}
</td>
</tr>
</div>
}
</div>
}
}
</table>
}
<table class="table table-bordered">
<tr>
<th class="metal">
<div class="box-header">
Recent updated repositories
</th>
</tr>
</div>
@if(recentRepositories.isEmpty){
<tr>
<td>No repositories</td>
</tr>
<div class="box-content-bottom">
No repositories
</div>
} else {
<div class="box-content-bottom" style="padding: 0px;">
@recentRepositories.map { repository =>
<tr>
<td>
<div class="box-content-row">
@helper.html.repositoryicon(repository, false)
<a href="@url(repository)">@repository.owner/<span class="strong">@repository.name</span></a>
</td>
</tr>
</div>
}
</div>
}
</table>
</div>
</div>
</div>

View File

@@ -8,7 +8,7 @@
<hr/><br/>
<form method="POST" validate="true">
<div class="issue-avatar-image">@avatar(loginAccount.get.userName, 48)</div>
<div class="box issue-comment-box">
<div class="issue-comment-box">
<div class="box-content">
@helper.html.preview(
repository = repository,
@@ -20,15 +20,15 @@
style = "width: 635px; height: 100px; max-height: 150px;",
elastic = true
)
</div>
</div>
<div class="pull-right">
<div style="text-align: right;">
<input type="hidden" name="issueId" value="@issue.issueId"/>
<input type="submit" class="btn btn-success" formaction="@url(repository)/issue_comments/new" value="Comment"/>
@if((reopenable || !issue.closed) && (hasWritePermission || issue.openedUserName == loginAccount.get.userName)){
<input type="submit" class="btn" formaction="@url(repository)/issue_comments/state" value="@{if(issue.closed) "Reopen" else "Close"}" id="action"/>
}
</div>
</div>
</div>
</form>
}
<script>

View File

@@ -8,8 +8,8 @@
@import gitbucket.core.model.CommitComment
@if(issue.isDefined){
<div class="issue-avatar-image">@avatar(issue.get.openedUserName, 48)</div>
<div class="box issue-comment-box">
<div class="box-header-small">
<div class="issue-comment-box">
<div class="box-header">
@user(issue.get.openedUserName, styleClass="username strong") <span class="muted">commented @helper.html.datetimeago(issue.get.registeredDate)</span>
<span class="pull-right">
@if(hasWritePermission || loginAccount.map(_.userName == issue.get.openedUserName).getOrElse(false)){
@@ -17,7 +17,7 @@
}
</span>
</div>
<div class="box-content issue-content markdown-body" id="issueContent">
<div class="box-content-bottom issue-content markdown-body" id="issueContent">
@markdown(issue.get.content getOrElse "No description provided.", repository, false, true, true, hasWritePermission)
</div>
</div>
@@ -28,7 +28,7 @@
@if(comment.action != "close" && comment.action != "reopen" && comment.action != "delete_branch"){
<div class="issue-avatar-image">@avatar(comment.commentedUserName, 48)</div>
<div class="box issue-comment-box" id="comment-@comment.commentId">
<div class="box-header-small">
<div class="box-header">
@user(comment.commentedUserName, styleClass="username strong")
<span class="muted">
@if(comment.action == "comment"){
@@ -46,7 +46,7 @@
}
</span>
</div>
<div class="box-content"class="issue-content" id="commentContent-@comment.commentId">
<div class="box-content-bottom issue-content" id="commentContent-@comment.commentId">
@if(comment.action == "commit" && comment.content.split(" ").last.matches("[a-f0-9]{40}")){
@defining(comment.content.substring(comment.content.length - 40)){ id =>
<div class="pull-right"><a href="@path/@repository.owner/@repository.name/commit/@id" class="monospace">@id.substring(0, 7)</a></div>

View File

@@ -13,9 +13,9 @@
<div>
<div class="show-title pull-right">
@if(hasWritePermission || loginAccount.map(_.userName == issue.openedUserName).getOrElse(false)){
<a class="btn btn-small" href="#" id="edit">Edit</a>
<a class="btn" href="#" id="edit">Edit</a>
}
<a class="btn btn-small btn-success" href="@url(repository)/issues/new">New issue</a>
<a class="btn btn-success" href="@url(repository)/issues/new">New issue</a>
</div>
<div class="edit-title pull-right" style="display: none;">
<a class="btn" href="#" id="update">Save</a> <a href="#" id="cancel">Cancel</a>

View File

@@ -67,14 +67,14 @@
@if(loginAccount.isDefined){
<div class="btn-group" style="margin-top: 0px;">
<a class="dropdown-toggle menu" data-toggle="dropdown" href="#"><i class="octicon octicon-plus" style="font-size: 20px; vertical-align: top; margin-top: 10px;"></i><span class="caret" style="vertical-align: middle;"></span></a>
<ul class="dropdown-menu">
<ul class="dropdown-menu pull-right">
<li><a href="@path/new">New repository</a></li>
<li><a href="@path/groups/new">New group</a></li>
</ul>
</div>
<div class="btn-group" style="margin-top: 0px;">
<a class="dropdown-toggle menu" data-toggle="dropdown" href="#" data-toggle="tooltip" data-placement="bottom" title="Signed is as @loginAccount.get.userName">@avatar(loginAccount.get.userName, 16)<span class="caret" style="vertical-align: middle;"></span></a>
<ul class="dropdown-menu">
<ul class="dropdown-menu pull-right">
<li><a href="@url(loginAccount.get.userName)/_edit">Account settings</a></li>
@if(loginAccount.get.isAdmin){
<li><a href="@path/admin/users">System administration</a></li>

View File

@@ -18,9 +18,9 @@
<div>
<div class="show-title pull-right">
@if(hasWritePermission || loginAccount.map(_.userName == issue.openedUserName).getOrElse(false)){
<a class="btn btn-small" href="#" id="edit">Edit</a>
<a class="btn" href="#" id="edit">Edit</a>
}
<a class="btn btn-small btn-success" href="@url(repository)/issues/new">New issue</a>
<a class="btn btn-success" href="@url(repository)/issues/new">New issue</a>
</div>
<div class="edit-title pull-right" style="display: none;">
<a class="btn" href="#" id="update">Save</a> <a href="#" id="cancel">Cancel</a>

View File

@@ -128,7 +128,7 @@
@readme.map { case(filePath, content) =>
<div id="readme">
<div class="box-header">@filePath.reverse.head</div>
<div class="box-content markdown-body">@renderMarkup(filePath, content, branch, repository, false, false, true)</div>
<div class="box-content-bottom markdown-body">@renderMarkup(filePath, content, branch, repository, false, false, true)</div>
</div>
}
}

View File

@@ -1,18 +1,14 @@
@(systemSettings: gitbucket.core.service.SystemSettingsService.SystemSettings)(implicit context: gitbucket.core.controller.Context)
@import context._
<table class="table table-bordered">
<tr>
<th class="metal">
<div class="box-header">
@if(systemSettings.allowAccountRegistration){
<div class="pull-right">
<a href="@path/register" class="btn btn-mini">Create new account</a>
</div>
}
Sign in
</th>
</tr>
<tr>
<td>
</div>
<div class="box-content-bottom">
<form action="@path/signin" method="POST" validate="true">
<label for="userName">Username:</label>
<span id="error-userName" class="error"></span>
@@ -24,6 +20,4 @@
<input type="submit" class="btn btn-success" value="Sign in"/>
</div>
</form>
</td>
</tr>
</table>
</div>

View File

@@ -131,15 +131,6 @@ a.global-header-menu {
line-height: 3.5;
}
/*
img.plugin-global-menu {
width: 16px;
height: 16px;
position: relative;
top: -2px;
}
*/
/* ======================================================================== */
/* General Styles */
/* ======================================================================== */
@@ -227,64 +218,50 @@ h3 {
margin-top: 0px;
}
div.box {
background-color: #efefef;
padding: 2px;
margin-bottom: 10px;
}
div.box-header {
font-size: 120%;
font-weight: bold;
background-color: #e0e0e0;
background-image: -moz-linear-gradient(#fafafa, #e0e0e0);
background-image: -webkit-linear-gradient(#fafafa, #e0e0e0);
background-image: linear-gradient(#fafafa, #e0e0e0);
background-repeat: repeat-x;
background-color: #f5f5f5;
margin: 0;
border-top-left-radius: 1px;
border-top-right-radius: 1px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
border: 1px solid #d8d8d8;
border-bottom: none;
padding: 8px 10px 8px 10px;
text-shadow: 0 1px 0 #fff
}
div.box-header-small {
background-color: #e0e0e0;
background-image: -moz-linear-gradient(#fafafa, #e0e0e0);
background-image: -webkit-linear-gradient(#fafafa, #e0e0e0);
background-image: linear-gradient(#fafafa, #e0e0e0);
background-repeat: repeat-x;
margin: 0;
border-top-left-radius: 1px;
border-top-right-radius: 1px;
border: 1px solid #d8d8d8;
border-bottom: none;
padding: 6px 4px 6px 4px;
text-shadow: 0 1px 0 #fff
padding: 8px 8px 8px 8px;
}
.inline-comment div.box-header-small {
background: #f2f8fa;
}
div.box-content {
background-color: white;
border: 1px solid #d8d8d8;
padding: 4px;
border-radius: 3px;
}
div.box-content-bottom > div.box-content-row:nth-of-type(1) {
border: none;
}
div.box-content-row {
border-top: 1px solid #d8d8d8;
padding: 4px;
}
div.box-content-bottom {
background-color: white;
border: 1px solid #d8d8d8;
padding: 4px;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
margin-bottom: 20px;
}
th.box-header {
background-color: #e0e0e0;
background-image: -moz-linear-gradient(#fafafa, #e0e0e0);
background-image: -webkit-linear-gradient(#fafafa, #e0e0e0);
background-image: linear-gradient(#fafafa, #e0e0e0);
background-repeat: repeat-x;
margin: 0;
border-top-left-radius: 1px;
border-top-right-radius: 1px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
border: 1px solid #d8d8d8;
border-bottom: none;
text-shadow: 0 1px 0 #fff
@@ -294,17 +271,6 @@ th.box-header .octicon {
display: inline;
}
th.metal {
background-color: #e0e0e0;
background-image: -moz-linear-gradient(#fafafa, #e8e8e8);
background-image: -webkit-linear-gradient(#fafafa, #e8e8e8);
background-image: linear-gradient(#fafafa, #e8e8e8);
background-repeat: repeat-x;
margin: 0;
border-top-left-radius: 1px;
border-top-right-radius: 1px;
}
dl {
margin: 0px;
}
@@ -485,25 +451,13 @@ ul.nav-stacked.side-menu li.active a:hover {
}
.nav-tabs.nav-stacked.side-menu > li:first-child > a {
-webkit-border-top-right-radius: 0px;
border-top-right-radius: 0px;
-webkit-border-top-left-radius: 0px;
border-top-left-radius: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-topleft: 0px;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.nav-tabs.nav-stacked.side-menu > li:last-child > a {
-webkit-border-bottom-right-radius: 0px;
border-bottom-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
border-bottom-left-radius: 0px;
-moz-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 0px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
/****************************************************************************/
@@ -639,10 +593,11 @@ a.header-link:hover i.octicon-x{
color: #FFF;
}
/*
table.blobview {
table-layout: fixed;
}
*/
table.table-file-list {
margin-bottom: 0px;