notid/integreat
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

fix(ssr): center the client bank-account sub-editor content

Browse Source 
The bank-account editor (cash/credit/checking) is a full sub-modal that swaps
into the client wizard at the same 820px width, but its single-column form
(~430px of fields) hugged the far-left edge, leaving the whole right half empty —
the same "too wide / empty" look as the pay modal. Constrain the form to max-w-xl
and center it (mx-auto) so the whitespace is balanced; keeps the 820px card so
there's no size jump entering/leaving the editor.

Audit context: walked all 7 client steps + the pay wizard (step 1 + step 2
simple/advanced grid) at 1440x900 — all fit with no overflow; the regular steps
stay balanced via the vertical timeline sidebar. This sub-editor was the one
unbalanced spot.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Bryce
2026-06-28 08:47:46 -07:00
parent 333c280732
commit 67f8906631
2 changed files with 5 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
resources/public/output.css
View File

@@ -1694,6 +1694,10 @@ input:checked + .toggle-bg {
max-width: 1024px; max-width: 1024px;
} }
.max-w-xl {
max-width: 36rem;
}
.max-w-xs { .max-w-xs {
max-width: 20rem; max-width: 20rem;
} }

2
src/clj/auto_ap/ssr/admin/clients.clj
View File

@@ -1026,7 +1026,7 @@
(com/modal-card-advanced (com/modal-card-advanced
{:class " md:w-[820px] md:h-[560px] w-full h-full"} {:class " md:w-[820px] md:h-[560px] w-full h-full"}
(com/modal-header {} [:div.p-2 "Bank Account"]) (com/modal-header {} [:div.p-2 "Bank Account"])
(com/modal-body {} [:div {:class "htmx-added:opacity-0 opacity-100 transition-opacity duration-300"} (com/modal-body {} [:div {:class "max-w-xl mx-auto htmx-added:opacity-0 opacity-100 transition-opacity duration-300"}
(bank-account-form ba client-id)]) (bank-account-form ba client-id)])
(com/modal-footer {} (com/modal-footer {}
[:div.flex.justify-end.items-baseline.gap-x-4 [:div.flex.justify-end.items-baseline.gap-x-4