{% extends 'layout/base.jinja' %}
{% from 'news/macro.jinja' import render_digest_card %}
{% from 'gl_site/macro.jinja' import render_banner %}

{% block content %}
    <section class="block-banners">
        <div class="external-container">
            <div class="block-banners__heading-container">
                <h1 class="block-banners__heading">Оптовый
                    интернет-магазин «ЭлимКанц»</h1>
                <p class="block-banners__title">Товары для офиса и школы</p>
                <a class="button" href="{{ url('partners:register') }}">Стать клиентом</a>
            </div>
            {% if header_banners %}
                <div class="block-banners__grid">
                    <div class="block-banners__grid-top">
                        {% for banner in header_banners.left %}
                            {{ render_banner(banner, 'medium', request) }}
                        {% endfor %}
                        {% if header_banners.big %}
                            {{ render_banner(header_banners.big, 'big', request) }}
                        {% endif %}
                        {% for banner in header_banners.right %}
                            {{ render_banner(banner, 'medium', request) }}
                        {% endfor %}
                    </div>
                    <div class="block-banners__grid-bottom">
                        {% for banner in header_banners.banners %}
                            {{ render_banner(banner, 'small', request) }}
                        {% endfor %}
                    </div>
                </div>
            {% endif %}
        </div>
    </section>
    {% if banners %}
        <section class="main-categories">
            <p class="visually-hidden">Акции и категории товаров</p>
            <div class="main-categories__grid">
                {% for banner in banners %}
                    {% include banner.get_banner_template() %}
                {% endfor %}
            </div>
            <a class="main-catalog-link" href="{{ url('products:categories_root') }}">Каталог товаров
                <svg class="icon icon-chevron-right" role="img">
                    <use xlink:href="{{ static('frontend/img/svg/symbol/svg/sprite.symbol.svg') }}#chevron-right"></use>
                </svg>
            </a>
        </section>
    {% endif %}
    <section class="about-company">
        <p class="visually-hidden">О компании</p>
        <img class="about-company__bg" src="{{ static('frontend/img/main-page/paper-texture.jpg') }}"
             alt="Фон страницы">
        <div class="about-company__inner">
            <div class="about-company__text">
                <h2 class="about-company__big-title">Компания ЭлимКанц</h2>
                <p class="about-company__title">Мы —&nbsp;<span class="highlight highlight_elimkanz">оптовый
                    поставщик&nbsp;
                </span>
                    канцелярских и сопутствующих товаров для офиса и школы
                </p>
            </div>
            <div class="about-company__card about-company__card_wide">
                <h2 class="about-company__big-title">Разнообразный ассортимент</h2>
                <p class="about-company__title">Мы предоставляем нашим клиентам самый широкий спектр
                    продукции</p>
                <div class="about-company__card-row">
                    <span class="about-company__numbers">>&nbsp;<span class="accent-color">20 000&nbsp;</span>
                        <span class="small-text">товаров</span>
                    </span>
                    <span class="about-company__numbers">в&nbsp;<span class="accent-color">50&nbsp;</span>
                        <span class="small-text">категориях</span>
                    </span>
                </div>
            </div>
            <div class="about-company__card">
                <h2 class="about-company__big-title">Разнообразный ассортимент</h2>
                <p class="about-company__title">Мы предоставляем нашим клиентам самый широкий спектр
                    продукции</p>
                <p class="about-company__big-title about-company__big-title_orange">Персональный менеджер для
                    каждого клиента</p>
            </div>
            <div class="about-company__card">
                <h2 class="about-company__big-title">Продуманная логистика</h2>
                <p class="about-company__title">Собственный транспорт и работа с ТК</p>
                <p class="about-company__big-title about-company__big-title_orange">Доставляем во все регионы
                    России</p>
            </div>
            <div class="about-company__card">
                <h2 class="about-company__big-title">Компетенция</h2>
                <p class="about-company__title">Мы предоставляем нашим клиентам самый широкий спектр
                    продукции</p>
                <span class="about-company__numbers about-company__numbers_bottom-indent">>&nbsp;<span
                        class="accent-color">20&nbsp;
                </span>
                    <span class="small-text">лет</span>
                </span>
                <p class="about-company__big-title">работаем на рынке канцтоваров</p>
            </div>
        </div>
        <a class="main-catalog-link" href="{{ url('products:categories_root') }}">Каталог товаров
            <svg class="icon icon-chevron-right" role="img">
                <use xlink:href="{{ static('frontend/img/svg/symbol/svg/sprite.symbol.svg') }}#chevron-right"></use>
            </svg>
        </a>
    </section>
    <section class="manufacturers">
        <div class="manufacturers__hero">
            <h2 class="manufacturers__heading">Производители продукции</h2>
            <p class="manufacturers__title">Мы работаем с более 300 производителей канцелярских товаров.<br>100
                отечественных изготовителей-поставщиков и 200 зарубежных</p>
            {% if config.partners_page_link %}
                <a class="manufacturers__link button button_white" href="{{ config.partners_page_link }}">Стать
                    поставщиком
                </a>
            {% endif %}
        </div>
        <div class="manufacturers__cards"
             style="background-image: url('{{ static('frontend/img/main-page/logotype-background.jpg') }}')">
            <div class="manufacturers__grid">
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/burocrat.svg') }}"
                         alt="Бюрократ">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/dps-kanc.svg') }}"
                         alt="DPS Kanc">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/attomex.svg') }}"
                         alt="Attomex">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/hatber.svg') }}"
                         alt="Hatber">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/luch.svg') }}"
                         alt="Луч">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/niks.svg') }}"
                         alt="Никс">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/de-vente.svg') }}"
                         alt="de Vente">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/erich-krause.svg') }}"
                         alt="Erich Krause">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/gosznak.svg') }}"
                         alt="Госзнак">
                </div>
                <div class="manufacturers__card">
                    <img class="manufacturers__card-img"
                         src="{{ static('frontend/img/svg/manufacturers/nevskaya-palitra.svg') }}"
                         alt="Невская Палитра">
                </div>
            </div>
        </div>
    </section>
    {#    {% if feedbacks %}#}
    {#        <section class="reviews"#}
    {#                 style="background-image: url('{{ static('frontend/img/main-page/paper-texture.jpg') }}')">#}
    {#            <p class="visually-hidden">Отзывы</p>#}
    {#            <div class="reviews__wrap">#}
    {#                <h2 class="reviews__big-title">Что о нас говорят клиенты</h2>#}
    {#                <p class="reviews__title">Наши клиенты — компании, мнение и желания<br>которых&nbsp;<span#}
    {#                            class="highlight highlight_elimkanz">никогда не останется без внимания.#}
    {#                </span>#}
    {#                </p>#}
    {#                <div class="reviews__row">#}
    {#                    {% for feedback in feedbacks %}#}
    {#                        <div class="reviews__card">#}
    {#                            <p class="reviews__organozation">{{ feedback.company }}</p>#}
    {#                            <p class="reviews__username">{{ feedback.person }}</p>#}
    {#                            <p class="reviews__position">{{ feedback.job_title }}</p>#}
    {#                            <p class="reviews__text">{{ feedback.text|safe }}</p>#}
    {#                        </div>#}
    {#                    {% endfor %}#}
    {#                </div>#}
    {#            </div>#}
    {#        </section>#}
    {#    {% endif %}#}
    {#    <section class="new-lk">#}
    {#        <h2>Новый личный кабинет</h2>#}
    {#        <p>Раздел, который позволяет клиенту определенной компании получить доступ к данным о состоянии и статистической#}
    {#            информации, деталям заказа и ведущимся про проекту работам</p>#}
    {#        <div class="new-lk__slider js-new-lk__slider">#}
    {#            <div><img class="new-lk__slider-img" src="{{ static('frontend/img/main-page/order.jpg') }}"#}
    {#                      alt="Страница заказа"></div>#}
    {#            <div><img class="new-lk__slider-img" src="{{ static('frontend/img/main-page/catalog.jpg') }}" alt="Каталог">#}
    {#            </div>#}
    {#            <div><img class="new-lk__slider-img" src="{{ static('frontend/img/main-page/shipments-list.jpg') }}"#}
    {#                      alt="Список отгрузок"></div>#}
    {#            <div><img class="new-lk__slider-img" src="{{ static('frontend/img/main-page/item.jpg') }}"#}
    {#                      alt="Страница товара"></div>#}
    {#        </div>#}
    {#        <a class="button" href="{{ url('partners:register') }}">Стать клиентом</a>#}
    </section>
    {% if records %}
        <section class="magazine"
                 style="background-image: url('{{ static('frontend/img/main-page/paper-texture.jpg') }}')">
            <div class="magazine__bg">
                <div class="external-container magazine__row">
                    <div class="magazine__head">
                        <h2 class="magazine__big-title">Журнал</h2>
                        <p class="magazine__title">Новости и статьи про канцелярские товары. Экспертиза от
                            <mark>наших специалистов</mark>
                        </p>
                    </div>
                    <div class="magazine__links">
                        {% for c in categories %}
                            <a class="magazine__link" href="{{ c.get_absolute_url() }}">{{ c.title }}</a>
                        {% endfor %}
                    </div>
                </div>
                <div class="digest">
                    <div class="digest__grid">
                        {% for r in records %}
                            {{ render_digest_card(r) }}
                        {% endfor %}
                    </div>
                </div>
                <div class="external-container flex-center">
                    <a class="main-catalog-link main-catalog-link_dark" href="{{ url('news:index') }}">Все статьи
                        <svg class="icon icon-chevron-right" role="img">
                            <use xlink:href="{{ static('frontend/img/svg/symbol/svg/sprite.symbol.svg') }}#chevron-right"></use>
                        </svg>
                    </a>
                </div>
            </div>
        </section>
    {% endif %}
{% endblock %}