coolaj86
/
gitroast
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

pull request page ui review, upgrade octicon icons

This commit is contained in:
fuxiaohei 2014-09-23 22:28:03 +08:00
parent b92cac7038
commit 60c65415dd
9 changed files with 343 additions and 228 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
public/ng/css/gogs.css
View File

@ -728,7 +728,6 @@ ol.linenums {
} }
#dashboard { #dashboard {
padding: 24px 0; padding: 24px 0;
margin-bottom: 60px;
} }
#dashboard-sidebar .panel-header h4 { #dashboard-sidebar .panel-header h4 {
margin: 0; margin: 0;
@ -1608,12 +1607,16 @@ The register and sign-in page style
background-color: #FFF; background-color: #FFF;
border-color: #DDD; border-color: #DDD;
} }
.pr-title {
padding: 4px 0;
}
.pr-title .pr-num { .pr-title .pr-num {
font-weight: normal; font-weight: normal;
color: #888; color: #888;
} }
.pr-meta { .pr-meta {
color: #888; color: #888;
padding: 4px 0 8px 0;
} }
.pr-meta .pr-author { .pr-meta .pr-author {
margin: 0 8px; margin: 0 8px;
@ -1687,7 +1690,7 @@ The register and sign-in page style
.issue-line, .issue-line,
.issue-merge, .issue-merge,
.issue-add-comment { .issue-add-comment {
margin-bottom: 16px; margin-bottom: 24px;
} }
.issue-comment .author-avatar img { .issue-comment .author-avatar img {
margin-right: 12px; margin-right: 12px;
@ -1791,6 +1794,7 @@ textarea#issue-add-content {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
height: 120px; height: 120px;
resize: vertical;
} }
.org-header-alert .alert { .org-header-alert .alert {
margin-top: 10px; margin-top: 10px;
@ -1825,7 +1829,11 @@ textarea#issue-add-content {
color: #d9453d; color: #d9453d;
} }
#org-header > div > .menu-line > li.right > a .octicon { #org-header > div > .menu-line > li.right > a .octicon {
margin-right: 6px; margin-right: 4px;
}
#org-header > div > .menu-line > li.right > a .label {
margin-left: 4px;
font-size: .6em;
} }
#org-header > div > .menu-line > li.right .current { #org-header > div > .menu-line > li.right .current {
border-bottom: 2px solid #D26911; border-bottom: 2px solid #D26911;

20
public/ng/fonts/octicons.css vendored
View File

@ -14,22 +14,20 @@
.mega-octicon is optimized for 32px but can be used larger. .mega-octicon is optimized for 32px but can be used larger.
*/ */
.octicon { .octicon, .mega-octicon {
font: normal normal 16px octicons; font: normal normal normal 16px/1 octicons;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.mega-octicon {
font: normal normal 32px octicons;
line-height: 1;
display: inline-block; display: inline-block;
text-decoration: none; text-decoration: none;
text-rendering: auto;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} }
.mega-octicon { font-size: 32px; }
.octicon-alert:before { content: '\f02d'} /*  */ .octicon-alert:before { content: '\f02d'} /*  */
.octicon-alignment-align:before { content: '\f08a'} /*  */ .octicon-alignment-align:before { content: '\f08a'} /*  */

BIN
public/ng/fonts/octicons.eot
View File

Binary file not shown.

BIN
public/ng/fonts/octicons.ttf
View File

Binary file not shown.

BIN
public/ng/fonts/octicons.woff
View File

Binary file not shown.

1
public/ng/less/gogs/dashboard.less
View File

@ -43,7 +43,6 @@
} }
#dashboard { #dashboard {
padding: 24px 0; padding: 24px 0;
margin-bottom: 60px;
} }
// dashboard sidebar contains contributed repositories panel, // dashboard sidebar contains contributed repositories panel,
// and my repositories panel // and my repositories panel

23
public/ng/less/gogs/issue.less
View File

@ -1,19 +1,15 @@
@import "../ui/var"; @import "../ui/var";
.repo-issue-wrapper { .repo-issue-wrapper {
padding: 18px 0; padding: 18px 0;
} }
.pr-main { .pr-main {
padding-right: 40px; padding-right: 40px;
box-sizing: border-box; box-sizing: border-box;
} }
.pr-sidebar { .pr-sidebar {
border-left: 1px solid #DDD; border-left: 1px solid #DDD;
box-sizing: border-box; box-sizing: border-box;
} }
#pr-sidebar-nav { #pr-sidebar-nav {
margin-top: 6px; margin-top: 6px;
li { li {
@ -39,16 +35,16 @@
} }
} }
} }
.pr-title { .pr-title {
.pr-num { .pr-num {
font-weight: normal; font-weight: normal;
color: #888; color: #888;
} }
padding: 4px 0;
} }
.pr-meta { .pr-meta {
color: #888; color: #888;
padding: 4px 0 8px 0;
.pr-author { .pr-author {
margin: 0 8px; margin: 0 8px;
color: #444; color: #444;
@ -62,7 +58,6 @@
padding: 4px 6px; padding: 4px 6px;
} }
} }
.pr-nav { .pr-nav {
border-bottom: 1px solid #DDD; border-bottom: 1px solid #DDD;
margin-top: 16px; margin-top: 16px;
@ -89,7 +84,6 @@
} }
} }
} }
.diff-bar { .diff-bar {
.diff-add { .diff-add {
color: @btnGreenColor; color: @btnGreenColor;
@ -114,26 +108,22 @@
border-bottom-left-radius: .2em; border-bottom-left-radius: .2em;
} }
} }
#pr-commit, #pr-commit,
#pr-file-diff, #pr-file-diff,
#issue-add-comment-preview { #issue-add-comment-preview {
display: none; display: none;
} }
#pr-conversation-list { #pr-conversation-list {
padding-right: 30px; padding-right: 30px;
box-sizing: border-box; box-sizing: border-box;
} }
.issue-comment, .issue-comment,
.issue-commit, .issue-commit,
.issue-line, .issue-line,
.issue-merge, .issue-merge,
.issue-add-comment { .issue-add-comment {
margin-bottom: 16px; margin-bottom: 24px;
} }
.issue-comment { .issue-comment {
.author-avatar { .author-avatar {
img { img {
@ -165,7 +155,6 @@
} }
} }
} }
.issue-commit { .issue-commit {
line-height: 32px; line-height: 32px;
i, .author-avatar img { i, .author-avatar img {
@ -181,7 +170,6 @@
line-height: 24px; line-height: 24px;
} }
} }
.issue-merge { .issue-merge {
.ico { .ico {
width: 40px; width: 40px;
@ -202,7 +190,6 @@
font-size: 13px; font-size: 13px;
} }
} }
.issue-merge-ok { .issue-merge-ok {
.ico { .ico {
background-color: #65AD4E; background-color: #65AD4E;
@ -217,12 +204,10 @@
color: darken(#65AD4E, 10%); color: darken(#65AD4E, 10%);
} }
} }
.issue-line { .issue-line {
height: 4px; height: 4px;
background-color: #E6E6E6; background-color: #E6E6E6;
} }
.issue-add-comment { .issue-add-comment {
.panel { .panel {
margin-left: 60px; margin-left: 60px;
@ -254,9 +239,9 @@
} }
} }
} }
textarea#issue-add-content { textarea#issue-add-content {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
height: 120px; height: 120px;
resize: vertical;
} }

378
public/ng/less/gogs/organization.less
View File

@ -1,229 +1,233 @@
@import "../ui/var"; @import "../ui/var";
.org-header-alert .alert { .org-header-alert .alert {
margin-top: 10px; margin-top: 10px;
} }
.org-header { .org-header {
padding: 16px 0; padding: 16px 0;
background-color: #FFF; background-color: #FFF;
border-bottom: 1px solid #DDD; border-bottom: 1px solid #DDD;
img { img {
padding-right: 10px; padding-right: 10px;
} }
} }
#org-home-header { #org-home-header {
min-height: 100px; min-height: 100px;
} }
#org-header { #org-header {
height: 48px; height: 48px;
.org-name { .org-name {
padding-left: 10px; padding-left: 10px;
font-size: 1.4em; font-size: 1.4em;
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
margin-bottom: 0; margin-bottom: 0;
} }
> div { > div {
> .menu-line { > .menu-line {
> li { > li {
&.right { &.right {
> a { > a {
font-size: 1.2em; font-size: 1.2em;
color: @dashboardHeaderLinkColor; color: @dashboardHeaderLinkColor;
&:hover { &:hover {
background-color: transparent; background-color: transparent;
color: @dashboardHeaderLinkHoverColor; color: @dashboardHeaderLinkHoverColor;
} }
.octicon { .octicon {
margin-right: 6px; margin-right: 4px;
} }
} .label{
.current { margin-left: 4px;
border-bottom: 2px solid #D26911; font-size: .6em;
} }
} }
} .current {
} border-bottom: 2px solid #D26911;
} }
}
}
}
}
} }
#org-home-header-info { #org-home-header-info {
padding-top: 10px; padding-top: 10px;
h2 { h2 {
font-size: 30px; font-size: 30px;
} }
ul { ul {
list-style: none; list-style: none;
li { li {
float: left; float: left;
padding-right: 5px; padding-right: 5px;
} }
} }
} }
#org-home-repo-list { #org-home-repo-list {
padding: 10px 0; padding: 10px 0;
} }
#org-repo-list { #org-repo-list {
padding: 10px 0; padding: 10px 0;
.org-repo-item { .org-repo-item {
border-top: 1px solid #eee; border-top: 1px solid #eee;
padding: 30px 20px; padding: 30px 20px;
.org-repo-status { .org-repo-status {
list-style: none; list-style: none;
color: #888; color: #888;
li { li {
float: left; float: left;
margin-right: 6px; margin-right: 6px;
} }
} }
h2 { h2 {
margin-bottom: 5px; margin-bottom: 5px;
} }
.org-repo-description { .org-repo-description {
margin: 0; margin: 0;
font-size: 14px; font-size: 14px;
color: #666; color: #666;
} }
.org-repo-updated { .org-repo-updated {
font-size: 12px; font-size: 12px;
display: block; display: block;
margin: 5px 0 0; margin: 5px 0 0;
color: #808080; color: #808080;
} }
} }
} }
.org-sidebar { .org-sidebar {
margin: -80px 0 0 20px; margin: -80px 0 0 20px;
.panel-footer { .panel-footer {
padding: .8em 1.2em; padding: .8em 1.2em;
} }
.member-avatar-group { .member-avatar-group {
padding: 15px; padding: 15px;
img { img {
width: 59px; width: 59px;
height: 59px; height: 59px;
border-radius: 3px; border-radius: 3px;
} }
} }
} }
#org-home-team-list { #org-home-team-list {
padding: 0 15px; padding: 0 15px;
ul { ul {
list-style: none; list-style: none;
padding-top: 10px; padding-top: 10px;
li { li {
padding: 10px 0; padding: 10px 0;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
&:last-child { &:last-child {
border-bottom: 0; border-bottom: 0;
} }
} }
} }
} }
.team-name { .team-name {
display: block; display: block;
font-size: 14px; font-size: 14px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.team-meta { .team-meta {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
color: #777; color: #777;
} }
.org-toolbar { .org-toolbar {
padding: 10px 0; padding: 10px 0;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
#org-member-list { #org-member-list {
.org-member-item { .org-member-item {
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
padding: 15px 20px; padding: 15px 20px;
.member-name { .member-name {
padding-left: 15px; padding-left: 15px;
} }
ul { ul {
list-style: none; list-style: none;
li { li {
text-align: center; text-align: center;
display: inline-block; display: inline-block;
} }
} }
} }
} }
.invite-box { .invite-box {
padding: 50px 0; padding: 50px 0;
min-height: 130px; min-height: 130px;
margin: 0 auto; margin: 0 auto;
width: 50%; width: 50%;
input { input {
width: 300px; width: 300px;
} }
} }
#org-member-list-block { #org-member-list-block {
padding-top: 2px; padding-top: 2px;
} }
.org-team-list { .org-team-list {
.org-team-list-item { .org-team-list-item {
float: left; float: left;
padding: 15px; padding: 15px;
width: 555px; width: 555px;
.member-avatar-group { .member-avatar-group {
padding: 5px 15px; padding: 5px 15px;
img { img {
width: 38px; width: 38px;
height: 38px; height: 38px;
border-radius: 3px; border-radius: 3px;
} }
} }
} }
} }
#team-create-form { #team-create-form {
.note { .note {
margin-left: 153px; margin-left: 153px;
} }
} }
#org-team-card { #org-team-card {
.desc { .desc {
font-size: 14px; font-size: 14px;
padding: 10px 20px; padding: 10px 20px;
} }
.team-stats { .team-stats {
padding: 0 20px 10px 20px; padding: 0 20px 10px 20px;
text-transform: uppercase; text-transform: uppercase;
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
} }
.panel-footer { .panel-footer {
padding: 10px 20px; padding: 10px 20px;
} }
} }
#team-repositories-list, #team-repositories-list,
#team-members-list { #team-members-list {
.panel-body .search { .panel-body .search {
padding: 4px 0 10px 10px; padding: 4px 0 10px 10px;
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
} }
li { li {
&.collab { &.collab {
padding-top: 10px !important; padding-top: 10px !important;
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
} }
&:last-child { &:last-child {
border-bottom: 0 !important; border-bottom: 0 !important;
} }
} }
} }
#team-repositories-list { #team-repositories-list {
li { li {
a .octicon { a .octicon {
color: #888; color: #888;
} }
.member { .member {
color: @linkColor; color: @linkColor;
font-size: 14px; font-size: 14px;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
} }
} }
} }

135
templates/repo/pulls.tmpl
View File

@ -1,9 +1,130 @@
{{template "base/head" .}} {{template "ng/base/head" .}}
{{template "base/navbar" .}} {{template "ng/base/header" .}}
{{template "repo/nav" .}} <div id="repo-wrapper">
{{template "repo/toolbar" .}} {{template "repo/header" .}}
<div id="body" class="container"> <div class="clear container repo-issue-wrapper repo-pr">
<div id="source"> <div class="pr-main grid-11-12 left">
<div class="pr-title clear">
<h2 class="pr-title grid-5-6 left">Fix: Repo Name can not be converted to lower in some cases <span class="pr-num">#256</span></h2>
<div class="pr-title-btn grid-1-6 right text-right">
<button class="btn btn-gray btn-radius">Edit</button>&nbsp;&nbsp;
<a href="#"><button class="btn btn-green btn-radius">New Issue</button></a>
</div>
</div>
<div class="pr-meta">
<button class="btn btn-small btn-green btn-radius">
<i class="octicon octicon-git-pull-request"></i> Open
</button>
<span class="msg">
<a href="#" class="text-bold pr-author">eryx</a>wants to merge 2 commits into <span class="pr-branch label label-gray radius">gogits:master</span> from <span class="pr-branch label label-gray radius">unknown repository</span>
</span>
</div>
<div class="pr-nav clear">
<ul class="menu menu-line left" id="pr-nav">
<li class="current js-tab-nav js-tab-nav-show" data-tab-target="#pr-conversation"><a href="#"><i class="octicon octicon-comment"></i>conversations
<span class="label label-gray label-radius">5</span>
</a></li>
<li class="js-tab-nav" data-tab-target="#pr-commit"><a href="#"><i class="octicon octicon-git-commit"></i>commits
<span class="label label-gray label-radius">2</span>
</a></li>
<li class="js-tab-nav" data-tab-target="#pr-file-diff"><a href="#"><i class="octicon octicon-file-code"></i>files
<span class="label label-gray label-radius">3</span>
</a></li>
</ul>
<div class="diff-bar right">
<span class="diff-add">+12</span>
<span class="inline-block diff-status">
<span class="block diff-status-inner"></span>
</span>
<span class="diff-delete">-7</span>
</div>
</div>
<div id="pr-conversation" class="js-tab-show clear">
<div id="pr-conversation-list" class="left grid-5-6">
<div class="issue-comment clear">
<a class="author-avatar" href="#"><img class="avatar-40 radius" src="https://avatars2.githubusercontent.com/u/275347?v=1&s=96" alt=""/></a>
<div class="panel panel-radius">
<p class="panel-header clear"><a class="author-name" href="#">eryx</a>
<span class="date">7 days ago</span>
<span class="action right">
<span class="label label-black label-radius">owner</span>
<a href="#"><i class="octicon octicon-pencil"></i></a>
<a href="#"><i class="octicon octicon-x"></i></a>
</span>
</p>
<div class="panel-content content markdown">just like github.com, the RepoName can not be converted to lower in the case of backend data storage, or frontend clone link display.</div>
</div>
</div>
<div class="issue-commit clear">
<i class="mega-octicon octicon-git-commit left"></i>
<a class="author-avatar left" href="#"><img class="avatar-24 radius" src="https://avatars2.githubusercontent.com/u/275347?v=1&s=96" alt=""/></a>
<a class="sha right" href="#">8e259ba</a>
<span class="message">Fix: Repo Name can not be converted to lower in the case of backend data storage, or frontend clone link display. or frontend clone link display or frontend clone link display.</span>
</div>
<div class="issue-line"></div>
<div class="issue-merge issue-merge-ok clear">
<span class="inline-block radius ico"><i class="mega-octicon octicon-git-pull-request"></i></span>
<div class="panel panel-radius">
<p class="panel-header clear">
<i class="octicon octicon-check"></i><strong>All is well !</strong>
</p>
<div class="panel-content content clear">
<div class="message left"><strong>This pull request can be automatically merged.</strong><br/>
You can also merge branches on the <a href="#">command line</a>.</div>
<button class="btn btn-green right btn-radius">
<i class="octicon octicon-git-merge"></i>
Merge Pull Request
</button>
</div>
</div>
</div>
<div class="issue-add-comment clear">
<a class="author-avatar" href="#"><img class="avatar-40 radius" src="https://avatars2.githubusercontent.com/u/275347?v=1&s=96" alt=""/></a>
<div class="panel panel-radius">
<div class="panel-header">
<ul class="menu menu-line add-nav">
<li class="js-tab-nav js-tab-nav-show" data-tab-target="#issue-add-comment-form"><a href="#">Write</a></li>
<li class="js-tab-nav" data-tab-target="#issue-add-comment-preview"><a href="#">Preview</a></li>
</ul>
</div>
<div class="panel-content content">
<form id="issue-add-comment-form" action="#" method="post">
<textarea class="ipt ipt-radius" name="content" id="issue-add-content"></textarea>
<p class="submit text-right">
<button class="btn btn-gray btn-radius text-bold" name="submit" value="close">Close pull request</button>&nbsp;&nbsp;
<button class="btn btn-green btn-radius text-bold" name="submit" value="comment">Comment</button>
</p>
</form>
<div id="issue-add-comment-preview">
preview
</div>
</div>
</div>
</div>
</div>
<div id="pr-conversation-sidebar" class="left grid-1-6">
1-4
</div>
</div>
<div id="pr-commit">commit</div>
<div id="pr-file-diff">file diff</div>
</div>
<div class="pr-sidebar grid-1-12 right">
<ul class="menu menu-vertical" id="pr-sidebar-nav">
<li><a href="#" class="btn-right-radius"><i class="octicon octicon-code"></i>
<span class="right">code</span></a></li>
<li class="border-bottom"></li>
<li><a href="#" class="btn-right-radius"><i class="octicon octicon-issue-opened"></i>
<span class="num right label label-blue label-radius">12</span>
</a></li>
<li class="current"><a href="#" class="btn-right-radius"><i class="octicon octicon-git-pull-request"></i>
<span class="num right label label-black label-radius">12</span>
</a></li>
<li class="border-bottom"></li>
<li><a href="#" class="btn-right-radius"><i class="octicon octicon-tools"></i></a></li>
</ul>
</div>
</div> </div>
</div> </div>
{{template "base/footer" .}} </div>
{{template "ng/base/footer" .}}