show post title in user comments sidebar #241

web/app/components/comment/__info/comment__info.scss

@@ -6,4 +6,5 @@
   padding-right: 84px;
   font-size: 14px;
   line-height: 16px;
+  position: relative;
 }

web/app/components/comment/__title/comment__title.scss

@@ -0,0 +1,13 @@
+.comment__title {
+  margin-bottom: 0.2rem;
+
+  &-link {
+    color: #0e7e9d;
+    font-weight: bold;
+    text-decoration: none;
+
+    &:hover {
+      opacity: 0.75;
+    }
+  }
+}

web/app/components/comment/comment.jsx

@@ -468,6 +468,14 @@ export default class Comment extends Component {
         className={b('comment', props, defaultMods)}
         id={mods.disabled ? null : `${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}
       >
+        {mods.view === 'user' &&
+          o.title && (
+            <div className="comment__title">
+              <a className="comment__title-link" href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}>
+                {o.title}
+              </a>
+            </div>
+          )}
         <div className="comment__body">
           <div className="comment__info">
             {mods.view !== 'user' && <Avatar picture={o.user.picture} />}

web/app/components/comment/index.js

@@ -21,6 +21,7 @@ require('./__control/_select-label/comment__control_select-label.scss');
 require('./__control/_view/_inactive/comment__control_view_inactive.scss');
 
 require('./__controls/comment__controls.scss');
+require('./__title/comment__title.scss');
 require('./__info/comment__info.scss');
 require('./__input/comment__input.scss');
 require('./__link-to-parent/comment__link-to-parent.scss');