field.html.twig 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. {#
  2. /**
  3. * @file
  4. * Theme override for a field.
  5. *
  6. * To override output, copy the "field.html.twig" from the templates directory
  7. * to your theme's directory and customize it, just like customizing other
  8. * Drupal templates such as page.html.twig or node.html.twig.
  9. *
  10. * Instead of overriding the theming for all fields, you can also just override
  11. * theming for a subset of fields using
  12. * @link themeable Theme hook suggestions. @endlink For example,
  13. * here are some theme hook suggestions that can be used for a field_foo field
  14. * on an article node type:
  15. * - field--node--field-foo--article.html.twig
  16. * - field--node--field-foo.html.twig
  17. * - field--node--article.html.twig
  18. * - field--field-foo.html.twig
  19. * - field--text-with-summary.html.twig
  20. * - field.html.twig
  21. *
  22. * Available variables:
  23. * - attributes: HTML attributes for the containing element.
  24. * - label_hidden: Whether to show the field label or not.
  25. * - title_attributes: HTML attributes for the title.
  26. * - label: The label for the field.
  27. * - multiple: TRUE if a field can contain multiple items.
  28. * - items: List of all the field items. Each item contains:
  29. * - attributes: List of HTML attributes for each item.
  30. * - content: The field item's content.
  31. * - entity_type: The entity type to which the field belongs.
  32. * - field_name: The name of the field.
  33. * - field_type: The type of the field.
  34. * - label_display: The display settings for the label.
  35. *
  36. *
  37. * @see template_preprocess_field()
  38. */
  39. #}
  40. {%
  41. set classes = [
  42. 'field',
  43. 'field--name-' ~ field_name|clean_class,
  44. 'field--type-' ~ field_type|clean_class,
  45. 'field--label-' ~ label_display,
  46. label_display == 'inline' ? 'clearfix',
  47. ]
  48. %}
  49. {%
  50. set title_classes = [
  51. 'field__label',
  52. label_display == 'visually_hidden' ? 'visually-hidden',
  53. ]
  54. %}
  55. {%
  56. set ouid_classes = [
  57. 'first_part_home',
  58. ]
  59. %}
  60. {# {%
  61. set id_titre = [
  62. 'id-' ~ paragraph|clean_id,
  63. 'block-' ~ plugin_id|clean_class,
  64. key.value,
  65. 'id-' ~ counter,
  66. ]
  67. %} #}
  68. {%
  69. set id_hook = [
  70. 'hook-id-' ~ paragraph.id()|clean_id,
  71. 'paragraph-id--' ~ paragraph.id()|clean_id,
  72. ]
  73. %}
  74. {% if label_hidden %}
  75. {% if multiple %}
  76. <div{{ attributes.addClass(classes, 'field__items') }}>
  77. {% for item in items %}
  78. <div{{ item.attributes.addClass('field__item') }}>{{ item.content }}</div>
  79. {% endfor %}
  80. </div>
  81. {% else %}
  82. {% for item in items %}
  83. {# {% for i in 0..10 %} #}
  84. {# <span> {{index}}</span> #}
  85. {# <span id="{{item[key].value }}"></span> #}
  86. {# <span>{{counter}}</span> #}
  87. {# <div {{ attributes.addClass(classes, 'field__item') }}>{{ item.content }}</div> #}
  88. <div {{ attributes.addClass(classes, 'field__item').setAttribute('id', id_hook) }}>{{ item.content }}</div>
  89. {# {% endfor %} #}
  90. {% endfor %}
  91. {% endif %}
  92. {% else %}
  93. <div{{ attributes.addClass(classes) }}>
  94. <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
  95. {% if multiple %}
  96. <div class="field__items">
  97. {% endif %}
  98. {% for item in items %}
  99. <div{{ item.attributes.addClass('field__item') }}>{{ item.content }}</div>
  100. {% endfor %}
  101. {% if multiple %}
  102. </div>
  103. {% endif %}
  104. </div>
  105. {% endif %}
  106. {# {% for key, item in items %}
  107. <span id="{{element['#items'][key].value|replace({' ':''}) }}"></span>
  108. <div{{ item.attributes }}>{{ item.content }}</div> #}