Some DataTables markup issues

[sergeyklay]

Please see at screenshot

• Apply button - doesn't resemble a button, at least initially
• Search field is broken
• Field for Show xxx entries must be longer
• Archive label background merges with <tr> background

In Mozilla Firefox 26.0 this page looks like as on screenshot

[sergeyklay]

P.S. Search input field have control-label class

[sandeepone]

Will fix these things. Should i remove the control-label or add control-label class.

[sandeepone]

I think it should be form-control am i right?? I forgot BS now.. my head is pumping :)

[sergeyklay]

Yep, form-control :)

[sergeyklay]

For search input field:
need replace
class="control-label col-xs-4 col-md-3 col-sm-3"
to
class="form-control input-sm"

With these changes:

[sergeyklay]

For example I tried a slightly different markup and received what you see in the second screenshot:

Current markup:

Tested markup:

[sergeyklay]

Mobile viewport issue

[sergeyklay]

This code is not perfect, but it demonstrates that the markup can be more responsive:

<fieldset class="bulk-actions form-actions rounded">
    <div class="row">
        <div class="form-group col-xs-8 col-sm-3 col-md-2">
            <div class="control-group">
                <?php echo Form::select('...', array(), '', array('class' => 'form-control input-sm')); ?>
            </div>
        </div>
        <div class="form-group col-xs-4 col-sm-2 col-md-2">
            <?php echo Form::submit('...', __('Apply'), array('class'=>'btn btn-primary btn-sm')); ?>
        </div>
        <div class="form-group col-xs-6 col-sm-7 col-md-8 form-actions-right">
            <?php echo HTML::anchor('...', '<i class="fa fa-plus fa-white"></i> '.__('Compose'), array('class'=>'btn btn-success btn-sm')); ?>
        </div>
    </div>
</fieldset>

320x480

768x1024

1280x600

P.S. I used in example .form-actions-right class:

.form-actions-right {
    text-align: right;
}

@media only screen and (max-width: 767px) {
    .form-actions-right {
        text-align: left;
    }
}

Current view:

[sergeyklay]

P.S. Why Bulk Options? Mb Bulk Actions ?

[sergeyklay]

I would also like note that we have some issue with tabs in mobile viewport. See twbs/bootstrap#11954

[sandeepone]

Any update on this issue. Any PR on apply button??

[sergeyklay]

Not ready yet

[sergeyklay]

What about buttons dropdown button here?
http://getbootstrap.com/components/#btn-dropdowns-single

[sergeyklay]

Must be closed

[sergeyklay]

done