payfrit/payfrit-biz
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add DINE-IN badge to KDS order cards for consistency

Browse source 
Pickup and Delivery had colored badges but Dine-In did not. Added
blue DINE-IN badge matching the existing badge style.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
John Mizerek 2026-03-11 13:39:23 -07:00
parent 800471f249
commit 5328fda65b
2 changed files with 2 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
kds/index.html
View file

@ -81,6 +81,7 @@
.station-name-display { font-size: 11px; color: #555; margin-left: 8px; text-transform: uppercase; letter-spacing: 1px; }
/* Order type badges */
.badge-dinein { display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: #001a2a; color: #38bdf8; border: 1px solid #38bdf833; vertical-align: middle; margin-left: 6px; letter-spacing: 1px; }
.badge-pickup { display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: #1a2a00; color: #a3e635; border: 1px solid #a3e63533; vertical-align: middle; margin-left: 6px; letter-spacing: 1px; }
.badge-delivery { display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: #2a1a00; color: #fb923c; border: 1px solid #fb923c33; vertical-align: middle; margin-left: 6px; letter-spacing: 1px; }

2
kds/kds.js
View file

@ -343,7 +343,7 @@ function renderOrder(order) {
return `
<div class="order-card ${statusClass}">
<div class="order-header">
<div class="order-number">#${order.OrderID}${order.OrderTypeID === 2 ? ' <span class="badge-pickup">PICKUP</span>' : ''}${order.OrderTypeID === 3 ? ' <span class="badge-delivery">DELIVERY</span>' : ''}</div>
<div class="order-number">#${order.OrderID}${order.OrderTypeID === 1 ? ' <span class="badge-dinein">DINE-IN</span>' : ''}${order.OrderTypeID === 2 ? ' <span class="badge-pickup">PICKUP</span>' : ''}${order.OrderTypeID === 3 ? ' <span class="badge-delivery">DELIVERY</span>' : ''}</div>
<div class="order-time">
<div class="elapsed-time ${timeClass}">${formatElapsedTime(elapsedTime)}</div>
<div class="submit-time">${formatSubmitTime(order.SubmittedOn)}</div>