playground
/
gogs
mirror of https://github.com/gogits/gogs.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Merge pull request #1091 from sapk/fix-ng-issue-pages 

Apply ng to issue dashboard
pull/1105/head
无闻 10 years ago
parent
7fe68d3db7 96a71aaed8
commit
e312634286
9 changed files with 184 additions and 60 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 29
      public/ng/css/gogs.css
  2. 37
      public/ng/css/ui.css
  3. 26
      public/ng/less/gogs/issue.less
  4. 29
      public/ng/less/ui/form.less
  5. 5
      public/ng/less/ui/menu.less
  6. 2
      public/ng/less/ui/reset.less
  7. 4
      public/ng/less/ui/var.less
  8. 7
      routers/user/home.go
  9. 95
      templates/user/issues.tmpl

29
public/ng/css/gogs.css
Unescape View File

@ -2414,6 +2414,35 @@ textarea#issue-add-content {
#milestone-list .action-bar a { #milestone-list .action-bar a {
margin-left: 12px; margin-left: 12px;
} }
.issues.list-group {
margin: 10px 0 20px 0;
}
.issues.list-group > .list-group-item {
background-color: #FFF;
border: 1px solid #e5e5e5;
display: block;
padding: 10px 15px;
margin-bottom: -1px;
}
.issues.list-group > .list-group-item:hover {
background-color: rgba(19, 95, 215, 0.03);
}
.issues.list-group > .list-group-item > .title {
margin-bottom: 16px;
font-weight: bold;
font-size: 1.2em;
}
.issues.list-group > .list-group-item > .title > a {
color: #444;
}
.issues.list-group > .list-group-item > .info span {
margin-right: 12px;
color: #888;
line-height: 20px;
}
.issues.list-group > .list-group-item > .info span > a {
color: #444;
}
.org-header-alert .alert { .org-header-alert .alert {
margin-top: 10px; margin-top: 10px;
} }

37
public/ng/css/ui.css
Unescape View File

