Design reference

Forms — every input the visitor fills in, in one place.

Ten forms — nine sharing the .lead-form / .field / .form-* classes, plus the footer capture's own .footer-capture-* set — all in public/styles.css, so this page can't drift from what ships. It's the form sibling of the hero sections, section gallery, pop-ups, and footer gallery.

  1. 01 Contact inquiry
  2. 02 Footer capture
  3. 03 Book a call
  4. 04 Webinar registration
  5. 05 Login
  6. 06 Password recovery
  7. 07 Launch Kit checkout
  8. 08 Engagement deposit
  9. 09 Self-pay packages
  10. 10 Custom amount

Status states

Every form above is shown at rest. After a submit, the shared .form-status region under the form takes one of four states — the same element form-engine.js writes to.

  • Sending…

    data-state="loading"
  • Waiting on confirmation…

    data-state="pending"
  • Thanks — we'll be in touch shortly.

    data-state="success"
  • That didn't send. Please try again.

    data-state="error"