From b866dc92d77c37c12982609b641c159d9eb109bf Mon Sep 17 00:00:00 2001 From: fuxiaohei Date: Tue, 4 Nov 2014 21:58:28 +0800 Subject: [PATCH] finish issue list ui draft --- public/ng/css/gogs.css | 56 +++++++++++++++++++++++++- public/ng/css/ui.css | 27 +++++++++++++ public/ng/less/gogs/issue.less | 69 +++++++++++++++++++++++++++++++++ public/ng/less/ui.less | 3 +- public/ng/less/ui/pager.less | 28 +++++++++++++ public/ng/less/ui/var.less | 9 +++++ templates/repo/issue2/list.tmpl | 55 ++++++++++++++++++++++++++ 7 files changed, 245 insertions(+), 2 deletions(-) create mode 100644 public/ng/less/ui/pager.less diff --git a/public/ng/css/gogs.css b/public/ng/css/gogs.css index 8e5b590c00..91588d9916 100644 --- a/public/ng/css/gogs.css +++ b/public/ng/css/gogs.css @@ -1067,7 +1067,7 @@ The register and sign-in page style padding: 18px 0; } .repo-wide-wrapper { - padding: 18px 0; + padding: 18px; position: relative; } #repo-clone-url { @@ -1992,6 +1992,60 @@ textarea#issue-add-content { #issue-new > a button { height: 34px; } +#issue-list-menu { + padding: 16px 0 12px 0; + border-bottom: 1px solid #BBB; + margin-bottom: 12px; +} +#issue-list-menu .mark a { + color: #AAA; +} +#issue-list-menu .mark a:hover { + color: #444; +} +#issue-list-menu .mark.hover a { + color: #222; + font-weight: bold; +} +#issue-list-menu > .left .mark { + margin-right: 12px; +} +#issue-list-menu > .right .mark { + margin-left: 12px; +} +#issue-list .item { + position: relative; + padding-bottom: 12px; + margin-bottom: 12px; + border-bottom: 1px dashed #AAA; +} +#issue-list .item .title > .title-text { + color: #444; + font-size: 15px; + margin: 0 6px; +} +#issue-list .comment { + color: #666; + position: absolute; + top: 6px; + right: 0; +} +#issue-list .issue-label a { + color: #FFF; +} +#issue-list .desc { + color: #999; +} +#issue-list .desc a { + color: #999; +} +#issue-list .desc a:hover { + color: #03a2ef; +} +#issue-list-pager { + margin: 18px 0 24px 0; + font-size: 14px; +} .org-header-alert .alert { margin-top: 10px; } diff --git a/public/ng/css/ui.css b/public/ng/css/ui.css index a6c218ad89..8d562485ba 100644 --- a/public/ng/css/ui.css +++ b/public/ng/css/ui.css @@ -881,3 +881,30 @@ table td { .table-radius tbody tr:last-child > td:last-child { border-bottom-right-radius: .3em; } +.pager .page { + padding: 2px 6px; + margin: 0 3px; + background-color: #cccccc; + color: #444444; +} +.pager .page:hover, +.pager .page.hover { + background-color: #428bca; + color: #ffffff; +} +.pager .prev, +.pager .next { + padding: 2px 8px; + margin: 0 4px; + background-color: #505050; + color: #fafafa; +} +.pager .prev.invalid, +.pager .next.invalid { + background-color: #eeeeee; + color: #aaaaaa; + cursor: not-allowed; +} +.pager .page-radius { + border-radius: .2em; +} diff --git a/public/ng/less/gogs/issue.less b/public/ng/less/gogs/issue.less index 12cc59fc69..1ab54ee370 100644 --- a/public/ng/less/gogs/issue.less +++ b/public/ng/less/gogs/issue.less @@ -250,4 +250,73 @@ textarea#issue-add-content { height: 34px; } } +} +// issue list menu +#issue-list-menu { + padding: 16px 0 12px 0; + border-bottom: 1px solid #BBB; + margin-bottom: 12px; + .mark { + a { + color: #AAA; + &:hover { + color: #444; + } + } + &.hover { + a { + color: #222; + font-weight: bold; + } + } + } + > .left { + .mark { + margin-right: 12px; + } + } + > .right { + .mark { + margin-left: 12px; + } + } +} +// each issue list item +#issue-list { + .item { + position: relative; + padding-bottom: 12px; + margin-bottom: 12px; + border-bottom: 1px dashed #AAA; + .title > .title-text { + color: #444; + font-size: 15px; + margin: 0 6px; + } + } + .comment { + color: #666; + position: absolute; + top: 6px; + right: 0; + } + .issue-label { + a { + color: #FFF; + } + } + .desc { + color: #999; + a { + color: #999; + &:hover { + color: #03a2ef; + } + } + } +} +// issue list pager +#issue-list-pager { + margin: 18px 0 24px 0; + font-size: 14px; } \ No newline at end of file diff --git a/public/ng/less/ui.less b/public/ng/less/ui.less index 3db8b12cb6..fc7ad3c2fb 100644 --- a/public/ng/less/ui.less +++ b/public/ng/less/ui.less @@ -7,4 +7,5 @@ @import "ui/label"; @import "ui/bread"; @import "ui/alert"; -@import "ui/table"; \ No newline at end of file +@import "ui/table"; +@import "ui/pager"; \ No newline at end of file diff --git a/public/ng/less/ui/pager.less b/public/ng/less/ui/pager.less new file mode 100644 index 0000000000..18e24cd132 --- /dev/null +++ b/public/ng/less/ui/pager.less @@ -0,0 +1,28 @@ +@import "var"; + +.pager{ + .page{ + padding: 2px 6px; + margin: 0 3px; + background-color: @pagerPageBgColor; + color: @pagerPageColor; + &:hover,&.hover{ + background-color: @pagerHoverBgColor; + color: @pagerHoverColor; + } + } + .prev,.next{ + padding: 2px 8px; + margin: 0 4px; + background-color: @pagerDirectionBgColor; + color: @pagerDirectionColor; + &.invalid{ + background-color: @pagerInvalidBgColor; + color: @pagerInvalidColor; + cursor: not-allowed; + } + } + .page-radius{ + border-radius: .2em; + } +} \ No newline at end of file diff --git a/public/ng/less/ui/var.less b/public/ng/less/ui/var.less index e3c5ada633..c9eb162930 100644 --- a/public/ng/less/ui/var.less +++ b/public/ng/less/ui/var.less @@ -81,3 +81,12 @@ @preBgColor:#444; @preFontColor:#FFF; + +@pagerPageColor:#444; +@pagerPageBgColor:#CCC; +@pagerHoverBgColor:#428BCA; +@pagerHoverColor:#FFF; +@pagerInvalidColor:#AAA; +@pagerInvalidBgColor:#EEE; +@pagerDirectionBgColor:#505050; +@pagerDirectionColor:#FAFAFA; diff --git a/templates/repo/issue2/list.tmpl b/templates/repo/issue2/list.tmpl index d2440a3c5e..384371eb04 100644 --- a/templates/repo/issue2/list.tmpl +++ b/templates/repo/issue2/list.tmpl @@ -11,6 +11,61 @@
  • Filter
    • +
    + + +
    + + 1 + 2 + 3 + +
    +
    {{template "ng/base/footer" .}} \ No newline at end of file