How to style the widget

[micter59]

Hello,

I'm starting to use your bundle to deal with telephone number in my app. Until now, it's getting pretty well. Thanks, because you're library saves me a lot of time and efforts !

I'm introducing international number in my forms, so I use the PhoneNumberType::WIDGET_COUNTRY_CHOICE like this :

->add('telephone', PhoneNumberType::class, [
    'widget' => PhoneNumberType::WIDGET_COUNTRY_CHOICE,
    'country_choices' => ['FR', 'BE', 'GB'],
    'default_region' => 'FR',
    'label' => 'Téléphone',
    'required' => false
])

Functionnaly, it's ok. Number are well saved in database. But I'm wondering how to style the 2 parts of the widget separately. In fact, I'm essentially willing to make the country part (the select with FR, BE, GB) not so large, to give more space to the number it-self.

Thanks for your help.

Michaël

[micter59]

I've found the way to deal with the 2 fields separately. I let here the solution I use to embed it in a bootstrap 5 form (twig & symfony form) :

        <div class="mb-3 row align-items-center">
            {{ form_label(form.telephone) }}
            <div class="col-2">
                {{ form_widget(form.telephone.country) }}
            </div>
            <div class="col">
                {{ form_widget(form.telephone.number) }}
            </div>
        </div>

        <div class="mb-3 row align-items-center">
            {{ form_label(form.telportable) }}
            <div class="col-2">
                {{ form_widget(form.telportable.country) }}
            </div>
            <div class="col">
                {{ form_widget(form.telportable.number) }}
            </div>
        </div>