diff --git a/assets/css/custom.css b/assets/css/custom.css new file mode 100644 index 0000000..04bd45e --- /dev/null +++ b/assets/css/custom.css @@ -0,0 +1,77 @@ +@import url('https://fonts.googleapis.com/css2?family=Georgia&family=Helvetica+Neue&display=swap'); + +body { + background-color: #FDFDFD; + color: #4A4A4A; + font-family: 'Helvetica Neue', Arial, sans-serif; +} + +h1, h2, h3, h4, h5, h6 { + font-family: 'Georgia', serif; +} + +.btn-primary { + background-color: #D4AF37; + border-color: #D4AF37; +} + +.btn-primary:hover, .btn-primary:focus { + background-color: #c09d2e; + border-color: #c09d2e; +} + +.btn-secondary { + background-color: #6c757d; + border-color: #6c757d; +} + +.card { + border-radius: 0.5rem; + border: 1px solid #EAEAEA; +} + +.card-header { + border-bottom: 1px solid #EAEAEA; +} + +.card-footer { + border-top: 1px solid #EAEAEA; +} + +.form-control:focus { + border-color: #D4AF37; + box-shadow: 0 0 0 0.25rem rgba(212, 175, 55, 0.25); +} + +.table { + margin-bottom: 0; +} + +#estimator-section { + background: linear-gradient(to bottom, rgba(212, 175, 55, 0.05), rgba(212, 175, 55, 0)); + padding-top: 2rem; + padding-bottom: 2rem; + border-radius: 0.5rem; +} + +@media print { + body * { + visibility: hidden; + } + #estimator-section, #estimator-section * { + visibility: visible; + } + #estimator-section { + position: absolute; + left: 0; + top: 0; + width: 100%; + } + .btn, .form-label, #item-form { + display: none !important; + } + .card { + box-shadow: none !important; + border: none !important; + } +} \ No newline at end of file diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..b62f321 --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,81 @@ +document.addEventListener('DOMContentLoaded', () => { + const itemForm = document.getElementById('item-form'); + const estimateItems = document.getElementById('estimate-items'); + const subtotalEl = document.getElementById('subtotal'); + const taxEl = document.getElementById('tax'); + const totalEl = document.getElementById('total'); + const printBtn = document.getElementById('print-btn'); + const emptyState = document.getElementById('empty-state'); + + let items = []; + + const updateTotals = () => { + const subtotal = items.reduce((acc, item) => acc + item.total, 0); + const tax = subtotal * 0.10; + const total = subtotal + tax; + + subtotalEl.textContent = `$${subtotal.toFixed(2)}`; + taxEl.textContent = `$${tax.toFixed(2)}`; + totalEl.textContent = `$${total.toFixed(2)}`; + + if (items.length > 0) { + emptyState.style.display = 'none'; + } else { + emptyState.style.display = 'block'; + } + }; + + const renderItems = () => { + estimateItems.innerHTML = ''; + items.forEach((item, index) => { + const tr = document.createElement('tr'); + tr.innerHTML = ` + ${item.description} + ${item.quantity} + $${item.price.toFixed(2)} + $${item.total.toFixed(2)} + + + + `; + estimateItems.appendChild(tr); + }); + updateTotals(); + }; + + itemForm.addEventListener('submit', (e) => { + e.preventDefault(); + const description = document.getElementById('item-description').value; + const quantity = parseInt(document.getElementById('item-quantity').value); + const price = parseFloat(document.getElementById('item-price').value); + + if (description && quantity > 0 && price > 0) { + const newItem = { + description, + quantity, + price, + total: quantity * price + }; + items.push(newItem); + renderItems(); + itemForm.reset(); + } + }); + + estimateItems.addEventListener('click', (e) => { + if (e.target.classList.contains('remove-btn') || e.target.closest('.remove-btn')) { + const button = e.target.closest('.remove-btn'); + const index = parseInt(button.dataset.index); + items.splice(index, 1); + renderItems(); + } + }); + + printBtn.addEventListener('click', () => { + window.print(); + }); + + updateTotals(); +}); \ No newline at end of file diff --git a/index.php b/index.php index 7205f3d..923d80b 100644 --- a/index.php +++ b/index.php @@ -1,150 +1,114 @@ - - + - - - New Style - - - - - - - - - - - - - - - - - - - + + + Project BrassConnect Full-Stack Development PrompC + + + + + + + + + + + -
-
-

Analyzing your requirements and generating your website…

-
- Loading… -
-

AI is collecting your requirements and applying the first changes.

-

This page will update automatically as the plan is implemented.

-

Runtime: PHP — UTC

-
-
- + +
+
+

BrassConnect Estimator

+

A B2B Marketplace for the Brass Industry

+
+
+ +
+
+
+

Create a Quick Estimate

+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ +
+ +

Line Items

+
+ + + + + + + + + + + + + +
DescriptionQuantityUnit PriceTotalAction
+
+
+ +

Your estimate is currently empty.

+
+ +
+ +
+
+
+
+

Summary

+
+ Subtotal + $0.00 +
+
+ Tax (10%) + $0.00 +
+
+
+ Total + $0.00 +
+
+
+
+
+ +
+
+ +
+
+
+ + + + - + \ No newline at end of file