diff options
author | Dessalines <tyhou13@gmx.com> | 2019-04-04 19:08:21 -0700 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2019-04-04 19:08:21 -0700 |
commit | 6a3bea1f50137993c74f8c38e417892929022234 (patch) | |
tree | 9b3eb4b66404431314c10a4cd4c82f0dbff34614 /ui/src/components/community-form.tsx | |
parent | 977b1985e3497f759a44b15f4a87b9cd11017f48 (diff) |
Adding some UI cancel buttons.
Diffstat (limited to 'ui/src/components/community-form.tsx')
-rw-r--r-- | ui/src/components/community-form.tsx | 25 |
1 files changed, 15 insertions, 10 deletions
diff --git a/ui/src/components/community-form.tsx b/ui/src/components/community-form.tsx index a8ea7b11..0cf67983 100644 --- a/ui/src/components/community-form.tsx +++ b/ui/src/components/community-form.tsx @@ -67,26 +67,26 @@ export class CommunityForm extends Component<CommunityFormProps, CommunityFormSt return ( <form onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}> <div class="form-group row"> - <label class="col-sm-2 col-form-label">Name</label> - <div class="col-sm-10"> + <label class="col-12 col-form-label">Name</label> + <div class="col-12"> <input type="text" class="form-control" value={this.state.communityForm.name} onInput={linkEvent(this, this.handleCommunityNameChange)} required minLength={3} pattern="[a-z0-9_]+" title="lowercase, underscores, and no spaces."/> </div> </div> <div class="form-group row"> - <label class="col-sm-2 col-form-label">Title / Headline</label> - <div class="col-sm-10"> + <label class="col-12 col-form-label">Title</label> + <div class="col-12"> <input type="text" value={this.state.communityForm.title} onInput={linkEvent(this, this.handleCommunityTitleChange)} class="form-control" required minLength={3} /> </div> </div> <div class="form-group row"> - <label class="col-sm-2 col-form-label">Description / Sidebar</label> - <div class="col-sm-10"> + <label class="col-12 col-form-label">Sidebar</label> + <div class="col-12"> <textarea value={this.state.communityForm.description} onInput={linkEvent(this, this.handleCommunityDescriptionChange)} class="form-control" rows={6} /> </div> </div> <div class="form-group row"> - <label class="col-sm-2 col-form-label">Category</label> - <div class="col-sm-10"> + <label class="col-12 col-form-label">Category</label> + <div class="col-12"> <select class="form-control" value={this.state.communityForm.category_id} onInput={linkEvent(this, this.handleCommunityCategoryChange)}> {this.state.categories.map(category => <option value={category.id}>{category.name}</option> @@ -95,8 +95,9 @@ export class CommunityForm extends Component<CommunityFormProps, CommunityFormSt </div> </div> <div class="form-group row"> - <div class="col-sm-10"> - <button type="submit" class="btn btn-secondary">{this.props.community ? 'Edit' : 'Create'} Community</button> + <div class="col-12"> + <button type="submit" class="btn btn-secondary mr-2">{this.props.community ? 'Save' : 'Create'}</button> + {this.props.community && <button type="button" class="btn btn-secondary" onClick={linkEvent(this, this.handleCancel)}>Cancel</button>} </div> </div> </form> @@ -132,6 +133,10 @@ export class CommunityForm extends Component<CommunityFormProps, CommunityFormSt i.setState(i.state); } + handleCancel(i: CommunityForm, event) { + i.props.onCancel(); + } + parseMessage(msg: any) { let op: UserOperation = msgOp(msg); console.log(msg); |