moved error message into form area; tweaked cancel behavior

cms/static/sass/_users.scss

@@ -32,6 +32,21 @@
     padding: 15px 20px;
     background: $mediumGrey;
 
+    #result {
+      display: none;
+      float: left;
+      margin-bottom: 15px;
+      padding: 3px 15px;
+      border-radius: 3px;
+      background: $error-red;
+      font-size: 14px;
+      color: #fff;
+    }
+
+    .form-elements {
+      clear: both;
+    }
+
     label {
       display: inline-block;
       margin-right: 10px;

cms/templates/manage_users.html

@@ -20,9 +20,12 @@
       </div>
       %if allow_actions:
       <div class="new-user-form">
-        <label>email: </label><input type="text" id="email" class="email-input" autocomplete="off" placeholder="email@example.com">
-        <a href="#" id="add_user" class="add-button">add user</a>
-        <a href="#" class="cancel-button">cancel</a>
+        <div id="result"></div>
+        <div class="form-elements">
+          <label>email: </label><input type="text" id="email" class="email-input" autocomplete="off" placeholder="email@example.com">
+          <a href="#" id="add_user" class="add-button">add user</a>
+          <a href="#" class="cancel-button">cancel</a>
+        </div>
       </div>
       %endif
       <div>
@@ -42,8 +45,6 @@
           % endfor
         </ol>
       </div>
-      
-      <div id="result"></div>
     </article>
   </div>
 </div>
@@ -61,6 +62,8 @@
   function hideNewUserForm(e) {
     e.preventDefault();
     $newUserForm.slideUp(150);
+    $('#result').hide();
+    $('#email').val('');
   }
 
   $(document).ready(function() {
@@ -78,7 +81,7 @@
         data:JSON.stringify({ 'email': $('#email').val()}),
       }).done(function(data) {
         if (data.ErrMsg != undefined)
-          $('#result').empty().append(data.ErrMsg);
+          $('#result').show().empty().append(data.ErrMsg);
         else
           location.reload();
       })