Download as
Browse Code »

Commit 1ad174fbcdb7c14eb8fbe9820e1152383f41a89e

Authored by Dmitriy Zaporozhets
1 parent 9f80ab8e
Exists in spb-stable and in 2 other branches 7-0-stable, 7-0-stable-spb

Improve edit page UI/UX 

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Showing 3 changed files with 19 additions and 11 deletions   Show diff stats
app/assets/stylesheets/sections/diff.scss
  Diff comments   View file @1ad174f
... ... @@ -330,3 +330,8 @@
330 330 }
331 331 }
332 332 }
  333 +
  334 +.file-content .diff-file {
  335 + margin: 0;
  336 + border: none;
  337 +}
... ...
app/views/projects/edit_tree/preview.html.haml
  Diff comments   View file @1ad174f
... ... @@ -23,4 +23,4 @@
23 23 %td.new_line= link_to raw(type == "old" ? "&nbsp;" : line_new) , "##{line_code}", id: line_code
24 24 %td.line_content{class: "noteable_line #{type} #{line_code}", "line_code" => line_code}= raw diff_line_content(line)
25 25 - else
26   - %p.nothing_here_message No changes.
  26 + .nothing-here-block No changes.
... ...
app/views/projects/edit_tree/show.html.haml
  Diff comments   View file @1ad174f
1   -%h3.page-title Edit mode
2 1 .file-editor
  2 + %ul.nav.nav-tabs.js-edit-mode
  3 + %li.active
  4 + = link_to 'Edit', '#editor'
  5 + %li
  6 + = link_to editing_preview_title(@blob.name), '#preview', 'data-preview-url' => preview_project_edit_tree_path(@project, @id)
  7 +
3 8 = form_tag(project_edit_tree_path(@project, @id), method: :put, class: "form-horizontal") do
4 9 .file-holder.file
5 10 .file-title
6   - .btn-group.js-edit-mode.left-options
7   - = link_to 'Edit', '#editor', class: 'active hover btn btn-tiny'
8   - = link_to editing_preview_title(@blob.name), '#preview', class: 'btn btn-tiny', 'data-preview-url' => preview_project_edit_tree_path(@project, @id)
9 11 %i.icon-file
10 12 %span.file_name
  13 + %span.monospace.light #{@ref}:
11 14 = @path
12   - %small
13   - on
14   - %strong= @ref
15 15 %span.options
16 16 .btn-group.tree-btn-group
17 17 = link_to "Cancel", @after_edit_path, class: "btn btn-tiny btn-cancel", data: { confirm: leave_edit_message }
18 18 .file-content.code
19 19 %pre.js-edit-mode-pane#editor= @blob.data
20 20 .js-edit-mode-pane#preview.hide
  21 + %center
  22 + %h2
  23 + %i.icon-spinner.icon-spin
21 24  
22 25 .form-group.commit_message-group
23 26 = label_tag 'commit_message', class: "control-label" do
... ... @@ -61,14 +64,14 @@
61 64 paneId = currentLink.attr('href'),
62 65 currentPane = editModePanes.filter(paneId);
63 66  
64   - editModeLinks.removeClass('active hover');
65   - currentLink.addClass('active hover');
  67 + editModeLinks.parent().removeClass('active hover');
  68 + currentLink.parent().addClass('active hover');
66 69 editModePanes.hide();
67 70  
68 71 if (paneId == '#preview') {
  72 + currentPane.fadeIn(200);
69 73 $.post(currentLink.data('preview-url'), { content: editor.getValue() }, function(response) {
70 74 currentPane.empty().append(response);
71   - currentPane.fadeIn(200);
72 75 })
73 76 } else {
74 77 currentPane.fadeIn(200);
... ...