Commit 39834ec6409163e3339ed23ccdc9682932f45c9e

Authored by Riyad Preukschas
1 parent 4d2278e7

Move diff notes into the actual diff content column

app/assets/stylesheets/sections/commits.scss
... ... @@ -176,12 +176,14 @@
176 176 }
177 177 }
178 178 }
179   - .old_line, .new_line {
180   - margin: 0px;
181   - padding: 0px;
182   - border: none;
183   - background: #EEE;
184   - color: #666;
  179 + .new_line,
  180 + .old_line,
  181 + .notes_line {
  182 + margin:0px;
  183 + padding:0px;
  184 + border:none;
  185 + background:#EEE;
  186 + color:#666;
185 187 padding: 0px 5px;
186 188 border-right: 1px solid #ccc;
187 189 text-align: right;
... ... @@ -191,6 +193,13 @@
191 193 moz-user-select: none;
192 194 -khtml-user-select: none;
193 195 user-select: none;
  196 +
  197 + &.notes_line {
  198 + border: 1px solid #ccc;
  199 + border-left: none;
  200 + text-align: center;
  201 + padding: 10px 0;
  202 + }
194 203 a {
195 204 float: left;
196 205 width: 35px;
... ... @@ -218,6 +227,10 @@
218 227 background: #fafafa;
219 228 }
220 229 }
  230 + .notes_content {
  231 + border: 1px solid #ccc;
  232 + border-width: 1px 0;
  233 + }
221 234 }
222 235  
223 236 /** COMMIT BLOCK **/
... ...
app/assets/stylesheets/sections/notes.scss
1 1 /**
2 2 * Notes
3 3 */
4   -#notes-list,
5   -#new-notes-list {
  4 +ul.notes {
6 5 display: block;
7 6 list-style: none;
8 7 margin: 0px;
... ... @@ -81,21 +80,36 @@
81 80 padding-bottom: 5px;
82 81 }
83 82 }
84   -}
85 83  
86   -#notes-list:not(.reversed) .note,
87   -#notes-list:not(.reversed) .discussion,
88   -#new-notes-list:not(.reversed) .note,
89   -#new-notes-list:not(.reversed) .discussion {
90   - border-bottom: 1px solid #eee;
  84 + // paint top or bottom borders depending on notes direction
  85 + &:not(.reversed) .note,
  86 + &:not(.reversed) .discussion {
  87 + border-bottom: 1px solid #eee;
  88 + }
  89 + &.reversed .note,
  90 + &.reversed .discussion {
  91 + border-top: 1px solid #eee;
  92 + }
91 93 }
92   -#notes-list.reversed .note,
93   -#notes-list.reversed .discussion,
94   -#new-notes-list.reversed .note,
95   -#new-notes-list.reversed .discussion {
96   - border-top: 1px solid #eee;
  94 +
  95 +.comment-btn {
  96 + @extend .save-btn;
97 97 }
98 98  
  99 +.diff_file tr.notes_holder {
  100 + font-family: $sansFontFamily;
  101 + font-size: 13px;
  102 + line-height: 18px;
  103 +
  104 + td:last-child {
  105 + background-color: $white;
  106 + padding-top: 0;
  107 + }
  108 +
  109 + .comment-btn {
  110 + margin-top: 8px;
  111 + }
  112 +}
