Moved color values into variables

5 files changed, 20 insertions, 15 deletions

diff --git a/app/assets/stylesheets/highlight/dark.scss b/app/assets/stylesheets/highlight/dark.scss
index c26edec8ee3..db6c99ff8d3 100644
--- a/app/assets/stylesheets/highlight/dark.scss
+++ b/app/assets/stylesheets/highlight/dark.scss
@@ -20,6 +20,7 @@ $dark-highlight-bg: #ffe792;
 $dark-highlight-color: $black;
 $dark-pre-hll-bg: #373b41;
 $dark-hll-bg: #373b41;
+$dark-over-bg: #ded7fc;
 $dark-c: #969896;
 $dark-err: #c66;
 $dark-k: #b294bb;
@@ -141,11 +142,11 @@ $dark-il: #de935f;
 
     .diff-line-num {
       &.is-over {
-        background-color: #ded7fc;
-        border-color: darken(#ded7fc, 5%);
+        background-color: $dark-over-bg;
+        border-color: darken($dark-over-bg, 5%);
 
         a {
-          color: darken(#ded7fc, 15%);
+          color: darken($dark-over-bg, 15%);
         }
       }
     }
diff --git a/app/assets/stylesheets/highlight/monokai.scss b/app/assets/stylesheets/highlight/monokai.scss
index b311e1085c1..d5d238095ba 100644
--- a/app/assets/stylesheets/highlight/monokai.scss
+++ b/app/assets/stylesheets/highlight/monokai.scss
@@ -13,6 +13,7 @@ $monokai-line-empty-bg: #49483e;
 $monokai-line-empty-border: darken($monokai-line-empty-bg, 15%);
 $monokai-diff-border: #808080;
 $monokai-highlight-bg: #ffe792;
+$monokai-over-bg: #9f9ab5;
 
 $monokai-new-bg: rgba(166, 226, 46, 0.1);
 $monokai-new-idiff: rgba(166, 226, 46, 0.15);
@@ -141,11 +142,11 @@ $monokai-gi: #a6e22e;
 
     .diff-line-num {
       &.is-over {
-        background-color: #9f9ab5;
-        border-color: darken(#9f9ab5, 5%);
+        background-color: $monokai-over-bg;
+        border-color: darken($monokai-over-bg, 5%);
 
         a {
-          color: darken(#9f9ab5, 15%);
+          color: darken($monokai-over-bg, 15%);
         }
       }
     }
diff --git a/app/assets/stylesheets/highlight/solarized_dark.scss b/app/assets/stylesheets/highlight/solarized_dark.scss
index b238b66c42d..0bb1634a31e 100644
--- a/app/assets/stylesheets/highlight/solarized_dark.scss
+++ b/app/assets/stylesheets/highlight/solarized_dark.scss
@@ -17,6 +17,7 @@ $solarized-dark-line-color-new: #5a766c;
 $solarized-dark-line-color-old: #7a6c71;
 $solarized-dark-highlight: #094554;
 $solarized-dark-hll-bg: #174652;
+$solarized-dark-over-bg: #9f9ab5;
 $solarized-dark-c: #586e75;
 $solarized-dark-err: #93a1a1;
 $solarized-dark-g: #93a1a1;
@@ -145,11 +146,11 @@ $solarized-dark-il: #2aa198;
 
     .diff-line-num {
       &.is-over {
-        background-color: #9f9ab5;
-        border-color: darken(#9f9ab5, 5%);
+        background-color: $solarized-dark-over-bg;
+        border-color: darken($solarized-dark-over-bg, 5%);
 
         a {
-          color: darken(#9f9ab5, 15%);
+          color: darken($solarized-dark-over-bg, 15%);
         }
       }
     }
diff --git a/app/assets/stylesheets/highlight/solarized_light.scss b/app/assets/stylesheets/highlight/solarized_light.scss
index 0ac1e46a9f7..a4b82fbc236 100644
--- a/app/assets/stylesheets/highlight/solarized_light.scss
+++ b/app/assets/stylesheets/highlight/solarized_light.scss
@@ -18,6 +18,7 @@ $solarized-light-line-color-new: #a1a080;
 $solarized-light-line-color-old: #ad9186;
 $solarized-light-highlight: #eee8d5;
 $solarized-light-hll-bg: #ddd8c5;
+$solarized-light-over-bg: #ded7fc;
 $solarized-light-c: #93a1a1;
 $solarized-light-err: #586e75;
 $solarized-light-g: #586e75;
@@ -152,11 +153,11 @@ $solarized-light-il: #2aa198;
 
     .diff-line-num {
       &.is-over {
-        background-color: #ded7fc;
-        border-color: darken(#ded7fc, 5%);
+        background-color: $solarized-light-over-bg;
+        border-color: darken($solarized-light-over-bg, 5%);
 
         a {
-          color: darken(#ded7fc, 15%);
+          color: darken($solarized-light-over-bg, 15%);
         }
       }
     }
diff --git a/app/assets/stylesheets/highlight/white.scss b/app/assets/stylesheets/highlight/white.scss
index 9b19282dd6f..86e6764ec92 100644
--- a/app/assets/stylesheets/highlight/white.scss
+++ b/app/assets/stylesheets/highlight/white.scss
@@ -7,6 +7,7 @@ $white-code-color: $gl-text-color;
 $white-highlight: #fafe3d;
 $white-pre-hll-bg: #f8eec7;
 $white-hll-bg: #f8f8f8;
+$white-over-bg: #ded7fc;
 $white-c: #998;
 $white-err: #a61717;
 $white-err-bg: #e3d2d2;
@@ -124,11 +125,11 @@ $white-gc-bg: #eaf2f5;
       }
 
       &.is-over {
-        background-color: #ded7fc;
-        border-color: darken(#ded7fc, 5%);
+        background-color: $white-over-bg;
+        border-color: darken($white-over-bg, 5%);
 
         a {
-          color: darken(#ded7fc, 15%);
+          color: darken($white-over-bg, 15%);
         }
       }