status-messages.html.twig
Same filename in this branch
- 10 core/profiles/demo_umami/themes/umami/templates/components/messages/status-messages.html.twig
- 10 core/themes/stable9/templates/media-library/status-messages.html.twig
- 10 core/themes/claro/templates/misc/status-messages.html.twig
- 10 core/themes/starterkit_theme/templates/misc/status-messages.html.twig
- 10 core/modules/system/tests/themes/test_messages/templates/status-messages.html.twig
- 10 core/modules/system/templates/status-messages.html.twig
Same filename in other branches
- 9 core/profiles/demo_umami/themes/umami/templates/components/messages/status-messages.html.twig
- 9 core/themes/olivero/templates/misc/status-messages.html.twig
- 9 core/themes/stable9/templates/media-library/status-messages.html.twig
- 9 core/themes/seven/templates/classy/misc/status-messages.html.twig
- 9 core/themes/claro/templates/misc/status-messages.html.twig
- 9 core/themes/bartik/templates/status-messages.html.twig
- 9 core/themes/stable/templates/misc/status-messages.html.twig
- 9 core/themes/starterkit_theme/templates/misc/status-messages.html.twig
- 9 core/themes/classy/templates/misc/status-messages.html.twig
- 9 core/modules/system/tests/themes/test_messages/templates/status-messages.html.twig
- 9 core/modules/system/templates/status-messages.html.twig
- 8.9.x core/profiles/demo_umami/themes/umami/templates/components/messages/status-messages.html.twig
- 8.9.x core/themes/seven/templates/classy/misc/status-messages.html.twig
- 8.9.x core/themes/claro/templates/misc/status-messages.html.twig
- 8.9.x core/themes/bartik/templates/status-messages.html.twig
- 8.9.x core/themes/stable/templates/misc/status-messages.html.twig
- 8.9.x core/themes/classy/templates/misc/status-messages.html.twig
- 8.9.x core/modules/system/tests/themes/test_messages/templates/status-messages.html.twig
- 8.9.x core/modules/system/templates/status-messages.html.twig
- 11.x core/profiles/demo_umami/themes/umami/templates/components/messages/status-messages.html.twig
- 11.x core/themes/olivero/templates/misc/status-messages.html.twig
- 11.x core/themes/stable9/templates/media-library/status-messages.html.twig
- 11.x core/themes/claro/templates/misc/status-messages.html.twig
- 11.x core/themes/starterkit_theme/templates/misc/status-messages.html.twig
- 11.x core/modules/system/tests/themes/test_messages/templates/status-messages.html.twig
- 11.x core/modules/system/templates/status-messages.html.twig
Theme override for status messages.
Displays status, error, and warning messages, grouped by type.
An invisible heading identifies the messages for assistive technology. Sighted users see a colored box. See https://www.w3.org/TR/WCAG-TECHS/H69.html for info.
Add an ARIA label to the contentinfo area so that assistive technology user agents will better describe this landmark.
Available variables:
- message_list: List of messages to be displayed, grouped by type.
- status_headings: List of all status types.
- attributes: HTML attributes for the element, including:
- class: HTML classes.
6 theme calls to status-messages.html.twig
- AnnounceRenderer::render in core/
modules/ announcements_feed/ src/ AnnounceRenderer.php - Generates the announcements feed render array.
- CKEditor5::buildConfigurationForm in core/
modules/ ckeditor5/ src/ Plugin/ Editor/ CKEditor5.php - Form constructor.
- ContentTranslationHandler::entityFormSharedElements in core/
modules/ content_translation/ src/ ContentTranslationHandler.php - Process callback: determines which elements get clue in the form.
- ContentTranslationHandlerTest::providerTestEntityFormSharedElements in core/
modules/ content_translation/ tests/ src/ Kernel/ ContentTranslationHandlerTest.php - Returns test cases for ::testEntityFormSharedElements().
- LayoutBuilderEntityFormTrait::buildMessageContainer in core/
modules/ layout_builder/ src/ Form/ LayoutBuilderEntityFormTrait.php - Build the message container.
File
-
core/
themes/ olivero/ templates/ misc/ status-messages.html.twig
View source
- {#
- /**
- * @file
- * Theme override for status messages.
- *
- * Displays status, error, and warning messages, grouped by type.
- *
- * An invisible heading identifies the messages for assistive technology.
- * Sighted users see a colored box. See
- * https://www.w3.org/TR/WCAG-TECHS/H69.html for info.
- *
- * Add an ARIA label to the contentinfo area so that assistive technology
- * user agents will better describe this landmark.
- *
- * Available variables:
- * - message_list: List of messages to be displayed, grouped by type.
- * - status_headings: List of all status types.
- * - attributes: HTML attributes for the element, including:
- * - class: HTML classes.
- */
- #}
- {{ attach_library('olivero/messages') }}
-
- <div data-drupal-messages class="messages-list">
- <div class="messages__wrapper layout-container">
- {% for type, messages in message_list %}
- {%
- set classes = [
- 'messages-list__item',
- 'messages',
- 'messages--' ~ type,
- ]
- %}
-
- <div{{ attributes
- .addClass(classes)
- .setAttribute('data-drupal-selector', 'messages')
- .setAttribute('role', 'contentinfo')
- .setAttribute('aria-label', status_headings[type])
- }}>
- <div class="messages__container" data-drupal-selector="messages-container"{% if type == 'error' %} role="alert"{% endif %}>
- {% if status_headings[type] %}
- <div class="messages__header">
- <h2 class="visually-hidden">{{ status_headings[type] }}</h2>
- <div class="messages__icon">
- {% if type == 'error' %}
- {% include "@olivero/../images/error.svg" %}
- {% elseif type == 'warning' %}
- {% include "@olivero/../images/warning.svg" %}
- {% elseif type == 'status' %}
- {% include "@olivero/../images/status.svg" %}
- {% elseif type == 'info' %}
- {% include "@olivero/../images/info.svg" %}
- {% endif %}
- </div>
- </div>
- {% endif %}
- <div class="messages__content">
- {% if messages|length > 1 %}
- <ul class="messages__list">
- {% for message in messages %}
- <li class="messages__item">{{ message }}</li>
- {% endfor %}
- </ul>
- {% else %}
- {{ messages|first }}
- {% endif %}
- </div>
- </div>
- </div>
- {# Remove type specific classes. #}
- {% set attributes = attributes.removeClass(classes) %}
- {% endfor %}
- </div>
- </div>
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.