{% extends './base.html.twig' %}
{{trans_default_domain("doc")}}

{% block body %}
  {% block header %}
    {{ render( controller("documentation:documentation:header" )) }}
  {% endblock %}

  <div class="container-fluid">
    <div class="row flex-xl-nowrap">
      {% include './navbar.html.twig' with {
        'route' : nodefony.route
      } %}
      <main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5" style="top: 5rem;">

        <a href="https://github.com/nodefony/nodefony">
          <img style="position: fixed; top: 49px; right: 0; border: 0;z-index:8000" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub">
        </a>
        <span>
          <div class=" h1 d-flex flex-row bd-highlight mb-3 w-100 justify-content-center align-items-center">
            <div class="p-2 "><img src="{{CDN('image')}}/app/images/app-logo.png"></div>
            <div class="p-2 ">
              <h1 class="h1">Nodefony
                {{nodefony.version}}</h1>
            </div>
          </div>
        </span>
        <hr>
        {% include './includes/menu.html' with {
          'nodefony' : nodefony
        } %}
        {% include './includes/installation.html' with {
          'nodefony' : nodefony
        } %}
        {% include './includes/configuration.html' with {
          'nodefony' : nodefony
        } %}
        {% include './includes/examples/index.html' with {
          'nodefony' : nodefony
        } %}

        <hr style="margin-top:100px">
        <div class="container-fluid mt-8">
          <div class="row">
            <div class="col-md-6">
              <div class="card">
                <div class="card-header">Local Recent Commits
                  <span class="branch badge badge-pill badge-secondary pull-right"></span>
                </div>
                <div class="card-body" style="overflow: auto;">
                  <ul class="list-group list-group-flush" id="commits"></ul>
                </div>
              </div>
            </div>
            <div class="col-md-6">
              <div class="card">
                <div class="card-header">GitHub Issue Queue Activity</div>
                <div class="card-body" style="overflow: auto;">
                  <ul id="issues" class="list-group list-group-flush"></ul>
                </div>
              </div>
            </div>
          </div>
        </div>

      </main>
    </div>
  </div>

  {% block footer %}
    {{ render( controller("documentation:documentation:footer" )) }}
  {% endblock %}

{% endblock %}
