kbenestad/invoice
1
0
Fork 0
mirror of https://github.com/kbenestad/invoice.git synced 2026-06-18 16:14:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Style validation success message to match design: green bg, checkmark icon

Browse source 
Green filled circle checkmark SVG + "All good. The form is ready to download."
on #d1fae5 background with #166534 text, matching the screenshot.

https://claude.ai/code/session_01MkM7p8Us3L8YAfLKGA13NS
This commit is contained in:
Claude 2026-06-08 17:08:10 +00:00
parent a03b0e0bef
commit e80f413b3d
No known key found for this signature in database
2 changed files with 8 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
app/config.yml
View file

@ -468,10 +468,10 @@ translations:
fr: Valider fr: Valider
"no": Valider "no": Valider
val-ok: val-ok:
en: All required fields are filled. en: All good. The form is ready to download.
de: Alle Pflichtfelder sind ausgefüllt. de: Alles in Ordnung. Das Formular ist bereit zum Herunterladen.
fr: Tous les champs obligatoires sont remplis. fr: Tout est bon. Le formulaire est prêt à télécharger.
"no": Alle obligatoriske felt er fylt ut. "no": Alt er i orden. Skjemaet er klart til nedlasting.
val-invoice-no: val-invoice-no:
en: Invoice number is required en: Invoice number is required
de: Rechnungsnummer ist erforderlich de: Rechnungsnummer ist erforderlich

8
app/index.html
View file

@ -1462,11 +1462,11 @@ function validateInvoice() {
if (existing) existing.remove(); if (existing) existing.remove();
const msg = document.createElement("div"); const msg = document.createElement("div");
msg.id = "validate-msg"; msg.id = "validate-msg";
msg.style.cssText = "margin-top:8px;padding:10px 14px;border-radius:8px;font-size:var(--fs-small)"; msg.style.cssText = "margin-top:8px;padding:10px 14px;border-radius:8px;font-size:var(--fs-small);display:flex;align-items:center;gap:10px";
if (errors.length === 0) { if (errors.length === 0) {
msg.style.background = "color-mix(in srgb, var(--accent) 12%, transparent)"; msg.style.background = "#d1fae5";
msg.style.color = "var(--accent)"; msg.style.color = "#166534";
msg.textContent = t("val-ok") || "All required fields are filled."; msg.innerHTML = `<svg width="18" height="18" viewBox="0 0 18 18" fill="none" style="flex-shrink:0"><circle cx="9" cy="9" r="9" fill="#22c55e"/><path d="M5 9l3 3 5-5" stroke="#fff" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg>${h(t("val-ok") || "All good. The form is ready to download.")}`;
} else { } else {
msg.style.background = "color-mix(in srgb, #e74c3c 12%, transparent)"; msg.style.background = "color-mix(in srgb, #e74c3c 12%, transparent)";
msg.style.color = "#e74c3c"; msg.style.color = "#e74c3c";