fix: Remove clear form button and improve UX

Major UI/UX improvements and bug fixes:

• Fixed date formatting bug in ticket receipts (undefined dates)
• Removed clear form button per user request
• Added favicon integration across all pages (apple-touch-icon, favicon variants)
• Implemented auto-collapse for product categories after adding items
• Changed all ticket content alignment to left for better readability
• Made product interface more compact to reduce scrolling
• Enhanced date validation and formatting throughout the system

Technical changes:
- Fixed esc() function regex that was causing date corruption
- Added collapseAllCategories() function for better UX
- Updated cache-busting versions for proper browser refresh
- Improved date handling with proper validation
- Added comprehensive favicon support with web manifest

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Marco Gallegos
2025-09-09 16:18:51 -06:00
parent 07209a4183
commit 9f3daff09b
15 changed files with 1001 additions and 46 deletions

View File

@@ -440,7 +440,7 @@ th[onclick]:hover {
.products-container {
display: flex;
flex-direction: column;
gap: 15px;
gap: 10px;
}
.product-selector {
@@ -887,6 +887,7 @@ button.action-btn {
}
.t-center { text-align: center; }
.t-right { text-align: right; }
.t-left { text-align: left; }
.t-bold { font-weight: bold; }
.t-business-name { font-size: 14px; margin-bottom: 4px; }
.t-tagline { font-size: 11px; margin-bottom: 8px; font-style: italic; }
@@ -899,6 +900,7 @@ button.action-btn {
.t-row-label { font-weight: bold; }
.t-service-detail-label { font-weight: bold; }
.t-footer { margin-top: 10px; }
.t-total-large { font-size: 13px; }
.t-qr-section {
margin-top: 12px;
@@ -914,6 +916,27 @@ button.action-btn {
display: block;
}
/* Estilos para columnas del ticket */
.t-client-appointment-section {
margin: 8px 0;
}
.t-client-appointment-row {
display: flex;
justify-content: space-between;
gap: 10px;
}
.t-client-appointment-col {
flex: 1;
font-size: 11px;
line-height: 1.3;
}
.t-client-appointment-col div {
margin-bottom: 4px;
}
/***** MODO IMPRESIÓN *****/
@media print {
@@ -1732,10 +1755,10 @@ table tbody tr:hover {
}
.products-grid {
padding: 20px;
padding: 15px;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 15px;
gap: 10px;
background: white;
}
@@ -1743,12 +1766,13 @@ table tbody tr:hover {
display: grid;
grid-template-columns: 1fr auto auto auto;
align-items: center;
gap: 10px;
padding: 12px 16px;
gap: 8px;
padding: 8px 12px;
border-bottom: 1px solid #e0e0e0;
cursor: pointer;
transition: background-color 0.2s ease;
background: white;
font-size: 13px;
}
.product-card:nth-child(even) {
@@ -1795,7 +1819,7 @@ table tbody tr:hover {
.product-actions {
display: flex;
gap: 8px;
gap: 6px;
align-items: center;
justify-self: end;
}
@@ -1804,9 +1828,9 @@ table tbody tr:hover {
background: #2c3e50;
color: white;
border: none;
padding: 6px 12px;
border-radius: 4px;
font-size: 12px;
padding: 4px 8px;
border-radius: 3px;
font-size: 11px;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s ease;
@@ -1895,12 +1919,12 @@ table tbody tr:hover {
}
.quantity-input {
width: 60px;
padding: 8px;
border: 2px solid #e1e5e9;
border-radius: 6px;
width: 45px;
padding: 4px;
border: 1px solid #e1e5e9;
border-radius: 3px;
text-align: center;
font-size: 14px;
font-size: 12px;
}
/* --- Checkout Panel --- */