(add) Consensus Threshold Ballot component layout
This commit is contained in:
parent
490be1fb8d
commit
3f445d6bfb
|
@ -0,0 +1,15 @@
|
|||
.frm-BallotMinThresholdMetadata {
|
||||
margin-bottom: $base-grid-gap;
|
||||
}
|
||||
|
||||
.frm-BallotMinThresholdMetadata_Row {
|
||||
@include form-row-base-styles();
|
||||
display: grid;
|
||||
grid-row-gap: $base-grid-gap;
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
@media (min-width: $breakpoint-xxl) {
|
||||
grid-column-gap: $base-grid-gap;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
|
@ -5,6 +5,7 @@
|
|||
@import "BallotFooter";
|
||||
@import "BallotInfoContainer";
|
||||
@import "BallotKeysMetadata";
|
||||
@import "BallotMinThresholdMetadata";
|
||||
@import "Ballots";
|
||||
@import "BaseLoader";
|
||||
@import "ButtonAddBallot";
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -1,40 +1,35 @@
|
|||
import React from 'react'
|
||||
import { FormInput } from '../FormInput'
|
||||
import { inject, observer } from 'mobx-react'
|
||||
|
||||
@inject('ballotStore')
|
||||
@observer
|
||||
export class BallotMinThresholdMetadata extends React.Component {
|
||||
render() {
|
||||
const { ballotStore } = this.props
|
||||
const { ballotStore, networkBranch } = this.props
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="hidden">
|
||||
<div className="left">
|
||||
<div className="form-el">
|
||||
<label htmlFor="key">Proposed Value</label>
|
||||
<input
|
||||
type="number"
|
||||
id="key"
|
||||
value={ballotStore.ballotMinThreshold.proposedValue}
|
||||
onChange={e => ballotStore.changeBallotMetadata(e, 'proposedValue', 'ballotMinThreshold')}
|
||||
/>
|
||||
<p className="hint">Proposed value of the minimum threshold for keys ballot consensus.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="right">
|
||||
<div className="form-el">
|
||||
<label htmlFor="datetime-local">Ballot End</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
id="datetime-local"
|
||||
value={ballotStore.endTime}
|
||||
onChange={e => ballotStore.changeBallotMetadata(e, 'endTime')}
|
||||
/>
|
||||
<p className="hint">Ballot's end time.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="frm-BallotMinThresholdMetadata">
|
||||
<div className="frm-BallotMinThresholdMetadata_Row">
|
||||
<FormInput
|
||||
hint="Proposed value of the minimum threshold for keys ballot consensus."
|
||||
id="key"
|
||||
networkBranch={networkBranch}
|
||||
onChange={e => ballotStore.changeBallotMetadata(e, 'proposedValue', 'ballotMinThreshold')}
|
||||
title="Proposed Value"
|
||||
type="number"
|
||||
value={ballotStore.ballotMinThreshold.proposedValue}
|
||||
/>
|
||||
<FormInput
|
||||
hint="Ballot's end time."
|
||||
id="datetime-local"
|
||||
networkBranch={networkBranch}
|
||||
onChange={e => ballotStore.changeBallotMetadata(e, 'endTime')}
|
||||
title="Ballot End"
|
||||
type="datetime-local"
|
||||
value={ballotStore.endTime}
|
||||
/>
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -430,7 +430,7 @@ export class NewBallot extends React.Component {
|
|||
minThreshold = contractsStore.keysBallotThreshold
|
||||
break
|
||||
case ballotStore.BallotType.minThreshold:
|
||||
metadata = <BallotMinThresholdMetadata />
|
||||
metadata = <BallotMinThresholdMetadata networkBranch={networkBranch} />
|
||||
minThreshold = contractsStore.minThresholdBallotThreshold
|
||||
break
|
||||
case ballotStore.BallotType.proxy:
|
||||
|
|
Loading…
Reference in New Issue