Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #2980304 by dww, jrockowitz, Rithesh BK, Kristen Pol, andrewmacpherson, dorianwinterfeld, bnjmnm: Seven theme's details/summary focus style is broken/missing in some browsers

merge-requests/2419/head
Lauri Eskola 2020-05-04 17:38:59 +03:00
parent 2718a80a6b
commit 4569c101d2
No known key found for this signature in database
GPG Key ID: 37E6EF00B7EEF188
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
core/themes/seven/css/base/elements.css
View File

@ -164,6 +164,16 @@ details summary:focus {
text-decoration: underline; text-decoration: underline;
outline: none; outline: none;
} }
/**
* Unfortunately, text-decoration for details summary is not supported on all
* browsers. So we add a span (which can handle text-decoration) in Seven's
* templates/details.html.twig. In case there are other details templates that
* don't have the span, we leave the text-decoration in the parent selector.
* This provides maximum compatibility and coverage with minimal disruption.
*/
details summary:focus span {
text-decoration: underline;
}
img { img {
max-width: 100%; max-width: 100%;
height: auto; height: auto;

2
core/themes/seven/templates/details.html.twig
View File

@ -30,7 +30,7 @@
] ]
%} %}
<summary{{ summary_attributes.addClass(summary_classes) }}> <summary{{ summary_attributes.addClass(summary_classes) }}>
{{- title -}} <span>{{ title }}</span>
</summary> </summary>
{%- endif -%} {%- endif -%}
<div class="seven-details__wrapper details-wrapper"> <div class="seven-details__wrapper details-wrapper">