262 lines
10 KiB
PHP
262 lines
10 KiB
PHP
<!--begin::Chat drawer-->
|
|
<div id="kt_shopping_cart" class="bg-body" data-kt-drawer="true" data-kt-drawer-name="cart" data-kt-drawer-activate="true" data-kt-drawer-overlay="true" data-kt-drawer-width="{default:'300px', 'md': '500px'}" data-kt-drawer-direction="end" data-kt-drawer-toggle="#kt_drawer_shopping_cart_toggle" data-kt-drawer-close="#kt_drawer_shopping_cart_close">
|
|
<!--begin::Messenger-->
|
|
<div class="card card-flush w-100 rounded-0">
|
|
<!--begin::Card header-->
|
|
<div class="card-header">
|
|
<!--begin::Title-->
|
|
<h3 class="card-title text-gray-900 fw-bold">Shopping Cart</h3>
|
|
<!--end::Title-->
|
|
<!--begin::Card toolbar-->
|
|
<div class="card-toolbar">
|
|
<!--begin::Close-->
|
|
<div class="btn btn-sm btn-icon btn-active-light-primary" id="kt_drawer_shopping_cart_close">{!! getIcon('cross', 'fs-2') !!}</div>
|
|
<!--end::Close-->
|
|
</div>
|
|
<!--end::Card toolbar-->
|
|
</div>
|
|
<!--end::Card header-->
|
|
<!--begin::Card body-->
|
|
<div class="card-body hover-scroll-overlay-y h-400px pt-5">
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">Iblender</a>
|
|
<span class="text-gray-500 fw-semibold d-block">The best kitchen gadget in 2022</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 350</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">5</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-1.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">SmartCleaner</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Smart tool for cooking</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 650</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">4</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-3.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">CameraMaxr</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Professional camera for edge</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 150</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">3</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-8.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">$D Printer</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Manfactoring unique objekts</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 1450</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">7</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-26.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">MotionWire</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Perfect animation tool</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 650</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">7</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-21.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">Samsung</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Profile info,Timeline etc</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 720</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">6</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-34.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Separator-->
|
|
<div class="separator separator-dashed my-6"></div>
|
|
<!--end::Separator-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<!--begin::Wrapper-->
|
|
<div class="d-flex flex-column me-3">
|
|
<!--begin::Section-->
|
|
<div class="mb-3">
|
|
<a href="#" class="text-gray-800 text-hover-primary fs-4 fw-bold">$D Printer</a>
|
|
<span class="text-gray-500 fw-semibold d-block">Manfactoring unique objekts</span>
|
|
</div>
|
|
<!--end::Section-->
|
|
<!--begin::Section-->
|
|
<div class="d-flex align-items-center">
|
|
<span class="fw-bold text-gray-800 fs-5">$ 430</span>
|
|
<span class="text-muted mx-2">for</span>
|
|
<span class="fw-bold text-gray-800 fs-5 me-3">8</span>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon-success btn-icon w-25px h-25px me-2">{!! getIcon('minus', 'fs-4') !!}</a>
|
|
<a href="#" class="btn btn-sm btn-light-success btn-icon w-25px h-25px">{!! getIcon('plus', 'fs-4') !!}</a>
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
</div>
|
|
<!--end::Wrapper-->
|
|
<!--begin::Pic-->
|
|
<div class="symbol symbol-70px symbol-2by3 flex-shrink-0">
|
|
<img src="{{ image('stock/600x400/img-27.jpg') }}" alt="" />
|
|
</div>
|
|
<!--end::Pic-->
|
|
</div>
|
|
<!--end::Item-->
|
|
</div>
|
|
<!--end::Card body-->
|
|
<!--begin::Card footer-->
|
|
<div class="card-footer">
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<span class="fw-bold text-gray-600">Total</span>
|
|
<span class="text-gray-800 fw-bolder fs-5">$ 1840.00</span>
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--begin::Item-->
|
|
<div class="d-flex flex-stack">
|
|
<span class="fw-bold text-gray-600">Sub total</span>
|
|
<span class="text-primary fw-bolder fs-5">$ 246.35</span>
|
|
</div>
|
|
<!--end::Item-->
|
|
<!--end::Action-->
|
|
<div class="d-flex justify-content-end mt-9">
|
|
<a href="#" class="btn btn-primary d-flex justify-content-end">Pleace Order</a>
|
|
</div>
|
|
<!--end::Action-->
|
|
</div>
|
|
<!--end::Card footer-->
|
|
</div>
|
|
<!--end::Messenger-->
|
|
</div>
|
|
<!--end::Chat drawer-->
|