99 113  
100 114 /**
101 115 * Discussion/Note Actions
... ... @@ -225,36 +239,6 @@ p.notify_controls span{
225 239 font-weight: 700;
226 240 }
227 241  
228   -tr.line_notes_row {
229   - border-bottom: 1px solid #DDD;
230   - border-left: 7px solid #2A79A3;
231   -
232   - &.reply {
233   - background: #eee;
234   - border-left: 7px solid #2A79A3;
235   - border-top: 1px solid #ddd;
236   - td {
237   - padding: 7px 10px;
238   - }
239   - a.line_note_reply_link {
240   - border: 1px solid #eaeaea;
241   - @include border-radius(4px);
242   - padding: 3px 10px;
243   - margin-left: 5px;
244   - color: white;
245   - background: #2A79A3;
246   - border-color: #2A79A3;
247   - }
248   - }
249   - ul {
250   - margin: 0;
251   - li {
252   - padding: 0;
253   - border: none;
254   - }
255   - }
256   -}
257   -
258 242 .line_notes_row, .per_line_form { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
259 243  
260 244 .per_line_form {
... ...
app/views/commits/_text_diff.html.haml
... ... @@ -17,7 +17,7 @@
17 17 %td.new_line= link_to raw(type == "old" ? " " : line_new) , "##{line_code}", id: line_code
18 18 %td.line_content{class: "noteable_line #{type} #{line_code}", "line_code" => line_code}= raw "#{line}  "
19 19  
20   - - if @reply_allowed
21   - - comments = @line_notes.select { |n| n.line_code == line_code }.sort_by(&:created_at)
22   - - unless comments.empty?
23   - = render "notes/diff_notes_with_reply", notes: comments
  20 + - if @reply_allowed
  21 + - comments = @line_notes.select { |n| n.line_code == line_code }.sort_by(&:created_at)
  22 + - unless comments.empty?
  23 + = render "notes/diff_notes_with_reply", notes: comments
... ...
app/views/notes/_common_form.html.haml
... ... @@ -16,7 +16,7 @@
16 16  
17 17 .row.note_advanced_opts
18 18 .span3
19   - = f.submit 'Add Comment', class: "btn success submit_note grouped", id: "submit_note"
  19 + = f.submit 'Add Comment', class: "btn comment-btn submit_note grouped", id: "submit_note"
20 20 = link_to 'Preview', preview_project_notes_path(@project), class: 'btn grouped', id: 'preview-link'
21 21 .span4.notify_opts
22 22 %h6.left Notify via email:
... ...
app/views/notes/_create_diff_note.js.haml
... ... @@ -6,7 +6,7 @@
6 6  
7 7 // find the reply button for this line
8 8 // (might not be there if this is the first note)
9   - var trRpl = $("a.line_note_reply_link[data-noteable-type='#{note.noteable_type}'][data-noteable-id='#{note.noteable_id}'][data-line-code='#{note.line_code}']").closest("tr");
  9 + var trRpl = $(".js-note-add-to-diff-line[data-noteable-type='#{note.noteable_type}'][data-noteable-id='#{note.noteable_id}'][data-line-code='#{note.line_code}']").closest("tr");
10 10 if (trRpl.size() == 0) {
11 11 // find the commented line ...
12 12 var trEl = $(".#{note.line_code}").parent();
... ...
app/views/notes/_diff_note.html.haml
... ... @@ -1,5 +0,0 @@
1   -%tr.line_notes_row
2   - %td{colspan: 3}
3   - %ul
4   - = render "notes/note", note: note
5   -
app/views/notes/_diff_notes_with_reply.html.haml
1   -- notes.each do |note|
2   - = render "notes/diff_note", note: note
  1 +%tr.notes_holder
  2 + %td.notes_line{ colspan: 2 }
  3 + %span.btn.disabled
  4 + %i.icon-comment
  5 + = notes.count
  6 + %td.notes_content
  7 + %ul.notes
  8 + = render notes
3 9  
4   --# reply button
5   -- note = notes.first # example note
6   -%tr.line_notes_row.reply
7   - %td{colspan: 3}
8   - = link_to "javascript:;",
9   - class: "line_note_reply_link js-note-add-to-diff-line",
  10 + -# reply button
  11 + - note = notes.first # example note
  12 + %button{ class: "btn comment-btn js-note-add-to-diff-line",
10 13 data: { line_code: note.line_code,
11 14 noteable_type: note.noteable_type,
12 15 noteable_id: note.noteable_id },
13   - title: "Add a comment to this line" do
  16 + title: "Add a comment to this line" }
14 17 %i.icon-comment
15 18 Reply
... ...
app/views/notes/_notes_with_form.html.haml
1   -%ul#notes-list
2   -%ul#new-notes-list
  1 +%ul#notes-list.notes
  2 +%ul#new-notes-list.notes
3 3 .notes-status
4 4  
5 5 - if can? current_user, :write_note, @project
... ...
app/views/notes/_reversed_notes_with_form.html.haml
1 1 - if can? current_user, :write_note, @project
2 2 = render "notes/common_form"
3 3  
4   -%ul.reversed#new-notes-list
5   -%ul.reversed#notes-list
  4 +%ul#new-notes-list.reversed.notes
  5 +%ul#notes-list.reversed.notes
6 6 .notes-status
7 7  
8 8 :javascript
... ...