2015-03-29 21:10:53 +03:00
<section class="gh-flow-content">
<header>
<h1>Create your account</h1>
</header>
<form id="setup" class="gh-flow-create">
{{!-- Horrible hack to prevent Chrome from incorrectly auto-filling inputs --}}
<input style="display:none;" type="text" name="fakeusernameremembered"/>
<input style="display:none;" type="password" name="fakepasswordremembered"/>
<figure class="account-image">
<div class="placeholder-img" style="background-image: url( {{ gh-path 'admin' 'img/ghosticon.jpg' }} )"></div>
<!-- TODO: fix/change this to prevent XSS -->
<div id="account-image" class="gravatar-img" style=" {{ userImageBackground }} ">
<span class="sr-only">User image</span>
</div>
<a class="edit-account-image" href="#"><i class="icon-photos"><span class="sr-only">Upload an image</span></i></a>
</figure>
2015-06-07 06:19:19 +03:00
{{ # gh-form-group errors = errors property = "email" }}
2015-03-29 21:10:53 +03:00
<label for="email-address">Email address</label>
<span class="input-icon icon-mail">
2015-06-07 06:19:19 +03:00
{{ gh-input type = "email" name = "email" placeholder = "Eg. john@example.com" class = "gh-input" autofocus = "autofocus" autocorrect = "off" value = email focusOut = ( action "validate" "email" ) }}
2015-03-29 21:10:53 +03:00
</span>
2015-06-07 06:19:19 +03:00
{{ gh-error-message errors = errors property = "email" }}
{{ / gh-form-group }}
{{ # gh-form-group errors = errors property = "name" }}
2015-03-29 21:10:53 +03:00
<label for="full-name">Full name</label>
<span class="input-icon icon-user">
2015-06-07 06:19:19 +03:00
{{ gh-input type = "text" name = "name" placeholder = "Eg. John H. Watson" class = "gh-input" autofocus = "autofocus" autocorrect = "off" value = name focusOut = ( action "validate" "name" ) }}
2015-03-29 21:10:53 +03:00
</span>
2015-06-07 06:19:19 +03:00
{{ gh-error-message errors = errors property = "name" }}
{{ / gh-form-group }}
{{ # gh-form-group errors = errors property = "password" }}
2015-03-29 21:10:53 +03:00
<label for="password">Password</label>
<span class="input-icon icon-lock">
2015-06-07 06:19:19 +03:00
{{ gh-input type = "password" name = "password" placeholder = "At least 8 characters" class = "gh-input" autofocus = "autofocus" autocorrect = "off" value = password focusOut = ( action "validate" "password" ) }}
2015-03-29 21:10:53 +03:00
<div class="pw-strength">
<div class="pw-strength-dot"></div>
<div class="pw-strength-dot"></div>
<div class="pw-strength-dot"></div>
<div class="pw-strength-dot"></div>
<div class="pw-strength-dot <!--pw-strength-activedot-->"></div>
</div>
</span>
2015-06-07 06:19:19 +03:00
{{ gh-error-message errors = errors property = "password" }}
{{ / gh-form-group }}
{{ # gh-form-group errors = errors property = "blogTitle" }}
2015-03-29 21:10:53 +03:00
<label for="blog-title">Blog title</label>
<span class="input-icon icon-content">
2015-06-07 06:19:19 +03:00
{{ gh-input type = "text" name = "blog-title" placeholder = "Eg. The Daily Awesome" class = "gh-input" autofocus = "autofocus" autocorrect = "off" value = blogTitle focusOut = ( action "validate" "blogTitle" ) }}
2015-03-29 21:10:53 +03:00
</span>
2015-06-07 06:19:19 +03:00
{{ gh-error-message errors = errors property = "blogTitle" }}
{{ / gh-form-group }}
2015-03-29 21:10:53 +03:00
</form>
<button type="submit" class="btn btn-green btn-lg btn-block" {{ action "setup" }} {{ submitting }} >Last step: Invite your team <i class="icon-chevron"></i></button>
2015-06-07 06:19:19 +03:00
{{ # if showError }}
<p class="main-error"> {{ in validMessage }} </p>
{{ / if }}
2015-03-29 21:10:53 +03:00
</section>