configurable cursor opacity (#76)

vercel · Jul 21, 2016 · 51b7232 · 51b7232
1 parent c83f156
commit 51b7232
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/app/lib/components/term.js b/app/lib/components/term.js
@@ -1,5 +1,6 @@
 /* global Blob,URL,requestAnimationFrame */
 import React from 'react';
+import Color from 'color';
 import hterm from '../hterm';
 import Component from '../component';
 
@@ -26,7 +27,7 @@ export default class Term extends Component {
     this.term.prefs_.set('font-family', props.fontFamily);
     this.term.prefs_.set('font-size', props.fontSize);
     this.term.prefs_.set('font-smoothing', props.fontSmoothing);
-    this.term.prefs_.set('cursor-color', props.cursorColor);
+    this.term.prefs_.set('cursor-color', Color(props.cursorColor).rgbString());
     this.term.prefs_.set('enable-clipboard-notice', false);
     this.term.prefs_.set('foreground-color', props.foregroundColor);
     this.term.prefs_.set('background-color', props.backgroundColor);
@@ -181,7 +182,7 @@ export default class Term extends Component {
     }
 
     if (this.props.cursorColor !== nextProps.cursorColor) {
-      this.term.prefs_.set('cursor-color', nextProps.cursorColor);
+      this.term.prefs_.set('cursor-color', Color(nextProps.cursorColor).rgbString());
     }
 
     if (this.props.colors !== nextProps.colors) {

diff --git a/app/package.json b/app/package.json
@@ -6,6 +6,7 @@
   "repository": "zeit/hyperterm",
   "dependencies": {
     "aphrodite-simple": "0.4.1",
+    "color": "^0.11.3",
     "hterm-umdjs": "1.1.3",
     "json-loader": "0.5.4",
     "mousetrap": "1.6.0",

diff --git a/config-default.js b/config-default.js
@@ -6,8 +6,8 @@ module.exports = {
     // font family with optional fallbacks
     fontFamily: 'Menlo, "DejaVu Sans Mono", "Lucida Console", monospace',
 
-    // terminal cursor background color (hex)
-    cursorColor: '#F81CE5',
+    // terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk)
+    cursorColor: 'rgba(248,28,229,0.75)',
 
     // color of the text
     foregroundColor: '#fff',