Two-column layout with live preview pane

Featurekamo-internal
Ya
30 Mei 2026, 01:25 UTC
Mwandishi
kamo
Ahadi ya
f273999

The new-offer page was a tall narrow column on wide screens — wasted half the viewport. Now uses CSS Grid with the form on the left (5fr) and a live "Offer Preview" pane on the right (7fr) that updates as the operator types. Single-column on small screens (< lg). Form side: - Section blocks with icons (Product · Borrower · Amount · Custom Terms) - Borrower fields stack vertically (member id + state) in a more compact presentation now that horizontal space is reserved for the preview Preview side (only when a product is chosen): - Hero card with gradient background, kind chip, product name, and a human-readable headline ("$5,000 · 12-month installment · 14.99% APR" / "$25,000 line of credit · 9.99% rate") - 4-tile stats grid: principal, rate, monthly payment, term (installment) or principal, rate, draw period, repayment period (LOC) - Fee breakdown (origination/late/NSF/annual) with "custom" chip when an override is applied - Cost summary panel: net disbursed, total interest, total cost - Amortization schedule peek: first 3 + last 3 rows with a "{N} more payments…" gap row for terms > 6 months - TILA reminder note explaining the backend computes the true APR + builds the real schedule + renders disclosures on send All math is client-side straight-line amortization (P × r × (1+r)^n / ((1+r)^n - 1)) — a faithful preview, not the final disclosed APR. Backend still owns truth.

Mabadiliko yote

Je, unaona nini kuhusu usafiri?

Kila moja ya hizi updates ardhi katika nafasi yako ya kazi moja kwa moja. Kuanza bure na kuangalia kukua wiki baada ya wiki.

Kuwa Huru MileleMtazamo wa bei