Problem/Motivation

Several classes are missing from the standard output of the checkbox widget:

  • LI items need "js-form-item js-form-type-checkbox checkbox form-check".
  • Checkbox input fields need "form-checkbox form-check-input".
  • Labels need "form-check-label".

This would be a simpler approach to resolving #2937191: Render using theme input and select instead of lists with links for checkboxes and dropdown and might be a step in the right direction while waiting for the bigger fix to be finished.

Steps to reproduce

Compare the final output of the JS-powered checkbox widget with a regular checkbox field - several classes are missing.

Proposed resolution

Add the standard Drupal classes to the checkbox widget output.

Remaining tasks

Provide a working MR.

User interface changes

Checkboxes from the checkbox widget will pick up the standard CSS for regular FormAPI checkbox.

API changes

n/a

Data model changes

n/a

Issue fork facets-3528483

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

damienmckenna created an issue. See original summary.

damienmckenna opened merge request !309

damienmckenna’s picture

damienmckenna
Location TN, USA
commented
Status: Active » Needs review

In my local testing this is working better than the current 3.0.0 branch - checkboxes float correctly beside the labels, long labels don't wrap underneath the checkbox, etc.

strykaizer’s picture

strykaizer
Primary language Dutch
Location Belgium
commented
Status: Needs review » Fixed
Issue tags: +Vienna2025

Now that this issue is closed, please review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, please credit people who helped resolve this issue.

herved’s picture

herved commented

I assume the reasoning behind this makes sense, but I noticed it can have side effects.
The added checkbox class breaks the styling on one of our projects that uses Bootstrap 3 and didn’t account for it.

I wonder if this should instead use the Drupal.theme JS API.
Isn’t form-check Bootstrap-specific?
Also, does this follow classes from core/modules/system/templates/form-element.html.twig? if so, why isn’t form-item included?

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.