mirror of
https://github.com/Unleash/unleash.git
synced 2025-02-04 00:18:01 +01:00
Improve form.
This commit is contained in:
parent
1770de0614
commit
835a85db56
@ -1,3 +1,7 @@
|
|||||||
.new-feature-form {
|
.new-feature-form {
|
||||||
padding: 20px;
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: HelveticaNeueLight, HelveticaNeue-Light, 'Helvetica Neue Light', HelveticaNeue, 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||||
}
|
}
|
@ -23,46 +23,42 @@ var Menu = React.createClass({
|
|||||||
var UnsavedFeature = React.createClass({
|
var UnsavedFeature = React.createClass({
|
||||||
render: function() {
|
render: function() {
|
||||||
return (
|
return (
|
||||||
<div className="bg-info new-feature-form">
|
<div className="bg-info new-feature-form row">
|
||||||
<form className="form-inline" role="form" ref="form">
|
<form className="form-inline" role="form" ref="form">
|
||||||
<div className="form-group">
|
<div className="checkbox col-md-1 text-right">
|
||||||
<label className="sr-only" htmlFor="name">Name</label>
|
<input ref="enabled" type="checkbox" defaultValue={this.props.feature.enabled} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="form-group col-md-4">
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
className="form-control input-large"
|
className="form-control"
|
||||||
id="name"
|
id="name"
|
||||||
ref="name"
|
ref="name"
|
||||||
defaultValue={this.props.feature.name}
|
defaultValue={this.props.feature.name}
|
||||||
placeholder="Enter name" />
|
placeholder="Enter name" />
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="form-group">
|
|
||||||
<div className="input-group">
|
|
||||||
<input className="form-control"
|
<input className="form-control"
|
||||||
type="text"
|
type="text"
|
||||||
ref="description"
|
ref="description"
|
||||||
placeholder="Enter description" />
|
placeholder="Enter description" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="form-group">
|
<div className="form-group col-md-1 col-md-offset-5">
|
||||||
<label className="sr-only" htmlFor="strategy">Strategy</label>
|
<select id="strategy"
|
||||||
<select id="strategy" ref="strategy"
|
ref="strategy"
|
||||||
className="input-large" defaultValue={this.props.feature.strategy}>
|
className=""
|
||||||
|
defaultValue={this.props.feature.strategy}>
|
||||||
<option value="default">default</option>
|
<option value="default">default</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="checkbox">
|
<div className="form-group col-md-1">
|
||||||
<label>
|
<button type="submit" className="btn btn-primary btn-xs" onClick={this.saveFeature}>
|
||||||
Enabled
|
|
||||||
<input ref="enabled" type="checkbox" defaultValue={this.props.feature.enabled} />
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button type="submit" className="btn btn-primary pull-right" onClick={this.saveFeature}>
|
|
||||||
Save
|
Save
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
@ -92,17 +88,16 @@ var SavedFeature = React.createClass({
|
|||||||
render: function() {
|
render: function() {
|
||||||
return (
|
return (
|
||||||
<div className='row'>
|
<div className='row'>
|
||||||
<div className='col-xs-1 col-sm-1 col-md-1 col-lg-1'>
|
<div className='col-md-1 text-right'>
|
||||||
<input
|
<input
|
||||||
type='checkbox'
|
type='checkbox'
|
||||||
className='pull-right'
|
|
||||||
checked={this.props.feature.enabled}
|
checked={this.props.feature.enabled}
|
||||||
onChange={this.onChange} />
|
onChange={this.onChange} />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className='col-xs-4 col-sm-4 col-md-4 col-lg-4'
|
className='col-md-4'
|
||||||
title='{this.props.feature.description}'>{this.props.feature.name}</div>
|
title='{this.props.feature.description}'>{this.props.feature.name}</div>
|
||||||
<div className='pull-right col-xs-2 col-sm-2 col-md-2 col-lg-2'>
|
<div className='col-md-2 col-md-offset-5'>
|
||||||
{this.props.feature.strategy}
|
{this.props.feature.strategy}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -134,13 +129,13 @@ var FeatureList = React.createClass({
|
|||||||
}.bind(this));
|
}.bind(this));
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="container-fluid">
|
<div className="container">
|
||||||
<div className='panel panel-primary'>
|
<div className='panel panel-primary'>
|
||||||
<div className='panel-heading'>
|
<div className='panel-heading'>
|
||||||
<h3 className='panel-title'>Features</h3>
|
<h3 className='panel-title'>Features</h3>
|
||||||
<div className='text-right'>
|
<div className='text-right'>
|
||||||
<button type="button"
|
<button type="button"
|
||||||
className="btn btn-success btn-sm"
|
className="btn btn-default btn-sm"
|
||||||
onClick={this.props.onNewFeature}>
|
onClick={this.props.onNewFeature}>
|
||||||
<span className="glyphicon glyphicon-plus"></span> New
|
<span className="glyphicon glyphicon-plus"></span> New
|
||||||
</button>
|
</button>
|
||||||
|
Loading…
Reference in New Issue
Block a user