diff --git a/pos/static/css/catalog.css b/pos/static/css/catalog.css index c9fad21..882186b 100644 --- a/pos/static/css/catalog.css +++ b/pos/static/css/catalog.css @@ -363,13 +363,29 @@ .bodega-table th { text-align: left; font-weight: var(--font-weight-semibold); color: var(--color-text-muted); font-size: var(--text-caption); text-transform: uppercase; letter-spacing: var(--tracking-wider); padding: var(--space-2) var(--space-2); border-bottom: 1px solid var(--color-border); } .bodega-table td { padding: var(--space-2); border-bottom: 1px solid var(--color-border); color: var(--color-text-primary); } - /* Alternatives list */ +/* Alternatives list */ .alt-item { display: flex; align-items: center; justify-content: space-between; padding: var(--space-2) 0; border-bottom: 1px solid var(--color-border); } .alt-item:last-child { border-bottom: none; } .alt-item__pn { font-weight: var(--font-weight-semibold); color: var(--color-text-primary); font-size: var(--text-body-sm); } .alt-item__mfr { font-size: var(--text-caption); color: var(--color-text-muted); } .alt-item__stock { font-size: var(--text-caption); } + /* Compatible vehicles pagination */ + .compat-pager { + display: flex; align-items: center; justify-content: space-between; + gap: var(--space-2); margin-top: var(--space-4); padding-top: var(--space-3); + border-top: 1px solid var(--color-border); + } + .compat-pager__btn { + font-family: inherit; font-size: var(--text-caption); font-weight: var(--font-weight-semibold); + color: var(--color-text-primary); background: var(--color-surface-2); + border: 1px solid var(--color-border); border-radius: var(--radius-sm); + padding: var(--space-2) var(--space-3); cursor: pointer; white-space: nowrap; + } + .compat-pager__btn:hover:not(:disabled) { background: var(--color-surface-3, var(--color-surface-2)); } + .compat-pager__btn:disabled { opacity: 0.4; cursor: not-allowed; } + .compat-pager__info { font-size: var(--text-caption); color: var(--color-text-muted); text-align: center; flex: 1; } + /* Add to cart section */ .detail-footer { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border); diff --git a/pos/static/js/catalog.js b/pos/static/js/catalog.js index 82d9b83..2fce149 100644 --- a/pos/static/js/catalog.js +++ b/pos/static/js/catalog.js @@ -1272,10 +1272,8 @@ html += ''; } - // Compatibilities — deduplicate by (make, model, year, engine) +// Compatibilities — deduplicate by (make, model, year, engine) if (p.compatibilities && p.compatibilities.length) { - html += '