Ghost/ghost/admin/app/templates/signup.hbs
Kevin Ansfield e22eb668c4 💄 refactor setup screens to use ember-concurrency (#644)
refs TryGhost/Ghost#7865

💄 refactor signup to use ember-concurrency

refs https://github.com/TryGhost/Ghost/issues/7865
- moves authentication actions from `signup` route to controller
- refactors authentication and signup logic into EC tasks
- replaces use of `gh-spin-button` with `gh-task-button` in signup template

💄 refactor setup screens to use ember-concurrency

refs https://github.com/TryGhost/Ghost/issues/7865
- moves authentication actions from `setup/two` route to controller
- refactors authentication and setup logic into EC tasks
- replaces use of `gh-spin-button` with `gh-task-button`
- fixes some styling issues with the new SVG icons
- adds `app/styles/patterns/icons.css` back to contain per-icon overrides and animations (some SVGs use fills and others use strokes so we sometimes have conflicting styles)
2017-04-19 12:27:32 +02:00

94 lines
4.3 KiB
Handlebars

<div class="gh-flow">
<div class="gh-flow-content-wrap">
<section class="gh-flow-content">
{{#if config.ghostOAuth}}
<header>
<h1>{{config.blogTitle}}</h1>
<p>
{{!-- TODO: show invite creator's name/email --}}
Accept your invite from <strong>{{model.invitedBy}}</strong>
</p>
</header>
<form id="signup" class="gh-signin" method="post" novalidate="novalidate">
{{gh-task-button "Sign in with Ghost to accept"
task=authenticateWithGhostOrg
type="submit"
class="login gh-btn gh-btn-blue gh-btn-block gh-btn-icon"
tabindex="3"}}
</form>
{{else}}
<header>
<h1>Create your account</h1>
</header>
<form id="signup" class="gh-flow-create" method="post" novalidate="novalidate">
{{!-- Hack to stop Chrome's broken auto-fills --}}
<input style="display:none;" type="text" name="fakeusernameremembered"/>
<input style="display:none;" type="password" name="fakepasswordremembered"/>
{{gh-profile-image email=model.email setImage=(action "setImage")}}
{{#gh-form-group}}
<label for="email-address">Email address</label>
<span class="gh-input-icon gh-icon-mail">
{{inline-svg "email"}}
{{gh-input model.email
type="email"
name="email"
placeholder="Eg. john@example.com"
disabled="disabled"
autocorrect="off"}}
</span>
{{/gh-form-group}}
{{#gh-form-group errors=model.errors hasValidated=hasValidated property="name"}}
<label for="full-name">Full name</label>
<span class="gh-input-icon gh-icon-user">
{{inline-svg "user-circle"}}
{{gh-trim-focus-input model.name
tabindex="1"
type="text"
name="name"
placeholder="Eg. John H. Watson"
autocorrect="off"
onenter=(action "signup")
focusOut=(action "validate" "name")
update=(action (mut model.name))}}
</span>
{{gh-error-message errors=model.errors property="name"}}
{{/gh-form-group}}
{{#gh-form-group errors=model.errors hasValidated=hasValidated property="password"}}
<label for="password">Password</label>
<span class="gh-input-icon gh-icon-lock">
{{inline-svg "lock"}}
{{gh-input model.password
tabindex="2"
type="password"
name="password"
placeholder="At least 8 characters"
onenter=(action "signup")
autocorrect="off"
focusOut=(action "validate" "password")
update=(action (mut model.password))}}
</span>
{{gh-error-message errors=model.errors property="password"}}
{{/gh-form-group}}
</form>
{{gh-task-button "Create Account"
runningText="Creating"
task=signup
class="gh-btn gh-btn-green gh-btn-lg gh-btn-block gh-btn-icon"
tabindex="3"}}
{{/if}}
<p class="main-error">{{{if flowErrors flowErrors "&nbsp;"}}}</p>
</section>
</div>
</div>