Merge branch 'master' into ku-review-comment-positioning

Antonio Scandurra · Antonio Scandurra · commit 86b7bb61a87e · 2016-06-15T16:12:30.000+02:00
diff --git a/lib/github/review-comment/review-comment-component.js b/lib/github/review-comment/review-comment-component.js
@@ -17,9 +17,8 @@ export default class ReviewCommentComponent {
     const comment = this.comment
 
     return (
-      <div className='pr-comment-component'>
+      <div className='github-PRComment'>
         <div className='github-PRComment-margin'/>
-
         <header className='github-PRComment-header'>
           <UserAvatar className='github-PRComment-avatar' size={20} userId={comment.user.id} />
           <span className='github-PRComment-login'> {comment.user.login} </span>
diff --git a/styles/github-pr-comment.less b/styles/github-pr-comment.less
@@ -1,16 +1,25 @@
 @import "ui-variables";
 @import "syntax-variables";
 
-@PRComment-color: mix(@syntax-text-color, @syntax-background-color, 80%);
-@PRComment-color-subtle: mix(@syntax-text-color, @syntax-background-color, 50%);
-@PRComment-color-link: mix(@syntax-color-renamed, @PRComment-color-subtle, 20%);
+@PRComment-color: @syntax-text-color;
+@PRComment-color-subtle: mix(@syntax-text-color, @syntax-background-color, 66%);
+@PRComment-color-link: mix(@syntax-color-renamed, @PRComment-color-subtle, 33%);
 @PRComment-color-border: @syntax-indent-guide-color;
 
 .github-PRComment {
   max-width: 600px;
   font-size: 11/12em;
-  // color: @PRComment-color;
+  font-family: @font-family;
+  color: @PRComment-color;
   padding: 0 @component-padding;
+  background-color: @syntax-gutter-background-color;
+  cursor: default;
+  opacity: .33;
+  transition: opacity .2s;
+  &:hover {
+    opacity: 1;
+    transition-duration: .08s;
+  }
 
   &:nth-child(2) {
     border-top: 1px solid @PRComment-color-border;
@@ -27,7 +36,7 @@
   &-avatar {
     display: inline-block;
     border-radius: 50%;
-    margin-right: 4px;
+    margin-right: 8px;
   }
 
   &-login {}
