{% extends 'base.html.twig' %}

{% block page_title %}{{ 'about.title'|trans({}, 'about') }}{% endblock %}
{% block page_subtitle %}{{ 'about.subtitle'|trans({}, 'about') }}{% endblock %}

{% block main %}
    <div class="row">
        <div class="col-md-12">

            <div class="nav-tabs-custom">
                <ul class="nav nav-tabs">
                    <li class="active"><a href="#kimai" data-toggle="tab" aria-expanded="true">Kimai</a></li>
                    <li><a href="#system" data-toggle="tab" aria-expanded="true">System</a></li>
                    <li><a href="#license" data-toggle="tab" aria-expanded="true">License</a></li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" id="kimai">
                        <dl>
                            <dt>Version</dt><dd>{{ constant('App\\Constants::VERSION') }}</dd>
                            <dt>Status</dt><dd>{{ constant('App\\Constants::STATUS') }}</dd>
                            <dt>Name</dt><dd>{{ constant('App\\Constants::NAME') }}</dd>
                        </dl>
                    </div>
                    <div class="tab-pane" id="system">

                        <div class="box-group" id="accordion">
                            <div class="panel box">
                                <div class="box-header with-border">
                                    <h4 class="box-title">
                                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" class="" aria-expanded="true">
                                            Environment
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseTwo" class="panel-collapse collapse in" aria-expanded="true" style="">
                                    <div class="box-body">

                                        <dl>
                                            {% for name, value in dotenv %}
                                                <dt>{{ name }}</dt>
                                                <dd>{{ value }}</dd>
                                            {% endfor %}
                                        </dl>

                                    </div>
                                </div>
                            </div>
                            <div class="panel box">
                                <div class="box-header with-border">
                                    <h4 class="box-title">
                                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree" class="collapsed" aria-expanded="false">
                                            PHP
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseThree" class="panel-collapse collapse" aria-expanded="false" style="height: 0px;">
                                    <div class="box-body">

                                        <dl>
                                            <dt>Version</dt><dd>{{ constant('PHP_VERSION') }}</dd>
                                            <dt>Modules</dt><dd>{{ modules|join(', ') }}</dd>
                                            {% for name, value in settings %}
                                                <dt>{{ name }}</dt>
                                                <dd>
                                                    {% if value is empty %}
                                                        <i>unknown</i>
                                                    {% else %}
                                                        {{ value }}
                                                    {% endif %}
                                                </dd>
                                            {% endfor %}
                                        </dl>

                                    </div>
                                </div>
                            </div>
                            <div class="panel box">
                                <div class="box-header with-border">
                                    <h4 class="box-title">
                                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseFour" class="collapsed" aria-expanded="false">
                                            Server
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseFour" class="panel-collapse collapse" aria-expanded="false" style="height: 0px;">
                                    <div class="box-body">

                                        <dl>
                                            {% for name, value in info %}
                                                <dt>{{ name }}</dt>
                                                <dd>{{ value|raw }}</dd>
                                            {% endfor %}
                                        </dl>

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

                    </div>
                    <div class="tab-pane" id="license">
                        <pre>{{ license }}</pre>
                        <p>
                            <a href="https://choosealicense.com/licenses/mit/" target="_blank">choosealicense.com</a>,
                            <a href="https://en.wikipedia.org/wiki/MIT_License" target="_blank">wikipedia.org</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}