Design improved

app/assets/stylesheets/sections/editor.scss

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

app/views/tree/edit.html.haml

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