@ -188,7 +188,8 @@ input:focus,
background-color: #f2fffc; background-color: #f2fffc;
outline: none; outline: none;
} }
button { button,
.btn {
overflow: visible; overflow: visible;
padding: .6em 1.2em; padding: .6em 1.2em;
} }
@ -431,6 +432,19 @@ dt {
background-color: #fafafa; background-color: #fafafa;
color: #444444; color: #444444;
} }
.btn-white {
background-color: #ffffff;
color: #444444;
border: 1px solid #c6c6c6;
}
.btn-white:hover {
background-color: #e8e8e8;
color: #444444;
}
.btn-white.active {
background-color: #e8e8e8;
color: #444444;
}
.btn-active { .btn-active {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 0 4px rgba(0, 0, 0, 0.15) inset; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 0 4px rgba(0, 0, 0, 0.15) inset;
} }
@ -475,6 +489,22 @@ dt {
background-image: none !important; background-image: none !important;
color: #ffffff; color: #ffffff;
} }
.btn-group {
display: inline-block;
}
.btn-group > .btn {
position: relative;
float: left;
margin-right: -1px;
}
.btn-group > .btn:first-child {
border-bottom-left-radius: .25em;
border-top-left-radius: .25em;
}
.btn-group > .btn:last-child {
border-bottom-right-radius: .25em;
border-top-right-radius: .25em;
}
.ipt:focus { .ipt:focus {
border-color: #428bca; border-color: #428bca;
} }
@ -550,6 +580,10 @@ ul.menu > li > a:hover {
background-color: #eaeaea; background-color: #eaeaea;
color: #444444; color: #444444;
} }
ul.menu > li > a.active {
background-color: #4183c4;
color: #FFF;
}
ul.menu > li.current > a, ul.menu > li.current > a,
ul.menu > li.hover > a { ul.menu > li.hover > a {
color: #444444; color: #444444;
@ -597,6 +631,7 @@ ul.menu-vertical > li.head,
ul.menu-down > li.head { ul.menu-down > li.head {
display: block; display: block;
padding: .4em 1.2em; padding: .4em 1.2em;
margin-bottom: 4px;
} }
ul.menu-vertical > li.down, ul.menu-vertical > li.down,
ul.menu-down > li.down { ul.menu-down > li.down {

26
public/ng/less/gogs/issue.less
Unescape View File

@ -512,3 +512,29 @@ textarea#issue-add-content {
} }
} }
} }
.issues.list-group {
margin: 10px 0 20px 0;
> .list-group-item {
background-color: #FFF;
border: 1px solid #e5e5e5;
display: block;
padding: 10px 15px;
margin-bottom: -1px;
&:hover {
background-color: rgba(19, 95, 215, 0.03);
}
> .title {
margin-bottom: 16px;
font-weight: bold;
font-size: 1.2em;
> a { color: #444; }
}
> .info span {
margin-right: 12px;
color: #888;
line-height: 20px;
> a { color: #444; }
}
}
}

29
public/ng/less/ui/form.less
Unescape View File

@ -70,6 +70,19 @@
} }
} }
.btn-white {
background-color: @btnWhiteColor;
color: @baseFontColor;
border: 1px solid @btnWhiteBorderColor;
&:hover {
background-color: @btnWhiteHoverColor;
color: @baseFontColor;
}
&.active {
background-color: @btnWhiteHoverColor;
color: @baseFontColor;
}
}
// status buttons // status buttons
.btn-active { .btn-active {
@ -118,6 +131,22 @@
} }
} }
.btn-group {
display: inline-block;
> .btn {
position: relative;
float: left;
margin-right: -1px;
&:first-child{
border-bottom-left-radius: .25em;
border-top-left-radius: .25em;
}
&:last-child{
border-bottom-right-radius: .25em;
border-top-right-radius: .25em;
}
}
}
// input form elements // input form elements
.ipt { .ipt {
&:focus { &:focus {

5
public/ng/less/ui/menu.less
Unescape View File

@ -11,6 +11,10 @@ ul.menu {
background-color: @lineMenuHoverBgColor; background-color: @lineMenuHoverBgColor;
color: @lineMenuHoverFontColor; color: @lineMenuHoverFontColor;
} }
&.active {
background-color: #4183c4;
color: #FFF;
}
} }
&.current > a, &.current > a,
&.hover > a { &.hover > a {
@ -67,6 +71,7 @@ ul.menu-down {
> li.head { > li.head {
display: block; display: block;
padding: .4em 1.2em; padding: .4em 1.2em;
margin-bottom: 4px;
} }
> li.down { > li.down {
position: relative; position: relative;

2
public/ng/less/ui/reset.less
Unescape View File

@ -238,7 +238,7 @@ input,
} }
} }
button { button,.btn {
overflow: visible; overflow: visible;
padding: .6em 1.2em; padding: .6em 1.2em;
} }

4
public/ng/less/ui/var.less
Unescape View File

@ -45,6 +45,10 @@
@btnGrayHoverColor: #FAFAFA; @btnGrayHoverColor: #FAFAFA;
@btnGrayBorderColor: #D0D0D0; @btnGrayBorderColor: #D0D0D0;
@btnWhiteColor: #FFF;
@btnWhiteHoverColor: #e8e8e8;
@btnWhiteBorderColor: #c6c6c6;
@lineMenuHoverBgColor: #EAEAEA; @lineMenuHoverBgColor: #EAEAEA;
@lineMenuHoverFontColor: #444; @lineMenuHoverFontColor: #444;

7
routers/user/home.go
Unescape View File

@ -262,7 +262,9 @@ func Email2User(ctx *middleware.Context) {
} }
func Issues(ctx *middleware.Context) { func Issues(ctx *middleware.Context) {
ctx.Data["Title"] = "Your Issues" ctx.Data["Title"] = ctx.Tr("issues")
ctx.Data["PageIsDashboard"] = true
ctx.Data["PageIsIssues"] = true
viewType := ctx.Query("type") viewType := ctx.Query("type")
types := []string{"assigned", "created_by"} types := []string{"assigned", "created_by"}
@ -386,5 +388,8 @@ func Issues(ctx *middleware.Context) {
} else { } else {
ctx.Data["ShowCount"] = issueStats.OpenCount ctx.Data["ShowCount"] = issueStats.OpenCount
} }
ctx.Data["ContextUser"] = ctx.User
ctx.HTML(200, ISSUES) ctx.HTML(200, ISSUES)
} }

95
templates/user/issues.tmpl
Unescape View File

@ -1,53 +1,44 @@
{{template "base/head" .}} {{template "ng/base/head" .}}
{{template "base/navbar" .}} {{template "ng/base/header" .}}
<div id="body-nav"> {{template "user/dashboard/nav" .}}
<div class="container"> <div id="dashboard-wrapper">
<ul class="nav nav-pills pull-right"> <div id="dashboard" class="container" data-page="user">
<li><a href="{{AppSubUrl}}/">News Feed</a></li> {{if .HasInfo}}<div class="alert alert-info">{{.InfoMsg}}</div>{{end}}
<li class="active"><a href="{{AppSubUrl}}/issues">Issues</a></li> <div id="issue">
<!-- <li><a href="{{AppSubUrl}}/pulls">Pull Requests</a></li> <div class="left grid-1-5 filter-list">
<li><a href="{{AppSubUrl}}/stars">Stars</a></li> --> <ul class="list-unstyled menu menu-vertical">
</ul> <li><a href="{{AppSubUrl}}/issues?state={{.State}}&repoid={{.RepoId}}" class="radius{{if eq .ViewType "all"}} active{{end}}" >In your repositories <strong class="pull-right">{{.IssueStats.AllCount}}</strong></a></li>
<h3>Your Issues</h3> <li><a href="{{AppSubUrl}}/issues?type=assigned&repoid={{.RepoId}}&state={{.State}}" class="radius{{if eq .ViewType "assigned"}} active{{end}}">Assigned to you <strong class="pull-right">{{.IssueStats.AssignCount}}</strong></a></li>
</div> <li><a href="{{AppSubUrl}}/issues?type=created_by&repoid={{.RepoId}}&state={{.State}}" class="radius{{if eq .ViewType "created_by"}} active{{end}}">Created by you <strong class="pull-right">{{.IssueStats.CreateCount}}</strong></a></li>
<li><hr/></li>
{{range .Repos}}
<li><a href="{{AppSubUrl}}/issues?type={{$.ViewType}}{{if eq $.RepoId .Id}}{{else}}&repoid={{.Id}}{{end}}&state={{$.State}}" class="radius{{if eq $.RepoId .Id}} active{{end}}">{{$.SignedUser.Name}}/{{.Name}} <strong class="pull-right">{{if $.IsShowClosed}}{{.NumClosedIssues}}{{else}}{{.NumOpenIssues}}{{end}}</strong></a></li>
{{end}}
</ul>
</div>
<div class="right grid-3-4">
<div class="filter-option">
<div class="btn-group">
<a class="btn btn-white btn-small issue-open{{if not .IsShowClosed}} active{{end}}" href="{{AppSubUrl}}/issues?type={{.ViewType}}&repoid={{.RepoId}}">Open</a>
<a class="btn btn-white btn-small issue-close{{if .IsShowClosed}} active{{end}}" href="{{AppSubUrl}}/issues?type={{.ViewType}}&repoid={{.RepoId}}&state=closed">Closed</a>
</div>
</div>
<div class="issues list-group">
{{range .Issues}}{{if .}}
<div class="list-group-item issue-item" id="issue-{{.Id}}" onclick="window.location.href='{{AppSubUrl}}/{{.Repo.Owner.Name}}/{{.Repo.Name}}/issues/{{.Index}}'">
<span class="number pull-right">#{{.Index}}</span>
<h5 class="title"><a href="{{AppSubUrl}}/{{.Repo.Owner.Name}}/{{.Repo.Name}}/issues/{{.Index}}">{{.Name}}</a></h5>
<p class="info">
<span class="author"><img class="avatar" src="{{.Poster.AvatarLink}}" alt="" width="20"/>
<a href="{{AppSubUrl}}/{{.Poster.Name}}">{{.Poster.Name}}</a></span>
<span class="time">{{TimeSince .Created $.Lang}}</span>
<span class="comment"><i class="fa fa-comments"></i> {{.NumComments}}</span>
</p>
</div>
{{end}}{{end}}
</div>
</div>
</div>
</div>
</div> </div>
{{template "ng/base/footer" .}}
<div id="body" class="container" data-page="user">
{{if .HasInfo}}<div class="alert alert-info">{{.InfoMsg}}</div>{{end}}
<div id="issue">
<div class="col-md-3 filter-list">
<ul class="list-unstyled">
<li><a href="{{AppSubUrl}}/issues?state={{.State}}&repoid={{.RepoId}}"{{if eq .ViewType "all"}} class="active"{{end}}>In your repositories <strong class="pull-right">{{.IssueStats.AllCount}}</strong></a></li>
<li><a href="{{AppSubUrl}}/issues?type=assigned&repoid={{.RepoId}}&state={{.State}}"{{if eq .ViewType "assigned"}} class="active"{{end}}>Assigned to you <strong class="pull-right">{{.IssueStats.AssignCount}}</strong></a></li>
<li><a href="{{AppSubUrl}}/issues?type=created_by&repoid={{.RepoId}}&state={{.State}}"{{if eq .ViewType "created_by"}} class="active"{{end}}>Created by you <strong class="pull-right">{{.IssueStats.CreateCount}}</strong></a></li>
<li><hr/></li>
{{range .Repos}}
<li><a href="{{AppSubUrl}}/issues?type={{$.ViewType}}{{if eq $.RepoId .Id}}{{else}}&repoid={{.Id}}{{end}}&state={{$.State}}" class="sm{{if eq $.RepoId .Id}} active{{end}}">{{$.SignedUser.Name}}/{{.Name}} <strong class="pull-right">{{if $.IsShowClosed}}{{.NumClosedIssues}}{{else}}{{.NumOpenIssues}}{{end}}</strong></a></li>
{{end}}
</ul>
</div>
<div class="col-md-9">
<div class="filter-option">
<div class="btn-group">
<a class="btn btn-default issue-open{{if not .IsShowClosed}} active{{end}}" href="{{AppSubUrl}}/issues?type={{.ViewType}}&repoid={{.RepoId}}">Open</a>
<a class="btn btn-default issue-close{{if .IsShowClosed}} active{{end}}" href="{{AppSubUrl}}/issues?type={{.ViewType}}&repoid={{.RepoId}}&state=closed">Closed</a>
</div>
</div>
<div class="issues list-group">
{{range .Issues}}{{if .}}
<div class="list-group-item issue-item" id="issue-{{.Id}}">
<span class="number pull-right">#{{.Index}}</span>
<h5 class="title"><a href="{{AppSubUrl}}/{{.Repo.Owner.Name}}/{{.Repo.Name}}/issues/{{.Index}}">{{.Name}}</a></h5>
<p class="info">
<span class="author"><img class="avatar" src="{{.Poster.AvatarLink}}" alt="" width="20"/>
<a href="{{AppSubUrl}}/{{.Poster.Name}}">{{.Poster.Name}}</a></span>
<span class="time">{{TimeSince .Created $.Lang}}</span>
<span class="comment"><i class="fa fa-comments"></i> {{.NumComments}}</span>
</p>
</div>
{{end}}{{end}}
</div>
</div>
</div>
</div>
{{template "base/footer" .}}

Write Preview
Loading…
Cancel
Save