Skip to content

IBX-12279: Fixed label gaps for checkbox rows, richtext fields and compound legends - #2040

Open
tischsoic wants to merge 1 commit into
6.0from
IBX-12279-labels-follow-up
Open

IBX-12279: Fixed label gaps for checkbox rows, richtext fields and compound legends#2040
tischsoic wants to merge 1 commit into
6.0from
IBX-12279-labels-follow-up

Conversation

@tischsoic

@tischsoic tischsoic commented Aug 29, 2026

Copy link
Copy Markdown
Contributor
🎫 Issue IBX-12279

Related PRs:

Description:

Three label→input gaps that IBX-12187's 4px label margin did not reach:

  • checkbox sub-fields (form_row_subfield): Bootstrap's .form-check-input { margin-top: .25em } pushed the DS checkbox 3.5px down — the .form-check row is now a flex row starting 4px under the label;
  • richtext: the distraction-free-mode button (32px) shares the flex line with the label wrapper, so the editor started 10px too low — the label wrapper is bottom-aligned with the button;
  • compound field labels (radio/checkbox groups, collections, sub-forms) are rendered by Symfony as <legend class="col-form-label"> with 6.25px padding top and bottom — .ids-label.col-form-label now drops the padding and gets the 4px margin (e.g. Site Factory "Status", selection attribute "Options").

The toggle/checkbox-row centring itself comes from the design-system PR.

For QA:

  • Brand context → attribute definition create: "Required"/"Translatable" checkbox rows 4px under their labels.
  • New article: "Intro"/"Body" editors 4px under their labels, distraction-free button still in place.
  • Site Factory → Site create "Status"; Product catalog → selection attribute create "Options": label 4px above the control, no extra space above the label.

Documentation:

…mpound legends

- checkbox sub-fields: lay out the Bootstrap .form-check row as a flex row and
  drop the .form-check-input top margin so the row starts 4px under its label
- richtext: bottom-align the label wrapper with the distraction-free-mode
  button so the 4px label margin meets the editor
- compound field labels rendered as <legend class="col-form-label">: drop
  Bootstrap's vertical padding and apply the 4px label margin

Co-Authored-By: Claude <noreply@anthropic.com>
@sonarqubecloud

Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants