Init highlgiht js and render for blob. Improve css for it

app/assets/javascripts/main.js.coffee

@@ -59,6 +59,8 @@ $ ->
   # Click a .one_click_select field, select the contents
   $(".one_click_select").on 'click', -> $(@).select()
 
+  hljs.initHighlightingOnLoad()
+
   $('.remove-row').bind 'ajax:success', ->
     $(this).closest('li').fadeOut()
 

app/assets/stylesheets/generic/files.scss

@@ -144,7 +144,7 @@
     &.code {
       padding: 0;
 
-      table.lines {
+      .highlighted-data {
         border: none;
         box-shadow: none;
         margin: 0px;
@@ -158,47 +158,34 @@
           font-size: 12px !important;
           line-height: 16px !important;
           margin: 0;
-          padding: 10px 0;
         }
-        td {
-          border: none;
-          margin: 0;
-          padding: 0;
-          vertical-align: top;
 
-          &:first-child {
-            background: #eee;
-            width: 50px;
-          }
-          &:last-child {
-          }
-        }
-        tr:hover {
-          background: none;
+        .hljs {
+          padding: 0;
         }
 
-        pre.line_numbers {
-          color: #666;
-          padding: 10px 6px 10px 0;
+        .line-numbers {
+          padding: 10px;
           text-align: right;
-          background: #EEE;
+          float: left;
+          width: 60px;
 
           a {
-            color: #666;
+            display: block;
+            font-size: 12px !important;
+            line-height: 16px !important;
 
             i {
               display: none;
-              font-size: 14px;
-              line-height: 14px;
             }
+
             &:hover i {
-              display: inherit;
+              display: inline;
             }
           }
         }
 
         .highlight {
-          border-left: 1px solid #DEE2E3;
           overflow: auto;
           overflow-y: hidden;
 

app/views/projects/blob/_text.html.haml

@@ -8,7 +8,16 @@
 - else
   .file-content.code
     - unless blob.empty?
-      %div{class: user_color_scheme_class}
-        = raw blob.colorize(formatter: :gitlab)
+      %div.highlighted-data{class: user_color_scheme_class}
+        .line-numbers
+          - blob.data.lines.size.times do |index|
+            - i = index + 1
+            = link_to "#L#{i}", id: "L#{i}", rel: "#L#{i}" do
+              %i.icon-link
+              = i
+        .highlight
+          %pre
+            %code
+              = raw blob.data
     - else
       %p.nothing_here_message Empty file