Update github.js (#100)

more closer match to github theme

Co-authored-by: Phil Pluckthun <[email protected]>

Author: krsntn

src/themes/github.js

@@ -3,76 +3,167 @@
 
 import type { PrismTheme } from "../types";
 
-var theme: PrismTheme = {
+var theme = {
   plain: {
-    color: "#393A34",
+    color: "rgb(36, 41, 46)",
     backgroundColor: "#f6f8fa",
   },
   styles: [
     {
-      types: ["comment", "prolog", "doctype", "cdata"],
+      types: ["prolog"],
       style: {
-        color: "#999988",
-        fontStyle: "italic",
+        color: "rgb(0, 0, 128)",
       },
     },
     {
-      types: ["namespace"],
+      types: ["comment"],
       style: {
-        opacity: 0.7,
+        color: "rgb(106, 153, 85)",
       },
     },
     {
-      types: ["string", "attr-value"],
+      types: ["builtin", "changed", "keyword"],
       style: {
+        color: "rgb(215, 58, 73)",
         color: "#e3116c",
       },
     },
+    {
+      types: ["inserted-sign", "inserted"],
+      style: {
+        backgroundColor: "rgb(240, 255, 244)",
+        color: "rgb(34, 134, 58)",
+      },
+    },
+    {
+      types: ["constant"],
+      style: {
+        color: "rgb(100, 102, 149)",
+      },
+    },
+    {
+      types: ["attr-name", "variable"],
+      style: {
+        color: "rgb(156, 220, 254)",
+      },
+    },
+    {
+      types: ["deleted-sign", "deleted"],
+      style: {
+        backgroundColor: "rgb(255, 238, 240)",
+        color: "rgb(179, 29, 40)",
+      },
+    },
+    {
+      types: ["selector"],
+      style: {
+        color: "rgb(215, 186, 125)",
+      },
+    },
+    {
+      // Fix tag color
+      types: ["tag"],
+      style: {
+        color: "rgb(78, 201, 176)",
+      },
+    },
+    {
+      // Fix tag color for HTML
+      types: ["tag"],
+      languages: ["markup"],
+      style: {
+        color: "rgb(86, 156, 214)",
+      },
+    },
     {
       types: ["punctuation", "operator"],
       style: {
-        color: "#393A34",
+        color: "rgb(36, 41, 46)",
+      },
+    },
+    {
+      types: ["operator"],
+      style: {
+        color: "rgb(0, 92, 197)",
+      },
+    },
+    {
+      types: ["boolean"],
+      style: {
+        color: "rgb(0, 92, 197)",
+      },
+    },
+    {
+      // Fix punctuation color for HTML
+      types: ["punctuation"],
+      languages: ["markup"],
+      style: {
+        color: "#808080",
+      },
+    },
+    {
+      types: ["function"],
+      style: {
+        color: "rgb(111, 66, 193)",
+      },
+    },
+    {
+      types: ["class-name"],
+      style: {
+        color: "rgb(78, 201, 176)",
+      },
+    },
+    {
+      types: ["known-class-name", "class-name"],
+      style: {
+        color: "rgb(227, 98, 9)",
+      },
+    },
+    {
+      types: ["char"],
+      style: {
+        color: "rgb(209, 105, 105)",
+      },
+    },
+    {
+      types: ["property-access"],
+      style: {
+        color: "rgb(0, 92, 197)",
       },
     },
     {
-      types: [
-        "entity",
-        "url",
-        "symbol",
-        "number",
-        "boolean",
-        "variable",
-        "constant",
-        "property",
-        "regex",
-        "inserted",
-      ],
+      types: ["method", "function", "property-access"],
       style: {
-        color: "#36acaa",
+        color: "rgb(111, 66, 193)",
       },
     },
     {
-      types: ["atrule", "keyword", "attr-name", "selector"],
+      languages: ["json"],
+      types: ["property"],
       style: {
-        color: "#00a4db",
+        color: "rgb(3, 47, 98)",
       },
     },
     {
-      types: ["function", "deleted", "tag"],
+      languages: ["json"],
+      types: ["string"],
       style: {
-        color: "#d73a49",
+        color: "rgb(3, 47, 98)",
       },
     },
     {
-      types: ["function-variable"],
+      languages: ["json"],
+      types: ["number"],
       style: {
-        color: "#6f42c1",
+        color: "rgb(0, 92, 197)",
       },
     },
     {
-      types: ["tag", "selector", "keyword"],
+      languages: ["json"],
+      types: ["comment"],
       style: {
-        color: "#00009f",
+        backgroundColor: "rgb(179, 29, 40)",
+        color: "rgb(250, 251, 252)",
       },
     },
   ],