Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Removes poc-booking.html from wwwroot

Browse source 
Cleans up redundant HTML file from project directory

Eliminates an unused proof-of-concept booking page template
This commit is contained in:
Janus C. H. Knudsen 2026-01-05 17:38:39 +01:00
parent a4fc822229
commit 35b15294e3
5 changed files with 1105 additions and 5702 deletions
Download patch file Download diff file Expand all files Collapse all files

520
wwwroot/poc-checkout.html
View file

@ -1033,6 +1033,326 @@
color: white;
}
/* ==========================================
RECEIPT
========================================== */
.receipt-container {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.3);
z-index: 10;
display: flex;
justify-content: center;
padding-top: 20px;
opacity: 0;
visibility: hidden;
transition: opacity 300ms ease, visibility 300ms ease;
overflow-y: auto;
}
.receipt-container.visible {
opacity: 1;
visibility: visible;
}
.receipt {
width: 280px;
background: #fff;
font-family: 'Courier New', monospace;
font-size: 12px;
color: #000;
padding: 20px 16px;
box-shadow: 0 4px 20px rgba(0,0,0,0.3);
transform: translateY(-100%);
transition: transform 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
position: relative;
margin-bottom: 20px;
}
.receipt-container.visible .receipt {
transform: translateY(0);
}
/* Torn paper effect at bottom */
.receipt::after {
content: '';
position: absolute;
bottom: -10px;
left: 0;
right: 0;
height: 10px;
background: linear-gradient(135deg, #fff 25%, transparent 25%),
linear-gradient(-135deg, #fff 25%, transparent 25%);
background-size: 10px 10px;
}
.receipt-header {
text-align: center;
padding-bottom: 12px;
border-bottom: 1px dashed #000;
margin-bottom: 12px;
}
.receipt-logo {
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
margin-bottom: 4px;
}
.receipt-address {
font-size: 10px;
line-height: 1.4;
}
.receipt-info {
display: flex;
justify-content: space-between;
font-size: 10px;
padding: 8px 0;
border-bottom: 1px dashed #000;
margin-bottom: 12px;
}
.receipt-items {
margin-bottom: 12px;
}
.receipt-item {
display: flex;
justify-content: space-between;
padding: 4px 0;
font-size: 11px;
}
.receipt-item-name {
flex: 1;
padding-right: 8px;
}
.receipt-item-qty {
width: 30px;
text-align: center;
}
.receipt-item-price {
width: 70px;
text-align: right;
font-family: 'JetBrains Mono', monospace;
}
.receipt-divider {
border-top: 1px dashed #000;
margin: 8px 0;
}
.receipt-totals {
margin-bottom: 12px;
}
.receipt-total-row {
display: flex;
justify-content: space-between;
padding: 3px 0;
font-size: 11px;
}
.receipt-total-row.grand {
font-size: 14px;
font-weight: bold;
padding: 8px 0;
border-top: 2px solid #000;
border-bottom: 2px solid #000;
margin: 8px 0;
}
.receipt-payment {
font-size: 10px;
padding: 8px 0;
border-bottom: 1px dashed #000;
}
.receipt-payment-row {
display: flex;
justify-content: space-between;
padding: 2px 0;
}
.receipt-footer {
text-align: center;
padding-top: 12px;
font-size: 10px;
}
.receipt-footer-msg {
font-size: 12px;
font-weight: bold;
margin-bottom: 8px;
}
.receipt-qr {
margin: 12px auto 8px;
display: flex;
justify-content: center;
}
.receipt-qr svg {
border: 2px solid #000;
}
.receipt-id {
font-size: 9px;
letter-spacing: 1px;
}
.receipt-close {
position: absolute;
top: 8px;
right: 8px;
width: 24px;
height: 24px;
border: none;
background: #f0f0f0;
border-radius: 50%;
cursor: pointer;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
}
.receipt-close:hover {
background: #e0e0e0;
}
.receipt-actions {
display: flex;
gap: 8px;
margin-top: 16px;
padding-top: 12px;
border-top: 1px solid #e0e0e0;
}
.receipt-actions button {
flex: 1;
padding: 8px;
font-size: 11px;
border-radius: 4px;
cursor: pointer;
font-family: var(--font-family);
}
.receipt-actions .btn-print {
background: #000;
color: #fff;
border: none;
}
.receipt-actions .btn-close {
background: #fff;
border: 1px solid #ccc;
color: #333;
}
/* ==========================================
PRINT STYLES
========================================== */
@media print {
/* White background */
html, body {
background: white !important;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
/* Hide everything by default */
.demo-trigger,
.overlay,
.header,
.sidebar,
.cart-area,
.payment-total,
.payment-methods,
.payment-input-section,
.registered-payments,
.payment-footer {
display: none !important;
}
/* Reset panel positioning */
.panel {
position: static !important;
width: 100% !important;
transform: none !important;
box-shadow: none !important;
background: white !important;
}
.main {
display: block !important;
}
.payment-panel {
display: block !important;
position: static !important;
border: none !important;
background: white !important;
}
/* Show receipt */
.receipt-container {
display: flex !important;
justify-content: center !important;
visibility: visible !important;
opacity: 1 !important;
position: static !important;
background: white !important;
padding: 0 !important;
}
.receipt {
display: block !important;
margin: 0 !important;
box-shadow: none !important;
transform: none !important;
text-align: left !important;
}
/* Preserve item layout */
.receipt-item {
display: flex !important;
justify-content: space-between !important;
text-align: left !important;
}
.receipt-item-name {
text-align: left !important;
}
.receipt-item-price {
text-align: right !important;
}
.receipt-total-row {
display: flex !important;
justify-content: space-between !important;
}
/* Hide buttons in receipt */
.receipt-close,
.receipt-actions {
display: none !important;
}
/* Remove torn paper effect */
.receipt::after {
display: none;
}
}
</style>
</head>
<body>
@ -1303,7 +1623,178 @@
</div>
<!-- Payment Panel -->
<div class="payment-panel">
<div class="payment-panel" style="position: relative;">
<!-- Receipt overlay -->
<div class="receipt-container" id="receiptContainer">
<div class="receipt">
<button class="receipt-close" onclick="hideReceipt()">✕</button>
<div class="receipt-header">
<div class="receipt-logo">SALON BELLEZZA</div>
<div class="receipt-address">
Østergade 42, 1. sal<br>
1100 København K<br>
Tlf: 33 12 34 56<br>
CVR: 12345678
</div>
</div>
<div class="receipt-info">
<div>
<div>Dato: 16-12-2025</div>
<div>Tid: 14:32</div>
</div>
<div style="text-align: right;">
<div>Kvit: #4521</div>
<div>Kasse: 1</div>
</div>
</div>
<div class="receipt-items">
<div class="receipt-item" style="font-weight: bold; border-bottom: 1px solid #000; padding-bottom: 4px; margin-bottom: 4px;">
<span class="receipt-item-name">Vare</span>
<span class="receipt-item-qty">Antal</span>
<span class="receipt-item-price">Pris</span>
</div>
<div class="receipt-item">
<span class="receipt-item-name">Dameklip</span>
<span class="receipt-item-qty">1</span>
<span class="receipt-item-price">725,00</span>
</div>
<div class="receipt-item">
<span class="receipt-item-name">Gloss langt hår</span>
<span class="receipt-item-qty">1</span>
<span class="receipt-item-price">900,00</span>
</div>
<div class="receipt-item">
<span class="receipt-item-name">Olaplex No. 3</span>
<span class="receipt-item-qty">1</span>
<span class="receipt-item-price">300,00</span>
</div>
<div class="receipt-item">
<span class="receipt-item-name">India mask 250ml</span>
<span class="receipt-item-qty">2</span>
<span class="receipt-item-price">350,00</span>
</div>
</div>
<div class="receipt-divider"></div>
<div class="receipt-totals">
<div class="receipt-total-row">
<span>Subtotal</span>
<span>1.820,00</span>
</div>
<div class="receipt-total-row">
<span>Moms (25%)</span>
<span>455,00</span>
</div>
<div class="receipt-total-row grand">
<span>TOTAL</span>
<span>2.275,00 DKK</span>
</div>
</div>
<div class="receipt-payment">
<div class="receipt-payment-row">
<span>Betalt med Kort</span>
<span>2.275,00</span>
</div>
</div>
<div class="receipt-footer">
<div class="receipt-footer-msg">TAK FOR BESØGET!</div>
<div>Kunde: Sofie Nielsen</div>
<div>Betjent af: Emma Larsen</div>
<div class="receipt-qr">
<svg viewBox="0 0 29 29" width="80" height="80">
<!-- QR Code pattern -->
<rect width="29" height="29" fill="white"/>
<!-- Position patterns (corners) -->
<rect x="0" y="0" width="7" height="7" fill="black"/>
<rect x="1" y="1" width="5" height="5" fill="white"/>
<rect x="2" y="2" width="3" height="3" fill="black"/>
<rect x="22" y="0" width="7" height="7" fill="black"/>
<rect x="23" y="1" width="5" height="5" fill="white"/>
<rect x="24" y="2" width="3" height="3" fill="black"/>
<rect x="0" y="22" width="7" height="7" fill="black"/>
<rect x="1" y="23" width="5" height="5" fill="white"/>
<rect x="2" y="24" width="3" height="3" fill="black"/>
<!-- Timing patterns -->
<rect x="8" y="6" width="1" height="1" fill="black"/>
<rect x="10" y="6" width="1" height="1" fill="black"/>
<rect x="12" y="6" width="1" height="1" fill="black"/>
<rect x="6" y="8" width="1" height="1" fill="black"/>
<rect x="6" y="10" width="1" height="1" fill="black"/>
<rect x="6" y="12" width="1" height="1" fill="black"/>
<!-- Data modules (random pattern) -->
<rect x="8" y="8" width="1" height="1" fill="black"/>
<rect x="9" y="9" width="1" height="1" fill="black"/>
<rect x="10" y="8" width="1" height="1" fill="black"/>
<rect x="11" y="10" width="1" height="1" fill="black"/>
<rect x="12" y="9" width="1" height="1" fill="black"/>
<rect x="13" y="8" width="1" height="1" fill="black"/>
<rect x="8" y="11" width="1" height="1" fill="black"/>
<rect x="10" y="11" width="1" height="1" fill="black"/>
<rect x="12" y="11" width="1" height="1" fill="black"/>
<rect x="9" y="12" width="1" height="1" fill="black"/>
<rect x="11" y="12" width="1" height="1" fill="black"/>
<rect x="13" y="12" width="1" height="1" fill="black"/>
<rect x="15" y="8" width="1" height="1" fill="black"/>
<rect x="16" y="9" width="1" height="1" fill="black"/>
<rect x="17" y="8" width="1" height="1" fill="black"/>
<rect x="18" y="10" width="1" height="1" fill="black"/>
<rect x="19" y="9" width="1" height="1" fill="black"/>
<rect x="20" y="8" width="1" height="1" fill="black"/>
<rect x="15" y="11" width="1" height="1" fill="black"/>
<rect x="17" y="11" width="1" height="1" fill="black"/>
<rect x="19" y="11" width="1" height="1" fill="black"/>
<rect x="16" y="12" width="1" height="1" fill="black"/>
<rect x="18" y="12" width="1" height="1" fill="black"/>
<rect x="20" y="12" width="1" height="1" fill="black"/>
<rect x="8" y="14" width="1" height="1" fill="black"/>
<rect x="10" y="14" width="1" height="1" fill="black"/>
<rect x="12" y="15" width="1" height="1" fill="black"/>
<rect x="9" y="16" width="1" height="1" fill="black"/>
<rect x="11" y="16" width="1" height="1" fill="black"/>
<rect x="13" y="17" width="1" height="1" fill="black"/>
<rect x="8" y="18" width="1" height="1" fill="black"/>
<rect x="10" y="18" width="1" height="1" fill="black"/>
<rect x="12" y="19" width="1" height="1" fill="black"/>
<rect x="15" y="14" width="1" height="1" fill="black"/>
<rect x="17" y="15" width="1" height="1" fill="black"/>
<rect x="19" y="14" width="1" height="1" fill="black"/>
<rect x="16" y="16" width="1" height="1" fill="black"/>
<rect x="18" y="17" width="1" height="1" fill="black"/>
<rect x="20" y="16" width="1" height="1" fill="black"/>
<rect x="22" y="8" width="1" height="1" fill="black"/>
<rect x="24" y="9" width="1" height="1" fill="black"/>
<rect x="23" y="10" width="1" height="1" fill="black"/>
<rect x="25" y="11" width="1" height="1" fill="black"/>
<rect x="22" y="12" width="1" height="1" fill="black"/>
<rect x="24" y="13" width="1" height="1" fill="black"/>
<rect x="8" y="22" width="1" height="1" fill="black"/>
<rect x="10" y="23" width="1" height="1" fill="black"/>
<rect x="9" y="24" width="1" height="1" fill="black"/>
<rect x="11" y="25" width="1" height="1" fill="black"/>
<rect x="12" y="22" width="1" height="1" fill="black"/>
<rect x="13" y="24" width="1" height="1" fill="black"/>
<!-- Alignment pattern -->
<rect x="20" y="20" width="5" height="5" fill="black"/>
<rect x="21" y="21" width="3" height="3" fill="white"/>
<rect x="22" y="22" width="1" height="1" fill="black"/>
</svg>
</div>
<div class="receipt-id">4521-161225-1432</div>
</div>
<div class="receipt-actions">
<button class="btn-print" onclick="window.print()">🖨️ Print</button>
<button class="btn-close" onclick="hideReceipt()">Luk</button>
</div>
</div>
</div>
<div class="payment-total">
<div class="payment-total-amount" id="totalAmount">2.275 kr</div>
<div class="payment-total-label">Total at betale</div>
@ -1369,7 +1860,7 @@
</div>
<button class="btn-complete" id="btnComplete" disabled>Afslut salg</button>
<div class="payment-actions">
<button class="btn-secondary">Print kvittering</button>
<button class="btn-secondary" onclick="showReceipt()">Print kvittering</button>
<button class="btn-secondary">Send på mail</button>
</div>
</div>
@ -1978,6 +2469,31 @@
}
`;
document.head.appendChild(scannerStyle);
// ==========================================
// RECEIPT
// ==========================================
function showReceipt() {
const receiptContainer = document.getElementById('receiptContainer');
receiptContainer.classList.add('visible');
}
function hideReceipt() {
const receiptContainer = document.getElementById('receiptContainer');
receiptContainer.classList.remove('visible');
}
// Close receipt on Escape key
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
const receiptContainer = document.getElementById('receiptContainer');
if (receiptContainer.classList.contains('visible')) {
hideReceipt();
e.stopPropagation();
}
}
});
</script>
</body>
</html>