diff --git a/js/components/ascribe_panel/action_panel.js b/js/components/ascribe_panel/action_panel.js
index 3146f1ba..f6fe9a70 100644
--- a/js/components/ascribe_panel/action_panel.js
+++ b/js/components/ascribe_panel/action_panel.js
@@ -12,8 +12,12 @@ let ActionPanel = React.createClass({
]),
buttons: React.PropTypes.element,
onClick: React.PropTypes.func,
- ignoreFocus: React.PropTypes.bool
+ ignoreFocus: React.PropTypes.bool,
+
+ leftColumnWidth: React.PropTypes.string,
+ rightColumnWidth: React.PropTypes.string
},
+
getInitialState() {
return {
isFocused: false
@@ -40,14 +44,21 @@ let ActionPanel = React.createClass({
},
render() {
+
+ let { leftColumnWidth, rightColumnWidth } = this.props;
+
return (
-
+
-
+
{this.props.buttons}
diff --git a/js/components/ascribe_settings/contract_settings.js b/js/components/ascribe_settings/contract_settings.js
index 16225dc9..72d2b233 100644
--- a/js/components/ascribe_settings/contract_settings.js
+++ b/js/components/ascribe_settings/contract_settings.js
@@ -81,7 +81,7 @@ let ContractSettings = React.createClass({
title={contract.name}
content={contract.name}
buttons={
-
+
@@ -89,8 +89,11 @@ let ContractSettings = React.createClass({
onClick={this.removeContract.bind(this, contract)}>
REMOVE
-
- }/>
+
+ }
+ leftColumnWidth="40%"
+ rightColumnWidth="60%"
+ />
);
})}
@@ -104,20 +107,22 @@ let ContractSettings = React.createClass({
title={contract.name}
content={contract.name}
buttons={
-
+
-
-
-
- }/>
+ UPDATE
+
+
+
+
+ }
+ leftColumnWidth="40%"
+ rightColumnWidth="60%"/>
);
})}