{% extends 'allianceauth/base.html' %}
{% load i18n %}
{% block extra_css %}
    <style>
        .flex-container {
            display: flex;
            flex-direction: row;
            height: 100%;
            align-items: center;
            justify-content: center;
        }
        .flex-wrap {
            display: -webkit-flex; /* Safari */
            -webkit-flex-wrap: wrap; /* Safari 6.1+ */
            display: flex;
            flex-wrap: wrap;
        }
        .flex-item {

        }
    </style>
    {% include 'bundles/datatables-css.html' %}
{% endblock extra_css %}
{% block content %}
    <div class="col-lg-12">
        <br />
        <div class="col-lg-12 container">
            <nav class="navbar navbar-default">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                            <span class="sr-only">{% trans "Toggle navigation" %}</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="{% url 'fittings:dashboard' %}">{% trans "Fittings and Doctrines" %}</a>
                    </div>
                    <ul class="nav navbar-nav navbar-left">
                            <li> <a href="{% url 'fittings:view_all_fits' %}">View All Fits</a></li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        {% if perms.fittings.manage %}
                            <li> <a href="{% url 'fittings:add_fit' %}">Add Fitting</a></li>
                            <li> <a href="{% url 'fittings:add_doctrine' %}">Add Doctrine</a></li>
                        {% endif %}
                    </ul>
                </div>
            </nav>
            {% block fittings_block %}{% endblock %}
        </div>
    </div>
{% endblock %}
