allow setting variable 2 and 3 in config (#988)

components/Themes/index.js

@@ -142,11 +142,15 @@ class Themes extends React.PureComponent {
             :global(.cm-comment) {
               color: ${highlights.comment} !important;
             }
-            :global(.cm-variable),
+            :global(.cm-variable) {
-            :global(.cm-variable-2),
-            :global(.cm-variable-3) {
               color: ${highlights.variable} !important;
             }
+            :global(.cm-variable-2) {
+              color: ${highlights.variable2 || highlights.variable} !important;
+            }
+            :global(.cm-variable-3) {
+              color: ${highlights.variable3 || highlights.variable} !important;
+            }
             :global(.cm-number) {
               color: ${highlights.number} !important;
             }

lib/constants.js

@@ -152,7 +152,9 @@ export const THEMES = [
     highlights: {
       background: '#282a36',
       text: '#f8f8f2',
-      variable: '#fff',
+      variable: '#50fa7b',
+      variable2: 'white',
+      variable3: '#ffb86c',
       attribute: '#50fa7b',
       definition: '#50fa7b',
       keyword: '#ff79c6',