{% extends "layout.html" %}

{% block content %}
<!-- Header container -->
<div class="container-fluid container-pf-nav-pf-vertical container-pf-nav-pf-vertical-with-secondary">
  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-11 col-md-offset-1">
      <h1><strong>File</strong>: {{ file_.path }}</h1>
    </div>
  </div>
</div>
<!-- Detail container -->
<div class="container-fluid container-pf-nav-pf-vertical container-pf-nav-pf-vertical-with-secondary">
  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-11 col-md-offset-1">
      <h1><strong>Contents</strong></h1>
      {{ file_.content.content |yamlhighlight |safe }}
    </div>
  </div>
</div>
<script>
    $(document).ready(function(){
        /* Highlight the anchor line */
        var hash = $(location).attr('hash');
        $(hash).closest('span').addClass('hll');

        /* Refresh the highlighted line when clicking on a new line */
        $("a").click(function(){
            $("span.hll").removeClass('hll');
            var hash = $(this).attr('href');
            $(hash).closest('span').addClass('hll');
        });
    });
</script>
{% endblock %}