Archives/lemmy
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy synced 2024-11-05 06:00:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

Making chat / new comments section sticky top and fitting to your

Browse Source 
viewport

- Fixes #97. #98
This commit is contained in:
Dessalines 2019-04-21 16:44:47 -07:00
parent bfcc6e948f
commit b7cbea66d3
3 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/src/components/comment-form.tsx
View File

@ -56,7 +56,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
<form onSubmit={linkEvent(this, this.handleCommentSubmit)}> <form onSubmit={linkEvent(this, this.handleCommentSubmit)}>
<div class="form-group row"> <div class="form-group row">
<div class="col-sm-12"> <div class="col-sm-12">
<textarea class="form-control" value={this.state.commentForm.content} onInput={linkEvent(this, this.handleCommentContentChange)} placeholder="Comment here" required disabled={this.props.disabled}/> <textarea class="form-control" value={this.state.commentForm.content} onInput={linkEvent(this, this.handleCommentContentChange)} required disabled={this.props.disabled} rows={2} />
</div> </div>
</div> </div>
<div class="row"> <div class="row">

5
ui/src/components/post.tsx
View File

@ -130,8 +130,9 @@ export class Post extends Component<any, PostState> {
newComments() { newComments() {
return ( return (
<div class="sticky-top"> <div class="container-fluid sticky-top new-comments">
<h5>New Comments</h5> <h5>Chat</h5>
<CommentForm postId={this.state.post.id} disabled={this.state.post.locked} />
{this.state.comments.map(comment => {this.state.comments.map(comment =>
<CommentNodes <CommentNodes
nodes={[{comment: comment}]} nodes={[{comment: comment}]}

4
ui/src/css/main.css
View File

@ -87,3 +87,7 @@ blockquote {
margin-top: 6px; margin-top: 6px;
} }
.new-comments {
max-height: 100vh;
overflow-y: auto;
}