Merge branch 'highlight-js' into 'master'

Highlight.Js

Replace pygments code highlight with client-side library - highlight.js

http://highlightjs.org/

Former-commit-id: b6454591

app/assets/javascripts/application.js

@@ -24,6 +24,7 @@
 //= require g.raphael-min
 //= require g.bar-min
 //= require branch-graph
+//= require highlightjs.min
 //= require ace-src-noconflict/ace
 //= require_tree .
 //= require d3

app/assets/javascripts/blob.js.coffee

@@ -17,7 +17,7 @@ class BlobView
       setHash(hash)
       e.preventDefault()
- 
+
     # See if there are lines selected
     # "#L12" and "#L34-56" supported
     highlightBlobLines = (e) ->
@@ -64,7 +64,7 @@ class BlobView
         nodes.attr("id", hash)
     # initialize multi-line select
-    $("#tree-content-holder .line_numbers a[id^=L]").on("click", handleMultiSelect)
+    $("#tree-content-holder .line-numbers a[id^=L]").on("click", handleMultiSelect)
     # Highlight the correct lines on load
     highlightBlobLines()

app/assets/javascripts/dispatcher.js.coffee

@@ -4,6 +4,7 @@ $ ->
 class Dispatcher
   constructor: () ->
     @initSearch()
+    @initHighlight()
     @initPageScripts()
   initPageScripts: ->
@@ -53,3 +54,10 @@ class Dispatcher
     project_ref = opts.data('autocomplete-project-ref')
     new SearchAutocomplete(path, project_id, project_ref)
+
+  initHighlight: ->
+    $('.highlight pre code').each (i, e) ->
+      hljs.highlightBlock(e)
+      $(e).html($.map($(e).html().split("\n"), (line, i) ->
+        "<div class='line' id='LC" + (i + 1) + "'>" + line + "</div>"
+      ).join("\n"))

app/assets/javascripts/notes.js.coffee

@@ -94,6 +94,9 @@ class Notes
     if @isNewNote(note)
       @note_ids.push(note.id)
       $('ul.main-notes-list').append(note.html)
+      code = "#note_" + note.id + " .highlight pre code"
+      $(code).each (i, e) ->
+        hljs.highlightBlock(e)
   ###
@@ -253,6 +256,9 @@ class Notes
   updateNote: (xhr, note, status) =>
     note_li = $("#note_" + note.id)
     note_li.replaceWith(note.html)
+    code = "#note_" + note.id + " .highlight pre code"
+    $(code).each (i, e) ->
+      hljs.highlightBlock(e)
   ###
   Called in response to clicking the edit note link

app/assets/stylesheets/application.scss

@@ -5,6 +5,7 @@
  *= require jquery.ui.gitlab
  *= require jquery.atwho
  *= require select2
+ *= require highlightjs.min
  *= require_self
 */
@@ -38,6 +39,7 @@
 @import "generic/lists.scss";
 @import "generic/forms.scss";
 @import "generic/selects.scss";
+@import "generic/highlight.scss";
 /**
  * Page specific styles (issues, projects etc):

app/assets/stylesheets/generic/files.scss

@@ -143,75 +143,6 @@
      */
     &.code {
       padding: 0;
-
-      table.lines {
-        border: none;
-        box-shadow: none;
-        margin: 0px;
-        padding: 0px;
-        table-layout: fixed;
-
-        pre {
-          border: none;
-          border-radius: 0;
-          font-family: $monospace_font;
-          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;
-        }
-
-        pre.line_numbers {
-          color: #666;
-          padding: 10px 6px 10px 0;
-          text-align: right;
-          background: #EEE;
-
-          a {
-            color: #666;
-
-            i {
-              display: none;
-              font-size: 14px;
-              line-height: 14px;
-            }
-            &:hover i {
-              display: inherit;
-            }
-          }
-        }
-
-        .highlight {
-          border-left: 1px solid #DEE2E3;
-          overflow: auto;
-          overflow-y: hidden;
-
-          pre {
-            white-space: pre;
-            word-wrap: normal;
-
-            .line {
-              padding: 0 10px;
-            }
-          }
-        }
-      }
     }
   }
 }

app/assets/stylesheets/generic/highlight.scss

+.highlighted-data {
+  border: none;
+  box-shadow: none;
+  margin: 0px;
+  padding: 0px;
+  table-layout: fixed;
+
+  pre {
+    padding: 10px;
+    border: none;
+    border-radius: 0;
+    font-family: $monospace_font;
+    font-size: 12px !important;
+    line-height: 16px !important;
+    margin: 0;
+
+    code {
+      white-space: pre;
+      word-wrap: normal;
+      padding: 0;
+
+      .line {
+        display: inline;
+      }
+    }
+  }
+
+  .hljs {
+    padding: 0;
+  }
+
+  .line-numbers {
+    padding: 10px;
+    text-align: right;
+    float: left;
+    width: 60px;
+
+    a {
+      font-family: $monospace_font;
+      display: block;
+      font-size: 12px !important;
+      line-height: 16px !important;
+
+      i {
+        display: none;
+      }
+
+      &:hover i {
+        display: inline;
+      }
+    }
+  }
+
+  .highlight {
+    overflow: auto;
+    overflow-y: hidden;
+
+    pre {
+      white-space: pre;
+      word-wrap: normal;
+    }
+  }
+}

