[resumes][refactor] add vertical line to replies

apps/portal/src/components/resumes/comments/ResumeCommentListItem.tsx

@@ -144,8 +144,14 @@ export default function ResumeCommentListItem({
                 <span>{showReplies ? 'Hide replies' : 'Show replies'}</span>
               </button>
 
-              {showReplies &&
-                comment.children.map((child) => {
+              {showReplies && (
+                <div className="flex flex-row">
+                  <div className="relative flex flex-col px-2 py-2">
+                    <div className="flex-grow border-r border-gray-300" />
+                  </div>
+
+                  <div className="flex flex-col space-y-1">
+                    {comment.children.map((child) => {
                       return (
                         <ResumeCommentListItem
                           key={child.id}
@@ -155,6 +161,9 @@ export default function ResumeCommentListItem({
                       );
                     })}
                   </div>
+                </div>
+              )}
+            </div>
           )}
         </div>
       </div>

apps/portal/src/components/resumes/comments/comment/ResumeCommentVoteButtons.tsx

@@ -97,7 +97,9 @@ export default function ResumeCommentVoteButtons({
         />
       </button>
 
-      <div className="text-xs">{commentVotesQuery.data?.numVotes ?? 0}</div>
+      <div className="flex min-w-[1rem] justify-center text-xs">
+        {commentVotesQuery.data?.numVotes ?? 0}
+      </div>
 
       <button
         disabled={