Added toolbar to comment form

3 files changed, 34 insertions, 24 deletions

diff --git a/app/views/projects/_md_preview.html.haml b/app/views/projects/_md_preview.html.haml
index 32c44338614..4920910fee1 100644
--- a/app/views/projects/_md_preview.html.haml
+++ b/app/views/projects/_md_preview.html.haml
@@ -1,20 +1,19 @@
 .md-area
-  .md-header.clearfix
-    %ul.nav-links.pull-left
+  .md-header
+    %ul.nav-links
       %li.active
         %a.js-md-write-button{ href: "#md-write-holder" }
           Write
       %li
         %a.js-md-preview-button{ href: "#md-preview-holder" }
           Preview
-    .pull-right
-      %a.zen-cotrol.js-zen-enter{ href: "#" }
-        Go full screen
+      %li.pull-right
+        %button.zen-cotrol.zen-control-full.js-zen-enter{ type: 'button' }
+          Go full screen
 
   .md-write-holder
     = yield
-  .md.md-preview-holder.hide
-    .js-md-preview{class: (preview_class if defined?(preview_class))}
+  .md.md-preview-holder.js-md-preview.hide{class: (preview_class if defined?(preview_class))}
 
   - if defined?(referenced_users) && referenced_users
     %div.referenced-users.hide
diff --git a/app/views/projects/_zen.html.haml b/app/views/projects/_zen.html.haml
index efa60c88b14..bddff5cdcbc 100644
--- a/app/views/projects/_zen.html.haml
+++ b/app/views/projects/_zen.html.haml
@@ -1,9 +1,8 @@
-.zennable
-  .zen-backdrop
-    - classes << ' js-gfm-input js-autosize markdown-area'
-    - if defined?(f) && f
-      = f.text_area attr, class: classes, placeholder: "Write a comment or drag your files here..."
-    - else
-      = text_area_tag attr, nil, class: classes, placeholder: "Write a comment or drag your files here..."
-    %a.zen-cotrol.zen-control-leave.js-zen-leave{ href: "#" }
-      = icon('compress')
+.zen-backdrop
+  - classes << ' js-gfm-input js-autosize markdown-area'
+  - if defined?(f) && f
+    = f.text_area attr, class: classes, placeholder: "Write a comment or drag your files here..."
+  - else
+    = text_area_tag attr, nil, class: classes, placeholder: "Write a comment or drag your files here..."
+  %a.zen-cotrol.zen-control-leave.js-zen-leave{ href: "#" }
+    = icon('compress')
diff --git a/app/views/projects/notes/_hints.html.haml b/app/views/projects/notes/_hints.html.haml
index 6e7929bdab0..7f83656146e 100644
--- a/app/views/projects/notes/_hints.html.haml
+++ b/app/views/projects/notes/_hints.html.haml
@@ -1,9 +1,21 @@
-.comment-hints.clearfix
-  .pull-left
+.comment-toolbar.clearfix
+  %button.toolbar-button.js-toolbar-button{ type: 'button', data: { prefix: ':' }, tabindex: '-1' }
+    = icon('smile-o', class: 'toolbar-button-icon')
+    Emoji
+  .toolbar-text
+    Styling with
     = link_to 'Markdown', help_page_path('markdown', 'markdown'), target: '_blank', tabindex: -1
-    tip:
-    = random_markdown_tip
-  .pull-right
-    = link_to '#', class: 'markdown-selector', tabindex: -1 do
-      = icon('paperclip')
-      Attach a file
+    is supported
+  %button.toolbar-button.markdown-selector.pull-right{ type: 'button', tabindex: '-1' }
+    = icon('file-image-o', class: 'toolbar-button-icon')
+    Attach a file
+
+-# .comment-hints.clearfix
+-#   .pull-left
+-#     = link_to 'Markdown', help_page_path('markdown', 'markdown'), target: '_blank', tabindex: -1
+-#     tip:
+-#     = random_markdown_tip
+-#   .pull-right
+-#     = link_to '#', class: 'markdown-selector', tabindex: -1 do
+-#       = icon('paperclip')
+-#       Attach a file