<div class="signin-form-element" style="position: relative">
  <span class="cor-loader" ng-show="signingIn"></span>
  <form class="form-signin" ng-submit="signin();" ng-show="!signingIn">
    <input type="text" class="form-control input-lg" name="username"
           placeholder="Username or E-mail Address" ng-model="user.username" autofocus>
    <input type="password" class="form-control input-lg" name="password"
           placeholder="Password" ng-model="user.password">

    <div class="co-alert co-alert-warning" ng-show="tryAgainSoon > 0">
      Too many attempts have been made to login. Please try again in {{ tryAgainSoon }} second<span ng-if="tryAgainSoon != 1">s</span>.
    </div>

    <span ng-show="tryAgainSoon == 0">
      <button class="btn btn-lg btn-primary btn-block" type="submit">Sign In</button>

      <span class="social-alternate" quay-show="Features.GITHUB_LOGIN || Features.GOOGLE_LOGIN">
        <i class="fa fa-circle"></i>
        <span class="inner-text">OR</span>
      </span>

      <div class="external-login-button" provider="github" redirect-url="redirectUrl" sign-in-started="markStarted()"></div>
      <div class="external-login-button" provider="google" redirect-url="redirectUrl" sign-in-started="markStarted()"></div>
    </span>
  </form>

  <div class="co-alert co-alert-danger" ng-show="invalidCredentials">
    {{ invalidCredentialsMessage || 'Invalid username or password.' }}
  </div>
  <div class="co-alert co-alert-danger" ng-show="needsEmailVerification">
    You must verify your email address before you can sign in.
  </div>
</div>
