diff options
author | Dessalines <tyhou13@gmx.com> | 2019-08-25 10:42:10 -0700 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2019-08-25 10:42:10 -0700 |
commit | ed106732503434866bee2e73cb82d036a7d93060 (patch) | |
tree | 38afdcf22c9309198faaf2ddeded802b627b9d50 /ui | |
parent | 4e9c0710493a54cc9352ea25e4c1e50ac872e407 (diff) |
Refactoring chat sidebar. #237
Diffstat (limited to 'ui')
-rw-r--r-- | ui/src/components/post.tsx | 35 | ||||
-rw-r--r-- | ui/src/translations/en.ts | 1 |
2 files changed, 18 insertions, 18 deletions
diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx index a6df4105..91f8f4db 100644 --- a/ui/src/components/post.tsx +++ b/ui/src/components/post.tsx @@ -119,7 +119,7 @@ export class Post extends Component<any, PostState> { {this.state.loading ? <h5><svg class="icon icon-spinner spin"><use xlinkHref="#icon-spinner"></use></svg></h5> : <div class="row"> - <div class="col-12 col-md-8 col-lg-6 mb-3"> + <div class="col-12 col-md-8 mb-3"> <PostListing post={this.state.post} showBody @@ -139,11 +139,9 @@ export class Post extends Component<any, PostState> { {this.sortRadios()} {this.commentsTree()} </div> - <div class="col-12 col-md-4 col-lg-3 mb-3 d-none d-md-block px-0"> - {this.state.comments.length > 0 && this.newComments()} - </div> - <div class="col-12 col-sm-12 col-lg-3"> + <div class="col-12 col-sm-12 col-md-4"> {this.sidebar()} + {this.state.comments.length > 0 && this.newComments()} </div> </div> } @@ -175,25 +173,26 @@ export class Post extends Component<any, PostState> { newComments() { return ( - <div class="container-fluid sticky-top new-comments"> - <h5><T i18nKey="chat">#</T></h5> - <CommentForm postId={this.state.post.id} disabled={this.state.post.locked} /> - {this.state.comments.map(comment => - <CommentNodes - nodes={[{comment: comment}]} - noIndent - locked={this.state.post.locked} - moderators={this.state.moderators} - admins={this.state.admins} - /> - )} + <div class="d-none d-md-block sticky-top new-comments card border-secondary"> + <div class="card-body small"> + <h6><T i18nKey="recent_comments">#</T></h6> + {this.state.comments.map(comment => + <CommentNodes + nodes={[{comment: comment}]} + noIndent + locked={this.state.post.locked} + moderators={this.state.moderators} + admins={this.state.admins} + /> + )} + </div> </div> ) } sidebar() { return ( - <div class=""> + <div class="mb-3"> <Sidebar community={this.state.community} moderators={this.state.moderators} diff --git a/ui/src/translations/en.ts b/ui/src/translations/en.ts index c854ea7b..79249214 100644 --- a/ui/src/translations/en.ts +++ b/ui/src/translations/en.ts @@ -109,6 +109,7 @@ export const en = { expand_here: 'Expand here', subscribe_to_communities: 'Subscribe to some <1>communities</1>.', chat: 'Chat', + recent_comments: 'Recent Comments', no_results: 'No results.', setup: 'Setup', lemmy_instance_setup: 'Lemmy Instance Setup', |