commercetools-8.x-1.2-alpha1/modules/commercetools_content/templates/commercetools-cart-summary-block.html.twig

{{ attach_library('commercetools/commercetools.bootstrap_checker') }}

{% set cartRoute = constant('Drupal\\commercetools_content\\Routing\\RouteProvider::ROUTE_PREFIX') ~ constant('Drupal\\commercetools_content\\Routing\\RouteProvider::PAGE_CART_ROUTE') %}


<div class="commercetools-summary-block dropdown" style="max-width: 32rem">
  <button class="btn btn-light position-relative" type="button" id="cartDropdown" data-bs-toggle="dropdown" aria-expanded="false">
    <i class="bi bi-bag fs-4"></i>
    {% if cart.lineItems %}
      <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">{{ cart.lineItems|length }}</span>
    {% endif %}
  </button>

  <div class="dropdown-menu dropdown-menu-end p-3 shadow-lg" aria-labelledby="cartDropdown">
    {% if cart.lineItems %}
      <div style="max-height: 20rem; min-width:25rem; overflow-y: auto; overflow-x: hidden;">
        {{ render_var({'#theme': 'commercetools_line_items', '#lineItems': cart.lineItems|slice(0, max_items), '#lineStyle': 'summary'}) }}

        {% if cart.lineItems|length > max_items %}
          <div class="text-center mt-2">
            <a href="{{ path(cartRoute) }}" class="text-muted">{{ cart.lineItems|length - max_items }}
              {{ "more items"|t }}</a>
          </div>
        {% endif %}
      </div>

      <div class="position-sticky bottom-0 bg-white">
        {% if cart.totalPrice.localizedPrice %}
          <div class="my-2">
            <strong>{{ "Total price:"|t }}</strong>
            {{ cart.totalPrice.localizedPrice }}
          </div>
        {% endif %}
        <div class="d-flex">
          <a href="{{ path(cartRoute) }}" class="btn btn-primary w-100">{{ "View Cart"|t }}</a>
        </div>
      </div>
    {% else %}
      <p class="text-center text-muted">{{ "Your cart is empty."|t }}</p>
    {% endif %}
  </div>

</div>