Ghost/ghost/admin/app/templates/signup.hbs
Kevin Ansfield 2d507c47b1 Converted <GhErrorMessage> to glimmer component
no issue

- fixes `isVisible` deprecation warning that was showing up for every component invocation since the Ember 3.14 upgrade
2019-12-13 16:12:04 +00:00

90 lines
4.2 KiB
Handlebars

<div class="gh-flow">
<div class="gh-flow-content-wrap">
<section class="gh-flow-content">
<header>
<h1>Create your account</h1>
</header>
<form id="signup" class="gh-flow-create" method="post" novalidate="novalidate" onsubmit={{action "submit"}}>
{{gh-profile-image email=this.signupDetails.email setImage=(action "setImage")}}
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="name"}}
<label for="name">Full name</label>
<span class="gh-input-icon gh-icon-user">
{{svg-jar "user-circle"}}
{{gh-trim-focus-input
tabindex="1"
type="text"
id="display-name"
name="display-name"
placeholder="Eg. John H. Watson"
autocorrect="off"
autocomplete="name"
value=(readonly this.signupDetails.name)
input=(action (mut this.signupDetails.name) value="target.value")
focus-out=(action "validate" "name")
data-test-input="name"
}}
</span>
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="name" />
{{/gh-form-group}}
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="email"}}
<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"
value=(readonly this.signupDetails.email)
input=(action (mut this.signupDetails.email) value="target.value")
focus-out=(action "validate" "email")
data-test-input="email"
}}
</span>
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="email" />
{{/gh-form-group}}
{{#gh-form-group errors=this.signupDetails.errors hasValidated=this.signupDetails.hasValidated property="password"}}
<label for="password">Password</label>
<span class="gh-input-icon gh-icon-lock">
{{svg-jar "lock"}}
{{gh-text-input
tabindex="3"
type="password"
id="password"
name="password"
placeholder="At least 10 characters"
autocorrect="off"
autocomplete="new-password"
value=(readonly this.signupDetails.password)
input=(action (mut this.signupDetails.password) value="target.value")
focus-out=(action "validate" "password")
data-test-input="password"
}}
</span>
<GhErrorMessage @errors={{this.signupDetails.errors}} @property="password" />
{{/gh-form-group}}
</form>
{{gh-task-button "Create Account"
type="submit"
form="signup"
defaultClick=true
runningText="Creating"
task=this.signup
class="gh-btn gh-btn-green gh-btn-lg gh-btn-block gh-btn-icon"
tabindex="3"}}
<p class="main-error">{{if this.flowErrors this.flowErrors}}&nbsp;</p>
</section>
</div>
</div>