Problem/Motivation
The Drupal field template is quite verbose and can be hard to read. We start off checking for the label, then put in a conditional for if there are more than 1 field item (whether it's a multivalue field or not), then output certain divs depending on if the field has multiple values, then give an else version if not, and back to checking again about that label ... it gets tiresome.
Steps to reproduce
Open field.html.twig and see for yourself
Proposed resolution
Wouldn't it be great if we could simplify this to:
Be easier to read
- Out the same markup, whether there is one item in my field or multiple (so we don't have different CSS/JS depending on how many values we output)
- Have a conditional for styling differently if there is multiple (but this place as a modifier on the .field class, not as an additional .field__items class
Remaining tasks
Rewrite the field.html.twig template
User interface changes
None
API changes
None - my patch is against the starterkit_theme, but I'd like if we could (in D10) have this approach in our other themes too.
Data model changes
None
Release notes snippet
We have simplified the field.html.twig template. The only breaking change here is that we have a .field__items class wrapping the .field__item in all cases now, whether the field outputs multiple items or not. This is to make sure you can write the same CSS for single and multiple items. If you need to style something differently because it has multiple items, there is a .field--has-multiple-items modifier class at the .field level
This is based on a blog post I wrote called Simplified Drupal Field Template (but the same markup rendered)