I would like the BEF checkboxes to be laid out vertically in some cases and horizontally in others. I found a discussion where the following css does lay out the checkboxes inline (horizontally)

.bef-checkboxes .form-item {
float: left;
}

But the impact is site-wide. Does anyone know of a way to style a BEF filter on a specific view? In some cases the filter might be in a block, and in others not. I think there are ways to style specific blocks and that might be a solution for some instances. But particularly for horizontal filters a block may not be the best host.

It would be ideal if BEF included a layout setting (H or V) which would impact just the specific view/filter. It is a very useful module, thank you.

CommentFileSizeAuthor
#5 better_exposed_filters-horizontal_checkboxes-3102468-5.patch3.17 KBmortona2k
#3 better_exposed_filters-horizontal_checkboxes-3102468-3.patch2.57 KBmortona2k
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

pengi created an issue. See original summary.

mortona2k’s picture

mortona2k CreditAttribution: mortona2k commented
Version: 7.x-3.x-dev » 8.x-4.x-dev

I'm bumping this to 4.x. I think we can add an option to the plugin to set checkboxes to be inline.

The bef css has:

.bef-exposed-form .form--inline .form-item {
  float: none;
}
.bef-exposed-form .form--inline > .form-item {
  float: left; /* LRT */
}
.bef-exposed-form .form--inline .bef--secondary {
  clear: left;
}

This makes it so not all .form-item(s) inside .form--inline are inline, only ones directly inside the form. I'm not sure if this is the best approach to set this option, but we can add .form--inline to the checkboxes wrapper.

mortona2k’s picture

mortona2k CreditAttribution: mortona2k commented
FileSize
better_exposed_filters-horizontal_checkboxes-3102468-3.patch2.57 KB
Etroid’s picture

Etroid CreditAttribution: Etroid commented

@mortona2k thanks for the issue and patch. Can we also apply this to radio buttons?

mortona2k’s picture

mortona2k CreditAttribution: mortona2k commented
FileSize
better_exposed_filters-horizontal_checkboxes-3102468-5.patch3.17 KB

This patch extends to radios.

Etroid’s picture

Etroid CreditAttribution: Etroid commented

@mortona2k, looks good to me. Going to commit to 8.x-4.x-dev branch

  • 597644b committed on 8.x-4.x 
    Issue #2829212 by mortona2k: Option to lay out checkboxes horizontally
Etroid’s picture

Etroid CreditAttribution: Etroid commented
Status: Active » Fixed

Status: Fixed » Closed (fixed)

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

Neeraj420’s picture

Neeraj420 CreditAttribution: Neeraj420 as a volunteer commented

Can we have this for 7.x version also please.