From 764bdd4ac8c1175761e285148abccfbb84c67aac Mon Sep 17 00:00:00 2001
From: djvs <2954343+djvs@users.noreply.github.com>
Date: Tue, 25 Jul 2023 14:07:17 -0400
Subject: [PATCH] Separate final comment row + add classes (#1982)

Co-authored-by: djvs <djvs@users.noreply.github.com>
---
 .../components/comment/comment-node.tsx       | 32 ++++++++++---------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/shared/components/comment/comment-node.tsx b/src/shared/components/comment/comment-node.tsx
index 7b7f29e5..c2223dfb 100644
--- a/src/shared/components/comment/comment-node.tsx
+++ b/src/shared/components/comment/comment-node.tsx
@@ -384,20 +384,22 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
               />
             )}
             {!this.state.showEdit && !this.state.collapsed && (
-              <div>
-                {this.state.viewSource ? (
-                  <pre>{this.commentUnlessRemoved}</pre>
-                ) : (
-                  <div
-                    className="md-div"
-                    dangerouslySetInnerHTML={
-                      this.props.hideImages
-                        ? mdToHtmlNoImages(this.commentUnlessRemoved)
-                        : mdToHtml(this.commentUnlessRemoved)
-                    }
-                  />
-                )}
-                <div className="d-flex justify-content-between justify-content-lg-start flex-wrap text-muted fw-bold">
+              <>
+                <div className="comment-content">
+                  {this.state.viewSource ? (
+                    <pre>{this.commentUnlessRemoved}</pre>
+                  ) : (
+                    <div
+                      className="md-div"
+                      dangerouslySetInnerHTML={
+                        this.props.hideImages
+                          ? mdToHtmlNoImages(this.commentUnlessRemoved)
+                          : mdToHtml(this.commentUnlessRemoved)
+                      }
+                    />
+                  )}
+                </div>
+                <div className="comment-bottom-btns d-flex justify-content-between justify-content-lg-start flex-wrap text-muted fw-bold">
                   {this.props.showContext && this.getLinkButton()}
                   {this.props.markable && (
                     <button
@@ -915,7 +917,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                   )}
                 </div>
                 {/* end of button group */}
-              </div>
+              </>
             )}
           </div>
         </article>