SelectBooleanCheckbox: Wrong style with Barcelona

Post Reply
Posts: 202
Joined: 24 May 2011, 09:42

11 Jan 2018, 16:39

Using this sample with Barcelona

Code: Select all

<div class="card card-w-title">
    <p:selectBooleanCheckbox value="1" itemLabel="Xbox One" />
    <br />
    <p:selectBooleanCheckbox value="3" itemLabel="PS+" />
    <br />
    <p:selectBooleanCheckbox value="2" itemLabel="Wii U"/>
Results into this:

You set a width and height to the wrong place. See _forms.scss:

Code: Select all

.ui-chkbox {
        display: inline-block;
        vertical-align: middle;
        width: $iconWidth - 2px;
        height: $iconHeight - 2px;
        cursor: default;
        margin: 0 4px 0 0;
On PF showcase, it shows these are set on .ui-chkbox .ui-chkbox-box. Although, once this fix is done, try to select/unselect checkbox you'll see a gap showing up.

@aragorn@woof Could you fix this one please?

Post Reply
  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest