From 9a97995f181c13c225f62b1b582f6bf802dd6578 Mon Sep 17 00:00:00 2001
From: Abijeet <abijeetpatro@gmail.com>
Date: Thu, 25 May 2017 08:04:19 +0530
Subject: [PATCH] #47 Displays the time for comments and border bottom for sub
 comments.

---
 resources/assets/sass/_comments.scss         | 44 +++++++++++++-------
 resources/views/comments/list-item.blade.php | 15 ++++---
 2 files changed, 38 insertions(+), 21 deletions(-)

diff --git a/resources/assets/sass/_comments.scss b/resources/assets/sass/_comments.scss
index 7da319025..7d7cb486a 100644
--- a/resources/assets/sass/_comments.scss
+++ b/resources/assets/sass/_comments.scss
@@ -2,49 +2,63 @@
     .comment-box {
         border-bottom: 1px solid $comment-border;
     }
-    
+
     .comment-box:last-child {
         border-bottom: none;
     }
+    .load-more-comments {
+        font-size: 0.8em;
+        margin-top: -1px;
+        margin-bottom: 6px;
+    }
 }
-.page-comment {        
+.page-comment {
     .comment-container {
         margin-left: 42px;
     }
-    
+
     .comment-actions {
-        font-size: 0.8em;        
-        padding-bottom: 4px;
+        font-size: 0.8em;
+        padding-bottom: 2px;
+
         ul {
             padding-left: 0px;
-            margin-bottom: 5px;
+            margin-bottom: 2px;
         }
         li {
             float: left;
             list-style-type: none;
         }
-        
+
         li:after {
             content: '•';
             color: #707070;
             padding: 0 5px;
             font-size: 1em;
         }
-        
+
         li:last-child:after {
             content: none;
         }
     }
-    
+
+    .comment-actions.has-border {
+        border-bottom: 1px solid #DDD;
+    }
+
+    .comment-actions.has-border:last-child {
+        border-bottom: 0px;
+    }
+
     .comment-header {
         font-size: 1.25em;
         margin-top: 0.6em;
     }
-    
-    .comment-body {
-        
+
+    .comment-body p {
+        margin-bottom: 1em;
     }
-    
+
     .user-image {
         float: left;
         margin-right: 10px;
@@ -52,12 +66,12 @@
         img {
             width: 100%;
         }
-    }    
+    }
 }
 
 .comment-editor {
     margin-top: 2em;
-    
+
     textarea {
         display: block;
         width: 100%;
diff --git a/resources/views/comments/list-item.blade.php b/resources/views/comments/list-item.blade.php
index c267d619b..ca8b58625 100644
--- a/resources/views/comments/list-item.blade.php
+++ b/resources/views/comments/list-item.blade.php
@@ -1,4 +1,4 @@
-<div class='page-comment'>
+<div class='page-comment' id="comment-@{{::pageId}}-@{{::comment.id}}">
     <div class="user-image">
         <img ng-src="@{{::defaultAvatar}}" alt="user avatar">
     </div>
@@ -9,16 +9,19 @@
         <div ng-bind-html="comment.html" class="comment-body">
 
         </div>
-        <div class="comment-actions">
+        <div class="comment-actions" ng-class="{'has-border': comment.cnt_sub_comments === 0 || comment.is_loaded}">
             <ul>
                 <li ng-if="level < 3"><a href="#" comment-reply-link no-comment-reply-dupe="true" comment="comment" is-reply="true">Reply</a></li>
                 <li><a href="#" comment-reply-link no-comment-reply-dupe="true" comment="comment">Edit</a></li>
-                <li><a href="#">@{{::comment.created_at}}</a></li>
+                <li>Created <a title="@{{::comment.created.day_time_str}}" href="#comment-@{{::comment.id}}-@{{::pageId}}">@{{::comment.created.diff}}</a></li>
+                <li ng-if="comment.updated"><span title="@{{::comment.updated.day_time_str}}">Updated @{{::comment.updated.diff}}</span></li>
             </ul>
         </div>
-        <a href="#" ng-click="vm.loadSubComments($event, comment, $index)" class="load-more-comments" ng-if="comment.cnt_sub_comments > 0 && !comment.is_loaded">
-            Load @{{::comment.cnt_sub_comments}} more comment(s)
-        </a>
+        <div class="load-more-comments" ng-if="comment.cnt_sub_comments > 0 && !comment.is_loaded">
+            <a href="#" ng-click="vm.loadSubComments($event, comment, $index)">
+                Load @{{::comment.cnt_sub_comments}} more comment(s)
+            </a>
+        </div>
         <div class="comment-box" ng-repeat="comment in comments = comment.comments track by comment.id" ng-init="level = level + 1">
             <div ng-include src="'comment-list-item.html'">
             </div>