Added back in action buttons to input label/fieldset

This commit is contained in:
orangemug 2020-06-10 10:59:44 +01:00
parent f3906c8dd8
commit 40579c3e0c
4 changed files with 21 additions and 3 deletions

View file

@ -72,6 +72,9 @@ export default class Block extends React.Component {
<div className="maputnik-input-block-label">
{this.props.label}
</div>
<div className="maputnik-input-block-action">
{this.props.action}
</div>
<div className="maputnik-input-block-content" ref={el => this._blockEl = el}>
{this.props.children}
</div>

View file

@ -14,7 +14,12 @@ export default class Fieldset extends React.Component {
const {props} = this;
return <div className="maputnik-input-block" role="group" aria-labelledby={this._labelId}>
<div className="maputnik-input-block-label" id={this._labelId}>{props.label}</div>
<div className="maputnik-input-block-label" id={this._labelId}>
{props.label}
</div>
<div className="maputnik-input-block-action">
{this.props.action}
</div>
<div className="maputnik-input-block-content">
{props.children}
</div>

View file

@ -33,7 +33,7 @@ export default class SpecField extends React.Component {
TypeBlock = Block;
}
return <TypeBlock label={props.label}>
return <TypeBlock label={props.label} action={props.action}>
<InputSpec {...props} />
</TypeBlock>
}

View file

@ -168,11 +168,21 @@
color: $color-lowgray;
display: inline-block;
user-select: none;
width: 50%;
width: 32%;
vertical-align: top;
font-size: 12px;
}
&-action {
color: $color-lowgray;
display: inline-block;
user-select: none;
width: 18%;
vertical-align: top;
font-size: 12px;
text-align: right;
}
&-content {
display: inline-block;
width: 50%;