Cursor on user name, and Reply Bio box

client/coral-embed-stream/src/Comment.css

@@ -1 +1,3 @@
-
+.Reply {
+  position: relative;
+}

client/coral-embed-stream/src/Comment.js

@@ -16,6 +16,8 @@ import {ReplyBox, ReplyButton} from 'coral-plugin-replies';
 import FlagComment from 'coral-plugin-flags/FlagComment';
 import LikeButton from 'coral-plugin-likes/LikeButton';
 
+import styles from './Comment.css'
+
 const getAction = (type, comment) => comment.actions.filter((a) => a.type === type)[0];
 
 class Comment extends React.Component {
@@ -87,7 +89,7 @@ class Comment extends React.Component {
 
     return (
       <div
-        className={parentId ? 'reply' : 'comment'}
+        className={parentId ? `reply ${styles.Reply}` : `comment ${styles.Comment}`}
         id={`c_${comment.id}`}
         style={{marginLeft: depth * 30}}>
         <hr aria-hidden={true} />

client/coral-plugin-author-name/AuthorName.js

@@ -27,7 +27,7 @@ export default class AuthorName extends Component {
     const {showTooltip} = this.state;
     return (
       <div className={`${packagename}-text ${styles.container}`} onClick={this.handleClick} onMouseLeave={this.handleMouseLeave}>
-        <a className={styles.authorName}>
+        <a className={`${styles.authorName} ${author.settings.bio ? styles.hasBio : ''}`}>
           {author && author.name}
           {author.settings.bio ? <span className={`${styles.arrowDown} ${showTooltip ? styles.arrowUp : ''}`} /> : null}
         </a>

client/coral-plugin-author-name/styles.css

@@ -2,10 +2,12 @@
   color: black;
   display: inline-block;
   margin: 10px 0;
+}
 
+.hasBio {
   &:hover {
-    cursor: pointer;
-  }
+     cursor: pointer;
+   }
 }
 
 .arrowDown {