fix(invoices): widen quantity fields in edit form layout

Increase quantity column spans for Invoice Items and Extra Goods on the invoice edit page so values are easier to read, and keep static and JS-added rows aligned.
This commit is contained in:
Dries Peeters
2026-03-26 14:51:22 +01:00
parent 3d0ad839c4
commit 36fcbc65bf
+12 -12
View File
@@ -71,8 +71,8 @@
<div class="hidden md:grid md:grid-cols-12 gap-3 mb-2 px-3 text-xs font-semibold text-text-muted-light dark:text-text-muted-dark uppercase">
<div class="md:col-span-2">{{ _('Project / Stock Item') }}</div>
<div class="md:col-span-2">{{ _('Task / Warehouse') }}</div>
<div class="md:col-span-4">{{ _('Description') }}</div>
<div class="md:col-span-1">{{ _('Quantity') }}</div>
<div class="md:col-span-3">{{ _('Description') }}</div>
<div class="md:col-span-2">{{ _('Quantity') }}</div>
<div class="md:col-span-2">{{ _('Unit Price') }}</div>
<div class="md:col-span-1 text-center">{{ _('Action') }}</div>
</div>
@@ -110,10 +110,10 @@
</select>
</div>
{% endif %}
<div class="md:col-span-4 flex flex-col">
<div class="md:col-span-3 flex flex-col">
<input type="text" name="description[]" placeholder="{{ _('e.g., Web Development Services') }}" value="{{ item.description }}" class="form-input item-description" data-calc-trigger>
</div>
<div class="md:col-span-1 flex flex-col">
<div class="md:col-span-2 flex flex-col">
{% if item.time_entry_ids %}
<input type="number" name="quantity[]" placeholder="{{ _('Quantity') }}" value="{{ item.quantity }}" step="0.01" min="0" class="form-input item-quantity bg-gray-100 dark:bg-gray-800 cursor-not-allowed" readonly title="{{ _('Quantity is from logged hours and cannot be edited') }}">
{% else %}
@@ -230,9 +230,9 @@
<!-- Goods header (desktop) -->
<div class="hidden md:grid md:grid-cols-12 gap-3 mb-2 px-3 text-xs font-semibold text-text-muted-light dark:text-text-muted-dark uppercase">
<div class="md:col-span-2">{{ _('Name') }}</div>
<div class="md:col-span-3">{{ _('Description') }}</div>
<div class="md:col-span-2">{{ _('Description') }}</div>
<div class="md:col-span-2">{{ _('Category') }}</div>
<div class="md:col-span-1">{{ _('Qty') }}</div>
<div class="md:col-span-2">{{ _('Qty') }}</div>
<div class="md:col-span-2">{{ _('Price') }}</div>
<div class="md:col-span-1">{{ _('SKU') }}</div>
<div class="md:col-span-1 text-center">{{ _('Action') }}</div>
@@ -244,7 +244,7 @@
<div class="md:col-span-2 flex flex-col">
<input type="text" name="good_name[]" placeholder="{{ _('e.g., Software License') }}" value="{{ good.name }}" class="form-input" data-calc-trigger>
</div>
<div class="md:col-span-3 flex flex-col">
<div class="md:col-span-2 flex flex-col">
<input type="text" name="good_description[]" placeholder="{{ _('Description') }}" value="{{ good.description or '' }}" class="form-input">
</div>
<div class="md:col-span-2 flex flex-col">
@@ -256,7 +256,7 @@
<option value="other" {% if good.category == 'other' %}selected{% endif %}>{{ _('Other') }}</option>
</select>
</div>
<div class="md:col-span-1 flex flex-col">
<div class="md:col-span-2 flex flex-col">
<input type="number" name="good_quantity[]" placeholder="{{ _('Qty') }}" value="{{ good.quantity }}" step="0.01" min="0" class="form-input good-quantity" data-calc-trigger>
</div>
<div class="md:col-span-2 flex flex-col">
@@ -534,10 +534,10 @@ document.addEventListener('DOMContentLoaded', function() {
${warehousesHtml}
</select>
</div>
<div class="md:col-span-4 flex flex-col">
<div class="md:col-span-3 flex flex-col">
<input type="text" name="description[]" placeholder="{{ _('e.g., Web Development Services') }}" class="form-input item-description" data-calc-trigger>
</div>
<div class="md:col-span-1 flex flex-col">
<div class="md:col-span-2 flex flex-col">
<input type="number" name="quantity[]" placeholder="{{ _('Quantity') }}" value="1" step="0.01" min="0" class="form-input item-quantity" data-calc-trigger>
</div>
<div class="md:col-span-2 flex flex-col">
@@ -604,7 +604,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="md:col-span-2 flex flex-col">
<input type="text" name="good_name[]" placeholder="{{ _('e.g., Software License') }}" class="form-input" data-calc-trigger>
</div>
<div class="md:col-span-3 flex flex-col">
<div class="md:col-span-2 flex flex-col">
<input type="text" name="good_description[]" placeholder="{{ _('Description') }}" class="form-input">
</div>
<div class="md:col-span-2 flex flex-col">
@@ -616,7 +616,7 @@ document.addEventListener('DOMContentLoaded', function() {
<option value="other">{{ _('Other') }}</option>
</select>
</div>
<div class="md:col-span-1 flex flex-col">
<div class="md:col-span-2 flex flex-col">
<input type="number" name="good_quantity[]" placeholder="{{ _('Qty') }}" value="1" step="0.01" min="0" class="form-input good-quantity" data-calc-trigger>
</div>
<div class="md:col-span-2 flex flex-col">