comments.html in bfdotcom-theme-0.2.3

- old
+ new

@@ -11,13 +11,26 @@
     </div>
 </div>
 
 <div class="showSignedIn row">
     <div class="col">
-        You're signed in as <span id="currentUserName"></span>, and the new comment form is coming soon, I promise! <br />
-        <a href="#" onclick="signOut()">Sign out</a>
+        <p>You're signed in as <span id="currentUserName"></span> | <a href="#" onclick="signOut()">Sign out</a></p>
+        <div class="form-group">
+            <label for="commentText">Comment</label>
+            <textarea class="form-control" id="commentText" rows="3"></textarea>
+        </div>
+        <button type="button" class="btn btn-outline-info" id="submitButton" onclick="submitComment()">Add your comment</button>
     </div>
+    <div class="spinner-border" role="status" id="submittingComment">
+        <span class="sr-only">Submitting comment...</span>
+    </div>
+    <div class="alert alert-success" role="alert" id="commentSuccess">
+        Your comment has been submitted - it will appear here after it has been approved.
+      </div>
+      <div class="alert alert-danger" role="alert" id="commentError">
+        There was an error submitting your comment, sorry!
+      </div>
 </div>
 
 {%- if comments_size > 0 -%}
 {%- for comment in comments -%}
 <hr />
@@ -30,8 +43,12 @@
         <strong>{{comment.name}}</strong> <small>{{comment.datetime}}</small><br />
         {{comment.comment}}
     </div>    
 </div>
 {%- endfor -%}
+{%- endif -%}
+
+{%- if comments_size = 0 -%}
+<p>There are no comments on this post yet. Be the first to leave one!</p>
 {%- endif -%}
 
 <p>&nbsp;</p>
\ No newline at end of file