{% extends 'appearance/base.html' %}

{% load i18n %}
{% load static %}

{% load common_tags %}

{% block title %}{% trans 'About' %}{% endblock %}

{% block stylesheets %}
    <style>
        @font-face {
            font-family: 'mayan-edms';
            src: url("{% static 'appearance/fonts/mayan-edms.ttf' %}") format('truetype');
            font-weight: normal;
            font-style: normal;
        }

        [class^="icon-"], [class*=" icon-"] {
            font-family: 'mayan-edms';
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        .icon-mayan-edms-logo:before {
            content: "\e600";
            font-size: 150%;
        }

        .mayan-edms-logo {
            font-family: 'IM Fell English SC', serif;
            font-size: 150%;
            text-shadow: 5px 5px 1px rgba(0, 0, 0, 0.3);
        }

        @media (min-width: 768px) {
            .mayan-edms-logo {
                font-size: 300%;
            }
        }

        @media (min-width: 991px) {
            .mayan-edms-logo {
                font-size: 500%;
            }
        }

        .img-mayan-edms-ng-logo {
            width: 10%;
        }
    </style>
{% endblock stylesheets %}

{% block content %}
    <h3>{% trans 'About' %}</h3>
    <hr>

    {% build as build_number %}
    <div class="well">
        <h3 class="text-center">{% project_information '__title__' %} ({% trans 'Version' %} {% project_information '__version__' %})</h3>
        {% if build_number %}
            <p class='text-center'>{% blocktrans with build_number as build_number %}Build number: {{ build_number }}{% endblocktrans %}</p>
        {% endif %}
        <p class="text-center">
            {% project_information '__description__' as project_description %}
            {% trans project_description %}
        </p>

        <p class="text-center">
            <i class="fa fa-home"></i><a href="{% project_information '__website__' %}"> {% project_information '__website__' %}</a>
        </p>

        <p class="text-center">
            {% project_information '__license__' as license_information %}
            {% trans 'Released under the license:' %} {% trans license_information %}
        </p>

        <p class="text-center mayan-edms-logo"><img class="img-mayan-edms-ng-logo" src="{% static 'appearance/images/mayan-pyramid.svg' %}" rel="AS"/> Mayan EDMS NG</p>
    </div>
{% endblock %}

{% block footer %}
    <div id="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-body">
                    {% project_information '__copyright__' %}
                </div>
            </div>
        </div>
    </div>
{% endblock %}
