Styling forms
Drupal uses a set of nested templates to render a form, starting from the template of the single input element (such as textfield or button) up to a form element that wraps together the input element and its label. Every form element is then managed by a template for the specific form ID, and finally, by a template that wraps everything by adding the <form> HTML tag.
Styling generic forms
To style a form we need to overwrite and customize some templates:
- First, we need to provide a custom template for all the render elements used in the form, and their labels:
{{ include('@atoms/input.html.twig', {attributes: attributes,
children: children,
}) }}
This is the template that Drupal will use for every form input; put this code in the templates/form/input.html file of the alps_trips theme.
- Submit buttons are different from other input elements, and must use a different template:
{{ include('@atoms/button...