Added Stylelint Setup

Added stylelint to static-analysis
Updated yarn dependencies
CSS Fixes and rule adoptions of stylelint
Added stylelint-scss
Deduplicated yarn.lock to clear dependencies

First round of advanced stylelint rules

Mainly Vendor prefix updates related to flex

Updates to more webkit specific vendor prefixes

Finished all vendor specific fixes

Moved now 4 rules to warning

Fixed the new scss lint problems

More stylelint adaptions after rebase

3 files changed, 51 insertions, 27 deletions

diff --git a/app/assets/stylesheets/highlight/common.scss b/app/assets/stylesheets/highlight/common.scss
index 2b0794759d5..ac3214a07d9 100644
--- a/app/assets/stylesheets/highlight/common.scss
+++ b/app/assets/stylesheets/highlight/common.scss
@@ -1,4 +1,4 @@
-@import "../framework/variables";
+@import '../framework/variables';
 
 @mixin diff-background($background, $idiff, $border) {
   background: $background;
diff --git a/app/assets/stylesheets/highlight/embedded.scss b/app/assets/stylesheets/highlight/embedded.scss
index 44c8a1d39ec..74364ee4ddb 100644
--- a/app/assets/stylesheets/highlight/embedded.scss
+++ b/app/assets/stylesheets/highlight/embedded.scss
@@ -1,3 +1,3 @@
 .code {
-  @import "white_base";
+  @import 'white_base';
 }
diff --git a/app/assets/stylesheets/highlight/white_base.scss b/app/assets/stylesheets/highlight/white_base.scss
index 23ec3380ce9..ee0ec94c636 100644
--- a/app/assets/stylesheets/highlight/white_base.scss
+++ b/app/assets/stylesheets/highlight/white_base.scss
@@ -1,6 +1,6 @@
 /* https://github.com/aahan/pygments-github-style */
 
-@import "./common";
+@import './common';
 
 /*
 * White Syntax Colors
@@ -37,16 +37,16 @@ $white-kt: #458;
 $white-m: #099;
 $white-s: #d14;
 $white-n: #333;
-$white-na: teal;
+$white-na: #008080;
 $white-nb: #0086b3;
 $white-nc: #458;
-$white-no: teal;
-$white-ni: purple;
+$white-no: #008080;
+$white-ni: #800080;
 $white-ne: #900;
 $white-nf: #900;
 $white-nn: #555;
-$white-nt: navy;
-$white-nv: teal;
+$white-nt: #000080;
+$white-nv: #008080;
 $white-w: #bbb;
 $white-mf: #099;
 $white-mh: #099;
@@ -64,9 +64,9 @@ $white-sr: #009926;
 $white-s1: #d14;
 $white-ss: #990073;
 $white-bp: #999;
-$white-vc: teal;
-$white-vg: teal;
-$white-vi: teal;
+$white-vc: #008080;
+$white-vg: #008080;
+$white-vi: #008080;
 $white-il: #099;
 $white-gc-color: #999;
 $white-gc-bg: #eaf2f5;
@@ -77,7 +77,7 @@ $white-gc-bg: #eaf2f5;
   background-color: $gray-light;
 }
 
-  // Line numbers
+// Line numbers
 .line-numbers,
 .diff-line-num {
   background-color: $gray-light;
@@ -103,7 +103,6 @@ pre.code,
 
 // Diff line
 .line_holder {
-
   &.match .line_content,
   .new-nonewline.line_content,
   .old-nonewline.line_content {
@@ -201,25 +200,38 @@ pre .hll {
   background-color: $white-pre-hll-bg !important;
 }
 
-  // Search result highlight
+// Search result highlight
 span.highlight_word {
   background-color: $white-highlight !important;
 }
 
-  // Links to URLs, emails, or dependencies
+// Links to URLs, emails, or dependencies
 .line a {
   color: $white-nb;
 }
 
 .hll { background-color: $white-hll-bg; }
-.c { color: $white-c; font-style: italic; }
-.err { color: $white-err; background-color: $white-err-bg; }
+
+.c { color: $white-c;
+  font-style: italic; }
+
+.err { color: $white-err;
+  background-color: $white-err-bg; }
 .k { font-weight: $gl-font-weight-bold; }
 .o { font-weight: $gl-font-weight-bold; }
-.cm { color: $white-cm; font-style: italic; }
-.cp { color: $white-cp; font-weight: $gl-font-weight-bold; }
-.c1 { color: $white-c1; font-style: italic; }
-.cs { color: $white-cs; font-weight: $gl-font-weight-bold; font-style: italic; }
+
+.cm { color: $white-cm;
+  font-style: italic; }
+
+.cp { color: $white-cp;
+  font-weight: $gl-font-weight-bold; }
+
+.c1 { color: $white-c1;
+  font-style: italic; }
+
+.cs { color: $white-cs;
+  font-weight: $gl-font-weight-bold;
+  font-style: italic; }
 
 .gd {
   color: $white-gd;
@@ -248,24 +260,34 @@ span.highlight_word {
 .go { color: $white-go; }
 .gp { color: $white-gp; }
 .gs { font-weight: $gl-font-weight-bold; }
-.gu { color: $white-gu; font-weight: $gl-font-weight-bold; }
+
+.gu { color: $white-gu;
+  font-weight: $gl-font-weight-bold; }
 .gt { color: $white-gt; }
 .kc { font-weight: $gl-font-weight-bold; }
 .kd { font-weight: $gl-font-weight-bold; }
 .kn { font-weight: $gl-font-weight-bold; }
 .kp { font-weight: $gl-font-weight-bold; }
 .kr { font-weight: $gl-font-weight-bold; }
-.kt { color: $white-kt; font-weight: $gl-font-weight-bold; }
+
+.kt { color: $white-kt;
+  font-weight: $gl-font-weight-bold; }
 .m { color: $white-m; }
 .s { color: $white-s; }
 .n { color: $white-n; }
 .na { color: $white-na; }
 .nb { color: $white-nb; }
-.nc { color: $white-nc; font-weight: $gl-font-weight-bold; }
+
+.nc { color: $white-nc;
+  font-weight: $gl-font-weight-bold; }
 .no { color: $white-no; }
 .ni { color: $white-ni; }
-.ne { color: $white-ne; font-weight: $gl-font-weight-bold; }
-.nf { color: $white-nf; font-weight: $gl-font-weight-bold; }
+
+.ne { color: $white-ne;
+  font-weight: $gl-font-weight-bold; }
+
+.nf { color: $white-nf;
+  font-weight: $gl-font-weight-bold; }
 .nn { color: $white-nn; }
 .nt { color: $white-nt; }
 .nv { color: $white-nv; }
@@ -291,4 +313,6 @@ span.highlight_word {
 .vg { color: $white-vg; }
 .vi { color: $white-vi; }
 .il { color: $white-il; }
-.gc { color: $white-gc-color; background-color: $white-gc-bg; }
+
+.gc { color: $white-gc-color;
+  background-color: $white-gc-bg; }