This applies to custom search blocks.
Is there any way you could add css classes to any container type div elements.
Can you also apply a class to any "Labels Text"?
Example 1: the content type list as checkboxes are contained in a top level div with no classes(well just form-item form-item-labeled). That means I can't restyle that container unless I use jquery to add the class at runtime.
<div class="form-item form-item-labeled">
<label for="">Or Search for: </label>
<div class="form-checkboxes custom-search-selector custom-search-types"><div class="form-item form-option" id="edit-custom-search-types-c-all-wrapper">
<label class="option" for="edit-custom-search-types-c-all"><input name="custom_search_types[c-all]" id="edit-custom-search-types-c-all" value="c-all" checked="checked" class="form-checkbox custom-search-selector custom-search-types" type="checkbox"> -Any-</label> </div>
<div class="form-item form-option" id="edit-custom-search-types-c-group-wrapper">
<label class="option" for="edit-custom-search-types-c-group"><input name="custom_search_types[c-group]" id="edit-custom-search-types-c-group" value="c-group" class="form-checkbox custom-search-selector custom-search-types" type="checkbox"> Group</label> </div>
<div class="form-item form-option" id="edit-custom-search-types-c-page-wrapper">
<label class="option" for="edit-custom-search-types-c-page"><input name="custom_search_types[c-page]" id="edit-custom-search-types-c-page" value="c-page" class="form-checkbox custom-search-selector custom-search-types" type="checkbox"> Page</label> </div>
<div class="form-item form-option" id="edit-custom-search-types-c-profile-wrapper">
<label class="option" for="edit-custom-search-types-c-profile"><input name="custom_search_types[c-profile]" id="edit-custom-search-types-c-profile" value="c-profile" class="form-checkbox custom-search-selector custom-search-types" type="checkbox"> Profile</label> </div>
<div class="form-item form-option" id="edit-custom-search-types-o-user-wrapper">
<label class="option" for="edit-custom-search-types-o-user"><input name="custom_search_types[o-user]" id="edit-custom-search-types-o-user" value="o-user" class="form-checkbox custom-search-selector custom-search-types" type="checkbox"> Users</label> </div>
</div>
</div>
Example 2: the custom search block has form element that basically wraps everything in the block. Inside that form element is a div that wraps everything else. Can you apply a class to that div?
Overall, I think adding some more css hooks would make it even easier to style.
Thank you for making this module.
Comments
Comment #1
jdanthinne commentedJust commited changes to DEV version. Please review.
I've added classes around radios and checkboxes groups. Should be easier to theme.
For the example 2, I don't have access to the classes of this particular div, but I can add a class to the parent form element if you want to (it already has a class "search-form").
Comment #2
gmclelland commentedYou made the fix. Thanks! Works as intended.