finalize contract settings layout

This commit is contained in:
Tim Daubenschütz 2015-09-14 17:38:26 +02:00
parent 209d141939
commit 24f0d84fbc
4 changed files with 79 additions and 87 deletions

View File

@ -95,91 +95,86 @@ let ContractSettings = React.createClass({
return (
<CollapsibleParagraph
title={getLangText('Contract Settings')}
title={getLangText('Contracts')}
show={true}
defaultExpanded={true}>
defaultExpanded={false}>
<CollapsibleParagraph
title={getLangText('List Contracts')}
title={getLangText('Public Contracts')}
show={true}
defaultExpanded={true}>
<CollapsibleParagraph
title={getLangText('Public Contracts')}
show={true}
defaultExpanded={true}>
{createPublicContractForm}
{publicContracts.map((contract, i) => {
return (
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
buttons={
<div className="pull-right">
<button className="btn btn-default btn-sm margin-left-2px">
UPDATE
</button>
<a
className="btn btn-default btn-sm margin-left-2px"
href={contract.blob.url_safe}
target="_blank">
PREVIEW
</a>
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.removeContract(contract)}>
REMOVE
</button>
</div>
}
leftColumnWidth="40%"
rightColumnWidth="60%"/>
);
})}
</CollapsibleParagraph>
<CollapsibleParagraph
title={getLangText('Private Contracts')}
show={true}
defaultExpanded={true}>
<CreateContractForm
isPublic={false}
fileClassToUpload={{
singular: 'new private contract',
plural: 'new private contracts'
}}/>
{privateContracts.map((contract, i) => {
return (
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
buttons={
<div className="pull-right">
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.makeContractPublic(contract)}>
MAKE PUBLIC
</button>
<button className="btn btn-default btn-sm margin-left-2px">
UPDATE
</button>
<a
className="btn btn-default btn-sm margin-left-2px"
href={contract.blob.url_safe}
target="_blank">
PREVIEW
</a>
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.removeContract(contract)}>
REMOVE
</button>
</div>
}
leftColumnWidth="40%"
rightColumnWidth="60%"/>
);
})}
</CollapsibleParagraph>
{createPublicContractForm}
{publicContracts.map((contract, i) => {
return (
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
buttons={
<div className="pull-right">
<button className="btn btn-default btn-sm margin-left-2px">
UPDATE
</button>
<a
className="btn btn-default btn-sm margin-left-2px"
href={contract.blob.url_safe}
target="_blank">
PREVIEW
</a>
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.removeContract(contract)}>
REMOVE
</button>
</div>
}
leftColumnWidth="40%"
rightColumnWidth="60%"/>
);
})}
</CollapsibleParagraph>
<CollapsibleParagraph
title={getLangText('Private Contracts')}
show={true}
defaultExpanded={true}>
<CreateContractForm
isPublic={false}
fileClassToUpload={{
singular: 'new private contract',
plural: 'new private contracts'
}}/>
{privateContracts.map((contract, i) => {
return (
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
buttons={
<div className="pull-right">
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.makeContractPublic(contract)}>
MAKE PUBLIC
</button>
<button className="btn btn-default btn-sm margin-left-2px">
UPDATE
</button>
<a
className="btn btn-default btn-sm margin-left-2px"
href={contract.blob.url_safe}
target="_blank">
PREVIEW
</a>
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.removeContract(contract)}>
REMOVE
</button>
</div>
}
leftColumnWidth="40%"
rightColumnWidth="60%"/>
);
})}
</CollapsibleParagraph>
</CollapsibleParagraph>
);

View File

@ -26,8 +26,6 @@ let SettingsContainer = React.createClass({
<APISettings />
<BitcoinWalletSettings />
<ContractSettings />
<br />
<br />
</div>
);
}

View File

@ -59,7 +59,7 @@ let FileDragAndDropPreviewOther = React.createClass({
<div className="file-drag-and-drop-preview-table-wrapper">
<div className="file-drag-and-drop-preview-other">
{actionSymbol}
<span>{'.' + this.props.type}</span>
<p>{'.' + this.props.type}</p>
</div>
</div>
</div>

View File

@ -24,9 +24,8 @@
background: none;
border: 0;
width: 100%;
/* Shrink the size of the headline for a nested element */
.ascribe-collapsible-wrapper > .ascribe-collapsible-content {
.ascribe-collapsible-wrapper {
padding-left: 1em;
font-size: 95%;
}