BC-Cart.html

<div class="cart__page">
    <div class="cart__header">
        <h1 class="cart__title has-dash">{{ page.name }}</h1>
    </div>

    {% if cart.items != blank %}

    <div class="cart__content">
        <form method="post" action="/cart" id="cart-form" class="cart-form">
            <ul class="cart__items">
                {% for item in cart.items %}
                <li class="cart__item" data-item-id="{{ item.id }}">
                    <!-- style="background-image:url('{{ item.product.image | product_image_url | constrain: 576, 576 }}');" -->
                    <a class="cart__item--image" href="{{ item.product.url }}" title="View {{ item.product.name | escape }}">
                        <img src="{{ item.product.image | product_image_url | constrain: 576, 576 }}" />
                    </a>
                    <div class="cart__item--details">
                        <div class="cart__item--details-name">{{ item.product.name }}</div>
                        {% unless item.product.has_default_option %}
                        <div class="cart__item--details-option">{{ item.option.name }}</div>
                        {% endunless %}
                        <div class="cart__item--details-price">{{ item.unit_price | money: theme.money_format }}</div>
                        <div class="cart__item--adjustments">
                            <div class="cart__item--quantity-holder" data-item-id="{{ item.id }}">
                                {{ item | item_quantity_input, 'option-quantity', 'option-quantity' }}
                            </div>
                            <a class="button negative cart-item-remove" title="Remove item" href="#">Remove</a>
                            <!-- cart__item--remove -->
                        </div>
                    </div>
                </li>
                {% endfor %}
            </ul>
            <div class="cart__footer">
                <div class="cart__totals">
                    <div class="cart__summary">
                        <span class="cart__footer--label">Items coming your way:</span>
                        <span class="cart__items--count">{{ cart.item_count }}</span>
                    </div>
                    {% if cart.subtotal == cart.total %}
                    <div class="cart__total">
                        <span class="cart__footer--label">Your total:</span>
                        <span class="cart__total--amount">{{ cart.total | money: theme.money_format }}</span>
                    </div>
                    {% else %}
                    <div class="cart__subtotal">
                        <span class="cart__footer--label">Your subtotal:</span>
                        <span class="cart__subtotal--amount">{{ cart.subtotal | money: theme.money_format }}</span>
                    </div>
                    <div class="cart__total">
                        <span class="cart__footer--label">Your total:</span>
                        <span class="cart__total--amount">{{ cart.total | money: theme.money_format }}</span>
                    </div>
                    {% endif %}
                </div>
                <button type="submit" name="checkout" title="Checkout" class="button positive large checkout-btn">Checkout</button>
                <div class="cart__keep--shopping">
                    <p>Not done yet?</p>
                    <a class="button flat positive continue-shopping" href="/products" title="Continue shopping">Keep Shopping</a>
                </div>
            </div>
        </form>
    </div>

    {% else %}

    <div class="cart__content">
        <h2 class="content__sub-title">Your shopping cart needs some friends</h2>
        <p class="cart--empty-message">
            It looks like either you haven't added anything to your cart or someone has run off with it!<br /><br />
            Head back to the products page and put your cart to work!
        </p>
        <a class="button positive large" href="/products" title="Start shopping">Go shopping!</a>
    </div>
    {% endif %}
</div>