fix pos layout

This commit is contained in:
Flatlogic Bot 2026-03-09 05:25:57 +00:00
parent 6be2e6d02b
commit 9248543cfe

14
pos.php
View File

@ -194,7 +194,7 @@ $vat_rate = (float)($settings['vat_rate'] ?? 0);
</div> </div>
</nav> </nav>
<div class="row g-0 pos-layout"> <div class="row g-0 pos-layout flex-nowrap">
<!-- Left Sidebar: Categories --> <!-- Left Sidebar: Categories -->
<div class="col-md-2 col-auto pos-categories scrollable-y p-2" style="max-width: 220px;"> <div class="col-md-2 col-auto pos-categories scrollable-y p-2" style="max-width: 220px;">
<button class="category-btn active mb-2" data-category="all"> <button class="category-btn active mb-2" data-category="all">
@ -216,7 +216,7 @@ $vat_rate = (float)($settings['vat_rate'] ?? 0);
<!-- Center Area: Product Grid --> <!-- Center Area: Product Grid -->
<div class="col pos-products"> <div class="col pos-products">
<!-- Search Bar --> <!-- Search Bar -->
<div class="px-3 py-2 border-bottom bg-white"> <div class="px-3 py-2 border-bottom bg-white" style="flex-shrink: 0;">
<div class="row g-2 align-items-center"> <div class="row g-2 align-items-center">
<div class="col-md-6 col-lg-5"> <div class="col-md-6 col-lg-5">
<div class="position-relative"> <div class="position-relative">
@ -239,7 +239,7 @@ $vat_rate = (float)($settings['vat_rate'] ?? 0);
</div> </div>
<!-- Grid Container --> <!-- Grid Container -->
<div class="flex-grow-1 scrollable-y p-2"> <div class="flex-grow-1 p-2" style="overflow-y: auto; scrollbar-width: thin; min-height: 0;">
<div class="row g-2 row-cols-3 row-cols-sm-4 row-cols-md-5 row-cols-lg-6 row-cols-xl-6 row-cols-xxl-6" id="product-grid"> <div class="row g-2 row-cols-3 row-cols-sm-4 row-cols-md-5 row-cols-lg-6 row-cols-xl-6 row-cols-xxl-6" id="product-grid">
<?php foreach ($all_products as $product): ?> <?php foreach ($all_products as $product): ?>
<?php $has_variants = !empty($variants_by_product[$product['id']]); ?> <?php $has_variants = !empty($variants_by_product[$product['id']]); ?>
@ -278,8 +278,8 @@ $vat_rate = (float)($settings['vat_rate'] ?? 0);
</div> </div>
<!-- Right Sidebar: Cart --> <!-- Right Sidebar: Cart -->
<div class="col-md-3 col-12 pos-cart shadow-sm"> <div class="col-auto pos-cart shadow-sm" style="width: 320px; max-width: 45vw; min-width: 280px; flex-shrink: 0;">
<div class="p-2 border-bottom bg-white"> <div class="p-2 border-bottom bg-white" style="flex-shrink: 0;">
<div class="btn-group btn-group-touch w-100 mb-2" role="group"> <div class="btn-group btn-group-touch w-100 mb-2" role="group">
<input type="radio" class="btn-check" name="order_type" id="ot-takeaway" value="takeaway" <?= $order_type === 'takeaway' ? 'checked' : '' ?>> <input type="radio" class="btn-check" name="order_type" id="ot-takeaway" value="takeaway" <?= $order_type === 'takeaway' ? 'checked' : '' ?>>
<label class="btn btn-outline-primary py-2 rounded-start-pill" for="ot-takeaway" style="font-weight: 700;">Takeaway</label> <label class="btn btn-outline-primary py-2 rounded-start-pill" for="ot-takeaway" style="font-weight: 700;">Takeaway</label>
@ -320,14 +320,14 @@ $vat_rate = (float)($settings['vat_rate'] ?? 0);
</div> </div>
</div> </div>
<div class="flex-grow-1 overflow-auto p-2 bg-white" id="cart-items"> <div class="flex-grow-1 overflow-auto p-2 bg-white" id="cart-items" style="min-height: 0;">
<div class="text-center text-muted mt-5 opacity-50"> <div class="text-center text-muted mt-5 opacity-50">
<i class="bi bi-basket3 fs-1 d-block mb-2"></i> <i class="bi bi-basket3 fs-1 d-block mb-2"></i>
<p class="small">No Items</p> <p class="small">No Items</p>
</div> </div>
</div> </div>
<div class="p-3 border-top bg-light mt-auto rounded-top-4"> <div class="p-3 border-top bg-light mt-auto rounded-top-4" style="flex-shrink: 0;">
<div class="d-flex justify-content-between mb-1"> <div class="d-flex justify-content-between mb-1">
<span class="text-muted small">Subtotal</span> <span class="text-muted small">Subtotal</span>
<span class="fw-bold small" id="cart-subtotal"><?= format_currency(0) ?></span> <span class="fw-bold small" id="cart-subtotal"><?= format_currency(0) ?></span>