Style system notes

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

app/assets/stylesheets/base/gl_variables.scss

@@ -148,3 +148,10 @@ $btn-default-border:             #e7e9ed;
 //
 //##
 $nav-link-padding: 13px $gl-padding;
+
+//== Code
+//
+//##
+$pre-bg:           #f8fafc !default;
+$pre-color:        $gl-gray !default;
+$pre-border-color: #e7e9ed;

app/assets/stylesheets/generic/timeline.scss

@@ -28,39 +28,9 @@
     }
   }
 
-  .system-note .timeline-entry-inner {
-    .timeline-icon {
-      float: left;
-      margin-left: 12px;
-      margin-top: 8px;
-      @include box-shadow(none);
-
-      span {
-        margin: 0 2px;
-        font-size: 16px;
-        color: #eeeeee;
-      }
-    }
-
-    .timeline-content {
-      background: none;
-      margin-left: 45px;
-      padding: 0px 15px;
-
-      &:after { border: 0; }
-
-      .note-header {
-        span { font-size: 12px; }
-
-        .avatar {
-          margin-right: 5px;
-        }
-      }
-
-      .note-text {
-        font-size: 12px;
-        margin-left: 20px;
-      }
+  .system-note {
+    .note-text {
+      color: $gl-gray !important;
     }
   }
 }

app/assets/stylesheets/pages/notes.scss

@@ -34,10 +34,8 @@ ul.notes {
         content: "\00b7";
       }
 
-      font-size: 13px;
-
       a {
-        @extend .cgray;
+        color: $gl-gray;
 
         &:hover {
           text-decoration: underline;
@@ -45,8 +43,9 @@ ul.notes {
       }
     }
     .author {
-      color: #333;
-      font-weight: bold;
+      color: #4c4e54;
+      margin-right: 3px;
+
       &:hover {
         color: $gl-link-color;
       }

app/views/projects/notes/_note.html.haml

 %li.timeline-entry{ id: dom_id(note), class: [dom_class(note), "note-row-#{note.id}", ('system-note' if note.system)], data: { discussion: note.discussion_id } }
   .timeline-entry-inner
     .timeline-icon
-      - if note.system
-        %span= icon('circle')
-      - else
-        = link_to user_path(note.author) do
-          = image_tag avatar_icon(note.author_email), class: 'avatar s40', alt: ''
+      = link_to user_path(note.author) do
+        = image_tag avatar_icon(note.author_email), class: 'avatar s40', alt: ''
     .timeline-content
       .note-header
         - if note_editable?(note)
@@ -22,10 +19,6 @@
             %span.note-role.label
               = member.human_access
 
-        - if note.system
-          = link_to user_path(note.author) do
-            = image_tag avatar_icon(note.author_email), class: 'avatar s16', alt: ''
-
         = link_to_member(note.project, note.author, avatar: false)
 
         %span.author-username