{% extends '/ecommerce/parent.html.twig' %}
{% block stylesheets %}
{{ parent() }}
{% endblock %}
{% block header %}
{{ parent() }}
{% endblock %}
{% block menu %}
{{ parent() }}
{% endblock %}
{% block body %}
<div class="container-xxl">
<div class="row">
<div class="col-md-12">
<!-- Dark Variant -->
</div>
<div class="row">
{# <div class="col-md-4" style="max-height:450px;overflow-y:scroll">#}
{# {% for userEstablishment in userEstablishments %}#}
{# <div class="col-md-12" >#}
{# <div class="card#}
{# {% if app.user.connectedAt and userEstablishment.establishment.id == app.user.connectedAt.id %}#}
{# bg-success-subtle#}
{# {% else %}#}
{# bg-info-subtle#}
{# {% endif %}#}
{# " >#}
{# <div class="card-body" style="padding:10px!important" >#}
{# <h4 class="mb-1">{{ userEstablishment.establishment.name }}</h4>#}
{# <div class="d-flex justify-content-between align-items-center" >#}
{# <div>#}
{# {% set totalUser = 0 %}#}
{# {% for userEstablishment in userEstablishment.establishment.userEstablishments %}#}
{# {% if not userEstablishment.deleted %}#}
{# {% set totalUser = totalUser + 1 %}#}
{# {% endif %}#}
{# {% endfor %}#}
{# <p class="mb-0">{{ "team" | trans}} : {{ totalUser}} {{ "person" | trans }}</p>#}
{# </div>#}
{# <div>#}
{# {% if app.user.connectedAt and userEstablishment.establishment.id == app.user.connectedAt.id %}#}
{# <a class="btn btn-success" style="cursor: not-allowed">{{ "connected"|trans }}</a>#}
{# {% else %}#}
{# <a href="/ecommerce/connected-to/{{ userEstablishment.establishment.id }}"#}
{# class="btn btn-info">{{ "connect"|trans }}</a>#}
{# {% endif %}#}
{# </div>#}
{# </div>#}
{# </div>#}
{# </div>#}
{# </div>#}
{# {% endfor %}#}
{# </div>#}
<div class="col-md-12 col-xl-8 center">
<div class="card bg-primary-subtle overflow-hidden z-1">
<div id="carouselExampleDark" class="carousel carousel-dark slide" data-bs-ride="carousel">
<div class="carousel-indicators">
{% set totalBanner = 0 %}
{% for banner in banners %}
<button type="button" data-bs-target="#carouselExampleDark"
data-bs-slide-to="{{ totalBanner }}"
class="active" aria-current="true" aria-label="Slide 1"></button>
{% set totalBanner = totalBanner + 1 %}
{% endfor %}
</div>
<div class="carousel-inner">
{% for banner in banners %}
{% if banner.externalLink %}
<a target="_blank" href="{{ banner.externalLink }}">
{% elseif banner.article %}
<a target="_blank" href="/ecommerce/product/detail/{{ banner.article.id }}">
{% endif %}
<div class="carousel-item active" data-bs-interval="10000">
<img src="/assets/banner/{{ banner.path }}" class="d-block w-100" alt="...">
<div class="carousel-caption d-none d-md-block">
{# <h5>First slide label</h5> #}
{# <p>Some representative placeholder content for the first slide.</p> #}
</div>
</div>
{% if banner.externalLink or banner.article %}
</a>
{% endif %}
{% endfor %}
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark"
data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark"
data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
</div>
</div>
<div style="padding-bottom: 10px" class="card-header d-flex align-items-center justify-content-between">
<h4 class="card-title mb-0">{{ "news"|trans }}</h4>
<a href="/ecommerce/product/news" class="btn btn-sm btn-soft-primary">{{ "moreNews"|trans }}</a>
</div>
<div class="overflow-auto">
<div class="d-flex flex-row">
{% for newArticle in newArticles %}
<div class="col-md-3 col-xl-2 ms-3">
<a href="/ecommerce/product/detail/{{ newArticle.article.id }}">
<div class="card">
<div class="card-body text-center">
<div class="rounded d-flex align-items-center justify-content-center mx-auto">
<img src="{{ newArticle.article.pathImage }}" alt="{{ newArticle.article.name }}" onerror="this.onerror=null; this.src='/assets/images/default.png';" class="avatar-xl">
</div>
<div class="d-flex flex-column align-items-center justify-content-center mt-2">
<p class="text-dark fw-medium fs-16 mb-1" style="max-width: 150px; height: 38px; text-align: center; overflow: hidden; white-space: normal; line-height: 1.2;">
{{ newArticle.article.name }}
</p>
</div>
</div>
</div>
</a>
</div>
{% endfor %}
</div>
</div>
</div>
{% endblock %}
{% block footer %}
{{ parent() }}
{% endblock %}
{% block javascript %}
{{ parent() }}
{% endblock %}