Merge pull request #5726 from ErisDS/forms-tab

[WIP] Markup / tabindex / consistency fixes
This commit is contained in:
Kevin Ansfield 2015-08-26 19:45:11 +01:00
commit 0c4cc67dc1
14 changed files with 21 additions and 28 deletions

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),

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 () {

View File

@ -1,4 +1,4 @@
{{gh-spin-button type="button" classNameBindings=":btn :btn-sm :js-publish-button isDangerous:btn-red:btn-blue" action="save" buttonText=saveText submitting=submitting}}
{{#gh-spin-button type="button" classNameBindings=":btn :btn-sm :js-publish-button isDangerous:btn-red:btn-blue" action="save" submitting=submitting}}{{saveText}}{{/gh-spin-button}}
{{#gh-dropdown-button dropdownName="post-save-menu" classNameBindings=":btn :btn-sm isDangerous:btn-red:btn-blue btnopen:active :dropdown-toggle :up"}}
<i class="options icon-arrow2"></i>

View File

@ -5,7 +5,7 @@
<div class="password-wrap">
{{input class="gh-input password" type="password" placeholder="Password" name="password" value=password}}
</div>
{{gh-spin-button class="btn btn-blue" type="submit" action="validateAndAuthenticate" submitting=submitting buttonText="Log in"}}
{{#gh-spin-button class="btn btn-blue" type="submit" action="validateAndAuthenticate" submitting=submitting}}Log in{{/gh-spin-button}}
</form>
{{/gh-modal-dialog}}

View File

@ -9,7 +9,7 @@
{{gh-input type="password" name="ne2password" placeholder="Confirm Password" class="password" autocorrect="off" autofocus="autofocus" value=ne2Password}}
{{/gh-form-group}}
{{gh-spin-button class="btn btn-blue btn-block" type="submit" submitting=submitting buttonText="Reset Password" autoWidth=false}}
{{#gh-spin-button class="btn btn-blue btn-block" type="submit" submitting=submitting autoWidth="false"}}Reset Password{{/gh-spin-button}}
</form>
<p class="main-error">{{{flowErrors}}}</p>

View File

@ -2,7 +2,7 @@
<header class="view-header">
{{#gh-view-title openMobileMenu="openMobileMenu"}}<span>Code Injection</span>{{/gh-view-title}}
<section class="view-actions">
{{gh-spin-button type="button" class="btn btn-blue" action="save" buttonText="Save" submitting=submitting}}
{{#gh-spin-button class="btn btn-blue" action="save" submitting=submitting}}Save{{/gh-spin-button}}
</section>
</header>

View File

@ -2,7 +2,7 @@
<header class="view-header">
{{#gh-view-title openMobileMenu="openMobileMenu"}}<span>General</span>{{/gh-view-title}}
<section class="view-actions">
{{gh-spin-button type="button" class="btn btn-blue" action="save" buttonText="Save" submitting=submitting}}
{{#gh-spin-button class="btn btn-blue" action="save" submitting=submitting}}Save{{/gh-spin-button}}
</section>
</header>

View File

@ -37,7 +37,7 @@
<fieldset>
<div class="form-group">
<label>Send a test email</label>
{{gh-spin-button type="button" id="sendtestemail" class="btn btn-blue" action="sendTestEmail" buttonText="Send" submitting=submitting}}
{{#gh-spin-button id="sendtestemail" class="btn btn-blue" action="sendTestEmail" submitting=submitting}}Send{{/gh-spin-button}}
<p>Sends a test email to your address.</p>
</div>
</fieldset>

View File

@ -2,7 +2,7 @@
<header class="view-header">
{{#gh-view-title openMobileMenu="openMobileMenu"}}<span>Navigation</span>{{/gh-view-title}}
<section class="view-actions">
{{gh-spin-button type="button" class="btn btn-blue" action="save" buttonText="Save" submitting=submitting}}
{{#gh-spin-button class="btn btn-blue" action="save" submitting=submitting}}Save{{/gh-spin-button}}
</section>
</header>

View File

@ -11,7 +11,7 @@
{{gh-error-message errors=errors property="users"}}
</form>
{{gh-spin-button type="button" classNameBindings=":btn :btn-default :btn-lg :btn-block buttonClass" action="invite" buttonText=buttonText submitting=submitting autoWidth=false}}
{{#gh-spin-button classNameBindings=":btn :btn-default :btn-lg :btn-block buttonClass" action="invite" submitting=submitting autoWidth="false"}}{{buttonText}}{{/gh-spin-button}}
<button class="gh-flow-skip" {{action "skipInvite"}}>
I'll do this later, take me to my blog!

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}}

View File

@ -13,7 +13,7 @@
<button type="button" {{action "forgotten"}} class="forgotten-link btn btn-link" tabindex="4" disabled={{submitting}}>Forgot?</button>
</span>
{{/gh-form-group}}
{{gh-spin-button class="login btn btn-blue btn-block" type="submit" tabindex="3" buttonText="Sign in" submitting=loggingIn autoWidth=false}}
{{#gh-spin-button class="login btn btn-blue btn-block" type="submit" tabindex="3" submitting=loggingIn autoWidth="false"}}Sign in{{/gh-spin-button}}
</form>
<p class="main-error">{{{flowErrors}}}</p>

View File

@ -15,34 +15,27 @@
{{#gh-form-group errors=model.errors property="email"}}
<label for="email-address">Email address</label>
<span class="input-icon icon-mail">
{{gh-input type="email" name="email" placeholder="Eg. john@example.com" class="gh-input" enter=(action "signup") disabled=true autocorrect="off" value=model.email focusOut=(action "handleEmail")}}
{{gh-input type="email" name="email" placeholder="Eg. john@example.com" enter=(action "signup") disabled="disabled" autocorrect="off" value=model.email focusOut=(action "handleEmail")}}
</span>
{{gh-error-message errors=model.errors property="email"}}
{{/gh-form-group}}
{{#gh-form-group errors=model.errors property="name"}}
<label for="full-name">Full name</label>
<span class="input-icon icon-user">
{{gh-input type="text" name="name" placeholder="Eg. John H. Watson" class="gh-input" enter=(action "signup") autofocus="autofocus" autocorrect="off" value=model.name focusOut=(action "validate" "name")}}
{{gh-trim-focus-input tabindex="1" type="text" name="name" placeholder="Eg. John H. Watson" enter=(action "signup") autocorrect="off" value=model.name focusOut=(action "validate" "name")}}
</span>
{{gh-error-message errors=model.errors property="name"}}
{{/gh-form-group}}
{{#gh-form-group errors=model.errors property="password"}}
<label for="password">Password</label>
<span class="input-icon icon-lock">
{{input class="gh-input" type="password" name="password" autofocus="autofocus" enter=(action "signup") autocorrect="off" value=model.password focusOut=(action "validate" "password")}}
<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>
{{gh-input tabindex="2" type="password" name="password" enter=(action "signup") autocorrect="off" value=model.password focusOut=(action "validate" "password")}}
</span>
{{gh-error-message errors=model.errors property="password"}}
{{/gh-form-group}}
</form>
{{gh-spin-button type="submit" class="btn btn-green btn-lg btn-block" action="signup" submitting=submitting buttonText="Create Account" autoWidth=false}}
{{#gh-spin-button tabindex="3" type="submit" class="btn btn-green btn-lg btn-block" action="signup" submitting=submitting autoWidth="false"}}Create Account{{/gh-spin-button}}
<p class="main-error">{{{flowErrors}}}</p>
</section>
</div>

View File

@ -30,7 +30,7 @@
</span>
{{/if}}
{{gh-spin-button class="btn btn-blue" action="save" buttonText="Save" submitting=submitting}}
{{#gh-spin-button class="btn btn-blue" action="save" submitting=submitting}}Save{{/gh-spin-button}}
</section>
</header>