diff options
author | Tom Willemse | 2013-07-15 19:51:45 +0200 |
---|---|---|
committer | Tom Willemse | 2013-07-15 19:51:45 +0200 |
commit | 86b448369e155b98c0659c3e360f62f70a1cca97 (patch) | |
tree | e890ee4352a538df3279e9ffa0b708527fcbcdcc /static | |
parent | d746bfc8e57fb1280fab67d522db86f7d8e2abf1 (diff) | |
download | scrumli-86b448369e155b98c0659c3e360f62f70a1cca97.tar.gz scrumli-86b448369e155b98c0659c3e360f62f70a1cca97.zip |
Use a dialog to send new stories.
Diffstat (limited to 'static')
-rw-r--r-- | static/css/scrumli.css | 5 | ||||
-rw-r--r-- | static/js/main.js | 59 |
2 files changed, 47 insertions, 17 deletions
diff --git a/static/css/scrumli.css b/static/css/scrumli.css index 97ada10..7399c15 100644 --- a/static/css/scrumli.css +++ b/static/css/scrumli.css @@ -1,3 +1,8 @@ .clickable { cursor: pointer; } + +button.nothing { + background-color: inherit; + border: none; +} diff --git a/static/js/main.js b/static/js/main.js index e8991ad..b6c36f9 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -229,6 +229,7 @@ var StoryForm = React.createClass({ var headline = this.refs.headline.getDOMNode().value.trim(); var content = this.refs.content.getDOMNode().value.trim(); + $(".myModal").modal('hide'); this.props.onStorySubmit({role: role, necessity: necessity, headline: headline, @@ -243,27 +244,51 @@ var StoryForm = React.createClass({ }), render: function() { return ( - <form onSubmit={this.handleSubmit}> - <fieldset> - <legend class="toggle">New story</legend> + <div class="myModal modal fade hide"> + <form onSubmit={this.handleSubmit} class="form-horizontal"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal"> + × + </button> + <h3 id="myModalLabel">New story</h3> + </div> + <div class="modal-body"> <div id="new-story"> - <div class="input-prepend input-append"> - <span class="add-on">As a </span> - <input type="text" class="input-medium" ref="role" - placeholder="person" /> - <span class="add-on"> I </span> - <input type="text" class="input-small" - ref="necessity" placeholder="would like" /> - <span class="add-on"> to </span> - <input type="text" class="input-xxlarge" - ref="headline" placeholder="fill in this form..." /> - <button class="btn btn-primary" type="submit">!</button> - <br /> - <textarea ref="content"></textarea> + <div class="control-group"> + <label class="control-label">As a</label> + <div class="controls"> + <input type="text" ref="role" placeholder="person" /> + </div> + </div> + <div class="control-group"> + <label class="control-label">I</label> + <div class="controls"> + <input type="text" ref="necessity" + placeholder="would like" /> + </div> + </div> + <div class="control-group"> + <label class="control-label">to</label> + <div class="controls"> + <input type="text" ref="headline" + placeholder="fill in this form..." /> + </div> + </div> + <div class="control-group"> + <div class="controls"> + <textarea ref="content"></textarea> + </div> </div> </div> - </fieldset> + </div> + <div class="modal-footer"> + <button class="btn" data-dismiss="modal" aria-hidden="true"> + Close + </button> + <button class="btn btn-primary" type="submit">Save</button> + </div> </form> + </div> ); } }); |