app/assets/stylesheets/highlight/dark.scss

-.dark .highlight {
-  background-color: #333;
+.dark {
+  background-color: #232323;
+  .line.hll {
+    background: #558;
+  }
+
+  .highlight{
+    border-left: 1px solid #444;
+  }
+
+  .line-numbers a {
+    color: #666;
+  }
   pre {
-    background-color: #333;
-    color: #eee;
-  }
-
-  .hll { display: block; background-color: darken($hover, 65%) }
-  .c { color: #888888; font-style: italic } /* Comment */
-  .err { color: #a61717; background-color: #e3d2d2 } /* Error */
-  .k { color: #CDA869; font-weight: bold } /* Keyword */
-  .kp { color: #CDA869; font-weight: bold } /* Keyword */
-  .cm { color: #888888 } /* Comment.Multiline */
-  .cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */
-  .c1 { color: #888888 } /* Comment.Single */
-  .cs { color: #cc0000; font-weight: bold; background-color: transparent } /* Comment.Special */
-  .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
-  .ge { font-style: italic } /* Generic.Emph */
-  .gr { color: #aa0000 } /* Generic.Error */
-  .gh { color: #303030 } /* Generic.Heading */
-  .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
-  .go { color: #888888 } /* Generic.Output */
-  .gp { color: #555555 } /* Generic.Prompt */
-  .gs { font-weight: bold } /* Generic.Strong */
-  .gu { color: #606060 } /* Generic.Subheading */
-  .gt { color: #aa0000 } /* Generic.Traceback */
-  .kc{font-weight: bold;} /* Keyword.Constant */
-  .kd{font-weight: bold;} /* Keyword.Declaration */
-  .kn{font-weight: bold;} /* Keyword.Namespace */
-  .kp{font-weight: bold;} /* Keyword.Pseudo */
-  .kr{font-weight: bold;} /* Keyword.Reserved */
-  .kt{color: #458;font-weight: bold;} /* Keyword.Type */
-  .m { color: #0000DD; font-weight: bold } /* Literal.Number */
-  .p { color: #eee;  }
-  .s { color: #0AD; background-color: transparent } /* Literal.String */
-  .na{color: #008080;} /* Name.Attribute */
-  .nb{color: #0086B3;} /* Name.Builtin */
-  .nc{color: #ccc;font-weight: bold;} /* Name.Class */
-  .no{color: turquoise;} /* Name.Constant */
-  .ni{color: #800080;}
-  .ne{color: #900;font-weight: bold;} /* Name.Exception */
-  .nf{color: #ccc;font-weight: bold;} /* Name.Function */
-  .nn{color: #79C3E0;font-weight: bold;} /* Name.Namespace */
-  .nt{color: #fc5;} /* Name.Tag */
-  .nv{color: #FA4;} /* Name.Variable */
-  .py { color: #336699; font-weight: bold } /* Name.Property */
-  .ow { color: #008800 } /* Operator.Word */
-  .w { color: #bbbbbb } /* Text.Whitespace */
-  .mf { color: #7AC; font-weight: bold } /* Literal.Number.Float */
-  .mh { color: #7AC; font-weight: bold } /* Literal.Number.Hex */
-  .mi {color: #099;} /* Literal.Number.Integer */
-  .mo { color: #0000DD; font-weight: bold } /* Literal.Number.Oct */
-  .sb { color: #dd2200; background-color: transparent; } /* Literal.String.Backtick */
-  .sc{color: #d14;} /* Literal.String.Char */
-  .sd { color: #dd2200; background-color: transparent; } /* Literal.String.Doc */
-  .s2{color: orange;} /* Literal.String.Double */
-  .se{color: orange;} /* Literal.String.Escape */
-  .sh{color: orange;} /* Literal.String.Heredoc */
-  .si{color: orange;} /* Literal.String.Interpol */
-  .sx{color: orange;} /* Literal.String.Other */
-  .sr{color: orange;} /* Literal.String.Regex */
-  .s1{color: orange;} /* Literal.String.Single */
-  .ss{color: orange;} /* Literal.String.Symbol */
-  .bp { color: #D58 } /* Name.Builtin.Pseudo */
-  .vc { color: #336699 } /* Name.Variable.Class */
-  .vg { color: #dd7700 } /* Name.Variable.Global */
-  .vi { color: cyan }
-}
+    background-color: #232323;
+  }
+
+  .hljs {
+    display: block;
+    background: #232323;
+    color: #E6E1DC;
+  }
+
+  .hljs-comment,
+  .hljs-template_comment,
+  .hljs-javadoc,
+  .hljs-shebang {
+    color: #BC9458;
+    font-style: italic;
+  }
+
+  .hljs-keyword,
+  .ruby .hljs-function .hljs-keyword,
+  .hljs-request,
+  .hljs-status,
+  .nginx .hljs-title,
+  .method,
+  .hljs-list .hljs-title {
+    color: #C26230;
+  }
+
+  .hljs-string,
+  .hljs-number,
+  .hljs-regexp,
+  .hljs-tag .hljs-value,
+  .hljs-cdata,
+  .hljs-filter .hljs-argument,
+  .hljs-attr_selector,
+  .apache .hljs-cbracket,
+  .hljs-date,
+  .tex .hljs-command,
+  .markdown .hljs-link_label {
+    color: #A5C261;
+  }
+
+  .hljs-subst {
+    color: #519F50;
+  }
+
+  .hljs-tag,
+  .hljs-tag .hljs-keyword,
+  .hljs-tag .hljs-title,
+  .hljs-doctype,
+  .hljs-sub .hljs-identifier,
+  .hljs-pi,
+  .input_number {
+    color: #E8BF6A;
+  }
+
+  .hljs-identifier {
+    color: #D0D0FF;
+  }
+
+  .hljs-class .hljs-title,
+  .haskell .hljs-type,
+  .smalltalk .hljs-class,
+  .hljs-javadoctag,
+  .hljs-yardoctag,
+  .hljs-phpdoc {
+    text-decoration: none;
+  }
+
+  .hljs-constant {
+    color: #DA4939;
+  }
+
+
+  .hljs-symbol,
+  .hljs-built_in,
+  .ruby .hljs-symbol .hljs-string,
+  .ruby .hljs-symbol .hljs-identifier,
+  .markdown .hljs-link_url,
+  .hljs-attribute {
+    color: #6D9CBE;
+  }
+
+  .markdown .hljs-link_url {
+    text-decoration: underline;
+  }
+
+
+  .hljs-params,
+  .hljs-variable,
+  .clojure .hljs-attribute {
+    color: #D0D0FF;
+  }
+
+  .css .hljs-tag,
+  .hljs-rules .hljs-property,
+  .hljs-pseudo,
+  .tex .hljs-special {
+    color: #CDA869;
+  }
+
+  .css .hljs-class {
+    color: #9B703F;
+  }
+
+  .hljs-rules .hljs-keyword {
+    color: #C5AF75;
+  }
+
+  .hljs-rules .hljs-value {
+    color: #CF6A4C;
+  }
+
+  .css .hljs-id {
+    color: #8B98AB;
+  }
+
+  .hljs-annotation,
+  .apache .hljs-sqbracket,
+  .nginx .hljs-built_in {
+    color: #9B859D;
+  }
+
+  .hljs-preprocessor,
+  .hljs-preprocessor *,
+  .hljs-pragma {
+    color: #8996A8 !important;
+  }
+
+  .hljs-hexcolor,
+  .css .hljs-value .hljs-number {
+    color: #A5C261;
+  }
+
+  .hljs-title,
+  .hljs-decorator,
+  .css .hljs-function {
+    color: #FFC66D;
+  }
+
+  .diff .hljs-header,
+  .hljs-chunk {
+    background-color: #2F33AB;
+    color: #E6E1DC;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .diff .hljs-change {
+    background-color: #4A410D;
+    color: #F8F8F8;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .hljs-addition {
+    background-color: #144212;
+    color: #E6E1DC;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .hljs-deletion {
+    background-color: #600;
+    color: #E6E1DC;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .coffeescript .javascript,
+  .javascript .xml,
+  .tex .hljs-formula,
+  .xml .javascript,
+  .xml .vbscript,
+  .xml .css,
+  .xml .hljs-cdata {
+    opacity: 0.7;
+  }
+}

app/assets/stylesheets/highlight/monokai.scss

-$monokai-fg: #f8f8f2;
-$monokai-comment: #75715e;
-$monokai-pink: #f92672;
-$monokai-blue: #66d9ef;
-$monokai-green: #a6e22e;
-$monokai-gold: #e6db74;
-$monokai-dark: #3b3a32;
-$monokai-purple: #ae81ff;
-.monokai .highlight {
-  background-color: #272822;
+.monokai {
+  background-color: #272822;
+  .highlight{
+    border-left: 1px solid #444;
+  }
+  .line.hll {
+    background: #558;
+  }
+
+  .line-numbers a {
+    color: #666;
+  }
   pre {
     background-color: #272822;
-    color: $monokai-fg;
+    color: #f8f8f2;
   }
-  .hll { background-color: darken($hover, 65%) }
-  .c  { color: $monokai-comment } /* Comment */
-  .err { color: $monokai-fg } /* Error */
-  .g  { color: $monokai-fg } /* Generic */
-  .k  { color: $monokai-pink } /* Keyword */
-  .l  { color: $monokai-fg } /* Literal */
-  .n  { color: $monokai-blue } /* Name */
-  .o  { color: $monokai-fg } /* Operator */
-  .x  { color: $monokai-fg } /* Other */
-  .p  { color: $monokai-fg } /* Punctuation */
-  .cm { color: $monokai-comment } /* Comment.Multiline */
-  .cp { color: $monokai-comment } /* Comment.Preproc */
-  .c1 { color: $monokai-comment } /* Comment.Single */
-  .cs { color: $monokai-comment } /* Comment.Special */
-  .gd { color: #8b0807 } /* Generic.Deleted */
-  .ge { color: $monokai-fg; text-decoration: underline } /* Generic.Emph */
-  .gr { color: $monokai-fg } /* Generic.Error */
-  .gh { color: $monokai-fg; font-weight: bold } /* Generic.Heading */
-  .gi { color: $monokai-fg; font-weight: bold; background-color: #46830c } /* Generic.Inserted */
-  .go { color: $monokai-dark; background-color: #31322c } /* Generic.Output */
-  .gp { color: $monokai-fg } /* Generic.Prompt */
-  .gs { color: $monokai-fg } /* Generic.Strong */
-  .gu { color: $monokai-fg; font-weight: bold } /* Generic.Subheading */
-  .gt { color: #f8f8f0; background-color: $monokai-pink } /* Generic.Traceback */
-  .kc { color: $monokai-purple } /* Keyword.Constant */
-  .kd { color: $monokai-pink } /* Keyword.Declaration */
-  .kn { color: $monokai-pink } /* Keyword.Namespace */
-  .kp { color: $monokai-pink } /* Keyword.Pseudo */
-  .kr { color: $monokai-pink } /* Keyword.Reserved */
-  .kt { color: $monokai-fg } /* Keyword.Type */
-  .ld { color: $monokai-fg } /* Literal.Date */
-  .m  { color: $monokai-purple } /* Literal.Number */
-  .s  { color: $monokai-gold } /* Literal.String */
-  .na { color: $monokai-purple } /* Name.Attribute */
-  .nb { color: $monokai-blue } /* Name.Builtin */
-  .nc { color: $monokai-fg } /* Name.Class */
-  .no { color: $monokai-fg } /* Name.Constant */
-  .nd { color: $monokai-fg } /* Name.Decorator */
-  .ni { color: $monokai-fg } /* Name.Entity */
-  .ne { color: $monokai-fg } /* Name.Exception */
-  .nf { color: $monokai-green } /* Name.Function */
-  .nl { color: $monokai-gold } /* Name.Label */
-  .nn { color: $monokai-fg } /* Name.Namespace */
-  .nx { color: $monokai-fg } /* Name.Other */
-  .nt { color: $monokai-pink } /* Name.Tag */
-  .nv { color: $monokai-blue; font-style: italic } /* Name.Variable */
-  .py { color: $monokai-fg } /* Name.Property */
-  .ow { color: $monokai-pink } /* Operator.Word */
-  .w  { color: $monokai-fg } /* Text.Whitespace */
-  .mf { color: $monokai-purple } /* Literal.Number.Float */
-  .mh { color: $monokai-purple } /* Literal.Number.Hex */
-  .mi { color: $monokai-purple } /* Literal.Number.Integer */
-  .mo { color: $monokai-purple } /* Literal.Number.Oct */
-  .sb { color: $monokai-gold } /* Literal.String.Backtick */
-  .sc { color: $monokai-gold } /* Literal.String.Char */
-  .sd { color: $monokai-gold } /* Literal.String.Doc */
-  .s2 { color: $monokai-gold } /* Literal.String.Double */
-  .se { color: $monokai-gold } /* Literal.String.Escape */
-  .sh { color: $monokai-gold } /* Literal.String.Heredoc */
-  .si { color: $monokai-gold } /* Literal.String.Interpol */
-  .sx { color: $monokai-gold } /* Literal.String.Other */
-  .sr { color: $monokai-gold } /* Literal.String.Regex */
-  .s1 { color: $monokai-gold } /* Literal.String.Single */
-  .ss { color: $monokai-gold } /* Literal.String.Symbol */
-  .bp { color: $monokai-fg } /* Name.Builtin.Pseudo */
-  .vc { color: $monokai-blue; font-style: italic } /* Name.Variable.Class */
-  .vg { color: $monokai-blue; font-style: italic } /* Name.Variable.Global */
-  .vi { color: $monokai-blue; font-style: italic } /* Name.Variable.Instance */
-  .il { color: $monokai-purple } /* Literal.Number.Integer.Long */
-}
+  .hljs {
+    display: block;
+    background: #272822;
+  }
+
+  .hljs-tag,
+  .hljs-tag .hljs-title,
+  .hljs-keyword,
+  .hljs-literal,
+  .hljs-strong,
+  .hljs-change,
+  .hljs-winutils,
+  .hljs-flow,
+  .lisp .hljs-title,
+  .clojure .hljs-built_in,
+  .nginx .hljs-title,
+  .tex .hljs-special {
+    color: #F92672;
+  }
+
+  .hljs {
+    color: #DDD;
+  }
+
+  .hljs .hljs-constant,
+  .asciidoc .hljs-code {
+    color: #66D9EF;
+  }
+
+  .hljs-code,
+  .hljs-class .hljs-title,
+  .hljs-header {
+    color: white;
+  }
+
+  .hljs-link_label,
+  .hljs-attribute,
+  .hljs-symbol,
+  .hljs-symbol .hljs-string,
+  .hljs-value,
+  .hljs-regexp {
+    color: #BF79DB;
+  }
+
+  .hljs-link_url,
+  .hljs-tag .hljs-value,
+  .hljs-string,
+  .hljs-bullet,
+  .hljs-subst,
+  .hljs-title,
+  .hljs-emphasis,
+  .haskell .hljs-type,
+  .hljs-preprocessor,
+  .hljs-pragma,
+  .ruby .hljs-class .hljs-parent,
+  .hljs-built_in,
+  .sql .hljs-aggregate,
+  .django .hljs-template_tag,
+  .django .hljs-variable,
+  .smalltalk .hljs-class,
+  .hljs-javadoc,
+  .django .hljs-filter .hljs-argument,
+  .smalltalk .hljs-localvars,
+  .smalltalk .hljs-array,
+  .hljs-attr_selector,
+  .hljs-pseudo,
+  .hljs-addition,
+  .hljs-stream,
+  .hljs-envvar,
+  .apache .hljs-tag,
+  .apache .hljs-cbracket,
+  .tex .hljs-command,
+  .hljs-prompt {
+    color: #A6E22E;
+  }
+  .hljs-comment,
+  .java .hljs-annotation,
+  .smartquote,
+  .hljs-blockquote,
+  .hljs-horizontal_rule,
+  .python .hljs-decorator,
+  .hljs-template_comment,
+  .hljs-pi,
+  .hljs-doctype,
+  .hljs-deletion,
+  .hljs-shebang,
+  .apache .hljs-sqbracket,
+  .tex .hljs-formula {
+    color: #75715E;
+  }
+
+  .hljs-keyword,
+  .hljs-literal,
+  .css .hljs-id,
+  .hljs-phpdoc,
+  .hljs-title,
+  .hljs-header,
+  .haskell .hljs-type,
+  .vbscript .hljs-built_in,
+  .sql .hljs-aggregate,
+  .rsl .hljs-built_in,
+  .smalltalk .hljs-class,
+  .diff .hljs-header,
+  .hljs-chunk,
+  .hljs-winutils,
+  .bash .hljs-variable,
+  .apache .hljs-tag,
+  .tex .hljs-special,
+  .hljs-request,
+  .hljs-status {
+    font-weight: bold;
+  }
+
+  .coffeescript .javascript,
+  .javascript .xml,
+  .tex .hljs-formula,
+  .xml .javascript,
+  .xml .vbscript,
+  .xml .css,
+  .xml .hljs-cdata {
+    opacity: 0.5;
+  }
+}

app/assets/stylesheets/highlight/solarized_dark.scss

-.solarized-dark .highlight {
-  
+.solarized-dark {
   background-color: #002B36;
-  
+
+  .highlight{
+    border-left: 1px solid #113b46;
+  }
+
+  .line.hll {
+    background: #000;
+  }
+
   pre {
     background-color: #002B36;
     color: #eee;
   }
-  .hll { background-color: #073642 }
-  .c { color: #586E75 } /* Comment */
-  .err { color: #93A1A1 } /* Error */
-  .g { color: #93A1A1 } /* Generic */
-  .k { color: #859900 } /* Keyword */
-  .l { color: #93A1A1 } /* Literal */
-  .n { color: #93A1A1 } /* Name */
-  .o { color: #859900 } /* Operator */
-  .x { color: #CB4B16 } /* Other */
-  .p { color: #93A1A1 } /* Punctuation */
-  .cm { color: #586E75 } /* Comment.Multiline */
-  .cp { color: #859900 } /* Comment.Preproc */
-  .c1 { color: #586E75 } /* Comment.Single */
-  .cs { color: #859900 } /* Comment.Special */
-  .gd { color: #2AA198 } /* Generic.Deleted */
-  .ge { color: #93A1A1; font-style: italic } /* Generic.Emph */
-  .gr { color: #DC322F } /* Generic.Error */
-  .gh { color: #CB4B16 } /* Generic.Heading */
-  .gi { color: #859900 } /* Generic.Inserted */
-  .go { color: #93A1A1 } /* Generic.Output */
-  .gp { color: #93A1A1 } /* Generic.Prompt */
-  .gs { color: #93A1A1; font-weight: bold } /* Generic.Strong */
-  .gu { color: #CB4B16 } /* Generic.Subheading */
-  .gt { color: #93A1A1 } /* Generic.Traceback */
-  .kc { color: #CB4B16 } /* Keyword.Constant */
-  .kd { color: #268BD2 } /* Keyword.Declaration */
-  .kn { color: #859900 } /* Keyword.Namespace */
-  .kp { color: #859900 } /* Keyword.Pseudo */
-  .kr { color: #268BD2 } /* Keyword.Reserved */
-  .kt { color: #DC322F } /* Keyword.Type */
-  .ld { color: #93A1A1 } /* Literal.Date */
-  .m { color: #2AA198 } /* Literal.Number */
-  .s { color: #2AA198 } /* Literal.String */
-  .na { color: #93A1A1 } /* Name.Attribute */
-  .nb { color: #B58900 } /* Name.Builtin */
-  .nc { color: #268BD2 } /* Name.Class */
-  .no { color: #CB4B16 } /* Name.Constant */
-  .nd { color: #268BD2 } /* Name.Decorator */
-  .ni { color: #CB4B16 } /* Name.Entity */
-  .ne { color: #CB4B16 } /* Name.Exception */
-  .nf { color: #268BD2 } /* Name.Function */
-  .nl { color: #93A1A1 } /* Name.Label */
-  .nn { color: #93A1A1 } /* Name.Namespace */
-  .nx { color: #93A1A1 } /* Name.Other */
-  .py { color: #93A1A1 } /* Name.Property */
-  .nt { color: #268BD2 } /* Name.Tag */
-  .nv { color: #268BD2 } /* Name.Variable */
-  .ow { color: #859900 } /* Operator.Word */
-  .w { color: #93A1A1 } /* Text.Whitespace */
-  .mf { color: #2AA198 } /* Literal.Number.Float */
-  .mh { color: #2AA198 } /* Literal.Number.Hex */
-  .mi { color: #2AA198 } /* Literal.Number.Integer */
-  .mo { color: #2AA198 } /* Literal.Number.Oct */
-  .sb { color: #586E75 } /* Literal.String.Backtick */
-  .sc { color: #2AA198 } /* Literal.String.Char */
-  .sd { color: #93A1A1 } /* Literal.String.Doc */
-  .s2 { color: #2AA198 } /* Literal.String.Double */
-  .se { color: #CB4B16 } /* Literal.String.Escape */
-  .sh { color: #93A1A1 } /* Literal.String.Heredoc */
-  .si { color: #2AA198 } /* Literal.String.Interpol */
-  .sx { color: #2AA198 } /* Literal.String.Other */
-  .sr { color: #DC322F } /* Literal.String.Regex */
-  .s1 { color: #2AA198 } /* Literal.String.Single */
-  .ss { color: #2AA198 } /* Literal.String.Symbol */
-  .bp { color: #268BD2 } /* Name.Builtin.Pseudo */
-  .vc { color: #268BD2 } /* Name.Variable.Class */
-  .vg { color: #268BD2 } /* Name.Variable.Global */
-  .vi { color: #268BD2 } /* Name.Variable.Instance */
-  .il { color: #2AA198 } /* Literal.Number.Integer.Long */
-}
+  .line-numbers a {
+    color: #666;
+  }
+  .hljs {
+    display: block;
+    background: #002b36;
+    color: #839496;
+  }
+
+  .hljs-comment,
+  .hljs-template_comment,
+  .diff .hljs-header,
+  .hljs-doctype,
+  .hljs-pi,
+  .lisp .hljs-string,
+  .hljs-javadoc {
+    color: #586e75;
+  }
+
+  /* Solarized Green */
+  .hljs-keyword,
+  .hljs-winutils,
+  .method,
+  .hljs-addition,
+  .css .hljs-tag,
+  .hljs-request,
+  .hljs-status,
+  .nginx .hljs-title {
+    color: #859900;
+  }
+
+  /* Solarized Cyan */
+  .hljs-number,
+  .hljs-command,
+  .hljs-string,
+  .hljs-tag .hljs-value,
+  .hljs-rules .hljs-value,
+  .hljs-phpdoc,
+  .tex .hljs-formula,
+  .hljs-regexp,
+  .hljs-hexcolor,
+  .hljs-link_url {
+    color: #2aa198;
+  }
+
+  /* Solarized Blue */
+  .hljs-title,
+  .hljs-localvars,
+  .hljs-chunk,
+  .hljs-decorator,
+  .hljs-built_in,
+  .hljs-identifier,
+  .vhdl .hljs-literal,
+  .hljs-id,
+  .css .hljs-function {
+    color: #268bd2;
+  }
+
+  /* Solarized Yellow */
+  .hljs-attribute,
+  .hljs-variable,
+  .lisp .hljs-body,
+  .smalltalk .hljs-number,
+  .hljs-constant,
+  .hljs-class .hljs-title,
+  .hljs-parent,
+  .haskell .hljs-type,
+  .hljs-link_reference {
+    color: #b58900;
+  }
+
+  /* Solarized Orange */
+  .hljs-preprocessor,
+  .hljs-preprocessor .hljs-keyword,
+  .hljs-pragma,
+  .hljs-shebang,
+  .hljs-symbol,
+  .hljs-symbol .hljs-string,
+  .diff .hljs-change,
+  .hljs-special,
+  .hljs-attr_selector,
+  .hljs-subst,
+  .hljs-cdata,
+  .clojure .hljs-title,
+  .css .hljs-pseudo,
+  .hljs-header {
+    color: #cb4b16;
+  }
+
+  /* Solarized Red */
+  .hljs-deletion,
+  .hljs-important {
+    color: #dc322f;
+  }
+
+  /* Solarized Violet */
+  .hljs-link_label {
+    color: #6c71c4;
+  }
+
+  .tex .hljs-formula {
+    background: #073642;
+  }
+}

app/assets/stylesheets/highlight/white.scss

-.white .highlight {
-  
+.white {
   background-color: #fff;
-  
+
+  .line.hll {
+    background: #FFA;
+  }
+
+  .highlight{
+    border-left: 1px solid #eee;
+  }
+
   pre {
     background-color: #fff;
     color: #333;
   }
-  .hll { display: block; background-color: $hover }
-  .c { color: #888888; font-style: italic } /* Comment */
-  .err { color: #a61717; background-color: #e3d2d2 } /* Error */
-  .k { color: #000000; font-weight: bold } /* Keyword */
-  .cm { color: #888888 } /* Comment.Multiline */
-  .cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */
-  .c1 { color: #888888 } /* Comment.Single */
-  .cs { color: #cc0000; font-weight: bold; background-color: #fff0f0 } /* Comment.Special */
-  .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
-  .ge { font-style: italic } /* Generic.Emph */
-  .gr { color: #aa0000 } /* Generic.Error */
-  .gh { color: #303030 } /* Generic.Heading */
-  .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
-  .go { color: #888888 } /* Generic.Output */
-  .gp { color: #555555 } /* Generic.Prompt */
-  .gs { font-weight: bold } /* Generic.Strong */
-  .gu { color: #606060 } /* Generic.Subheading */
-  .gt { color: #aa0000 } /* Generic.Traceback */
-  .kc{font-weight: bold;} /* Keyword.Constant */
-  .kd{font-weight: bold;} /* Keyword.Declaration */
-  .kn{font-weight: bold;} /* Keyword.Namespace */
-  .kp{font-weight: bold;} /* Keyword.Pseudo */
-  .kr{font-weight: bold;} /* Keyword.Reserved */
-  .kt{color: #458;font-weight: bold;} /* Keyword.Type */
-  .m { color: #0000DD; font-weight: bold } /* Literal.Number */
-  .s { color: #dd2200; background-color: #fff0f0 } /* Literal.String */
-  .na{color: #008080;} /* Name.Attribute */
-  .nb{color: #0086B3;} /* Name.Builtin */
-  .nc{color: #458;font-weight: bold;} /* Name.Class */
-  .no{color: #008080;} /* Name.Constant */
-  .ni{color: #800080;}
-  .ne{color: #900;font-weight: bold;} /* Name.Exception */
-  .nf{color: #900;font-weight: bold;} /* Name.Function */
-  .nn{color: #005;font-weight: bold;} /* Name.Namespace */
-  .nt{color: #000080;} /* Name.Tag */
-  .nv{color: #008080;} /* Name.Variable */
-  .py { color: #336699; font-weight: bold } /* Name.Property */
-  .ow { color: #008800 } /* Operator.Word */
-  .w { color: #bbbbbb } /* Text.Whitespace */
-  .mf { color: #0000DD; font-weight: bold } /* Literal.Number.Float */
-  .mh { color: #0000DD; font-weight: bold } /* Literal.Number.Hex */
-  .mi {color: #099;} /* Literal.Number.Integer */
-  .mo { color: #0000DD; font-weight: bold } /* Literal.Number.Oct */
-  .sb { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Backtick */
-  .sc{color: #d14;} /* Literal.String.Char */
-  .sd { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Doc */
-  .s2{color: #d14;} /* Literal.String.Double */
-  .se{color: #d14;} /* Literal.String.Escape */
-  .sh{color: #d14;} /* Literal.String.Heredoc */
-  .si{color: #d14;} /* Literal.String.Interpol */
-  .sx{color: #d14;} /* Literal.String.Other */
-  .sr{color: #d14;} /* Literal.String.Regex */
-  .s1{color: #d14;} /* Literal.String.Single */
-  .ss{color: #d14;} /* Literal.String.Symbol */
-  .bp { color: #003388 } /* Name.Builtin.Pseudo */
-  .vc { color: #336699 } /* Name.Variable.Class */
-  .vg { color: #dd7700 } /* Name.Variable.Global */
-  .vi { color: #3333bb }
+  .hljs {
+    background: #FFF;
+  }
+
+  .line-numbers a {
+    color: #999;
+  }
+
+  .hljs {
+    display: block;
+    background: #fff; color: black;
+  }
+
+  .hljs-comment,
+  .hljs-template_comment,
+  .hljs-javadoc,
+  .hljs-comment * {
+    color: #006a00;
+  }
+
+  .hljs-keyword,
+  .hljs-literal,
+  .nginx .hljs-title {
+    color: #aa0d91;
+  }
+  .method,
+  .hljs-list .hljs-title,
+  .hljs-tag .hljs-title,
+  .setting .hljs-value,
+  .hljs-winutils,
+  .tex .hljs-command,
+  .http .hljs-title,
+  .hljs-request,
+  .hljs-status {
+    color: #008;
+  }
+
+  .hljs-envvar,
+  .tex .hljs-special {
+    color: #660;
+  }
+
+  .hljs-string {
+    color: #c41a16;
+  }
+  .hljs-tag .hljs-value,
+  .hljs-cdata,
+  .hljs-filter .hljs-argument,
+  .hljs-attr_selector,
+  .apache .hljs-cbracket,
+  .hljs-date,
+  .hljs-regexp {
+    color: #080;
+  }
+
+  .hljs-sub .hljs-identifier,
+  .hljs-pi,
+  .hljs-tag,
+  .hljs-tag .hljs-keyword,
+  .hljs-decorator,
+  .ini .hljs-title,
+  .hljs-shebang,
+  .hljs-prompt,
+  .hljs-hexcolor,
+  .hljs-rules .hljs-value,
+  .hljs-symbol,
+  .hljs-symbol .hljs-string,
+  .hljs-number,
+  .css .hljs-function,
+  .clojure .hljs-title,
+  .clojure .hljs-built_in,
+  .hljs-function .hljs-title,
+  .coffeescript .hljs-attribute {
+    color: #1c00cf;
+  }
+
+  .hljs-class .hljs-title,
+  .haskell .hljs-type,
+  .smalltalk .hljs-class,
+  .hljs-javadoctag,
+  .hljs-yardoctag,
+  .hljs-phpdoc,
+  .hljs-typename,
+  .hljs-tag .hljs-attribute,
+  .hljs-doctype,
+  .hljs-class .hljs-id,
+  .hljs-built_in,
+  .setting,
+  .hljs-params,
+  .clojure .hljs-attribute {
+    color: #5c2699;
+  }
+
+  .hljs-variable {
+   color: #3f6e74;
+  }
+  .css .hljs-tag,
+  .hljs-rules .hljs-property,
+  .hljs-pseudo,
+  .hljs-subst {
+    color: #000;
+  }
+
+  .css .hljs-class,
+  .css .hljs-id {
+    color: #9B703F;
+  }
+
+  .hljs-value .hljs-important {
+    color: #ff7700;
+    font-weight: bold;
+  }
+
+  .hljs-rules .hljs-keyword {
+    color: #C5AF75;
+  }
+
+  .hljs-annotation,
+  .apache .hljs-sqbracket,
+  .nginx .hljs-built_in {
+    color: #9B859D;
+  }
+
+  .hljs-preprocessor,
+  .hljs-preprocessor *,
+  .hljs-pragma {
+    color: #643820;
+  }
+
+  .tex .hljs-formula {
+    background-color: #EEE;
+    font-style: italic;
+  }
+
+  .diff .hljs-header,
+  .hljs-chunk {
+    color: #808080;
+    font-weight: bold;
+  }
+
+  .diff .hljs-change {
+    background-color: #BCCFF9;
+  }
+
+  .hljs-addition {
+    background-color: #BAEEBA;
+  }
+
+  .hljs-deletion {
+    background-color: #FFC8BD;
+  }
+
+  .hljs-comment .hljs-yardoctag {
+    font-weight: bold;
+  }
+
+  .method .hljs-id {
+    color: #000;
+  }
 }
 .shadow {

app/assets/stylesheets/main/mixins.scss

@@ -128,7 +128,7 @@
     }
   }
-  code {
+  p > code {
     font-size: inherit;
     font-weight: inherit;
     color: #555;

app/assets/stylesheets/sections/notes.scss

@@ -92,10 +92,6 @@ ul.notes {
     .note-body {
       @include md-typography;
       margin-left: 45px;
-
-      .highlight {
-        @include border-radius(4px);
-      }
     }
     .note-header {
       padding-bottom: 5px;

app/helpers/application_helper.rb

@@ -203,8 +203,14 @@ module ApplicationHelper
   def highlight_js(&block)
     string = capture(&block)
-    content_tag :div, class: user_color_scheme_class do
-      Pygments::Lexer[:js].highlight(string).html_safe
+    content_tag :div, class: "highlighted-data #{user_color_scheme_class}" do
+      content_tag :div, class: 'highlight' do
+        content_tag :pre do
+          content_tag :code do
+            string.html_safe
+          end
+        end
+      end
     end
   end

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

@@ -8,7 +8,6 @@
 - else
   .file-content.code
     - unless blob.empty?
-      %div{class: user_color_scheme_class}
-        = raw blob.colorize(formatter: :gitlab)
+      = render 'shared/file_hljs', blob: blob
     - else
       %p.nothing_here_message Empty file

app/views/projects/snippets/_blob.html.haml

@@ -9,7 +9,6 @@
         = link_to "raw", raw_project_snippet_path(@project, @snippet), class: "btn btn-tiny", target: "_blank"
   .file-content.code
     - unless @snippet.content.empty?
-      %div{class: user_color_scheme_class}
-        = raw @snippet.colorize(formatter: :gitlab)
+      = render 'shared/file_hljs', blob: @snippet
     - else
       %p.nothing_here_message Empty file

app/views/shared/_file_hljs.html.haml

+%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

app/views/snippets/_blob.html.haml

@@ -18,8 +18,7 @@
         = render_markup(@snippet.file_name, @snippet.data)
     - else
       .file-content.code
-        %div{class: user_color_scheme_class}
-          = raw @snippet.colorize(formatter: :gitlab)
+        = render 'shared/file_hljs', blob: @snippet
   - else
     .file-content.code
       %p.nothing_here_message Empty file

doc/raketasks/user_management.md

 ### Add user as a developer to all projects
-```
+```bash
 bundle exec rake gitlab:import:user_to_projects[username@domain.tld]
 ```
@@ -11,6 +11,6 @@ Notes:
 * admin users are added as masters
-```
+```bash
 bundle exec rake gitlab:import:all_users_to_all_projects
 ```

lib/redcarpet/render/gitlab_html.rb

@@ -12,10 +12,6 @@ class Redcarpet::Render::GitlabHTML < Redcarpet::Render::HTML
   end
   def block_code(code, language)
-    options = { options: {encoding: 'utf-8'} }
-    lexer = Pygments::Lexer.find(language) # language can be an alias
-    options.merge!(lexer: lexer.aliases[0].downcase) if lexer # downcase is required
-
     # New lines are placed to fix an rendering issue
     # with code wrapped inside <h1> tag for next case:
     #
@@ -25,7 +21,11 @@ class Redcarpet::Render::GitlabHTML < Redcarpet::Render::HTML
     #
     <<-HTML
-       <div class="#{h.user_color_scheme_class}">#{Pygments.highlight(code, options)}</div>
+<div class="highlighted-data #{h.user_color_scheme_class}">
+  <div class="highlight">
+    <pre><code class="#{language}">#{code}</code></pre>
+  </div>
+</div>
     HTML
   end