{% extends 'shipping_rate/export/low_rates/comparison_courier_service_pdf.html.twig' %}
{% block content %}
    {% block header %}

        <div class="header border-bottom-3x text-uppercase ml-2 mr-2" style="height: 30px">
            <div class="float-left" style="width: 20%; max-height: 30px">
                <img class="text-center img img-responsive"
                     src="{{ absolute_url(asset('img/logos/spainbox.png')) }}"
                        {#src="{{ absolute_url(asset(logotype |default('img/logos/spainbox.png'))) }}"#}
                     style="max-height: 72px">

                {#<img class="img img-responsive" src="{{ asset('img/logo.png') }}" style="max-height: 96px">#}
            </div>
            <div class="float-left pl-4" style="width: 25%;">
                {#<div class="div-row " style="">#}
                <h4 class="text-left" style="padding-top: 10px">{{ name | default('Comparación de tarifas') }}</h4>

                {#</div>#}
            </div>
            <div class="float-left" style="width: 55%; padding-top: 10px">
                {#<div class="div-row " style="">#}
                {#<img class="img img-responsive" src="{{ absolute_url(asset('img/logos/spainbox.png')) }}"#}
                {#style="max-height: 72px">#}

                <!-- section of selected couriers services -->
                {% set defaultColors = {1:'#6d5615', 2:'#4095de', 3:'#ff7c2f    '} %}
                {% for cs in courierServices %}
                    <div style="display: inline-block;">
                        <div class="float-left mr-2 ml-2" style="width: 20px; height: 15px; background-color: {{ cs.color }}">

                        </div>
                        <label style="font-size: 0.5rem" class="float-left text-left siz">{{ cs.code ~ ' - ' ~ cs.name }}</label>
                    </div>

                {% endfor %}
                {#<h6 class="text-left" style="margin-top: 0">{{ 'Fecha: ' ~ 'now'|date('d-m-Y') }}</h6>#}
                {#<h6 class="text-right" style="margin-top: -4%">{{ 'Fecha: ' ~ 'now'|date('d-m-Y') }}</h6>#}

            </div>
        </div>
        {#</div>#}
        {#<div class="footer">#}
        {#<div class="footer__pager">#}
        {#<span class="page"></span>/<span class="topage"></span>#}
        {#</div>#}
        {#</div>#}
        <script>
            function subst() {
                var vars = {};
                var x = document.location.search.substring(1).split('&');
                for (var i in x) {
                    var z = x[i].split('=', 2);
                    vars[z[0]] = unescape(z[1]);
                }
                var x = ['frompage', 'topage', 'page', 'webpage', 'section', 'subsection', 'subsubsection'];
                for (var i in x) {
                    var y = document.getElementsByClassName(x[i]);
                    for (var j = 0; j < y.length; ++j) {
                        y[j].textContent = vars[x[i]];
                    }
                }
            }

            subst();
        </script>
    {% endblock %}

{% endblock %}