diff --git a/app/assets/stylesheets/pages/merge_conflicts.scss b/app/assets/stylesheets/pages/merge_conflicts.scss index ab5a2570827..fe116311fff 100644 --- a/app/assets/stylesheets/pages/merge_conflicts.scss +++ b/app/assets/stylesheets/pages/merge_conflicts.scss @@ -19,7 +19,6 @@ $unselected_line: #f8f8f8; min-height: 19px; } - .header.line_content, .diff-line-num { &.origin { background-color: $origin_gutter; @@ -62,65 +61,6 @@ $unselected_line: #f8f8f8; } } - - .head { - .header, .diff-line-num { - background-color: $head_gutter; - } - - td { - background-color: $head_line; - } - - &.selected { - .header, .diff-line-num { - background-color: $selected_head_gutter; - } - - td { - background-color: $selected_head_line; - } - } - } - - .origin { - .header, .diff-line-num { - background-color: $origin_gutter; - } - - td { - background-color: $origin_line; - } - - &.selected { - .header, .diff-line-num { - background-color: $selected_origin_gutter; - } - - td { - background-color: $selected_origin_line; - } - } - } - - .origin, .head { - &.unselected { - .header, .diff-line-num { - background-color: $unselected_gutter; - } - - td { - background-color: $unselected_line; - } - } - } - - .parallel .header { - button { - right: 10px; - } - } - .line_content.header { position: relative; @@ -130,7 +70,7 @@ $unselected_line: #f8f8f8; background: #fff; font-size: 10px; position: absolute; - right: 20px; + right: 10px; height: 17px; line-height: 4px; // FIXME: 4px? top: 1px; diff --git a/app/views/projects/merge_requests/conflicts.html.haml b/app/views/projects/merge_requests/conflicts.html.haml index 81c87afb98d..04233c6210f 100644 --- a/app/views/projects/merge_requests/conflicts.html.haml +++ b/app/views/projects/merge_requests/conflicts.html.haml @@ -7,6 +7,14 @@ = render 'shared/issuable/sidebar', issuable: @merge_request + +- class_bindings = "{ | + 'head': line.isHead, | + 'origin': line.isOrigin, | + 'match': line.hasMatch, | + 'selected': line.isSelected, | + 'unselected': line.isUnselected }" + #conflicts{"v-cloak" => "true"} .loading{"v-if" => "isLoading"} %i.fa.fa-spinner.fa-spin @@ -35,6 +43,7 @@ into %strong {{conflictsData.target_branch}} + .files-wrapper{"v-if" => "!isLoading && !hasError"} .files{"v-show" => "isParallel"} .diff-file.file-holder.conflict.parallel-view{"v-for" => "file in conflictsData.files"} @@ -51,36 +60,19 @@ %template{"v-for" => "line in section"} %template{"v-if" => "line.isHeader"} - %td.diff-line-num.header{":class" => "{ | - 'head': line.isHead, | - 'origin': line.isOrigin, | - 'selected': line.isSelected, | - 'unselected': line.isUnselected}"} - %td.line_content.header{":class" => "{ | - 'head': line.isHead, | - 'origin': line.isOrigin, | - 'selected': line.isSelected, | - 'unselected': line.isUnselected}"} + %td.diff-line-num.header{":class" => "#{class_bindings}"} + %td.line_content.header{":class" => "#{class_bindings}"} %strong {{line.richText}} %button.btn{"@click" => "handleSelected(line.id, line.section)"} {{line.buttonTitle}} %template{"v-if" => "!line.isHeader"} - %td.diff-line-num.old_line{":class" => "{ | - 'head': line.isHead, | - 'origin': line.isOrigin, | - 'match': line.hasMatch, | - 'selected': line.isSelected, | - 'unselected': line.isUnselected }"} + %td.diff-line-num.old_line{":class" => "#{class_bindings}"} {{line.lineNumber}} - %td.line_content.parallel{":class" => "{ | - 'head': line.isHead, | - 'origin': line.isOrigin, | - 'match': line.hasMatch, | - 'selected': line.isSelected, | - 'unselected': line.isUnselected }"} + %td.line_content.parallel{":class" => "#{class_bindings}"} {{{line.richText}}} + .files{"v-show" => "!isParallel"} .diff-file.file-holder.conflict.inline-view{"v-for" => "file in conflictsData.files"} .file-title @@ -91,32 +83,27 @@ View file @{{conflictsData.shortCommitSha}} .diff-content.diff-wrap-lines - .diff-wrap-lines.code.file-content.js-syntax-highlight.white + .diff-wrap-lines.code.file-content.js-syntax-highlight %table - %tr.line_holder{"v-for" => "line in file.inlineLines", | - ":class" => "{ | - 'head': line.isHead, | - 'origin': line.isOrigin, | - 'match': line.hasMatch, | - 'selected': line.isSelected, | - 'unselected': line.isUnselected }"} + %tr.line_holder.diff-inline{"v-for" => "line in file.inlineLines"} %template{"v-if" => "!line.isHeader"} - %td.diff-line-num.new_line + %td.diff-line-num.new_line{":class" => "#{class_bindings}"} %a {{line.new_line}} - %td.diff-line-num.old_line + %td.diff-line-num.old_line{":class" => "#{class_bindings}"} %a {{line.old_line}} - %td.line_content + %td.line_content{":class" => "#{class_bindings}"} {{{line.richText}}} %template{"v-if" => "line.isHeader"} - %td.diff-line-num.header - %td.diff-line-num.header - %td.line_content.header + %td.diff-line-num.header{":class" => "#{class_bindings}"} + %td.diff-line-num.header{":class" => "#{class_bindings}"} + %td.line_content.header{":class" => "#{class_bindings}"} %strong {{{line.richText}}} %button.btn{"@click" => "handleSelected(line.id, line.section)"} {{line.buttonTitle}} + .content-block.oneline-block.files-changed %strong.resolved-count {{resolvedCount}} of