[resumes][refactor] add vertical line to replies

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

@@ -144,16 +144,25 @@ export default function ResumeCommentListItem({
                 <span>{showReplies ? 'Hide replies' : 'Show replies'}</span>
               </button>
 
-              {showReplies &&
+              {showReplies && (
-                comment.children.map((child) => {
+                <div className="flex flex-row">
-                  return (
+                  <div className="relative flex flex-col px-2 py-2">
-                    <ResumeCommentListItem
+                    <div className="flex-grow border-r border-gray-300" />
-                      key={child.id}
+                  </div>
-                      comment={child}
+
-                      userId={userId}
+                  <div className="flex flex-col space-y-1">
-                    />
+                    {comment.children.map((child) => {
-                  );
+                      return (
-                })}
+                        <ResumeCommentListItem
+                          key={child.id}
+                          comment={child}
+                          userId={userId}
+                        />
+                      );
+                    })}
+                  </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={