Fix validate message placement and confirm ghost button styling

- Add id="action-row" to button flex div for reliable message anchoring
- Insert validate message after #action-row (not via btn.closest)
- Both Save and Validate already use kb-btn--ghost; explicit in markup

https://claude.ai/code/session_01MkM7p8Us3L8YAfLKGA13NS
This commit is contained in:
Claude 2026-06-08 16:46:20 +00:00
parent 474d2a7a71
commit f44593cb55
No known key found for this signature in database

View file

@ -935,7 +935,7 @@ function buildForm() {
</div>
<!-- Action row -->
<div style="display:flex;gap:10px;margin-top:8px">
<div id="action-row" style="display:flex;gap:10px;margin-top:8px">
<button type="button" id="btn-save" class="kb-btn kb-btn--ghost kb-btn--lg" style="flex:2" onclick="saveInvoice()">${t("save")}</button>
<button type="button" id="btn-validate" class="kb-btn kb-btn--ghost kb-btn--lg" style="flex:2" onclick="validateInvoice()">${t("validate")}</button>
<button type="submit" id="btn-generate" class="kb-btn kb-btn--primary kb-btn--lg" style="flex:6">
@ -1466,7 +1466,8 @@ function validateInvoice() {
msg.style.color = "#e74c3c";
msg.innerHTML = errors.map(e => `• ${e}`).join("<br>");
}
btn.closest("div").after(msg);
const row = document.getElementById("action-row");
if (row) row.after(msg);
setTimeout(() => msg.remove(), 5000);
}