<!--** OFFLINE **-->
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<!--<link href="/styles/font-awesome.css" rel="stylesheet">-->
<div class="container-fluid">
    <h1 class="text-center" style="font-size: 76px; line-height: 76px; margin: 45px 0 40px;">forms-angular</h1>
    <h3 class="text-center"><i class="icon-quote-left"></i> Probably the most opinionated framework in the world <i class="icon-quote-right"></i></h3>

    <div ng-class="css('rowFluid')">
      <div class="big-box hero-unit span6 col-sm-6">
        <h2 class="text-center">Turns this...</h2>
        <div>
          <img src="/images/mongoose-schema.png" alt="Simple mongoose schema">
        </div>
      </div>
      <div class="big-box hero-unit span6 col-sm-6">
        <h2 class="text-center">...into this</h2>
        <div>
          <img src="/images/screen.png" alt="Screen shot of simple form">
        </div>
      </div>
    </div>
    <div ng-class="css('rowFluid')">
        <h2 class="text-center">...with just a few lines of code!</h2>
    </div>

    <div ng-class="css('rowFluid')" style="text-align: center; margin-top: 25px;">
        <div class="span4 col-sm-4">
            <i class="fa fa-edit fa-4x icon-edit icon-4x" style="font-size:96pt;"></i>

            <h2>Form generation</h2>

            <p><strong>forms-angular</strong> is a simple framework build on top of the <a href="http://blog.mongodb.org/post/49262866911/the-mean-stack-mongodb-expressjs-angularjs-and">MEAN
                stack</a>
                (with a little <a href="http://twitter.github.io/bootstrap/">Twitter Bootstrap</a> and <a href="http://mongoosejs.com/">Mongoose</a> thrown in for good measure) that
                enables you to generate forms super quickly. At its simplest it takes a mongoose schema and generates a
                form, complete with REST routing and bindings.</p>
        </div>
        <div class="span4 col-sm-4">
            <i class="fa fa-bolt fa-4x icon-bolt icon-4x" style="font-size:96pt;"></i>

            <h2>Quick start</h2>

            <p>You can have your first forms-angular application running in a few minutes using the Yeoman generator.
                Once the generator is installed <strong>yo fng</strong> is all it takes to get you up and running - see the
            <a ng-href="{{buildUrl('get-started')}}">Getting Started</a> page for details.</p>
        </div>
        <div class="span4 col-sm-4">
            <i class="fa fa-wrench fa-4x icon-wrench icon-4x" style="font-size:96pt;"></i>

            <h2>Customisation</h2>

            <p>Forms-angular is easy to extend, using regular Angular JS controllers that allow you to hook into
                navigation elements, data events and much more.  It also comes with a number of <a ng-href="{{buildUrl('plugins')}}">plugins</a>
            that extend the base functionality, adding <strong>reporting</strong>, full featured <strong>editors</strong> and much much more!</p>
        </div>
    </div>
</div>
