details.html.twig

Same filename in this branch
  1. 10 core/profiles/demo_umami/themes/umami/templates/classy/form/details.html.twig
  2. 10 core/themes/olivero/templates/form/details.html.twig
  3. 10 core/themes/stable9/templates/form/details.html.twig
  4. 10 core/themes/starterkit_theme/templates/form/details.html.twig
  5. 10 core/modules/system/templates/details.html.twig
Same filename in other branches
  1. 9 core/profiles/demo_umami/themes/umami/templates/classy/form/details.html.twig
  2. 9 core/themes/olivero/templates/form/details.html.twig
  3. 9 core/themes/stable9/templates/form/details.html.twig
  4. 9 core/themes/seven/templates/details.html.twig
  5. 9 core/themes/claro/templates/details.html.twig
  6. 9 core/themes/bartik/templates/classy/form/details.html.twig
  7. 9 core/themes/stable/templates/form/details.html.twig
  8. 9 core/themes/starterkit_theme/templates/form/details.html.twig
  9. 9 core/themes/classy/templates/form/details.html.twig
  10. 9 core/modules/system/templates/details.html.twig
  11. 8.9.x core/profiles/demo_umami/themes/umami/templates/classy/form/details.html.twig
  12. 8.9.x core/themes/seven/templates/details.html.twig
  13. 8.9.x core/themes/claro/templates/details.html.twig
  14. 8.9.x core/themes/bartik/templates/classy/form/details.html.twig
  15. 8.9.x core/themes/stable/templates/form/details.html.twig
  16. 8.9.x core/themes/classy/templates/form/details.html.twig
  17. 8.9.x core/modules/system/templates/details.html.twig
  18. 11.x core/profiles/demo_umami/themes/umami/templates/classy/form/details.html.twig
  19. 11.x core/themes/olivero/templates/form/details.html.twig
  20. 11.x core/themes/stable9/templates/form/details.html.twig
  21. 11.x core/themes/claro/templates/details.html.twig
  22. 11.x core/themes/starterkit_theme/templates/form/details.html.twig
  23. 11.x core/modules/system/templates/details.html.twig

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.
  • 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.
  • accordion: whether the details element should look as an accordion.
  • accordion_item: whether the details element is an item of an accordion list.
  • disabled: whether the details is disabled.

See also

template_preprocess_details()

claro_preprocess_details()

File

core/themes/claro/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. * - description: (optional) The description of the element, may not be set.
  11. * - children: (optional) The children of the element, may not be set.
  12. * - value: (optional) The value of the element, may not be set.
  13. * - accordion: whether the details element should look as an accordion.
  14. * - accordion_item: whether the details element is an item of an accordion
  15. * list.
  16. * - disabled: whether the details is disabled.
  17. *
  18. * @see template_preprocess_details()
  19. * @see claro_preprocess_details()
  20. */
  21. #}
  22. {%
  23. set classes = [
  24. 'claro-details',
  25. accordion ? 'claro-details--accordion',
  26. accordion_item ? 'claro-details--accordion-item',
  27. element['#module_package_listing'] ? 'claro-details--package-listing',
  28. ]
  29. %}
  30. {%
  31. set content_wrapper_classes = [
  32. 'claro-details__wrapper',
  33. 'details-wrapper',
  34. accordion ? 'claro-details__wrapper--accordion',
  35. accordion_item ? 'claro-details__wrapper--accordion-item',
  36. element['#module_package_listing'] ? 'claro-details__wrapper--package-listing',
  37. ]
  38. %}
  39. {%
  40. set inner_wrapper_classes = [
  41. 'claro-details__content',
  42. accordion ? 'claro-details__content--accordion',
  43. accordion_item ? 'claro-details__content--accordion-item',
  44. element['#module_package_listing'] ? 'claro-details__content--package-listing',
  45. ]
  46. %}
  47. <details{{ attributes.addClass(classes) }}>
  48. {%- if title -%}
  49. {%
  50. set summary_classes = [
  51. 'claro-details__summary',
  52. required ? 'js-form-required',
  53. required ? 'form-required',
  54. accordion ? 'claro-details__summary--accordion',
  55. accordion_item ? 'claro-details__summary--accordion-item',
  56. element['#module_package_listing'] ? 'claro-details__summary--package-listing',
  57. ]
  58. %}
  59. <summary{{ summary_attributes.addClass(summary_classes) }}>
  60. {{- title -}}
  61. {%- if required -%}
  62. <span class="required-mark"></span>
  63. {%- endif -%}
  64. </summary>
  65. {%- endif -%}
  66. <div{{ content_attributes.addClass(content_wrapper_classes) }}>
  67. {% if accordion or accordion_item %}
  68. <div{{ create_attribute({class: inner_wrapper_classes}) }}>
  69. {% endif %}
  70. {% if errors %}
  71. <div class="form-item form-item__error-message">
  72. {{ errors }}
  73. </div>
  74. {% endif %}
  75. {%- if description -%}
  76. <div class="claro-details__description{{ disabled ? ' is-disabled' }}">{{ description }}</div>
  77. {%- endif -%}
  78. {%- if children -%}
  79. {{ children }}
  80. {%- endif -%}
  81. {%- if value -%}
  82. {{ value }}
  83. {%- endif -%}
  84. {% if accordion or accordion_item %}
  85. </div>
  86. {% endif %}
  87. </div>
  88. </details>

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.