ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

finalize contract styles

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-09-08 10:15:26 +02:00
parent 2c9370e555
commit 38b7dcd79f
2 changed files with 35 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
js/components/ascribe_panel/action_panel.js
View File

@ -12,8 +12,12 @@ let ActionPanel = React.createClass({
]), ]),
buttons: React.PropTypes.element, buttons: React.PropTypes.element,
onClick: React.PropTypes.func, onClick: React.PropTypes.func,
ignoreFocus: React.PropTypes.bool ignoreFocus: React.PropTypes.bool,
leftColumnWidth: React.PropTypes.string,
rightColumnWidth: React.PropTypes.string
}, },
getInitialState() { getInitialState() {
return { return {
isFocused: false isFocused: false
@ -40,14 +44,21 @@ let ActionPanel = React.createClass({
}, },
render() { render() {
let { leftColumnWidth, rightColumnWidth } = this.props;
return ( return (
<div className={classnames('ascribe-panel-wrapper', {'is-focused': this.state.isFocused})}> <div className={classnames('ascribe-panel-wrapper', {'is-focused': this.state.isFocused})}>
<div className="ascribe-panel-table"> <div
className="ascribe-panel-table"
style={{width: leftColumnWidth}}>
<div className="ascribe-panel-content"> <div className="ascribe-panel-content">
{this.props.content} {this.props.content}
</div> </div>
</div> </div>
<div className="ascribe-panel-table"> <div
className="ascribe-panel-table"
style={{width: rightColumnWidth}}>
<div className="ascribe-panel-content"> <div className="ascribe-panel-content">
{this.props.buttons} {this.props.buttons}
</div> </div>

37
js/components/ascribe_settings/contract_settings.js
View File

@ -81,7 +81,7 @@ let ContractSettings = React.createClass({
title={contract.name} title={contract.name}
content={contract.name} content={contract.name}
buttons={ buttons={
<span> <div className="pull-right">
<button className="btn btn-default btn-sm margin-left-2px"> <button className="btn btn-default btn-sm margin-left-2px">
UPDATE UPDATE
</button> </button>
@ -89,8 +89,11 @@ let ContractSettings = React.createClass({
onClick={this.removeContract.bind(this, contract)}> onClick={this.removeContract.bind(this, contract)}>
REMOVE REMOVE
</button> </button>
</span> </div>
}/> }
leftColumnWidth="40%"
rightColumnWidth="60%"
/>
); );
})} })}
</CollapsibleParagraph> </CollapsibleParagraph>
@ -104,20 +107,22 @@ let ContractSettings = React.createClass({
title={contract.name} title={contract.name}
content={contract.name} content={contract.name}
buttons={ buttons={
<span> <div className="pull-right">
<button className="btn btn-default btn-sm margin-left-2px"> <button className="btn btn-default btn-sm margin-left-2px">
UPDATE UPDATE
</button> </button>
<button className="btn btn-default btn-sm margin-left-2px" <button className="btn btn-default btn-sm margin-left-2px"
onClick={this.removeContract.bind(this, contract)}> onClick={this.removeContract.bind(this, contract)}>
REMOVE REMOVE
</button> </button>
<button className="btn btn-default btn-sm margin-left-2px" <button className="btn btn-default btn-sm margin-left-2px"
onClick={this.makeContractPublic.bind(this, contract)}> onClick={this.makeContractPublic.bind(this, contract)}>
MAKE PUBLIC MAKE PUBLIC
</button> </button>
</span> </div>
}/> }
leftColumnWidth="40%"
rightColumnWidth="60%"/>
); );
})} })}
</CollapsibleParagraph> </CollapsibleParagraph>