How do I set default alignment for horizontal controls in Bootstrap-UI 3 for CakePHP 4?

This is a particularly obscure question about the Boostrap-UI plugin for CakePHP but I'm hoping someone might be able to help.

I’m using Bootstrap-UI (https://github.com/FriendsOfCake/bootstrap-ui) version 3.0, so using Bootstrap 4.6.

I’m trying to create a form that has controls that are aligned horizontally with their labels using the example from the readme here -

enter image description here

This works fine except I can’t see how to define the default column distribution ie so that the classes for the label and the control container are something like col-4 and col-8 without any breakpoint defined.

If I try something like -

              'align' => [
                'left' => 4,
                'middle' => 8,
              ]

The classes created are col-md-4 and col-md-8 ie it seems to default to md as the breakpoint for the columns.

I know this is a bit obscure but does anyone have any idea how to do what I want?

1 answer

  • answered 2022-05-07 10:58 ndm

    AFAICT that's currently not supported, meaning you can only generate the default mb breakpoint ones, or specify breakpoints yourself.

    You can open an issue over at GitHub for a feature request. As a workaround you could extend the plugin'S form helper and overwrite FormHelper::_gridClass() to modify the generated classlist, something along the lines of this, which would remove the default breakpoint from the generated class string:

    namespace App\View\Helper;
    
    class FormHelper extends \BootstrapUI\View\Helper\FormHelper
    {
        protected function _gridClass(string $position, bool $offset = false): string
        {
            return str_replace('-md', '', parent::_gridClass($position, $offset));
        }
    }
    
    public function initialize(): void
    {
        parent::initialize();
    
        $this->initializeUI();
    
        $this->helpers['Form'] = [
            'className' => \App\View\Helper\FormHelper::class
        ];
    }
    

    See also https://book.cakephp.org/4/en/views/helpers.html#creating-helpers

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum