Commit 4ac9dcc2 authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets

Merge branch 'issue-redesign' into 'master'

Issue redesign

* new issue UI
* fixed small font in issue/mr list

See merge request !1258
parents e0da2c35 1240a7e0
......@@ -22,6 +22,10 @@ $brand-info: $gl-info;
$brand-warning: $gl-warning;
$brand-danger: $gl-danger;
$border-radius-base: 3px !default;
$border-radius-large: 5px !default;
$border-radius-small: 2px !default;
//== Scaffolding
//
......
......@@ -177,7 +177,7 @@
margin: 0px;
&:last-child {
border:none
border-bottom: none;
}
&.active {
......@@ -215,3 +215,39 @@
font-size: 16px;
line-height: 24px;
}
@mixin nav-menu {
padding: 0;
margin: 0;
list-style: none;
margin-top: 5px;
height: 56px;
li {
display: inline-block;
a {
padding: 14px;
font-size: 17px;
line-height: 28px;
color: #7f8fa4;
border-bottom: 2px solid transparent;
&:hover, &:active, &:focus {
text-decoration: none;
}
}
&.active a {
color: #4c4e54;
border-bottom: 2px solid #1cacfc;
}
.badge {
font-weight: normal;
background-color: #fff;
background-color: #eee;
color: #78a;
}
}
}
......@@ -27,6 +27,11 @@
border-bottom: 1px solid #e7e9ed;
color: $gl-gray;
&.middle-block {
margin-top: 0;
margin-bottom: 0;
}
&.second-block {
margin-top: -1px;
margin-bottom: 0;
......
......@@ -370,41 +370,11 @@ table {
}
.center-top-menu {
padding: 0;
margin: 0;
list-style: none;
@include nav-menu;
text-align: center;
margin-top: 5px;
margin-bottom: $gl-padding;
height: 56px;
margin-top: -$gl-padding;
padding-top: $gl-padding;
li {
display: inline-block;
a {
padding: 14px;
font-size: 17px;
line-height: 28px;
color: #7f8fa4;
border-bottom: 2px solid transparent;
&:hover, &:active, &:focus {
text-decoration: none;
}
}
&.active a {
color: #4c4e54;
border-bottom: 2px solid #1cacfc;
}
.badge {
font-weight: normal;
background-color: #fff;
background-color: #eee;
color: #78a;
}
}
}
......@@ -5,10 +5,13 @@
*/
.issue-box {
@include border-radius(3px);
display: inline-block;
padding: 4px 13px;
padding: 10px $gl-padding;
font-weight: normal;
margin-right: 5px;
margin-right: 10px;
font-size: $gl-font-size;
&.issue-box-closed {
background-color: $gl-danger;
......@@ -21,7 +24,7 @@
}
&.issue-box-open {
background-color: $gl-success;
background-color: #019875;
color: #FFF;
}
......
......@@ -65,8 +65,11 @@
position: relative;
}
.md-header ul {
.md-header {
ul {
float: left;
margin-bottom: 1px;
}
}
.referenced-users {
......
.timeline {
list-style: none;
padding: 20px 0 20px;
position: relative;
@include basic-list;
&:before {
top: 0;
bottom: 0;
position: absolute;
content: " ";
width: 3px;
background-color: #eeeeee;
margin-left: 29px;
}
.timeline-entry {
position: relative;
margin-top: 5px;
margin-left: 30px;
margin-bottom: 10px;
clear: both;
&:target {
.timeline-entry-inner .timeline-content {
-webkit-animation:target-note 2s linear;
background: $hover;
}
}
.timeline-entry-inner {
position: relative;
margin-left: -20px;
&:before, &:after {
content: " ";
display: table;
}
.timeline-icon {
margin-top: 2px;
background: #fff;
color: #737881;
float: left;
@include border-radius($avatar_radius);
@include box-shadow(0 0 0 3px #EEE);
overflow: hidden;
.avatar {
margin: 0;
padding: 0;
}
}
.timeline-content {
position: relative;
background: $background-color;
padding: 10px 15px;
margin-left: 60px;
> li {
padding: $gl-padding;
border-color: #f1f2f4;
margin-left: -$gl-padding;
margin-right: -$gl-padding;
color: $gl-gray;
border-right: 1px solid #f1f2f4;
img {
max-width: 100%;
.avatar {
margin-right: 15px;
}
&:after {
content: '';
display: block;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 9px 0;
border-color: transparent $background-color transparent transparent;
left: 0;
top: 10px;
margin-left: -9px;
.controls {
padding-top: 10px;
float: right;
}
}
.note-text {
p:last-child {
margin-bottom: 0;
}
}
.system-note .timeline-entry-inner {
.timeline-icon {
background: none;
float: left;
margin-left: 12px;
margin-top: 0;
margin-top: 8px;
@include box-shadow(none);
span {
......
......@@ -4,7 +4,7 @@
}
.zen-enter-link {
color: #888;
color: $gl-gray;
position: absolute;
top: 0px;
right: 4px;
......@@ -13,7 +13,7 @@
.zen-leave-link {
display: none;
color: #888;
color: $gl-text-color;
position: absolute;
top: 10px;
right: 10px;
......
......@@ -25,8 +25,6 @@
}
.issuable-context-title {
font-size: 14px;
line-height: 1.4;
margin-bottom: 5px;
.avatar {
......@@ -34,18 +32,12 @@
}
label {
color: #666;
color: $gl-gray;
font-weight: normal;
margin-right: 4px;
}
}
.issuable-affix .context {
font-size: 13px;
.btn { font-size: 13px; }
}
.project-issuable-filter {
.controls {
float: right;
......@@ -56,3 +48,22 @@
text-align: left;
}
}
.issuable-details {
.page-title {
margin-top: -15px;
padding: 10px 0;
margin-bottom: 0;
color: $gl-gray;
font-size: 16px;
.author {
color: $gl-gray;
}
.issue-id {
font-size: 19px;
color: $gl-text-color;
}
}
}
.issues-list {
.issue {
padding: 10px 15px;
padding: 10px $gl-padding;
position: relative;
.issue-title {
......@@ -11,7 +11,6 @@
.issue-info {
color: $gl-gray;
font-size: 13px;
}
.issue-check {
......@@ -47,10 +46,6 @@
}
}
.participants {
margin-bottom: 20px;
}
.issue-search-form {
margin: 0;
height: 24px;
......
......@@ -89,20 +89,11 @@
}
}
@media(min-width: $screen-sm-max) {
.merge-request .merge-request-tabs{
li {
a {
padding: 15px 40px;
font-size: 14px;
}
}
}
}
.merge-request .merge-request-tabs{
margin-top: 30px;
margin-bottom: 20px;
@include nav-menu;
margin-bottom: -15px;
margin-top: 26px;
text-align: left;
}
.mr_source_commit,
......@@ -137,7 +128,6 @@
.merge-request-info {
color: $gl-gray;
font-size: 13px;
}
}
......
......@@ -72,9 +72,13 @@
.common-note-form {
margin: 0;
background: #F9F9F9;
padding: 5px;
border: 1px solid #DDD;
background: #f8fafc;
padding: $gl-padding;
margin-left: -$gl-padding;
margin-right: -$gl-padding;
border-right: 1px solid #f1f2f4;
border-top: 1px solid #f1f2f4;
margin-bottom: -$gl-padding;
}
.note-form-actions {
......
.md-area
.md-header.clearfix
%ul.nav.nav-tabs
%ul.center-top-menu
%li.active
= link_to '#md-write-holder', class: 'js-md-write-button', tabindex: '-1' do
Write
......
......@@ -7,21 +7,24 @@
= render 'shared/show_aside'
.row
%section.col-md-9
.gray-content-block.second-block
.row
.col-md-9
.votes-holder.pull-right
#votes= render 'votes/votes_block', votable: @issue
.participants
%span= pluralize(@participants.count, 'participant')
- @participants.each do |participant|
= link_to_member(@project, participant, name: false, size: 24)
.col-md-3
%span.slead.has_tooltip{title: 'Cross-project reference'}
= cross_project_reference(@project, @issue)
.row
%section.col-md-9
.voting_notes#notes= render 'projects/notes/notes_with_form'
%aside.col-md-3
.issuable-affix
.clearfix
%span.slead.has_tooltip{title: 'Cross-project reference'}
= cross_project_reference(@project, @issue)
%hr
.context
= render 'shared/issuable/context', issuable: @issue
......
......@@ -41,4 +41,4 @@
= issue.task_status
.pull-right.issue-updated-at
%small updated #{time_ago_with_tooltip(issue.updated_at, placement: 'bottom', html_class: 'issue_update_ago')}
%span updated #{time_ago_with_tooltip(issue.updated_at, placement: 'bottom', html_class: 'issue_update_ago')}
- page_title "#{@issue.title} (##{@issue.iid})", "Issues"
.issue
.issue-details.issuable-details
%h4.page-title
.page-title
.issue-box{ class: issue_box_class(@issue) }
- if @issue.closed?
Closed
- else
Open
Issue ##{@issue.iid}
%small.creator
· created by #{link_to_member(@project, @issue.author)}
%span.issue-id Issue ##{@issue.iid}
%span.creator
· created by #{link_to_member(@project, @issue.author, size: 24)}
·
= time_ago_with_tooltip(@issue.created_at, placement: 'bottom', html_class: 'issue_created_ago')
- if @issue.updated_at != @issue.created_at
%span
......@@ -32,7 +33,7 @@
= icon('pencil-square-o')
Edit
%hr
.gray-content-block.middle-block
%h2.issue-title
= gfm escape_once(@issue.title)
%div
......@@ -44,6 +45,5 @@
%textarea.hidden.js-task-list-field
= @issue.description
%hr
.issue-discussion
= render 'projects/issues/discussion'
......@@ -7,18 +7,21 @@
= render 'shared/show_aside'
.row
%section.col-md-9
.gray-content-block.second-block
.row
.col-md-9
.votes-holder.pull-right
#votes= render 'votes/votes_block', votable: @merge_request
= render "projects/merge_requests/show/participants"
.col-md-3
%span.slead.has_tooltip{:"data-original-title" => 'Cross-project reference'}
= cross_project_reference(@project, @merge_request)
.row
%section.col-md-9
= render "projects/notes/notes_with_form"
%aside.col-md-3
.issuable-affix
.clearfix
%span.slead.has_tooltip{:"data-original-title" => 'Cross-project reference'}
= cross_project_reference(@project, @merge_request)
%hr
.context
= render 'shared/issuable/context', issuable: @merge_request
......
......@@ -43,4 +43,4 @@
= merge_request.task_status
.pull-right.hidden-xs
%small updated #{time_ago_with_tooltip(merge_request.updated_at, placement: 'bottom', html_class: 'merge_request_updated_ago')}
%span updated #{time_ago_with_tooltip(merge_request.updated_at, placement: 'bottom', html_class: 'merge_request_updated_ago')}
......@@ -5,10 +5,8 @@
.merge-request{'data-url' => merge_request_path(@merge_request)}
.merge-request-details.issuable-details
= render "projects/merge_requests/show/mr_title"
%hr
= render "projects/merge_requests/show/mr_box"
%hr
.append-bottom-20.mr-source-target
.append-bottom-20.mr-source-target.prepend-top-default
- if @merge_request.open?
.pull-right
- if @merge_request.source_branch_exists?
......@@ -39,7 +37,7 @@
= link_to "command line", "#modal_merge_info", class: "how_to_merge_link vlink", title: "How To Merge", "data-toggle" => "modal"
- if @commits.present?
%ul.nav.nav-tabs.merge-request-tabs
%ul.merge-request-tabs
%li.notes-tab
= link_to namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: {target: '#notes', action: 'notes', toggle: 'tab'} do
= icon('comments')
......
%h2.issue-title
.gray-content-block.middle-block
%h2.issue-title
= gfm escape_once(@merge_request.title)
%div
%div
- if @merge_request.description.present?
.description{class: can?(current_user, :update_merge_request, @merge_request) ? 'js-task-list-container' : ''}
.wiki
......
%h4.page-title
.page-title
.issue-box{ class: issue_box_class(@merge_request) }
= @merge_request.state_human_name
Merge Request ##{@merge_request.iid}
%small.creator
%span.issue-id Merge Request ##{@merge_request.iid}
%span.creator
·
created by #{link_to_member(@project, @merge_request.author, size: 24)}
·
created by #{link_to_member(@project, @merge_request.author)}
= time_ago_with_tooltip(@merge_request.created_at)
- if @merge_request.updated_at != @merge_request.created_at
%span
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment