You are here

details.html.twig in Drupal 10

Theme override for a details element.

Available variables

  • attributes: A list of HTML attributes for the details element.
  • errors: (optional) Any errors for this details element, may not be set.
  • title: (optional) The title of the element, may not be set.
  • summary_attributes: A list of HTML attributes for the summary element.
  • description: (optional) The description of the element, may not be set.
  • children: (optional) The children of the element, may not be set.
  • value: (optional) The value of the element, may not be set.

File

core/themes/seven/templates/details.html.twig
View source
  1. {#
  2. /**
  3. * @file
  4. * Theme override for a details element.
  5. *
  6. * Available variables
  7. * - attributes: A list of HTML attributes for the details element.
  8. * - errors: (optional) Any errors for this details element, may not be set.
  9. * - title: (optional) The title of the element, may not be set.
  10. * - summary_attributes: A list of HTML attributes for the summary element.
  11. * - description: (optional) The description of the element, may not be set.
  12. * - children: (optional) The children of the element, may not be set.
  13. * - value: (optional) The value of the element, may not be set.
  14. *
  15. * @see template_preprocess_details()
  16. */
  17. #}
  18. {#
  19. Prefix 'details' class to avoid collision with Modernizr.
  20. @todo Remove prefix after https://www.drupal.org/node/2981732 has been solved.
  21. #}
  22. <details{{ attributes.addClass('seven-details') }}>
  23. {%- if title -%}
  24. {%
  25. set summary_classes = [
  26. 'seven-details__summary',
  27. required ? 'js-form-required',
  28. required ? 'form-required',
  29. ]
  30. %}
  31. <summary{{ summary_attributes.addClass(summary_classes) }}>
  32. <span>{{ title }}</span>
  33. </summary>
  34. {%- endif -%}
  35. <div class="seven-details__wrapper details-wrapper">
  36. {% if errors %}
  37. <div class="form-item form-item--error-message">
  38. <strong>{{ errors }}</strong>
  39. </div>
  40. {% endif %}
  41. {%- if description -%}
  42. <div class="seven-details__description">{{ description }}</div>
  43. {%- endif -%}
  44. {%- if children -%}
  45. {{ children }}
  46. {%- endif -%}
  47. {%- if value -%}
  48. {{ value }}
  49. {%- endif -%}
  50. </div>
  51. </details>