From 2a9535f88a5ba179656b830b00f9d96e3bc39c3a Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 5 Jul 2017 12:28:09 -0300
Subject: [PATCH] Featured Comment Styles

---
 .../client/components/FeaturedComment.js      | 10 +++----
 .../client/components/styles.css              | 26 +++++++++++++++++--
 2 files changed, 29 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-featured-comments/client/components/FeaturedComment.js b/plugins/talk-plugin-featured-comments/client/components/FeaturedComment.js
index 89ab67df1..a3f71b1d8 100644
--- a/plugins/talk-plugin-featured-comments/client/components/FeaturedComment.js
+++ b/plugins/talk-plugin-featured-comments/client/components/FeaturedComment.js
@@ -7,20 +7,20 @@ import {Icon} from 'plugin-api/beta/client/components/ui';
 
 const FeaturedComment = ({comment}) => {
   return (
-    <div className={cn(`${name}__featured-comment`, styles.featuredComment)}>
-      <p className={cn(`${name}__featured-comment__comment-body`)}>
+    <div className={cn(styles.featuredComment, `${name}__featured-comment`)}>
+      <p className={cn(styles.body, `${name}__featured-comment__comment-body`)}>
         "{comment.body}"
       </p>
       <footer>
         <div>
-          <strong className={cn(`${name}__featured-comment__username`, styles.username)}>
+          <strong className={cn(styles.username, `${name}__featured-comment__username`)}>
             {comment.user.username}
           </strong>
-          <span className={cn(`${name}__featured-comment__timeago`, styles.timeago)}>
+          <span className={cn(styles.timeago, `${name}__featured-comment__timeago`)}>
             ,{' '}{timeago(comment.created_at)}
           </span>
         </div>
-        <a className={cn(`${name}__featured-comment__go-to`, styles.goTo)}>
+        <a className={cn(styles.goTo, `${name}__featured-comment__go-to`)}>
           Go to conversation<Icon name="keyboard_arrow_right" />
         </a>
       </footer>
diff --git a/plugins/talk-plugin-featured-comments/client/components/styles.css b/plugins/talk-plugin-featured-comments/client/components/styles.css
index 4c3db162c..9a2943163 100644
--- a/plugins/talk-plugin-featured-comments/client/components/styles.css
+++ b/plugins/talk-plugin-featured-comments/client/components/styles.css
@@ -35,9 +35,31 @@
 .featuredComments {
   padding: 20px;
   background-color: #f9f9f9;
+  margin: 10px 0 30px;
+}
+
+.featuredComment {
+  margin: 10px 0 35px;
+}
+
+.featuredComment:last-child {
   margin: 10px 0;
 }
 
-.featuredComments .goTo {
-  color: #2d3fb9;
+.featuredComment .goTo {
+  color: #1d5294;
+  font-size: 13px;
+  padding: 5px 0;
+  display: inline-block;
+}
+
+.featuredComment .goTo:hover {
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+.featuredComment .body {
+  line-height: 20px;
+  text-align: left;
+  letter-spacing: 0.1px;
 }
\ No newline at end of file