2015-05-17 15:31:54 +03:00
|
|
|
<div class="gh-flow">
|
2014-07-30 19:04:03 +04:00
|
|
|
|
2015-05-17 15:31:54 +03:00
|
|
|
<div class="gh-flow-content-wrap">
|
|
|
|
<section class="gh-flow-content">
|
2017-09-04 22:17:04 +03:00
|
|
|
<header>
|
|
|
|
<h1>Create your account</h1>
|
|
|
|
</header>
|
2016-09-30 14:43:40 +03:00
|
|
|
|
2019-01-31 13:27:40 +03:00
|
|
|
<form id="signup" class="gh-flow-create" method="post" novalidate="novalidate" onsubmit={{action "submit"}}>
|
2019-12-13 17:20:29 +03:00
|
|
|
{{gh-profile-image email=this.signupDetails.email setImage=(action "setImage")}}
|
2016-09-30 14:43:40 +03:00
|
|
|
|
2019-12-13 17:20:29 +03:00
|
|
|
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="name"}}
|
2018-09-17 18:03:58 +03:00
|
|
|
<label for="name">Full name</label>
|
2017-09-04 22:17:04 +03:00
|
|
|
<span class="gh-input-icon gh-icon-user">
|
2018-03-19 12:57:31 +03:00
|
|
|
{{svg-jar "user-circle"}}
|
2018-02-28 14:44:03 +03:00
|
|
|
{{gh-trim-focus-input
|
2017-09-04 22:17:04 +03:00
|
|
|
tabindex="1"
|
|
|
|
type="text"
|
2019-01-31 13:27:40 +03:00
|
|
|
id="display-name"
|
|
|
|
name="display-name"
|
2017-09-04 22:17:04 +03:00
|
|
|
placeholder="Eg. John H. Watson"
|
|
|
|
autocorrect="off"
|
2019-01-31 13:27:40 +03:00
|
|
|
autocomplete="name"
|
2019-12-13 17:20:29 +03:00
|
|
|
value=(readonly this.signupDetails.name)
|
|
|
|
input=(action (mut this.signupDetails.name) value="target.value")
|
2018-02-28 14:44:03 +03:00
|
|
|
focus-out=(action "validate" "name")
|
2019-01-31 13:27:40 +03:00
|
|
|
data-test-input="name"
|
2018-02-28 14:44:03 +03:00
|
|
|
}}
|
2017-09-04 22:17:04 +03:00
|
|
|
</span>
|
2019-12-13 19:11:49 +03:00
|
|
|
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="name" />
|
2017-09-04 22:17:04 +03:00
|
|
|
{{/gh-form-group}}
|
2016-09-30 14:43:40 +03:00
|
|
|
|
2019-12-13 17:20:29 +03:00
|
|
|
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="email"}}
|
2019-02-11 14:35:27 +03:00
|
|
|
<label for="email">Email address</label>
|
|
|
|
<span class="gh-input-icon gh-icon-mail">
|
|
|
|
{{svg-jar "email"}}
|
|
|
|
{{gh-text-input
|
|
|
|
tabindex="2"
|
|
|
|
type="text"
|
|
|
|
id="username"
|
|
|
|
name="username"
|
|
|
|
placeholder="Eg. john@example.com"
|
|
|
|
autocorrect="off"
|
|
|
|
autocomplete="username email"
|
2019-12-13 17:20:29 +03:00
|
|
|
value=(readonly this.signupDetails.email)
|
|
|
|
input=(action (mut this.signupDetails.email) value="target.value")
|
2019-02-11 15:35:47 +03:00
|
|
|
focus-out=(action "validate" "email")
|
2019-02-11 14:35:27 +03:00
|
|
|
data-test-input="email"
|
|
|
|
}}
|
|
|
|
</span>
|
2019-12-13 19:11:49 +03:00
|
|
|
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="email" />
|
2019-02-11 14:35:27 +03:00
|
|
|
{{/gh-form-group}}
|
|
|
|
|
2019-12-13 17:20:29 +03:00
|
|
|
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="password"}}
|
2017-09-04 22:17:04 +03:00
|
|
|
<label for="password">Password</label>
|
|
|
|
<span class="gh-input-icon gh-icon-lock">
|
2018-03-19 12:57:31 +03:00
|
|
|
{{svg-jar "lock"}}
|
2018-02-28 14:44:03 +03:00
|
|
|
{{gh-text-input
|
2019-01-31 13:27:40 +03:00
|
|
|
tabindex="3"
|
2017-09-04 22:17:04 +03:00
|
|
|
type="password"
|
2018-09-17 18:03:58 +03:00
|
|
|
id="password"
|
2017-09-04 22:17:04 +03:00
|
|
|
name="password"
|
2017-10-19 11:23:14 +03:00
|
|
|
placeholder="At least 10 characters"
|
2017-09-04 22:17:04 +03:00
|
|
|
autocorrect="off"
|
2019-01-31 13:27:40 +03:00
|
|
|
autocomplete="new-password"
|
2019-12-13 17:20:29 +03:00
|
|
|
value=(readonly this.signupDetails.password)
|
|
|
|
input=(action (mut this.signupDetails.password) value="target.value")
|
2019-01-31 13:27:40 +03:00
|
|
|
focus-out=(action "validate" "password")
|
|
|
|
data-test-input="password"
|
|
|
|
}}
|
2017-09-04 22:17:04 +03:00
|
|
|
</span>
|
2019-12-13 19:11:49 +03:00
|
|
|
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="password" />
|
2017-09-04 22:17:04 +03:00
|
|
|
{{/gh-form-group}}
|
|
|
|
</form>
|
2016-09-30 14:43:40 +03:00
|
|
|
|
2017-09-04 22:17:04 +03:00
|
|
|
{{gh-task-button "Create Account"
|
2018-09-17 18:03:58 +03:00
|
|
|
type="submit"
|
|
|
|
form="signup"
|
2019-01-31 13:27:40 +03:00
|
|
|
defaultClick=true
|
2017-09-04 22:17:04 +03:00
|
|
|
runningText="Creating"
|
2019-12-13 17:20:29 +03:00
|
|
|
task=this.signup
|
2017-09-04 22:17:04 +03:00
|
|
|
class="gh-btn gh-btn-green gh-btn-lg gh-btn-block gh-btn-icon"
|
|
|
|
tabindex="3"}}
|
2016-09-30 14:43:40 +03:00
|
|
|
|
2019-12-13 17:20:29 +03:00
|
|
|
<p class="main-error">{{if this.flowErrors this.flowErrors}} </p>
|
2015-05-17 15:31:54 +03:00
|
|
|
</section>
|
2014-07-17 15:34:40 +04:00
|
|
|
</div>
|
2015-05-17 15:31:54 +03:00
|
|
|
|
|
|
|
</div>
|