quine-global/hyper
1
0
Fork 0
mirror of https://github.com/quine-global/hyper.git synced 2026-01-16 21:58:39 -09:00
Code Issues Projects Releases Packages Wiki Activity Actions

border color configuration support

Browse source
This commit is contained in:
Guillermo Rauch 2016-07-07 20:37:58 -07:00
parent 38713f9e2d
commit ff2419c54b
3 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/hyperterm.js
View file

@ -69,13 +69,14 @@ export default class HyperTerm extends Component {
} }
render () { render () {
const { backgroundColor } = this.props.config; const { backgroundColor, borderColor } = this.props.config;
return <div onClick={ this.focusActive }> return <div onClick={ this.focusActive }>
<div className={ classes('main', { mac: this.state.mac }) }> <div style={{ borderColor }} className={ classes('main', { mac: this.state.mac }) }>
<header style={{ backgroundColor }} onMouseDown={this.onHeaderMouseDown}> <header style={{ backgroundColor }} onMouseDown={this.onHeaderMouseDown}>
<Tabs <Tabs
active={this.state.active} active={this.state.active}
activeMarkers={this.state.activeMarkers} activeMarkers={this.state.activeMarkers}
borderColor={borderColor}
data={this.state.sessions.map((uid) => { data={this.state.sessions.map((uid) => {
const title = this.state.titles[uid]; const title = this.state.titles[uid];
return null != title ? title : 'Shell'; return null != title ? title : 'Shell';

10
app/tabs.js
View file

@ -1,12 +1,12 @@
import React from 'react'; import React from 'react';
import classes from 'classnames'; import classes from 'classnames';
export default function ({ data = [], active, activeMarkers = [], onChange, onClose }) { export default function ({ data = [], borderColor, active, activeMarkers = [], onChange, onClose }) {
return <nav style={{ WebkitAppRegion: 'drag' }}>{ return <nav style={{ WebkitAppRegion: 'drag' }}>{
data.length data.length
? 1 === data.length ? 1 === data.length
? <div className='single'>{ data[0] }</div> ? <div className='single'>{ data[0] }</div>
: <ul className='tabs'> : <ul style={{ borderColor }} className='tabs'>
{ {
data.map((tab, i) => { data.map((tab, i) => {
const isActive = i === active; const isActive = i === active;
@ -14,7 +14,11 @@ export default function ({ data = [], active, activeMarkers = [], onChange, onCl
return <li return <li
key={`tab-${i}`} key={`tab-${i}`}
className={classes({ is_active: isActive, has_activity: hasActivity })}> className={classes({ is_active: isActive, has_activity: hasActivity })}>
<span onClick={ onChange ? onClick.bind(null, i, onChange, active) : null }>{ tab }</span> <span
style={{ borderColor: isActive ? borderColor : null }}
onClick={ onChange ? onClick.bind(null, i, onChange, active) : null }>
{ tab }
</span>
<i onClick={ onClose ? onClose.bind(null, i) : null }> <i onClick={ onClose ? onClose.bind(null, i) : null }>
<svg className='icon'> <svg className='icon'>
<use xlinkHref='assets/icons.svg#close'></use> <use xlinkHref='assets/icons.svg#close'></use>

5
config-default.js
View file

@ -10,7 +10,10 @@ module.exports = {
cursorColor: '#F81CE5', cursorColor: '#F81CE5',
// terminal background color (hex) // terminal background color (hex)
backgroundColor: '#000', backgroundColor: '#000000',
// border color (winodw, tabs)
borderColor: '#333',
// some color overrides. see http://bit.ly/29k1iU2 for // some color overrides. see http://bit.ly/29k1iU2 for
// the full list // the full list