Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-13 22:41:32 -05:00
Code Issues Activity

Improve markup + tabindex etc on setup/two

Browse source 
refs #5652

- ensure gh-spin-button passes type & tabindex through to markup
- add gh-input class to auto focus input
- add tabindexes to setup/two + make first field autofocus and button submit
This commit is contained in:
Hannah Wolfe 2015-08-25 20:36:40 +01:00
parent 5662ccc3f7
commit a399adea3b
3 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
core/client/app/components/gh-spin-button.js
View file

@ -8,7 +8,7 @@ export default Ember.Component.extend({
autoWidth: true,
// Disable Button when isLoading equals true
attributeBindings: ['disabled'],
attributeBindings: ['disabled', 'type', 'tabindex'],
// Must be set on the controller
disabled: Ember.computed.equal('submitting', true),

2
core/client/app/components/gh-trim-focus-input.js
View file

@ -2,7 +2,7 @@ import Ember from 'ember';
/*global device*/
var TrimFocusInput = Ember.TextField.extend({
focus: true,
classNames: 'gh-input',
attributeBindings: ['autofocus'],
autofocus: Ember.computed(function () {

10
core/client/app/templates/setup/two.hbs
View file

@ -11,33 +11,33 @@
{{#gh-form-group errors=errors property="email"}}
<label for="email-address">Email address</label>
<span class="input-icon icon-mail">
{{gh-input type="email" name="email" enter=(action "setup") placeholder="Eg. john@example.com" class="gh-input" autofocus="autofocus" autocorrect="off" value=email focusOut=(action "handleEmail")}}
{{gh-trim-focus-input tabindex="1" type="email" name="email" enter=(action "setup") placeholder="Eg. john@example.com" autocorrect="off" value=email focusOut=(action "handleEmail")}}
</span>
{{gh-error-message errors=errors property="email"}}
{{/gh-form-group}}
{{#gh-form-group errors=errors property="name"}}
<label for="full-name">Full name</label>
<span class="input-icon icon-user">
{{gh-input type="text" name="name" enter=(action "setup") placeholder="Eg. John H. Watson" class="gh-input" autofocus="autofocus" autocorrect="off" value=name focusOut=(action "validate" "name")}}
{{gh-input tabindex="2" type="text" name="name" enter=(action "setup") placeholder="Eg. John H. Watson" autocorrect="off" value=name focusOut=(action "validate" "name")}}
</span>
{{gh-error-message errors=errors property="name"}}
{{/gh-form-group}}
{{#gh-form-group errors=errors property="password"}}
<label for="password">Password</label>
<span class="input-icon icon-lock">
{{gh-input type="password" name="password" enter=(action "setup") placeholder="At least 8 characters" class="gh-input" autofocus="autofocus" autocorrect="off" value=password focusOut=(action "validate" "password")}}
{{gh-input tabindex="3" type="password" name="password" enter=(action "setup") placeholder="At least 8 characters" autocorrect="off" value=password focusOut=(action "validate" "password")}}
</span>
{{gh-error-message errors=errors property="password"}}
{{/gh-form-group}}
{{#gh-form-group errors=errors property="blogTitle"}}
<label for="blog-title">Blog title</label>
<span class="input-icon icon-content">
{{gh-input type="text" name="blog-title" enter=(action "setup") placeholder="Eg. The Daily Awesome" class="gh-input" autofocus="autofocus" autocorrect="off" value=blogTitle focusOut=(action "validate" "blogTitle")}}
{{gh-input tabindex="4" type="text" name="blog-title" enter=(action "setup") placeholder="Eg. The Daily Awesome" autocorrect="off" value=blogTitle focusOut=(action "validate" "blogTitle")}}
</span>
{{gh-error-message errors=errors property="blogTitle"}}
{{/gh-form-group}}
</form>
{{#gh-spin-button type="button" class="btn btn-green btn-lg btn-block" action="setup" submitting=submitting autoWidth=false}}
{{#gh-spin-button type="submit" tabindex="5" class="btn btn-green btn-lg btn-block" action="setup" submitting=submitting autoWidth="false"}}
Last step: Invite your team <i class="icon-chevron"></i>
{{/gh-spin-button}}