feat: replace native number inputs with AppNumberInput across all views

This commit is contained in:
Your Name
2026-02-17 23:36:02 +02:00
parent 8112fe8fd6
commit fe0b20f247
2 changed files with 20 additions and 18 deletions

View File

@@ -155,11 +155,11 @@
<!-- Duration -->
<div>
<label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Duration (minutes)</label>
<input
v-model.number="durationMinutes"
type="number"
min="1"
class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
<AppNumberInput
v-model="durationMinutes"
:min="1"
:step="1"
suffix="min"
/>
</div>
@@ -226,6 +226,7 @@
<script setup lang="ts">
import { ref, reactive, computed, onMounted } from 'vue'
import { List as ListIcon } from 'lucide-vue-next'
import AppNumberInput from '../components/AppNumberInput.vue'
import AppSelect from '../components/AppSelect.vue'
import AppDatePicker from '../components/AppDatePicker.vue'
import { useEntriesStore, type TimeEntry } from '../stores/entries'

View File

@@ -158,23 +158,23 @@
<div class="grid grid-cols-2 gap-4">
<div>
<label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Tax Rate (%)</label>
<input
v-model.number="createForm.tax_rate"
type="number"
min="0"
max="100"
step="0.01"
class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
<AppNumberInput
v-model="createForm.tax_rate"
:min="0"
:max="100"
:step="0.5"
:precision="2"
suffix="%"
/>
</div>
<div>
<label class="block text-[0.6875rem] text-text-tertiary uppercase tracking-[0.08em] mb-1.5">Discount ($)</label>
<input
v-model.number="createForm.discount"
type="number"
min="0"
step="0.01"
class="w-full px-3 py-2 bg-bg-inset border border-border-subtle rounded-lg text-[0.8125rem] text-text-primary focus:outline-none focus:border-border-visible"
<AppNumberInput
v-model="createForm.discount"
:min="0"
:step="1"
:precision="2"
prefix="$"
/>
</div>
</div>
@@ -332,6 +332,7 @@
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { FileText } from 'lucide-vue-next'
import AppNumberInput from '../components/AppNumberInput.vue'
import AppSelect from '../components/AppSelect.vue'
import AppDatePicker from '../components/AppDatePicker.vue'
import { useInvoicesStore, type Invoice } from '../stores/invoices'