Comment border tweak (#1820)

* Tweak border depth

* Tweak top level margins
This commit is contained in:
SleeplessOne1917 2023-07-10 23:16:03 +00:00 committed by GitHub
parent 546f0ad704
commit 2911cd8cdb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 12 additions and 16 deletions

View file

@ -114,7 +114,7 @@ interface CommentNodeProps {
moderators?: CommunityModeratorView[]; moderators?: CommunityModeratorView[];
admins?: PersonView[]; admins?: PersonView[];
noBorder?: boolean; noBorder?: boolean;
noIndent?: boolean; isTopLevel?: boolean;
viewOnly?: boolean; viewOnly?: boolean;
locked?: boolean; locked?: boolean;
markable?: boolean; markable?: boolean;
@ -292,11 +292,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
mark: this.isCommentNew || this.commentView.comment.distinguished, mark: this.isCommentNew || this.commentView.comment.distinguished,
})} })}
> >
<div <div className="ms-2">
className={classNames({
"ms-2": !this.props.noIndent,
})}
>
<div className="d-flex flex-wrap align-items-center text-muted small"> <div className="d-flex flex-wrap align-items-center text-muted small">
<button <button
className="btn btn-sm btn-link text-muted me-2" className="btn btn-sm btn-link text-muted me-2"
@ -1136,7 +1132,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
allLanguages={this.props.allLanguages} allLanguages={this.props.allLanguages}
siteLanguages={this.props.siteLanguages} siteLanguages={this.props.siteLanguages}
hideImages={this.props.hideImages} hideImages={this.props.hideImages}
isChild={!this.props.noIndent} isChild={!this.props.isTopLevel}
depth={this.props.node.depth + 1} depth={this.props.node.depth + 1}
finished={this.props.finished} finished={this.props.finished}
onCommentReplyRead={this.props.onCommentReplyRead} onCommentReplyRead={this.props.onCommentReplyRead}

View file

@ -35,7 +35,7 @@ interface CommentNodesProps {
admins?: PersonView[]; admins?: PersonView[];
maxCommentsShown?: number; maxCommentsShown?: number;
noBorder?: boolean; noBorder?: boolean;
noIndent?: boolean; isTopLevel?: boolean;
viewOnly?: boolean; viewOnly?: boolean;
locked?: boolean; locked?: boolean;
markable?: boolean; markable?: boolean;
@ -86,7 +86,7 @@ export class CommentNodes extends Component<CommentNodesProps, any> {
this.props.nodes.length > 0 && ( this.props.nodes.length > 0 && (
<ul <ul
className={classNames("comments", { className={classNames("comments", {
"ms-1": !!this.props.isChild, "ms-1": this.props.depth && this.props.depth > 1,
"border-top border-light": !this.props.noBorder, "border-top border-light": !this.props.noBorder,
})} })}
style={ style={
@ -100,7 +100,7 @@ export class CommentNodes extends Component<CommentNodesProps, any> {
key={node.comment_view.comment.id} key={node.comment_view.comment.id}
node={node} node={node}
noBorder={this.props.noBorder} noBorder={this.props.noBorder}
noIndent={this.props.noIndent} isTopLevel={this.props.isTopLevel}
viewOnly={this.props.viewOnly} viewOnly={this.props.viewOnly}
locked={this.props.locked} locked={this.props.locked}
moderators={this.props.moderators} moderators={this.props.moderators}

View file

@ -448,7 +448,7 @@ export class Community extends Component<
nodes={commentsToFlatNodes(this.state.commentsRes.data.comments)} nodes={commentsToFlatNodes(this.state.commentsRes.data.comments)}
viewType={CommentViewType.Flat} viewType={CommentViewType.Flat}
finished={this.state.finished} finished={this.state.finished}
noIndent isTopLevel
showContext showContext
enableDownvotes={enableDownvotes(site_res)} enableDownvotes={enableDownvotes(site_res)}
moderators={communityRes.moderators} moderators={communityRes.moderators}

View file

@ -718,7 +718,7 @@ export class Home extends Component<any, HomeState> {
nodes={commentsToFlatNodes(comments)} nodes={commentsToFlatNodes(comments)}
viewType={CommentViewType.Flat} viewType={CommentViewType.Flat}
finished={this.state.finished} finished={this.state.finished}
noIndent isTopLevel
showCommunity showCommunity
showContext showContext
enableDownvotes={enableDownvotes(siteRes)} enableDownvotes={enableDownvotes(siteRes)}

View file

@ -252,7 +252,7 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
viewType={CommentViewType.Flat} viewType={CommentViewType.Flat}
admins={this.props.admins} admins={this.props.admins}
finished={this.props.finished} finished={this.props.finished}
noIndent isTopLevel
showCommunity showCommunity
showContext showContext
enableDownvotes={this.props.enableDownvotes} enableDownvotes={this.props.enableDownvotes}

View file

@ -542,7 +542,7 @@ export class Post extends Component<any, PostState> {
nodes={commentsToFlatNodes(commentsRes.data.comments)} nodes={commentsToFlatNodes(commentsRes.data.comments)}
viewType={this.state.commentViewType} viewType={this.state.commentViewType}
maxCommentsShown={this.state.maxCommentsShown} maxCommentsShown={this.state.maxCommentsShown}
noIndent isTopLevel
locked={postRes.data.post_view.post.locked} locked={postRes.data.post_view.post.locked}
moderators={postRes.data.moderators} moderators={postRes.data.moderators}
admins={this.state.siteRes.admins} admins={this.state.siteRes.admins}

View file

@ -721,7 +721,7 @@ export class Search extends Component<any, SearchState> {
viewType={CommentViewType.Flat} viewType={CommentViewType.Flat}
viewOnly viewOnly
locked locked
noIndent isTopLevel
enableDownvotes={enableDownvotes(this.state.siteRes)} enableDownvotes={enableDownvotes(this.state.siteRes)}
allLanguages={this.state.siteRes.all_languages} allLanguages={this.state.siteRes.all_languages}
siteLanguages={this.state.siteRes.discussion_languages} siteLanguages={this.state.siteRes.discussion_languages}
@ -782,7 +782,7 @@ export class Search extends Component<any, SearchState> {
viewType={CommentViewType.Flat} viewType={CommentViewType.Flat}
viewOnly viewOnly
locked locked
noIndent isTopLevel
enableDownvotes={enableDownvotes(siteRes)} enableDownvotes={enableDownvotes(siteRes)}
allLanguages={siteRes.all_languages} allLanguages={siteRes.all_languages}
siteLanguages={siteRes.discussion_languages} siteLanguages={siteRes.discussion_languages}