Merge af11e3a19b into 113b502abb

js/src/MyModal.tsx

@@ -1,6 +1,7 @@
 import { createRef, Component, ComponentChildren } from "preact";
 import { Modal } from "bootstrap";
 import './bootstrap.scss';
+import './style.scss';
 
 interface ModalProps {
   children: ComponentChildren;

js/src/style.scss

@@ -0,0 +1,11 @@
+#terminal {
+  width: auto;
+  height: 100%;
+  margin: 0 auto;
+  padding: 0;
+
+  .terminal {
+    padding: 5px;
+    height: 100%;
+  }
+}

js/src/xterm.tsx

@@ -1,9 +1,37 @@
-import { Terminal, IDisposable } from "xterm";
+import { Terminal, IDisposable, ITerminalOptions, ITheme } from "xterm";
 import { FitAddon } from 'xterm-addon-fit';
 import { WebLinksAddon } from 'xterm-addon-web-links';
 import { WebglAddon } from 'xterm-addon-webgl';
 import { ZModemAddon } from "./zmodem";
 
+const termOptions = {
+    fontSize: 13,
+    fontFamily: 'Menlo For Powerline,Consolas,Liberation Mono,Menlo,Courier,monospace',
+    macOptionClickForcesSelection: true,
+    macOptionIsMeta: true,
+    theme: {
+        foreground: '#d4d4d4',
+        background: '#1e1e1e',
+        cursor: '#adadad',
+        black: '#000000',
+        red: '#d81e00',
+        green: '#5ea702',
+        yellow: '#cfae00',
+        blue: '#427ab3',
+        magenta: '#89658e',
+        cyan: '#00a7aa',
+        white: '#dbded8',
+        brightBlack: '#686a66',
+        brightRed: '#f54235',
+        brightGreen: '#99e343',
+        brightYellow: '#fdeb61',
+        brightBlue: '#84b0d8',
+        brightMagenta: '#bc94b7',
+        brightCyan: '#37e6e8',
+        brightWhite: '#f1f1f0',
+    } as ITheme,
+} as ITerminalOptions;
+
 export class OurXterm {
     // The HTMLElement that contains our terminal
     elem: HTMLElement;
@@ -27,7 +55,7 @@ export class OurXterm {
 
     constructor(elem: HTMLElement) {
         this.elem = elem;
-        this.term = new Terminal();
+        this.term = new Terminal(termOptions);
         this.fitAddOn = new FitAddon();
         this.zmodemAddon = new ZModemAddon({
             toTerminal: (x: Uint8Array) => this.term.write(x),