Dropdown

This component is visually extended from the Tactics dropdown component. Its particularity is that it is deported outside the DOM of its triggering parent.

Deposit

TWIG component : Betclic/_common/_twig/_components/_forms/_input_fields.twig
CSS components : Betclic/_tactics/_common/_css/_components/_form/_fields.scss
Betclic/_tactics/_common/_css/_components/_form/_informations.scss
Betclic/_tactics/_common/_css/_components/_form/_inputs.scss
Betclic/_tactics/_common/_css/_components/_form/_labels.scss
Betclic/_tactics/_common/_css/_components/_form/_validation.scss
Betclic/_tactics/_common/_css/_components/_form/_sizes.scss
Betclic/_tactics/_common/_css/_components/_form/_dropdown.scss
JS : Betclic/_common/_js/_forms.js

The dropdown menu is moved at the end of the DOM, outside the parent container. To allow them to go over all the content. The positioning of the menu is entirely dynamic, it is placed above, below, to the left or even to the right of its trigger depending on its place in the window.

Default

In input field

Card number

Readonly

Card number

Disabled

Card number