<!DOCTYPE html>
<html language="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{{title}}</title>
    <link rel="icon" type="image/x-icon" href="{{site_root}}/favicon.ico">
    <link href="{{site_root}}/assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="{{site_root}}/assets/css/bootstrap-theme.min.css" rel="stylesheet">
    <link href="{{site_root}}/assets/css/swizzler.css" rel="stylesheet">
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div id="main" class="col-md-8">
          <div class="panel panel-default">
            {{#in_reply_to}}
              <div class="panel-heading avatars32">
                <span class="label label-info"><span class="glyphicon glyphicon-share-alt"></span>In reply to:</span>
                <ul class="list-group media-list">{{> message}}</ul>
              </div>
            {{/in_reply_to}}
            <div class="panel-body">
              {{#twist}}
                <div class="lead alert alert-info">
                  <ul class="list-group media-list">{{> message}}</ul>
                </div>
                {{#any_rts}}
                  <div class="avatars32">
                    <h5 class="pull-left"><span class="glyphicon glyphicon-retweet"></span> Retwists:&nbsp;</h5>{{! I know it's ugly. I suck at CSS !}}
                    {{#rts}}
                      <iframe class="thumbnail pull-left"
                        style="border:none; padding:0; background:none; overflow:hidden"
                        width=84 height=72 seamless=seamless
                        src="{{site_root}}/user_embed/{{rt_username}}/rt"></iframe>
                    {{/rts}}
                  </div>
                {{/any_rts}}
              {{/twist}}
            </div>
            {{#any_replies}}
              <div class="panel-footer avatars32">
                <span class="label label-info"><span class="glyphicon glyphicon-arrow-up"></span>Replies:</span>
                <ul class="list-group media-list">
                  {{#replies}}{{> message}}{{/replies}}
                </ul>
              </div>
            {{/any_replies}}
          </div>
        </div>
        <div id="sidebar" class="col-md-4">
          {{> sidebar}}
        </div>
      </div>
      {{> footer}}
    </div> <!-- /container -->
  </body>
</html>

