fix(ux): add inputmode and autocomplete attributes for mobile UX

- inputmode=decimal on budget amount input for correct decimal keyboard
- inputmode=numeric on rrule interval input for numeric keyboard
- autocomplete attributes on contacts form (name, tel, email, street-address)
This commit is contained in:
Ulas
2026-04-05 01:39:01 +02:00
parent 72515c5a69
commit 1dccba8d96
3 changed files with 6 additions and 6 deletions
+4 -4
View File
@@ -263,7 +263,7 @@ function openContactModal({ mode, contact = null }) {
const content = `
<div class="form-group">
<label class="form-label" for="cm-name">${t('contacts.nameLabel')}</label>
<input type="text" class="form-input" id="cm-name" placeholder="${t('contacts.namePlaceholder')}" value="${v('name')}">
<input type="text" class="form-input" id="cm-name" placeholder="${t('contacts.namePlaceholder')}" value="${v('name')}" autocomplete="name">
</div>
<div class="form-group">
<label class="form-label" for="cm-category">${t('contacts.categoryLabel')}</label>
@@ -271,15 +271,15 @@ function openContactModal({ mode, contact = null }) {
</div>
<div class="form-group">
<label class="form-label" for="cm-phone">${t('contacts.phoneLabel')}</label>
<input type="tel" class="form-input" id="cm-phone" placeholder="${t('contacts.phonePlaceholder')}" value="${v('phone')}">
<input type="tel" class="form-input" id="cm-phone" placeholder="${t('contacts.phonePlaceholder')}" value="${v('phone')}" autocomplete="tel">
</div>
<div class="form-group">
<label class="form-label" for="cm-email">${t('contacts.emailLabel')}</label>
<input type="email" class="form-input" id="cm-email" placeholder="${t('contacts.emailPlaceholder')}" value="${v('email')}">
<input type="email" class="form-input" id="cm-email" placeholder="${t('contacts.emailPlaceholder')}" value="${v('email')}" autocomplete="email">
</div>
<div class="form-group">
<label class="form-label" for="cm-address">${t('contacts.addressLabel')}</label>
<input type="text" class="form-input" id="cm-address" placeholder="${t('contacts.addressPlaceholder')}" value="${v('address')}">
<input type="text" class="form-input" id="cm-address" placeholder="${t('contacts.addressPlaceholder')}" value="${v('address')}" autocomplete="street-address">
</div>
<div class="form-group">
<label class="form-label" for="cm-notes">${t('contacts.notesLabel')}</label>