mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-10-01 01:36:00 -04:00
Fixed "Add comment" layout when no comments exist
This commit is contained in:
parent
cc24d478aa
commit
d3cc261320
@ -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) {
|
||||
|
@ -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>
|
@ -27,8 +27,3 @@
|
||||
</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>
|
Loading…
Reference in New Issue
Block a user