diff --git a/core/includes/form.inc b/core/includes/form.inc
index 9c72685..6168b54 100644
--- a/core/includes/form.inc
+++ b/core/includes/form.inc
@@ -242,9 +242,22 @@ function template_preprocess_details(&$variables) {
$variables['summary_attributes']['aria-pressed'] = $variables['summary_attributes']['aria-expanded'];
}
$variables['title'] = (!empty($element['#title'])) ? $element['#title'] : '';
- $variables['description'] = (!empty($element['#description'])) ? $element['#description'] : '';
$variables['children'] = (isset($element['#children'])) ? $element['#children'] : '';
$variables['value'] = (isset($element['#value'])) ? $element['#value'] : '';
+
+ $variables['description'] = NULL;
+ if (!empty($element['#description'])) {
+ $variables['description_display'] = isset($element['#description_display']) ? $element['#description_display'] : 'before';
+ $description_attributes = [];
+ if ($variables['description_display'] === 'invisible') {
+ $description_attributes['class'][] = 'visually-hidden';
+ }
+ if (!empty($element['#id'])) {
+ $description_attributes['id'] = $element['#id'] . '--description';
+ }
+ $variables['description']['attributes'] = new Attribute($description_attributes);
+ $variables['description']['content'] = $element['#description'];
+ }
}
/**
diff --git a/core/lib/Drupal/Core/Form/FormBuilder.php b/core/lib/Drupal/Core/Form/FormBuilder.php
index b67a37b..8881edd 100644
--- a/core/lib/Drupal/Core/Form/FormBuilder.php
+++ b/core/lib/Drupal/Core/Form/FormBuilder.php
@@ -683,11 +683,12 @@ public function doBuildForm($form_id, &$element, FormStateInterface &$form_state
$element['#defaults_loaded'] = TRUE;
}
// Assign basic defaults common for all form elements.
+ // NOTE: description_display is below by default, excepted for details.
$element += array(
'#required' => FALSE,
'#attributes' => array(),
'#title_display' => 'before',
- '#description_display' => 'after',
+ '#description_display' => (isset($element['#type']) && $element['#type'] == 'details') ? 'before' : 'after',
'#errors' => NULL,
);
diff --git a/core/modules/system/templates/details.html.twig b/core/modules/system/templates/details.html.twig
index 42dd4c2..7d9e749 100644
--- a/core/modules/system/templates/details.html.twig
+++ b/core/modules/system/templates/details.html.twig
@@ -7,6 +7,12 @@
* - attributes: A list of HTML attributes for the details element.
* - title: (optional) The title of the element, may not be set.
* - description: (optional) The description of the element, may not be set.
+ * - description_display: (optional) Description display setting. It can have these values:
+ * - before: The description is output before the element. This is the default
+ * value.
+ * - after: The description is output after the element.
+ * - invisible: The description is output after the element, hidden visually
+ * but available to screen readers.
* - children: (optional) The children of the element, may not be set.
* - value: (optional) The value of the element, may not be set.
*
@@ -19,15 +25,22 @@
{%- if title -%}