From 0200592055178faadafed1757ede4e3b2b187e0c Mon Sep 17 00:00:00 2001
From: Charles Holbrow <charlesholbrow@gmail.com>
Date: Thu, 21 Mar 2013 16:42:23 -0400
Subject: [PATCH] upload note styling

---
 karmaworld/assets/css/global.css           | 4 ++++
 karmaworld/assets/js/lightboxupload.js     | 5 +++--
 karmaworld/templates/partial/add_note.html | 5 ++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/karmaworld/assets/css/global.css b/karmaworld/assets/css/global.css
index c343f48..0716e35 100644
--- a/karmaworld/assets/css/global.css
+++ b/karmaworld/assets/css/global.css
@@ -762,3 +762,7 @@ legend
   font: 12px/2em "MuseoSlab-300";
 }
 
+.qq-upload-button {
+  margin-bottom:12px;
+}
+
diff --git a/karmaworld/assets/js/lightboxupload.js b/karmaworld/assets/js/lightboxupload.js
index 5f012d4..a49f996 100644
--- a/karmaworld/assets/js/lightboxupload.js
+++ b/karmaworld/assets/js/lightboxupload.js
@@ -11,14 +11,15 @@ $(function(){
     // Get the first hasgh, remove the # character
     var hash = window.location.hash.substring(1);
     if (hash === 'add-note'){
-
       $('#add-note-form').show();
-      $('#file-uploader').show();
       $('div.upload-status').hide();
+      $('#add-note-btn').hide();
     }
   }
 
   $('#add-note-btn').click(function(){
+    // hide the button added by qq
+    $('#file-uploader').hide();
     // show the add note form
     // TODO: rewrite to .show the form with a slide transition
     $('#add-note-form').show();
diff --git a/karmaworld/templates/partial/add_note.html b/karmaworld/templates/partial/add_note.html
index 63a1f8d..58c025e 100644
--- a/karmaworld/templates/partial/add_note.html
+++ b/karmaworld/templates/partial/add_note.html
@@ -5,7 +5,7 @@
     //var csrf_token = "{{ csrf_token }}";
   </script>
 
-  <div id=file-uploader style="display:none"></div>
+
   <form id=add-note method="POST">
     {% csrf_token %}
     <div class="row">
@@ -13,6 +13,9 @@
         <legend><span id=add-note-status>Uploading</span> <span id=filename>note</span>...</legend>
         <div class=progress> <div id="progress-fill"></div> </div>
       </div>
+      <div id=file-uploader class="four columns offset-by-one">
+        <!-- the upload button gets attached here -->
+      </div> 
       <div class="one columns offset-by-five end">
         <i class="icon-remove-circle"></i>
       </div>
-- 
2.25.1