Uploaded image for project: 'XWiki Platform'
  1. XWiki Platform
  2. XWIKI-11124

Flamingo badly extending .checkbox class for input[type='checkbox'] elements

    XMLWordPrintable

Details

    • Unknown
    • N/A
    • N/A

    Description

      In flamingo/less/forms.less file we are doing

      input[type="radio"]:extend(.radio all), 
input[type="checkbox"]:extend(.checkbox all)

      Although this seemed to be right the first time we used it, if you consult Bootstrap's documentation http://getbootstrap.com/css/#forms-controls you'll see that .checkbox class is supposed to be the parent of input [ type='checkbox'] and not just an additional class.

      <div class="checkbox">
  <label>
    <input type="checkbox" value="">
    Option
  </label>
</div>

      This extend is affecting lots of issues created related to checkboxes and radios, see Related issues.

      Solution:

      • Remove the extend and start using the .checkbox class accordingly
      • Since we are following .xform standard for most of our forms http://platform.xwiki.org/xwiki/bin/view/DevGuide/VerticalForms I propose we add the .checkbox class to the parent dd element 
        <dl>
<dt>...</dt>
<dd class="checkbox">
  <label>
    <input type="checkbox" value="">
    Option
  </label>
</dd>
<dl>

      Attachments

        Issue Links

          is duplicated by

          Improvement - An improvement or enhancement to an existing feature or task. XWIKI-10985 "Auto refresh" option is not aligned with its check box

          • Trivial - Cosmetic problem like misspelt words or misaligned text.
          • Closed
          is related to

          Bug - A problem which impairs or prevents the functions of the product. XWIKI-11287 Radio button with Bootstrap classes don't display well when inside xform class

          • Major - Major loss of function.
          • Closed

          Improvement - An improvement or enhancement to an existing feature or task. XWIKI-10557 Small alignment issues for radio buttons and checkboxes on rights

          • Minor - Minor loss of function, or other problem where easy workaround is present.
          • Closed

          Improvement - An improvement or enhancement to an existing feature or task. XWIKI-11045 The "Configuration" options from Users are not styled corectly on ie9

          • Trivial - Cosmetic problem like misspelt words or misaligned text.
          • Closed
          relates to

          Bug - A problem which impairs or prevents the functions of the product. XWIKI-10537 Improve the display of Administration -> Import on Flamingo

          • Major - Major loss of function.
          • Closed

          Bug - A problem which impairs or prevents the functions of the product. XWIKI-10920 Document checkboxes aren't fully visible when trying to import a XAR on Flamingo

          • Major - Major loss of function.
          • Closed

          Improvement - An improvement or enhancement to an existing feature or task. XWIKI-10885 "Hidden document" is not perfectly aligned with its checkbox

          • Trivial - Cosmetic problem like misspelt words or misaligned text.
          • Closed

          Activity

            People

              evalica Ecaterina Moraru (Valica)
              evalica Ecaterina Moraru (Valica)
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved: