[Notice] Announcing the End of Demo Server [Read me]
DeokHong Kim (a.k.a insanehong)
2014-04-28
ListPages: change style of comments and vote on list
- issue list on issue menu - board list on board menu - my issue list on site main - mypage : issue list, board list
@b6e8d815d413d7d5e2cc1c5cd5a2541c41e50c44
--- app/assets/stylesheets/less/_page.less
+++ app/assets/stylesheets/less/_page.less
... | ... | @@ -3314,8 +3314,8 @@ |
| 3314 | 3314 |
color:#999; |
| 3315 | 3315 |
|
| 3316 | 3316 |
.infos-item {
|
| 3317 |
- margin-right:8px; |
|
| 3318 |
- display:inline-block; |
|
| 3317 |
+ margin-right:12px; |
|
| 3318 |
+ float:left; |
|
| 3319 | 3319 |
|
| 3320 | 3320 |
&.infos-link-item {
|
| 3321 | 3321 |
&:hover {
|
... | ... | @@ -3324,6 +3324,42 @@ |
| 3324 | 3324 |
} |
| 3325 | 3325 |
} |
| 3326 | 3326 |
|
| 3327 |
+ &.item-count-groups {
|
|
| 3328 |
+ border:1px solid #EEE; |
|
| 3329 |
+ .border-radius(3px); |
|
| 3330 |
+ line-height: 14px; |
|
| 3331 |
+ margin-top:2px; |
|
| 3332 |
+ |
|
| 3333 |
+ .count-groups {
|
|
| 3334 |
+ margin:0 auto; |
|
| 3335 |
+ display:inline-block; |
|
| 3336 |
+ text-align: center; |
|
| 3337 |
+ padding:0 5px; |
|
| 3338 |
+ float: left; |
|
| 3339 |
+ |
|
| 3340 |
+ &.item-icon {
|
|
| 3341 |
+ background-color:#F7F7F7; |
|
| 3342 |
+ color:#3592b5; |
|
| 3343 |
+ font-size: 9px; |
|
| 3344 |
+ padding-top:2px; |
|
| 3345 |
+ line-height: 12px; |
|
| 3346 |
+ border-left:1px solid #EEE; |
|
| 3347 |
+ |
|
| 3348 |
+ &:first-child {
|
|
| 3349 |
+ border-left:none; |
|
| 3350 |
+ } |
|
| 3351 |
+ |
|
| 3352 |
+ &.strong {
|
|
| 3353 |
+ color:@primary; |
|
| 3354 |
+ } |
|
| 3355 |
+ } |
|
| 3356 |
+ |
|
| 3357 |
+ &.item-count {
|
|
| 3358 |
+ padding:0 7px; |
|
| 3359 |
+ } |
|
| 3360 |
+ } |
|
| 3361 |
+ } |
|
| 3362 |
+ |
|
| 3327 | 3363 |
&.infos-icon-link {
|
| 3328 | 3364 |
color:#3592b5; |
| 3329 | 3365 |
|
--- app/utils/TemplateHelper.scala
+++ app/utils/TemplateHelper.scala
... | ... | @@ -25,6 +25,7 @@ |
| 25 | 25 |
import play.api.i18n.Lang |
| 26 | 26 |
import models.CodeCommentThread |
| 27 | 27 |
import models.CommentThread |
| 28 |
+import play.api.templates.Html |
|
| 28 | 29 |
|
| 29 | 30 |
object TemplateHelper {
|
| 30 | 31 |
|
... | ... | @@ -508,4 +509,13 @@ |
| 508 | 509 |
} |
| 509 | 510 |
} |
| 510 | 511 |
} |
| 512 |
+ |
|
| 513 |
+ def countHtml(icon:String, link:String, count: Int, strong:String = "") = {
|
|
| 514 |
+ Html("""<span class="count-groups item-icon %s">
|
|
| 515 |
+ <i class="yobicon-%s"></i> |
|
| 516 |
+ </span> |
|
| 517 |
+ <span class="count-groups item-count"> |
|
| 518 |
+ <a href="%s">%d</a> |
|
| 519 |
+ </span> """.format(strong, icon, link, count)) |
|
| 520 |
+ } |
|
| 511 | 521 |
} |
--- app/views/board/partial_list.scala.html
+++ app/views/board/partial_list.scala.html
... | ... | @@ -55,11 +55,10 @@ |
| 55 | 55 |
</span> |
| 56 | 56 |
|
| 57 | 57 |
@if(post.numOfComments >0){
|
| 58 |
- <a href="@routes.BoardApp.post(project.owner, project.name, post.getNumber)#comments" class="infos-item infos-icon-link"> |
|
| 59 |
- <i class="yobicon-comments"></i> |
|
| 60 |
- <span class="size">@post.numOfComments</span> |
|
| 61 |
- </a> |
|
| 62 |
- } |
|
| 58 |
+ <span class="infos-item item-count-groups"> |
|
| 59 |
+ @countHtml("comments",routes.BoardApp.post(project.owner, project.name, post.getNumber).toString() + "#comments", post.numOfComments)
|
|
| 60 |
+ </span> |
|
| 61 |
+ } |
|
| 63 | 62 |
</div> |
| 64 | 63 |
</li> |
| 65 | 64 |
} |
--- app/views/issue/my_partial_list.scala.html
+++ app/views/issue/my_partial_list.scala.html
... | ... | @@ -62,12 +62,17 @@ |
| 62 | 62 |
@agoOrDateString(issue.createdDate) |
| 63 | 63 |
</span> |
| 64 | 64 |
|
| 65 |
- @if(issue.comments.size()>0){
|
|
| 66 |
- <a href="@routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber)#comments" class="infos-item infos-icon-link"> |
|
| 67 |
- <i class="yobicon-comments"></i> |
|
| 68 |
- <span class="size">@issue.comments.size()</span> |
|
| 69 |
- </a> |
|
| 65 |
+ @if(issue.comments.size()>0 || issue.voters.size()>0) {
|
|
| 66 |
+ <span class="infos-item item-count-groups"> |
|
| 67 |
+ @if(issue.comments.size()>0){
|
|
| 68 |
+ @countHtml("comments",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#comments", issue.comments.size() )
|
|
| 69 |
+ } |
|
| 70 |
+ @if(issue.voters.size()>0){
|
|
| 71 |
+ @countHtml("hearts",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#vote", issue.voters.size(), "strong" )
|
|
| 72 |
+ } |
|
| 73 |
+ </span> |
|
| 70 | 74 |
} |
| 75 |
+ |
|
| 71 | 76 |
@for(label <- issue.labels.toList.sortBy(r => (r.category, r.name))) {
|
| 72 | 77 |
<a href="@urlToList(issue.project, searchCondition.state)&labelIds=@label.id" class="label issue-label list-label" data-labelId="@label.id" data-color="@label.color" style="background:@label.color">@label.name</a> |
| 73 | 78 |
} |
--- app/views/issue/partial_list.scala.html
+++ app/views/issue/partial_list.scala.html
... | ... | @@ -65,18 +65,17 @@ |
| 65 | 65 |
@agoOrDateString(issue.createdDate) |
| 66 | 66 |
</span> |
| 67 | 67 |
|
| 68 |
- @if(issue.voters.size() > 0) {
|
|
| 69 |
- <div class="infos-item infos-sympathy"> |
|
| 70 |
- @Messages("issue.vote") +@issue.voters.size()
|
|
| 71 |
- </div> |
|
| 68 |
+ @if(issue.comments.size()>0 || issue.voters.size()>0) {
|
|
| 69 |
+ <span class="infos-item item-count-groups"> |
|
| 70 |
+ @if(issue.comments.size()>0){
|
|
| 71 |
+ @countHtml("comments",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#comments", issue.comments.size() )
|
|
| 72 |
+ } |
|
| 73 |
+ @if(issue.voters.size()>0){
|
|
| 74 |
+ @countHtml("hearts",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#vote", issue.voters.size(), "strong" )
|
|
| 75 |
+ } |
|
| 76 |
+ </span> |
|
| 72 | 77 |
} |
| 73 | 78 |
|
| 74 |
- @if(issue.comments.size()>0){
|
|
| 75 |
- <a href="@routes.IssueApp.issue(project.owner, project.name, issue.getNumber)#comments" class="infos-item infos-icon-link"> |
|
| 76 |
- <i class="yobicon-comments"></i> |
|
| 77 |
- <span class="size">@issue.comments.size()</span> |
|
| 78 |
- </a> |
|
| 79 |
- } |
|
| 80 | 79 |
@for(label <- issue.labels.toList.sortBy(r => (r.category, r.name))) {
|
| 81 | 80 |
<a href="#" class="label issue-label list-label" data-labelId="@label.id" data-color="@label.color" style="background:@label.color">@label.name</a> |
| 82 | 81 |
} |
--- app/views/issue/view.scala.html
+++ app/views/issue/view.scala.html
... | ... | @@ -233,7 +233,7 @@ |
| 233 | 233 |
@**<!-- // -->**@ |
| 234 | 234 |
|
| 235 | 235 |
@**<!-- voters -->**@ |
| 236 |
- <dl> |
|
| 236 |
+ <dl id="vote"> |
|
| 237 | 237 |
<dt>@Messages("issue.vote")</dt>
|
| 238 | 238 |
<dd> |
| 239 | 239 |
<dd style="padding:5px 10px;"> |
--- app/views/reviewthread/partial_list.scala.html
+++ app/views/reviewthread/partial_list.scala.html
... | ... | @@ -55,12 +55,12 @@ |
| 55 | 55 |
@agoOrDateString(thread.createdDate) |
| 56 | 56 |
</span> |
| 57 | 57 |
@defining(thread.reviewComments.size()-1) { numberOfComments =>
|
| 58 |
+ |
|
| 58 | 59 |
@if(numberOfComments > 0) {
|
| 59 |
- <a href="@DiffRenderer.urlToCommentThread(thread))" class="infos-item infos-icon-link"> |
|
| 60 |
- <i class="yobicon-comments"></i> |
|
| 61 |
- <span class="size">@numberOfComments</span> |
|
| 62 |
- </a> |
|
| 63 |
- } |
|
| 60 |
+ <span class="infos-item item-count-groups"> |
|
| 61 |
+ @countHtml("comments",DiffRenderer.urlToCommentThread(thread), numberOfComments)
|
|
| 62 |
+ </span> |
|
| 63 |
+ } |
|
| 64 | 64 |
} |
| 65 | 65 |
</div> |
| 66 | 66 |
</li> |
--- app/views/user/partial_issues.scala.html
+++ app/views/user/partial_issues.scala.html
... | ... | @@ -56,12 +56,17 @@ |
| 56 | 56 |
@agoOrDateString(issue.createdDate) |
| 57 | 57 |
</span> |
| 58 | 58 |
|
| 59 |
+ @if(issue.comments.size()>0 || issue.voters.size()>0) {
|
|
| 60 |
+ <span class="infos-item item-count-groups"> |
|
| 59 | 61 |
@if(issue.comments.size()>0){
|
| 60 |
- <a href="@routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber)#comments" class="infos-item infos-icon-link"> |
|
| 61 |
- <i class="yobicon-comments"></i> |
|
| 62 |
- <span class="size">@issue.comments.size()</span> |
|
| 63 |
- </a> |
|
| 62 |
+ @countHtml("comments",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#comments", issue.comments.size() )
|
|
| 64 | 63 |
} |
| 64 |
+ @if(issue.voters.size()>0){
|
|
| 65 |
+ @countHtml("hearts",routes.IssueApp.issue(issue.project.owner, issue.project.name, issue.getNumber).toString() + "#vote", issue.voters.size(), "strong" )
|
|
| 66 |
+ } |
|
| 67 |
+ </span> |
|
| 68 |
+ } |
|
| 69 |
+ |
|
| 65 | 70 |
@for(label <- issue.labels.toList.sortBy(r => (r.category, r.name))) {
|
| 66 | 71 |
@makeLabelLink(project, label) |
| 67 | 72 |
} |
--- app/views/user/partial_postings.scala.html
+++ app/views/user/partial_postings.scala.html
... | ... | @@ -51,11 +51,10 @@ |
| 51 | 51 |
</span> |
| 52 | 52 |
|
| 53 | 53 |
@if(post.numOfComments >0){
|
| 54 |
- <a href="@routes.BoardApp.post(project.owner, project.name, post.getNumber)#comments" class="infos-item infos-icon-link"> |
|
| 55 |
- <i class="yobicon-comments"></i> |
|
| 56 |
- <span class="size">@post.numOfComments</span> |
|
| 57 |
- </a> |
|
| 58 |
- } |
|
| 54 |
+ <span class="infos-item item-count-groups"> |
|
| 55 |
+ @countHtml("comments",routes.BoardApp.post(project.owner, project.name, post.getNumber).toString() + "#comments", post.numOfComments)
|
|
| 56 |
+ </span> |
|
| 57 |
+ } |
|
| 59 | 58 |
</div> |
| 60 | 59 |
</li> |
| 61 | 60 |
} |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?