more themes + fonts

packages/react/src/themes/blackscreen.js

@@ -2,35 +2,37 @@ import { tags as t } from '@lezer/highlight';
 import { createTheme } from '@uiw/codemirror-themes';
 export const settings = {
   background: 'black',
-  foreground: 'white', // whats that?
-  caret: 'white',
+  foreground: '#dddddd', // whats that?
+  caret: '#dddddd',
   selection: '#ffffff20',
   selectionMatch: '#036dd626',
   lineHighlight: '#ffffff10',
   gutterBackground: 'transparent',
   gutterForeground: '#8a919966',
+  fontFamily: 'BigBlueTerminal, monospace',
+  //fontFamily: 'x3270, monospace',
 };
 export default createTheme({
   theme: 'dark',
   settings,
   styles: [
-    { tag: t.keyword, color: 'white' },
-    { tag: t.operator, color: 'white' },
-    { tag: t.special(t.variableName), color: 'white' },
-    { tag: t.typeName, color: 'white' },
-    { tag: t.atom, color: 'white' },
-    { tag: t.number, color: 'white' },
-    { tag: t.definition(t.variableName), color: 'white' },
-    { tag: t.string, color: 'white' },
-    { tag: t.special(t.string), color: 'white' },
-    { tag: t.comment, color: 'white' },
-    { tag: t.variableName, color: 'white' },
-    { tag: t.tagName, color: 'white' },
-    { tag: t.bracket, color: 'white' },
-    { tag: t.meta, color: 'white' },
-    { tag: t.attributeName, color: 'white' },
-    { tag: t.propertyName, color: 'white' },
-    { tag: t.className, color: 'white' },
-    { tag: t.invalid, color: 'white' },
+    { tag: t.keyword, color: '#dddddd' },
+    { tag: t.operator, color: '#dddddd' },
+    { tag: t.special(t.variableName), color: '#dddddd' },
+    { tag: t.typeName, color: '#dddddd' },
+    { tag: t.atom, color: '#dddddd' },
+    { tag: t.number, color: '#dddddd' },
+    { tag: t.definition(t.variableName), color: '#dddddd' },
+    { tag: t.string, color: '#dddddd' },
+    { tag: t.special(t.string), color: '#dddddd' },
+    { tag: t.comment, color: '#dddddd' },
+    { tag: t.variableName, color: '#dddddd' },
+    { tag: t.tagName, color: '#dddddd' },
+    { tag: t.bracket, color: '#dddddd' },
+    { tag: t.meta, color: '#dddddd' },
+    { tag: t.attributeName, color: '#dddddd' },
+    { tag: t.propertyName, color: '#dddddd' },
+    { tag: t.className, color: '#dddddd' },
+    { tag: t.invalid, color: '#dddddd' },
   ],
 });

packages/react/src/themes/bluescreen.js

@@ -11,6 +11,7 @@ export const settings = {
   gutterBackground: 'transparent',
   // gutterForeground: '#8a919966',
   gutterForeground: '#8a919966',
+  fontFamily: 'BigBlueTerminal, monospace',
 };
 
 export default createTheme({

packages/react/src/themes/terminal.js

@@ -0,0 +1,38 @@
+import { tags as t } from '@lezer/highlight';
+import { createTheme } from '@uiw/codemirror-themes';
+export const settings = {
+  background: 'black',
+  foreground: '#41FF00', // whats that?
+  caret: '#41FF00',
+  selection: '#ffffff20',
+  selectionMatch: '#036dd626',
+  lineHighlight: '#ffffff10',
+  gutterBackground: 'transparent',
+  gutterForeground: '#8a919966',
+  //fontFamily: 'BigBlueTerminal, monospace',
+  fontFamily: 'x3270, monospace',
+};
+export default createTheme({
+  theme: 'dark',
+  settings,
+  styles: [
+    { tag: t.keyword, color: '#41FF00' },
+    { tag: t.operator, color: '#41FF00' },
+    { tag: t.special(t.variableName), color: '#41FF00' },
+    { tag: t.typeName, color: '#41FF00' },
+    { tag: t.atom, color: '#41FF00' },
+    { tag: t.number, color: '#41FF00' },
+    { tag: t.definition(t.variableName), color: '#41FF00' },
+    { tag: t.string, color: '#41FF00' },
+    { tag: t.special(t.string), color: '#41FF00' },
+    { tag: t.comment, color: '#41FF00' },
+    { tag: t.variableName, color: '#41FF00' },
+    { tag: t.tagName, color: '#41FF00' },
+    { tag: t.bracket, color: '#41FF00' },
+    { tag: t.meta, color: '#41FF00' },
+    { tag: t.attributeName, color: '#41FF00' },
+    { tag: t.propertyName, color: '#41FF00' },
+    { tag: t.className, color: '#41FF00' },
+    { tag: t.invalid, color: '#41FF00' },
+  ],
+});

packages/react/src/themes/whitescreen.js

@@ -11,6 +11,7 @@ export const settings = {
   gutterBackground: 'transparent',
   gutterForeground: 'black',
   light: true,
+  fontFamily: 'BigBlueTerminal, monospace',
 };
 export default createTheme({
   theme: 'light',