patternfly/tests-src/login.html

This reference implementation of PatternFly is based on [Bootstrap v3](http://getbootstrap.com/). Think of PatternFly as a "skinned" version of Bootstrap with additional components and customizations.

---
categories: [Layouts]
css-extra: false
layout: login
title: Login
resource: true
---
    <span id="badge">
      <img src="../dist/img/logo.svg" alt="{{ site.company }} logo" />
    </span>
    <div class="container">
      <div class="row">
        <div class="col-sm-12">
          <div id="brand">
            <img src="../dist/img/brand.svg" alt="{{ site.title-product }}">
          </div><!--/#brand-->
        </div><!--/.col-*-->
        <div class="col-sm-7 col-md-6 col-lg-5 login">
          <form class="form-horizontal" role="form">
            <div class="form-group">
              <label for="inputUsername" class="col-sm-2 col-md-2 control-label">Username</label>
              <div class="col-sm-10 col-md-10">
                <input type="text" class="form-control" id="inputUsername" placeholder="" tabindex="1">
              </div>
            </div>
            <div class="form-group">
              <label for="inputPassword" class="col-sm-2 col-md-2 control-label">Password</label>
              <div class="col-sm-10 col-md-10">
                <input type="password" class="form-control" id="inputPassword" placeholder="" tabindex="2">
              </div>
            </div>
            <div class="form-group">
              <div class="col-xs-8 col-sm-offset-2 col-sm-6 col-md-offset-2 col-md-6">
                <div class="checkbox">
                  <label>
                    <input type="checkbox" tabindex="3"> Remember username
                  </label>
                </div>
                <span class="help-block"> Forgot <a href="#" tabindex="5">username</a> or <a href="#" tabindex="6">password</a>?</span>
              </div>
              <div class="col-xs-4 col-sm-4 col-md-4 submit">
                <button type="submit" class="btn btn-primary btn-lg" tabindex="4">Log In</button>
              </div>
            </div>
          </form>
        </div><!--/.col-*-->
        <div class="col-sm-5 col-md-6 col-lg-7 details">
          <p><strong>Welcome to {{ site.title }}!</strong>
          This is placeholder text, only. Use this area to place any information or introductory message about your application that may be relevant for users. For example, you might include news or information about the latest release of your product here&mdash;such as a version number.</p>
        </div><!--/.col-*-->
      </div><!--/.row-->
    </div><!--/.container-->