Design improved

app/assets/stylesheets/sections/editor.scss

@@ -1,14 +1,14 @@
 .file-editor {
-  
   #editor{
     height: 500px;
-    width: 90%;
+    width: 100%;
     position: relative;
-    margin-bottom: 20px;
   }
-  textarea{
+  .editor-commit-comment {
-    display: block;
+    padding-top:20px;
-    width: 40%;
+    textarea {
-    margin: 10px 0 10px 0;
+      width: 50%;
+      margin-left: 20px;
+    }
   }
 }

app/views/tree/edit.html.haml

@@ -1,17 +1,20 @@
 .file-editor
-  .file_name
+  = form_tag(project_tree_path(@project, @id), :method => :put) do
-    File: 
+    .file_holder
-  %span.file_name
+      .file_title
-    = @tree.path.force_encoding('utf-8')
+        %i.icon-file
-    %br
+        = @tree.path.force_encoding('utf-8')
-    = form_tag(project_tree_path(@project, @id), :method => :put) do
+      .file_content.code
-      #editor
+        #editor= @tree.data
-        = @tree.data
+
+    .editor-commit-comment
+      = label_tag 'text-commit' do
+        %p.slead Commit message
+      = text_area_tag 'text_commit'
+    .form-actions
       = hidden_field_tag 'last_commit', @last_commit
       = hidden_field_tag 'content'
-      
+      = submit_tag "Save", class: 'btn save-btn'
-      = text_area_tag 'text_commit'
-      = submit_tag "Save"
 
 :javascript
   var editor = ace.edit("editor");