colin
/
bookstack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

#47 Displays the time for comments and border bottom for sub comments.

This commit is contained in:
Abijeet 2017-05-25 08:04:19 +05:30
parent 1a1e71cd60
commit 9a97995f18
2 changed files with 38 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
resources/assets/sass/_comments.scss
View File

@ -2,49 +2,63 @@
.comment-box { .comment-box {
border-bottom: 1px solid $comment-border; border-bottom: 1px solid $comment-border;
} }
.comment-box:last-child { .comment-box:last-child {
border-bottom: none; border-bottom: none;
} }
.load-more-comments {
font-size: 0.8em;
margin-top: -1px;
margin-bottom: 6px;
}
} }
.page-comment { .page-comment {
.comment-container { .comment-container {
margin-left: 42px; margin-left: 42px;
} }
.comment-actions { .comment-actions {
font-size: 0.8em; font-size: 0.8em;
padding-bottom: 4px; padding-bottom: 2px;
ul { ul {
padding-left: 0px; padding-left: 0px;
margin-bottom: 5px; margin-bottom: 2px;
} }
li { li {
float: left; float: left;
list-style-type: none; list-style-type: none;
} }
li:after { li:after {
content: '•'; content: '•';
color: #707070; color: #707070;
padding: 0 5px; padding: 0 5px;
font-size: 1em; font-size: 1em;
} }
li:last-child:after { li:last-child:after {
content: none; content: none;
} }
} }
.comment-actions.has-border {
border-bottom: 1px solid #DDD;
}
.comment-actions.has-border:last-child {
border-bottom: 0px;
}
.comment-header { .comment-header {
font-size: 1.25em; font-size: 1.25em;
margin-top: 0.6em; margin-top: 0.6em;
} }
.comment-body { .comment-body p {
margin-bottom: 1em;
} }
.user-image { .user-image {
float: left; float: left;
margin-right: 10px; margin-right: 10px;
@ -52,12 +66,12 @@
img { img {
width: 100%; width: 100%;
} }
} }
} }
.comment-editor { .comment-editor {
margin-top: 2em; margin-top: 2em;
textarea { textarea {
display: block; display: block;
width: 100%; width: 100%;

15
resources/views/comments/list-item.blade.php
View File

@ -1,4 +1,4 @@
<div class='page-comment'> <div class='page-comment' id="comment-@{{::pageId}}-@{{::comment.id}}">
<div class="user-image"> <div class="user-image">
<img ng-src="@{{::defaultAvatar}}" alt="user avatar"> <img ng-src="@{{::defaultAvatar}}" alt="user avatar">
</div> </div>
@ -9,16 +9,19 @@
<div ng-bind-html="comment.html" class="comment-body"> <div ng-bind-html="comment.html" class="comment-body">
</div> </div>
<div class="comment-actions"> <div class="comment-actions" ng-class="{'has-border': comment.cnt_sub_comments === 0 || comment.is_loaded}">
<ul> <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 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-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> </ul>
</div> </div>
<a href="#" ng-click="vm.loadSubComments($event, comment, $index)" class="load-more-comments" ng-if="comment.cnt_sub_comments > 0 && !comment.is_loaded"> <div class="load-more-comments" ng-if="comment.cnt_sub_comments > 0 && !comment.is_loaded">
Load @{{::comment.cnt_sub_comments}} more comment(s) <a href="#" ng-click="vm.loadSubComments($event, comment, $index)">
</a> 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 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 ng-include src="'comment-list-item.html'">
</div> </div>