Commit 9601ba1d authored by santiaago's avatar santiaago
Browse files

add get-started section

parent 9452cda1

app/index.html

+2 −0
Original line number Diff line number Diff line
@@ -55,6 +55,8 @@ 
      <div class="tinygraphs-marketing-specs" ng-include="'partials/marketing/specs.html'"></div>

      <hr class="tinygraphs-divider">

      <div class="tinygraphs-example" ng-include="'partials/marketing/example.html'"></div>

      <hr class="tinygraphs-divider">

      <div class="tinygraphs-get-started" ng-include="'partials/marketing/get-started.html'"></div>



    <!-- Start the featurettes

	 ================================================== -->

app/partials/marketing/example.html

+5 −5
Original line number Diff line number Diff line 
<div class="row">

  <div class="col-md-12">

    <h2 class="text-center" id="examples">EXAMPLE</h2>

    <h2 class="text-center" id="examples">EXAMPLES</h2>

    <div class="row">

      <div class="col-md-3">

	<img class="featurette-image img-responsive img-thumbnail" src="/checkerboard" alt="grid image">
@@ -19,16 +19,16 @@ 
</div> <!-- /.row -->

<div class="row">

  <div class="col-md-3">

    <code>/checkerboard</code>

    <code>tinygraphs.com/checkerboard</code>

  </div>

  <div class="col-md-3">

    <code>/squares/random/1</code>

    <code>tinygraphs.com/squares/random/1</code>

  </div>

  <div class="col-md-3">

    <code>/squares/tinygraphs</code>

    <code>tinygraphs.com/squares/tinygraphs</code>

  </div>

  <div class="col-md-3">

    <code>/squares/6/tinygraphs</code>

    <code>tinygraphs.com/squares/6/tinygraphs</code>

  </div>

</div> <!-- /.row -->

<div class="row">

app/partials/marketing/get-started.html

0 → 100644
+31 −0
Original line number Diff line number Diff line 
<div class="row">

  <div class="col-md-12">

    <h2 class="text-center" id="get-started">Get started</h2>

  </div>

</div>

<div class="row">

  <div class="col-md-12">

    <p class="lead text-center">To use tinygraphs in your webside just set the source of your <code>img</code> element to a the url of a tinygraphs image:</p>

    <p class="lead text-center"><code>"http://tinygraphs.com/squares/helloworld"</code></p>

    <p class="lead text-center">like so:</p>

    <p class="lead text-center"><code>&lt;img src=&quot;http://tinygraphs.com/squares/helloworld&quot;&gt;</code><br></p>

  </div>

</div>

<div class="row">

  <div class="col-md-6">

    <h2 class="text-center">try it out!</h2>

    <p class="lead text-center">tinygraphs.com/squares/<input type="text" ng-init="tgsource='helloworld'" ng-model="tgsource"></p>

  </div>

  <div class="col-md-6">

    <p class="lead text-center"><img class="featurette-image img-responsive img-thumbnail" src="/squares/{{tgsource}}" ></p>

  </div>

</div>

<div class="row">

  <div class="col-md-6"></div>

  <div class="col-md-6">

    <p class="lead text-center"><code>tinygraphs.com/squares/{{tgsource}}</code></p>

  </div>

</div> <!-- /.row -->

<div class="row">

    <p class="text-center"><br> <a class="btn btn-lg btn-primary" href="#" role="button">Go somewhere</a> </p>  

</div> <!-- /.row -->