luisgulo/BookStack
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fixed "Add comment" layout when no comments exist

Browse source
This commit is contained in:
Dan Brown 2019-04-13 12:58:57 +01:00
parent cc24d478aa
commit d3cc261320
No known key found for this signature in database
GPG key ID: 46D9F943C24A2EF9
3 changed files with 30 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
resources/assets/js/components/page-comments.js
View file

@ -88,6 +88,7 @@ class PageComments {
commentElem.parentNode.removeChild(commentElem);
window.$events.emit('success', window.trans('entities.comment_deleted_success'));
this.updateCount();
this.hideForm();
});
}
@ -129,7 +130,7 @@ class PageComments {
showForm() {
this.formContainer.style.display = 'block';
this.formContainer.parentNode.style.display = 'block';
this.elem.querySelector('[comment-add-button]').style.display = 'none';
this.elem.querySelector('[comment-add-button-container]').style.display = 'none';
this.formInput.focus();
window.scrollToElement(this.formInput);
}
@ -137,7 +138,18 @@ class PageComments {
hideForm() {
this.formContainer.style.display = 'none';
this.formContainer.parentNode.style.display = 'none';
this.elem.querySelector('[comment-add-button]').style.display = 'block';
const addButtonContainer = this.elem.querySelector('[comment-add-button-container]');
if (this.getCommentCount() > 0) {
this.elem.appendChild(addButtonContainer)
} else {
const countBar = this.elem.querySelector('[comment-count-bar]');
countBar.appendChild(addButtonContainer);
}
addButtonContainer.style.display = 'block';
}
getCommentCount() {
return this.elem.querySelectorAll('.comment-box[comment]').length;
}
setReply(commentElem) {

17
resources/views/comments/comments.blade.php
View file

@ -1,5 +1,13 @@
<div page-comments page-id="{{ $page->id }}" class="comments-list">
<h5 comments-title>{{ trans_choice('entities.comment_count', count($page->comments), ['count' => count($page->comments)]) }}</h5>
<div comment-count-bar class="grid half left-focus v-center">
<h5 comments-title>{{ trans_choice('entities.comment_count', count($page->comments), ['count' => count($page->comments)]) }}</h5>
@if (count($page->comments) === 0)
<div class="text-right" comment-add-button-container>
<button type="button" action="addComment"
class="button outline">{{ trans('entities.comment_add') }}</button>
</div>
@endif
</div>
<div class="comment-container" comment-container>
@foreach($page->comments as $comment)
@ -11,4 +19,11 @@
@include('comments.create')
@endif
@if (count($page->comments) > 0)
<div class="text-right" comment-add-button-container>
<button type="button" action="addComment"
class="button outline">{{ trans('entities.comment_add') }}</button>
</div>
@endif
</div>

5
resources/views/comments/create.blade.php
View file

@ -26,9 +26,4 @@
</div>
</form>
</div>
</div>
<div class="form-group text-right" comment-add-button>
<button type="button" action="addComment"
class="button outline">{{ trans('entities.comment_add') }}</button>
</div>