v1.12.2
Fix asterisk wrap, stacked buttons, and collapsed field widths
Three theme/structure issues reported on step 3 (and shared across steps), all rooted in how the form's flexbox interacts with Bricks' default flex rules:
-
Required asterisk dropped to its own line. The label is a flex column, so the bare "First Name" text node and the * became separate stacked flex items. Wrap the visible label text and its required marker in a single .cmm-mf-label-text span so they render inline on one line. Every label in the template now uses this wrapper; the label's own font styling moves to .cmm-mf-label-text.
-
Back / Continue buttons stacked vertically. .cmm-mf-actions set display: flex and justify-content: center but never pinned flex-direction, so Bricks' default flex-direction: column won. Force flex-direction: row !important (the <=760px media query still switches to column-reverse for mobile).
-
Fields collapsed to ~half width (e.g. Street Address, the First/Last/Mobile grid) with dead space on the right. The flex-column containers (.cmm-mf, .cmm-mf-panel, .cmm-mf-section, .cmm-mf-new-account, .cmm-mf-label) never set align-items, so the theme's align-items: flex-start/center shrank children to content width instead of stretching. Force align-items: stretch !important and width: 100% on those containers and the grid rows.
Also wrap the directory-checkbox caption in a and force the checkbox row to flex-direction: row so the box and label stay inline.
Bump version to 1.12.2.
Merged from #35 by @sfxdotcom.