diff --git a/app/config/config-default.js b/app/config/config-default.js index e75b7ca38dd6..02c17d465a7a 100644 --- a/app/config/config-default.js +++ b/app/config/config-default.js @@ -20,6 +20,9 @@ module.exports = { // font weight for bold characters: 'normal' or 'bold' fontWeightBold: 'bold', + // line height as a relative unit + lineHeight: 1, + // terminal cursor background color and opacity (hex, rgb, hsl, hsv, hwb or cmyk) cursorColor: 'rgba(248,28,229,0.8)', diff --git a/lib/components/term-group.js b/lib/components/term-group.js index f8343662eba6..f4b10b51e281 100644 --- a/lib/components/term-group.js +++ b/lib/components/term-group.js @@ -71,6 +71,7 @@ class TermGroup_ extends React.PureComponent { fontSmoothing: this.props.fontSmoothing, fontWeight: this.props.fontWeight, fontWeightBold: this.props.fontWeightBold, + lineHeight: this.props.lineHeight, modifierKeys: this.props.modifierKeys, padding: this.props.padding, url: session.url, diff --git a/lib/components/term.js b/lib/components/term.js index 08204e60f581..d05cd49d8d00 100644 --- a/lib/components/term.js +++ b/lib/components/term.js @@ -32,6 +32,7 @@ const getTermOptions = props => { fontSize: props.fontSize, fontWeight: props.fontWeight, fontWeightBold: props.fontWeightBold, + lineHeight: props.lineHeight, allowTransparency: needTransparency, experimentalCharAtlas: 'dynamic', theme: { @@ -263,7 +264,10 @@ export default class Term extends React.PureComponent { }); } - if (this.props.fontSize !== nextProps.fontSize || this.props.fontFamily !== nextProps.fontFamily) { + const fontSizeChanged = this.props.fontSize !== nextProps.fontSize; + const fontFamilyChanged = this.props.fontFamily !== nextProps.fontFamily; + const lineHeightChanged = this.props.lineHeight !== nextProps.lineHeight; + if (fontSizeChanged || fontFamilyChanged || lineHeightChanged) { // invalidate xterm cache about how wide each // character is this.term.charMeasure.measure(this.termOptions); diff --git a/lib/components/terms.js b/lib/components/terms.js index 5bfe7a00edde..65620b2168a9 100644 --- a/lib/components/terms.js +++ b/lib/components/terms.js @@ -101,6 +101,7 @@ export default class Terms extends React.Component { uiFontFamily: this.props.uiFontFamily, fontWeight: this.props.fontWeight, fontWeightBold: this.props.fontWeightBold, + lineHeight: this.props.lineHeight, padding: this.props.padding, bell: this.props.bell, bellSoundURL: this.props.bellSoundURL, diff --git a/lib/containers/terms.js b/lib/containers/terms.js index d80b0082a47e..bc1677ab7019 100644 --- a/lib/containers/terms.js +++ b/lib/containers/terms.js @@ -26,6 +26,7 @@ const TermsContainer = connect( fontFamily: state.ui.fontFamily, fontWeight: state.ui.fontWeight, fontWeightBold: state.ui.fontWeightBold, + lineHeight: state.ui.lineHeight, uiFontFamily: state.ui.uiFontFamily, fontSmoothing: state.ui.fontSmoothingOverride, padding: state.ui.padding, diff --git a/lib/reducers/ui.js b/lib/reducers/ui.js index 3a018979dd25..b0a68fa68d1e 100644 --- a/lib/reducers/ui.js +++ b/lib/reducers/ui.js @@ -47,6 +47,7 @@ const initial = Immutable({ fontSmoothingOverride: 'antialiased', fontWeight: 'normal', fontWeightBold: 'bold', + lineHeight: 1, css: '', termCSS: '', openAt: {}, @@ -138,6 +139,10 @@ const reducer = (state = initial, action) => { ret.fontWeightBold = config.fontWeightBold; } + if (Number.isFinite(config.lineHeight)) { + ret.lineHeight = config.lineHeight; + } + if (config.uiFontFamily) { ret.uiFontFamily = config.uiFontFamily; }