Merge branch 'none-syntax-highlighting' into 'master'

Add "none" syntax highlighting "color" scheme

Closes #32109

See merge request gitlab-org/gitlab-ce!20170

6 files changed, 272 insertions, 3 deletions

diff --git a/app/assets/images/none-scheme-preview.png b/app/assets/images/none-scheme-preview.png
new file mode 100644
index 00000000000..2eb6bf96671
--- /dev/null
+++ b/app/assets/images/none-scheme-preview.png
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index 985fac11c87..bdf20866197 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -47,6 +47,7 @@
 @import "highlight/solarized_dark";
 @import "highlight/solarized_light";
 @import "highlight/white";
+@import "highlight/none";
 
 /*
  * Styles for JS behaviors.
diff --git a/app/assets/stylesheets/highlight/none.scss b/app/assets/stylesheets/highlight/none.scss
new file mode 100644
index 00000000000..7d692a87e33
--- /dev/null
+++ b/app/assets/stylesheets/highlight/none.scss
@@ -0,0 +1,242 @@
+/*
+* None Syntax Colors
+*/
+
+
+
+@mixin matchLine {
+  color: $black-transparent;
+  background-color: $white-normal;
+}
+
+.code.none {
+    // Line numbers
+  .line-numbers,
+  .diff-line-num {
+    background-color: $gray-light;
+  }
+
+  .diff-line-num,
+  .diff-line-num a {
+    color: $black-transparent;
+  }
+
+  // Code itself
+  pre.code,
+  .diff-line-num {
+    border-color: $white-normal;
+  }
+
+  &,
+  pre.code,
+  .line_holder .line_content {
+    background-color: $white-light;
+    color: $gl-text-color;
+  }
+
+// Diff line
+
+  $none-over-bg: #ded7fc;
+  $none-expanded-border: #e0e0e0;
+  $none-expanded-bg: #f7f7f7;
+
+  .line_holder {
+
+    &.match .line_content,
+    .new-nonewline.line_content,
+    .old-nonewline.line_content {
+      @include matchLine;
+    }
+
+    .diff-line-num {
+      &.old {
+        background-color: $line-number-old;
+        border-color: $line-removed-dark;
+
+        a {
+          color: scale-color($line-number-old, $red: -30%, $green: -30%, $blue: -30%);
+        }
+      }
+
+      &.new {
+        background-color: $line-number-new;
+        border-color: $line-added-dark;
+
+        a {
+          color: scale-color($line-number-new, $red: -30%, $green: -30%, $blue: -30%);
+        }
+      }
+
+      &.is-over,
+      &.hll:not(.empty-cell).is-over {
+        background-color: $none-over-bg;
+        border-color: darken($none-over-bg, 5%);
+
+        a {
+          color: darken($none-over-bg, 15%);
+        }
+      }
+
+      &.hll:not(.empty-cell) {
+        background-color: $line-number-select;
+        border-color: $line-select-yellow-dark;
+      }
+    }
+
+    &:not(.diff-expanded) + .diff-expanded,
+    &.diff-expanded + .line_holder:not(.diff-expanded) {
+      > .diff-line-num,
+      > .line_content {
+        border-top: 1px solid $none-expanded-border;
+      }
+    }
+
+    &.diff-expanded {
+      > .diff-line-num,
+      > .line_content {
+        background: $none-expanded-bg;
+        border-color: $none-expanded-bg;
+      }
+    }
+
+    .line_content {
+      &.old {
+        background-color: $line-removed;
+
+        &::before {
+          color: scale-color($line-number-old, $red: -30%, $green: -30%, $blue: -30%);
+        }
+
+        span.idiff {
+          background-color: $line-removed-dark;
+        }
+      }
+
+      &.new {
+        background-color: $line-added;
+
+        &::before {
+          color: scale-color($line-number-new, $red: -30%, $green: -30%, $blue: -30%);
+        }
+
+        span.idiff {
+          background-color: $line-added-dark;
+        }
+      }
+
+      &.match {
+        @include matchLine;
+      }
+
+      &.hll:not(.empty-cell) {
+        background-color: $line-select-yellow;
+      }
+    }
+  }
+
+  // highlight line via anchor
+  pre .hll {
+    background-color: $white-normal;
+  }
+
+    // Search result highlight
+  span.highlight_word {
+    background-color: $white-normal;
+  }
+
+    // Links to URLs, emails, or dependencies
+  .line a {
+    color: $gl-text-color;
+    text-decoration: underline;
+  }
+
+  .hll { background-color: $white-light; }
+
+  .gd {
+    color: $gl-text-color;
+    background-color: $white-light;
+
+    .x {
+      color: $gl-text-color;
+      background-color: $white-light;
+    }
+  }
+
+  .gi {
+    color: $gl-text-color;
+    background-color: $white-light;
+
+    .x {
+      color: $gl-text-color;
+      background-color: $white-light;
+    }
+  }
+
+  .c { color: $gl-text-color; } /* Comment */
+  .err { color: $gl-text-color; } /* Error */
+  .g { color: $gl-text-color; } /* Generic */
+  .k { color: $gl-text-color; } /* Keyword */
+  .l { color: $gl-text-color; } /* Literal */
+  .n { color: $gl-text-color; } /* Name */
+  .o { color: $gl-text-color; } /* Operator */
+  .x { color: $gl-text-color; } /* Other */
+  .p { color: $gl-text-color; } /* Punctuation */
+  .cm { color: $gl-text-color; } /* Comment.Multiline */
+  .cp { color: $gl-text-color; } /* Comment.Preproc */
+  .c1 { color: $gl-text-color; } /* Comment.Single */
+  .cs { color: $gl-text-color; } /* Comment.Special */
+  .ge { color: $gl-text-color; } /* Generic.Emph */
+  .gr { color: $gl-text-color; } /* Generic.Error */
+  .gh { color: $gl-text-color; } /* Generic.Heading */
+  .go { color: $gl-text-color; } /* Generic.Output */
+  .gp { color: $gl-text-color; } /* Generic.Prompt */
+  .gs { color: $gl-text-color; } /* Generic.Strong */
+  .gu { color: $gl-text-color; } /* Generic.Subheading */
+  .gt { color: $gl-text-color; } /* Generic.Traceback */
+  .kc { color: $gl-text-color; } /* Keyword.Constant */
+  .kd { color: $gl-text-color; } /* Keyword.Declaration */
+  .kn { color: $gl-text-color; } /* Keyword.Namespace */
+  .kp { color: $gl-text-color; } /* Keyword.Pseudo */
+  .kr { color: $gl-text-color; } /* Keyword.Reserved */
+  .kt { color: $gl-text-color; } /* Keyword.Type */
+  .ld { color: $gl-text-color; } /* Literal.Date */
+  .m { color: $gl-text-color; } /* Literal.Number */
+  .s { color: $gl-text-color; } /* Literal.String */
+  .na { color: $gl-text-color; } /* Name.Attribute */
+  .nb { color: $gl-text-color; } /* Name.Builtin */
+  .nc { color: $gl-text-color; } /* Name.Class */
+  .no { color: $gl-text-color; } /* Name.Constant */
+  .nd { color: $gl-text-color; } /* Name.Decorator */
+  .ni { color: $gl-text-color; } /* Name.Entity */
+  .ne { color: $gl-text-color; } /* Name.Exception */
+  .nf { color: $gl-text-color; } /* Name.Function */
+  .nl { color: $gl-text-color; } /* Name.Label */
+  .nn { color: $gl-text-color; } /* Name.Namespace */
+  .nx { color: $gl-text-color; } /* Name.Other */
+  .py { color: $gl-text-color; } /* Name.Property */
+  .nt { color: $gl-text-color; } /* Name.Tag */
+  .nv { color: $gl-text-color; } /* Name.Variable */
+  .ow { color: $gl-text-color; } /* Operator.Word */
+  .w { color: $gl-text-color; } /* Text.Whitespace */
+  .mf { color: $gl-text-color; } /* Literal.Number.Float */
+  .mh { color: $gl-text-color; } /* Literal.Number.Hex */
+  .mi { color: $gl-text-color; } /* Literal.Number.Integer */
+  .mo { color: $gl-text-color; } /* Literal.Number.Oct */
+  .sb { color: $gl-text-color; } /* Literal.String.Backtick */
+  .sc { color: $gl-text-color; } /* Literal.String.Char */
+  .sd { color: $gl-text-color; } /* Literal.String.Doc */
+  .s2 { color: $gl-text-color; } /* Literal.String.Double */
+  .se { color: $gl-text-color; } /* Literal.String.Escape */
+  .sh { color: $gl-text-color; } /* Literal.String.Heredoc */
+  .si { color: $gl-text-color; } /* Literal.String.Interpol */
+  .sx { color: $gl-text-color; } /* Literal.String.Other */
+  .sr { color: $gl-text-color; } /* Literal.String.Regex */
+  .s1 { color: $gl-text-color; } /* Literal.String.Single */
+  .ss { color: $gl-text-color; } /* Literal.String.Symbol */
+  .bp { color: $gl-text-color; } /* Name.Builtin.Pseudo */
+  .vc { color: $gl-text-color; } /* Name.Variable.Class */
+  .vg { color: $gl-text-color; } /* Name.Variable.Global */
+  .vi { color: $gl-text-color; } /* Name.Variable.Instance */
+  .il { color: $gl-text-color; } /* Literal.Number.Integer.Long */
+
+}
diff --git a/app/assets/stylesheets/pages/merge_conflicts.scss b/app/assets/stylesheets/pages/merge_conflicts.scss
index d26659701e1..e0f7d075fc7 100644
--- a/app/assets/stylesheets/pages/merge_conflicts.scss
+++ b/app/assets/stylesheets/pages/merge_conflicts.scss
@@ -93,8 +93,28 @@ $colors: (
   solarized-dark-line-origin-chosen    : rgba(#2878c9, .35),
   solarized-dark-button-origin-chosen  : #0082cc,
 
-  solarized-dark-header-not-chosen     : rgba(#839496, .25),
-  solarized-dark-line-not-chosen       : rgba(#839496, .15)
+  solarized_dark_header_not_chosen     : rgba(#839496, .25),
+  solarized_dark_line_not_chosen       : rgba(#839496, .15),
+
+  none_header_head_neutral   : $gray-normal,
+  none_line_head_neutral     : $gray-normal,
+  none_button_head_neutral   : $gray-normal,
+
+  none_header_head_chosen    : $gray-darker,
+  none_line_head_chosen      : $gray-darker,
+  none_button_head_chosen    : $gray-darker,
+
+  none_header_origin_neutral : $gray-normal,
+  none_line_origin_neutral   : $gray-normal,
+  none_button_origin_neutral : $gray-normal,
+
+  none_header_origin_chosen  : $gray-darker,
+  none_line_origin_chosen    : $gray-darker,
+  none_button_origin_chosen  : $gray-darker,
+
+  none_header_not_chosen     : $gray-light,
+  none_line_not_chosen       : $gray-light
+
 );
 // scss-lint:enable ColorVariable
 
diff --git a/changelogs/unreleased/none-syntax-highlighting.yml b/changelogs/unreleased/none-syntax-highlighting.yml
new file mode 100644
index 00000000000..b373aac7c02
--- /dev/null
+++ b/changelogs/unreleased/none-syntax-highlighting.yml
@@ -0,0 +1,5 @@
+---
+title: Add no-color theme for syntax highlighting.
+merge_request: !20170
+author: khm
+type: added
diff --git a/lib/gitlab/color_schemes.rb b/lib/gitlab/color_schemes.rb
index a5e4065cf09..881e5dbc923 100644
--- a/lib/gitlab/color_schemes.rb
+++ b/lib/gitlab/color_schemes.rb
@@ -12,7 +12,8 @@ module Gitlab
       Scheme.new(2, 'Dark',            'dark'),
       Scheme.new(3, 'Solarized Light', 'solarized-light'),
       Scheme.new(4, 'Solarized Dark',  'solarized-dark'),
-      Scheme.new(5, 'Monokai',         'monokai')
+      Scheme.new(5, 'Monokai',         'monokai'),
+      Scheme.new(6, 'None',            'none')
     ].freeze
 
     # Convenience method to get a space-separated String of all the color scheme