diff --git a/project/templates/home/home.html b/project/templates/home/home.html index 058022db53c8c3acc8100a48b408c0d4fdd25a26..74bd0a82245d1bafe7702b70b67dabf247d64fc7 100644 --- a/project/templates/home/home.html +++ b/project/templates/home/home.html @@ -1,34 +1,79 @@ {% extends "usernav.html" if user else "index.html"%} {% block content %} - <div class="col-sm-12"> - <div class="jumbotron"> - <h1>It's working!!!</h1> - <p>Here, all of your wildest dreams can come true.</p> - <p><a class="btn btn-primary btn-lg" role="button">The Demo</a></p> - </div> - - <div class="row"> - <div class="col-xs-12 col-sm-6"> - <div class="thumbnail"> - <img data-src="holder.js/100%x200/sky" alt="..."> - <div class="caption"> - <h3>Awesome Sauce!</h3> - </div> - </div> - </div> - <div class="col-xs-12 col-sm-6"> - <div class="thumbnail"> - <img data-src="holder.js/100%x200/vine" alt="..."> - <div class="caption"> - <h3>It is so cool!</h3> - </div> - </div> - </div> - </div> - </div> + <div class="col-sm-12"> + + <div id="carousel-homepage" class="carousel slide" data-ride="carousel" data-pause="hover"> + <!-- Indicators --> + <ol class="carousel-indicators"> + <li data-target="#carousel-homepage" data-slide-to="0" class="active"></li> + <li data-target="#carousel-homepage" data-slide-to="1"></li> + <li data-target="#carousel-homepage" data-slide-to="2"></li> + </ol> + + <!-- Wrapper for slides --> + <div class="carousel-inner"> + <div class="item active"> + <img src="holder.js/100%x500/#777:#555/text:Welcome" alt="Welcome"> + <div class="carousel-caption"> + <h3>Welcome to My Movie Library</h3> + <p>This web application can help you keep track of your ever-growning movie library</p> + </div> + </div> + <div class="item"> + <img src="http://sccreader.files.wordpress.com/2012/09/movie_night_images.png" alt="Second Slide"> + <div class="carousel-caption"> + <h3>Awesome-sauce!</h3> + <p>You can keep track of the movies you loan to your friends!</p> + </div> + </div> + <div class="item"> + <img src="holder.js/100%x500/#555:#333/text:Third Slide" alt="Third Slide"> + <div class="carousel-caption"> + <h3>Open Source</h3> + <p>This project used open source tools provided by the community</p> + </div> + </div> + </div> + + <!-- Controls --> + <a class="left carousel-control" href="#carousel-homepage" data-slide="prev"> + <span class="glyphicon glyphicon-chevron-left"></span> + </a> + <a class="right carousel-control" href="#carousel-homepage" data-slide="next"> + <span class="glyphicon glyphicon-chevron-right"></span> + </a> + </div> + + + + <!-- <div class="jumbotron"> + <h1>It's working!!!</h1> + <p>Here, all of your wildest dreams can come true.</p> + <p><a class="btn btn-primary btn-lg" role="button">The Demo</a></p> + </div> + + <div class="row"> + <div class="col-xs-12 col-sm-6"> + <div class="thumbnail"> + <img data-src="holder.js/100%x200/sky" alt="..."> + <div class="caption"> + <h3>Awesome Sauce!</h3> + </div> + </div> + </div> + <div class="col-xs-12 col-sm-6"> + <div class="thumbnail"> + <img data-src="holder.js/100%x200/vine" alt="..."> + <div class="caption"> + <h3>It is so cool!</h3> + </div> + </div> + </div> + </div> --> + </div> {% endblock %} {% block modals %} - {% include "home/login_modal.html" %} - {% include "home/signup_modal.html" %} + {% include "home/login_modal.html" %} + {% include "home/signup_modal.html" %} {% endblock %}