Mirroring/coriolis
1
0
Fork 0
mirror of https://github.com/EDCD/coriolis.git synced 2025-12-10 07:05:35 +00:00
Code Issues Projects Releases Wiki Activity

Use table to align settings. Fixes #163

Browse Source
This commit is contained in:
Colin McLeod
2016-06-05 00:52:23 -07:00
parent 31b56354e0
commit 6e6c337bbb
1 changed files with 41 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/app/components/Header.jsx
View File

@@ -362,42 +362,44 @@ export default class Header extends TranslatedComponent {
return ( return (
<div className='menu-list no-wrap cap' onClick={ (e) => e.stopPropagation() }> <div className='menu-list no-wrap cap' onClick={ (e) => e.stopPropagation() }>
<div style={{ lineHeight: '2em' }}> <table style={{ width: '100%', background: 'none', borderSpacing: '0 0.5em' }}>
<div> <tbody>
{translate('language')} <tr>
<div style={{ float: 'right' }}> <td>{translate('language')}</td>
<select className='cap' dir='rtl' value={Persist.getLangCode()} onChange={this._setLanguage}> <td className='ri'>
{this.languageOptions} <select className='cap' dir='rtl' value={Persist.getLangCode()} onChange={this._setLanguage}>
</select> {this.languageOptions}
</div> </select>
</div> </td>
<div className='cap ptr' onClick={this._toggleTooltips} > </tr>
{translate('tooltips')} <tr className='cap ptr' onClick={this._toggleTooltips} >
<div className={cn({ disabled: !tips, 'primary-disabled': tips })} style={{ marginLeft: '0.5em', float: 'right' }}>{(tips ? '✓' : '✗')}</div> <td>{translate('tooltips')}</td>
</div> <td className={cn('ri', { disabled: !tips, 'primary-disabled': tips })}>{(tips ? '✓' : '✗')}</td>
<div> </tr>
{translate('insurance')} <tr>
<div style={{ float: 'right' }}> <td>{translate('insurance')}</td>
<select className='cap' dir='rtl' value={Persist.getInsurance()} onChange={this._setInsurance}> <td className='ri'>
{this.insuranceOptions} <select className='cap' dir='rtl' value={Persist.getInsurance()} onChange={this._setInsurance}>
</select> {this.insuranceOptions}
</div> </select>
</div> </td>
<div> </tr>
{translate('ship')} {translate('discount')} <tr>
<div style={{ float: 'right' }}> <td>{translate('ship')} {translate('discount')}</td>
<input type='text' size='10' value={this.state.shipDiscount} onChange={this._changeShipDiscount} onFocus={selectAll} onBlur={this._setShipDiscount} onKeyDown={this._kpShipDiscount}/> <td className='ri'>
<u className='primary-disabled'>%</u> <input type='text' size='10' value={this.state.shipDiscount} onChange={this._changeShipDiscount} onFocus={selectAll} onBlur={this._setShipDiscount} onKeyDown={this._kpShipDiscount}/>
</div> <u className='primary-disabled'>%</u>
</div> </td>
<div style={{ clear: 'both' }}> </tr>
{translate('module')} {translate('discount')} <tr>
<div style={{ float: 'right' }}> <td>{translate('module')} {translate('discount')}</td>
<input type='text' size='10' value={this.state.moduleDiscount} onChange={this._changeModuleDiscount} onFocus={selectAll} onBlur={this._setModuleDiscount} onKeyDown={this._kpModuleDiscount}/> <td className='ri'>
<u className='primary-disabled'>%</u> <input type='text' size='10' value={this.state.moduleDiscount} onChange={this._changeModuleDiscount} onFocus={selectAll} onBlur={this._setModuleDiscount} onKeyDown={this._kpModuleDiscount}/>
</div> <u className='primary-disabled'>%</u>
</div> </td>
</div> </tr>
</tbody>
</table>
<hr /> <hr />
<ul style={{ width: '100%' }}> <ul style={{ width: '100%' }}>
{translate('builds')} & {translate('comparisons')} {translate('builds')} & {translate('comparisons')}
@@ -481,21 +483,21 @@ export default class Header extends TranslatedComponent {
<div className='l menu'> <div className='l menu'>
<div className={cn('menu-header', { selected: openedMenu == 's' })} onClick={this._openShips}> <div className={cn('menu-header', { selected: openedMenu == 's' })} onClick={this._openShips}>
<Rocket className='warning' /><span className='menu-item-label'>{' ' + translate('ships')}</span> <Rocket className='warning' /><span className='menu-item-label'>{translate('ships')}</span>
</div> </div>
{openedMenu == 's' ? this._getShipsMenu() : null} {openedMenu == 's' ? this._getShipsMenu() : null}
</div> </div>
<div className='l menu'> <div className='l menu'>
<div className={cn('menu-header', { selected: openedMenu == 'b', disabled: !hasBuilds })} onClick={hasBuilds && this._openBuilds}> <div className={cn('menu-header', { selected: openedMenu == 'b', disabled: !hasBuilds })} onClick={hasBuilds && this._openBuilds}>
<Hammer className={cn('warning', { 'warning-disabled': !hasBuilds })} /><span className='menu-item-label'>{' ' + translate('builds')}</span> <Hammer className={cn('warning', { 'warning-disabled': !hasBuilds })} /><span className='menu-item-label'>{translate('builds')}</span>
</div> </div>
{openedMenu == 'b' ? this._getBuildsMenu() : null} {openedMenu == 'b' ? this._getBuildsMenu() : null}
</div> </div>
<div className='l menu'> <div className='l menu'>
<div className={cn('menu-header', { selected: openedMenu == 'comp', disabled: !hasBuilds })} onClick={hasBuilds && this._openComp}> <div className={cn('menu-header', { selected: openedMenu == 'comp', disabled: !hasBuilds })} onClick={hasBuilds && this._openComp}>
<StatsBars className={cn('warning', { 'warning-disabled': !hasBuilds })} /><span className='menu-item-label'>{' ' + translate('compare')}</span> <StatsBars className={cn('warning', { 'warning-disabled': !hasBuilds })} /><span className='menu-item-label'>{translate('compare')}</span>
</div> </div>
{openedMenu == 'comp' ? this._getComparisonsMenu() : null} {openedMenu == 'comp' ? this._getComparisonsMenu() : null}
</div> </div>