{% extends "layout.html" %} {% block title %}{{ this.name }}{% endblock %} {% block outerbody %} <div class="container showcase-site"> <div class="row"> <div class="back-link"> <a href="{{ this.parent|url }}">Back to Showcase</a> </div> <h1>{{ this.name }}</h1> <p class="site-link"><a href="{{ this.url }}">{{ this.url.host }}</a> </div> <div class="row"> <div class="col-md-8 col-md-offset-2"> {{ this.description }} </div> </div> </div> <div class="slideshow-wrapper"> <div class="slideshow"> <div class="slideshow-inner"> <div class="carousel slide" data-ride="carousel" data-interval="8500" id="site-slides"> <ol class="carousel-indicators"> {% for slide in this.attachments.images %} <li data-target="#site-slides" data-slide-to="{{ loop.index0 }}"{% if loop.first %} class="active"{% endif %}></li> {% endfor %} </ol> <div class="carousel-inner" role="listbox"> {% for image in this.attachments.images %} <div class="item slide{% if loop.first %} active{% endif %}"> <div class="container"> <img class="large" src="{{ image|url }}"> </div> </div> {% endfor %} </div> <a class="left carousel-control" href="#site-slides" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#site-slides" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </div> </div> </div> {% endblock %}