diff --git a/src/modules/data-entry/views/receipts/ReceiptCreateView.vue b/src/modules/data-entry/views/receipts/ReceiptCreateView.vue index 318d369..689d7e2 100644 --- a/src/modules/data-entry/views/receipts/ReceiptCreateView.vue +++ b/src/modules/data-entry/views/receipts/ReceiptCreateView.vue @@ -293,7 +293,7 @@ optionValue="value" placeholder="Tip" :disabled="isReadOnly" - class="dropdown-compact" + class="dropdown-compact dropdown-borderless" />
@@ -328,7 +328,7 @@ placeholder="Tip" :disabled="isReadOnly" @change="directionAutoDetected = false" - class="dropdown-compact" + class="dropdown-compact dropdown-borderless" />
@@ -340,7 +340,7 @@
- +
@@ -351,22 +351,10 @@ required :disabled="isReadOnly" class="input-compact" + :pt="{ root: { style: 'width: 130px' } }" />
-
- - -
- +
+ +
+ + +
@@ -414,6 +415,7 @@ placeholder="Selecteaza tip cheltuiala" required :disabled="isReadOnly" + class="dropdown-borderless" />
@@ -2404,12 +2406,11 @@ const submitForReview = async () => { padding: 0.5rem 0.75rem; } -/* CSS Grid layout for precise column control - PREVENTS OVERLAP */ +/* CSS Grid layout with FIXED columns to prevent overlap */ .values-row-inline { display: grid; - grid-template-columns: 150px 200px auto; - column-gap: 3rem; - row-gap: 0.5rem; + grid-template-columns: 140px 120px 200px; /* TOTAL | CARD | MOD PLATA - fixed widths */ + column-gap: 2rem; /* 32px gap between columns */ align-items: start; } @@ -2417,15 +2418,26 @@ const submitForReview = async () => { display: flex; flex-direction: column; gap: 0.2rem; + max-width: 100%; /* Prevent overflow */ + overflow: hidden; } -/* Explicit widths for inputs */ +/* TOTAL - first column */ .value-item-total { - width: 150px; + width: 140px; + max-width: 140px; } +/* Payment methods (CARD, NUMERAR) - middle columns */ +.payment-method-item { + width: 120px; + max-width: 120px; +} + +/* MOD PLATA - last column */ .value-item-payment { width: 200px; + max-width: 200px; } .value-item label { @@ -2435,26 +2447,44 @@ const submitForReview = async () => { text-transform: uppercase; } +/* Force InputNumber to respect container width */ .input-compact { - width: 130px; + width: 100% !important; + max-width: 130px !important; +} + +:deep(.value-item-total .p-inputnumber) { + width: 100% !important; + max-width: 130px !important; +} + +:deep(.value-item-total .p-inputnumber-input) { + width: 100% !important; +} + +:deep(.payment-method-item .p-inputnumber) { + width: 100% !important; + max-width: 110px !important; +} + +:deep(.payment-method-item .p-inputnumber-input) { + width: 100% !important; } .dropdown-payment { - width: 180px; /* Fixed width to prevent overlap */ + width: 100% !important; + max-width: 190px !important; } :deep(.dropdown-payment) { - width: 180px !important; + width: 100% !important; + max-width: 190px !important; } :deep(.dropdown-payment .p-dropdown) { width: 100% !important; } -.payment-method-item { - padding-left: 0.5rem; -} - .payment-method-value { display: inline-block; font-size: 0.95rem; @@ -2951,3 +2981,32 @@ const submitForReview = async () => { color: #f57c00; } + + +