Changed style button. Add margin top progress bar.

app/assets/javascripts/forms.js.coffee

@@ -34,7 +34,6 @@ App.Forms =
       i++
 
   initialize: ->
-    console.log 'initialize forms'
     App.Forms.disableEnter()
     App.Forms.submitOnChange()
     App.Forms.toggleLink()

app/assets/stylesheets/documentable.scss

@@ -1,34 +1,49 @@
-.progress-bar {
-  background-color: transparent;
-  height: 5px;
-  width: 100%;
-  z-index: 666000555;
-}
+.document{
+  .button{
+    font-weight: normal;
+  }
 
-.loading-bar {
-  height: 5px;
-  width: 0px;
-  z-index: 666000666;
-  -webkit-transition:width 500ms ease-out, height 500ms ease-out;
-  -moz-transition:width 500ms ease-out, height 500ms ease-out;
-  -o-transition:width 500ms ease-out, height 500ms ease-out;
-  transition:width 500ms ease-out, height 500ms ease-out;
-  &.uploading{
-    background-color: #bbb;
-  }
-  &.complete{
-    background-color: #0f0;
+  .progress-bar {
+    background-color: transparent;
+    height: 5px;
     width: 100%;
+    z-index: 666000555;
+  }
+
+  .file-name{
+    margin-top:15px;
+  }
+
+  .loading-bar {
+    height: 5px;
+    width: 0px;
+    z-index: 666000666;
+    -webkit-transition:width 500ms ease-out, height 500ms ease-out;
+    -moz-transition:width 500ms ease-out, height 500ms ease-out;
+    -o-transition:width 500ms ease-out, height 500ms ease-out;
+    transition:width 500ms ease-out, height 500ms ease-out;
+
+    &.uploading {
+      background-color: #bbb;
+    }
+
+    &.complete {
+      background-color: #0f0;
+      width: 100%;
+      margin-top: $line-height * 2;
+    }
+
+    &.errors {
+      background-color: #f00;
+      width: 100%;
+    }
+  }
+
+  .loading-bar.no-transition {
+    -webkit-transition:none;
+    -moz-transition:none;
+    -o-transition:none;
+    transition:none;
   }
-  &.errors{
-    background-color: #f00;
-    width: 100%;
-  }
-}
 
-.loading-bar.no-transition {
-  -webkit-transition:none;
-  -moz-transition:none;
-  -o-transition:none;
-  transition:none;
 }

app/views/documents/_nested_document.html.erb

@@ -44,17 +44,17 @@
                                                    method: :delete,
                                                    remote: true,
                                                    data: { confirm: t('documents.actions.destroy.confirm') },
-                                                   class: "button hollow alert" if document.persisted? %>
+                                                   class: "delete float-right" if document.persisted? %>
   <% elsif !document.persisted? && document.cached_attachment.present? %>
     <%= link_to t('documents.form.delete_button'), destroy_upload_documents_path(path: document.cached_attachment, index: index, documentable_type: document.documentable_type, documentable_id: document.documentable_id),
                                                    method: :delete,
                                                    remote: true,
-                                                   class: "button hollow alert" %>
+                                                   class: "delete float-right" %>
   <% else %>
     <%= label_tag document_nested_field_id(document, index, :attachment),
                   t("documents.form.attachment_label"),
                   class: "button hollow #{"error" if document.errors[:attachment].any?}" %>
-    <%= link_to t('documents.form.delete_button'), "#", class: "button hollow alert remove-document" %>
+    <%= link_to t('documents.form.delete_button'), "#", class: "delete float-right remove-document" %>
     <% if document.errors[:attachment].any? %>
       <br>
       <small class="error"><%= document.errors[:attachment].join(", ") %></small>
@@ -65,4 +65,4 @@
   <div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
   <p class="file-name"><%= document_attachment_file_name(document) %></p>
   <hr>
-</div>
+</div>

app/views/documents/_nested_documents.html.erb

@@ -11,7 +11,8 @@
   <%= link_to t("documents.form.add_new_document"),
               new_nested_documents_path(documentable_type: resource.class.name, index: resource.documents.size),
               remote: true,
-              id: "new_document_link"  %>
+              id: "new_document_link",
+              class: "button hollow"  %>
   <div class="max-documents-notice callout warning text-center hide">
     <%= t "documents.max_documents_allowed_reached_html" %>
   </div>
@@ -21,4 +22,4 @@
   </div>
 <% end %>
 
-<hr>
+<hr>

app/views/documents/destroy.js.erb

@@ -2,5 +2,6 @@ App.Documentable.destroy("<%= document_nested_field_wrapper_id(params[:index]) %
 <% new_document_link = link_to t("documents.form.add_new_document"),
                                new_document_path(documentable_type: @document.documentable_type, index: params[:index]),
                                remote: true,
-                               id: "new_document_link" %>
-App.Documentable.updateNewDocumentButton("<%= j new_document_link %>")
+                               id: "new_document_link",
+                               class: "button hollow" %>
+App.Documentable.updateNewDocumentButton("<%= j new_document_link %>")

app/views/documents/new_nested.js.erb

@@ -3,7 +3,8 @@
   new_document_link = link_to t("documents.form.add_new_document"),
                               new_nested_documents_path(documentable_type: params[:documentable_type], index: params[:index].to_i + 1),
                               remote: true,
-                              id: "new_document_link"
+                              id: "new_document_link",
+                              class: "button hollow"
 %>
 App.Documentable.new("<%= j nested_fields %>")
-App.Documentable.updateNewDocumentButton("<%= j new_document_link %>")
+App.Documentable.updateNewDocumentButton("<%= j new_document_link %>")