feat(css): Update the syntax highlighting colors

Signed-off-by: Valentin Popov <info@valentineus.link>

2 files changed, 276 insertions, 355 deletions

diff --git a/_scss/base/_highlight.scss b/_scss/base/_highlight.scss
index b4de65f..31c1ad4 100644
--- a/_scss/base/_highlight.scss
+++ b/_scss/base/_highlight.scss
@@ -1,355 +1,13 @@
-$color01: #000;
-$color02: #000080;
-$color03: #0000cf;
-$color04: #00a000;
-$color05: #204a87;
-$color06: #3465a4;
-$color07: #4e9a06;
-$color08: #5c35cc;
-$color09: #800080;
-$color10: #8f5902;
-$color11: #a40000;
-$color12: #c4a000;
-$color13: #c00;
-$color14: #ce5c00;
-$color15: #ef2929;
-$color16: #f57900;
-$color17: #f8f8f8;
-
-.highlight {
-  .c {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .err {
-    border: 1px solid $color15;
-    color: $color11;
-  }
-
-  .g {
-    color: $color01;
-  }
-
-  .k {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .l {
-    color: $color01;
-  }
-
-  .n {
-    color: $color01;
-  }
-
-  .o {
-    color: $color14;
-    font-weight: bold;
-  }
-
-  .x {
-    color: $color01;
-  }
-
-  .p {
-    color: $color01;
-    font-weight: bold;
-  }
-
-  .ch {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .cm {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .cp {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .cpf {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .c1 {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .cs {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .gd {
-    color: $color11;
-  }
-
-  .ge {
-    color: $color01;
-    font-style: italic;
-  }
-
-  .gr {
-    color: $color15;
-  }
-
-  .gh {
-    color: $color02;
-    font-weight: bold;
-  }
-
-  .gi {
-    color: $color04;
-  }
-
-  .go {
-    color: $color01;
-    font-style: italic;
-  }
-
-  .gp {
-    color: $color10;
-  }
-
-  .gs {
-    color: $color01;
-    font-weight: bold;
-  }
-
-  .gu {
-    color: $color09;
-    font-weight: bold;
-  }
-
-  .gt {
-    color: $color11;
-    font-weight: bold;
-  }
-
-  .kc {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .kd {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .kn {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .kp {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .kr {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .kt {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .ld {
-    color: $color01;
-  }
-
-  .m {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .s {
-    color: $color07;
-  }
-
-  .na {
-    color: $color12;
-  }
-
-  .nb {
-    color: $color05;
-  }
-
-  .nc {
-    color: $color01;
-  }
-
-  .no {
-    color: $color01;
-  }
-
-  .nd {
-    color: $color08;
-    font-weight: bold;
-  }
-
-  .ni {
-    color: $color14;
-  }
-
-  .ne {
-    color: $color13;
-    font-weight: bold;
-  }
-
-  .nf {
-    color: $color01;
-  }
-
-  .nl {
-    color: $color16;
-  }
-
-  .nn {
-    color: $color01;
-  }
-
-  .nx {
-    color: $color01;
-  }
-
-  .py {
-    color: $color01;
-  }
-
-  .nt {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .nv {
-    color: $color01;
-  }
-
-  .ow {
-    color: $color05;
-    font-weight: bold;
-  }
-
-  .w {
-    color: $color17;
-    text-decoration: underline;
-  }
-
-  .mb {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .mf {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .mh {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .mi {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .mo {
-    color: $color03;
-    font-weight: bold;
-  }
-
-  .sa {
-    color: $color07;
-  }
-
-  .sb {
-    color: $color07;
-  }
-
-  .sc {
-    color: $color07;
-  }
-
-  .dl {
-    color: $color07;
-  }
-
-  .sd {
-    color: $color10;
-    font-style: italic;
-  }
-
-  .s2 {
-    color: $color07;
-  }
-
-  .se {
-    color: $color07;
-  }
-
-  .sh {
-    color: $color07;
-  }
-
-  .si {
-    color: $color07;
-  }
-
-  .sx {
-    color: $color07;
-  }
-
-  .sr {
-    color: $color07;
-  }
-
-  .s1 {
-    color: $color07;
-  }
-
-  .ss {
-    color: $color07;
-  }
-
-  .bp {
-    color: $color06;
-  }
-
-  .fm {
-    color: $color01;
-  }
-
-  .vc {
-    color: $color01;
-  }
-
-  .vg {
-    color: $color01;
-  }
-
-  .vi {
-    color: $color01;
-  }
-
-  .vm {
-    color: $color01;
-  }
-
-  .il {
-    color: $color03;
-    font-weight: bold;
-  }
-}
+$color-01: #1d1f21;
+$color-02: #373b41;
+$color-03: #81a2be;
+$color-04: #8abeb7;
+$color-05: #969896;
+$color-06: #b294bb;
+$color-07: #b5bd68;
+$color-08: #c5c8c6;
+$color-09: #c66;
+$color-10: #de935f;
+$color-11: #f0c674;
+
+@import 'highlight/main';
diff --git a/_scss/highlight/_main.scss b/_scss/highlight/_main.scss
new file mode 100644
index 0000000..86fbfc5
--- /dev/null
+++ b/_scss/highlight/_main.scss
@@ -0,0 +1,263 @@
+.highlight {
+  background: $color-01;
+  color: $color-08;
+
+  .bp {
+    color: $color-08;
+  }
+
+  .c {
+    color: $color-05;
+  }
+
+  .c1 {
+    color: $color-05;
+  }
+
+  .cm {
+    color: $color-05;
+  }
+
+  .cp {
+    color: $color-05;
+  }
+
+  .cs {
+    color: $color-05;
+  }
+
+  .err {
+    color: $color-09;
+  }
+
+  .gd {
+    color: $color-09;
+  }
+
+  .ge {
+    font-style: italic;
+  }
+
+  .gh {
+    color: $color-08;
+    font-weight: bold;
+  }
+
+  .gi {
+    color: $color-07;
+  }
+
+  .gp {
+    color: $color-05;
+    font-weight: bold;
+  }
+
+  .gs {
+    font-weight: bold;
+  }
+
+  .gu {
+    color: $color-04;
+    font-weight: bold;
+  }
+
+  .hll {
+    background-color: $color-02;
+  }
+
+  .il {
+    color: $color-10;
+  }
+
+  .k {
+    color: $color-06;
+  }
+
+  .kc {
+    color: $color-06;
+  }
+
+  .kd {
+    color: $color-06;
+  }
+
+  .kn {
+    color: $color-04;
+  }
+
+  .kp {
+    color: $color-06;
+  }
+
+  .kr {
+    color: $color-06;
+  }
+
+  .kt {
+    color: $color-11;
+  }
+
+  .l {
+    color: $color-10;
+  }
+
+  .ld {
+    color: $color-07;
+  }
+
+  .m {
+    color: $color-10;
+  }
+
+  .mf {
+    color: $color-10;
+  }
+
+  .mh {
+    color: $color-10;
+  }
+
+  .mi {
+    color: $color-10;
+  }
+
+  .mo {
+    color: $color-10;
+  }
+
+  .n {
+    color: $color-08;
+  }
+
+  .na {
+    color: $color-03;
+  }
+
+  .nb {
+    color: $color-08;
+  }
+
+  .nc {
+    color: $color-11;
+  }
+
+  .nd {
+    color: $color-04;
+  }
+
+  .ne {
+    color: $color-09;
+  }
+
+  .nf {
+    color: $color-03;
+  }
+
+  .ni {
+    color: $color-08;
+  }
+
+  .nl {
+    color: $color-08;
+  }
+
+  .nn {
+    color: $color-11;
+  }
+
+  .no {
+    color: $color-09;
+  }
+
+  .nt {
+    color: $color-04;
+  }
+
+  .nv {
+    color: $color-09;
+  }
+
+  .nx {
+    color: $color-03;
+  }
+
+  .o {
+    color: $color-04;
+  }
+
+  .ow {
+    color: $color-04;
+  }
+
+  .p {
+    color: $color-08;
+  }
+
+  .py {
+    color: $color-08;
+  }
+
+  .s {
+    color: $color-07;
+  }
+
+  .s1 {
+    color: $color-07;
+  }
+
+  .s2 {
+    color: $color-07;
+  }
+
+  .sb {
+    color: $color-07;
+  }
+
+  .sc {
+    color: $color-08;
+  }
+
+  .sd {
+    color: $color-05;
+  }
+
+  .se {
+    color: $color-10;
+  }
+
+  .sh {
+    color: $color-07;
+  }
+
+  .si {
+    color: $color-10;
+  }
+
+  .sr {
+    color: $color-07;
+  }
+
+  .ss {
+    color: $color-07;
+  }
+
+  .sx {
+    color: $color-07;
+  }
+
+  .vc {
+    color: $color-09;
+  }
+
+  .vg {
+    color: $color-09;
+  }
+
+  .vi {
+    color: $color-09;
+  }
+
+  .w {
+    color: $color-08;
+  }
+}