1{# 2/** 3 * @file 4 * Theme override for comments. 5 * 6 * Available variables: 7 * - author: Comment author. Can be a link or plain text. 8 * - content: The content-related items for the comment display. Use 9 * {{ content }} to print them all, or print a subset such as 10 * {{ content.field_example }}. Use the following code to temporarily suppress 11 * the printing of a given child element: 12 * @code 13 * {{ content|without('field_example') }} 14 * @endcode 15 * - created: Formatted date and time for when the comment was created. 16 * Preprocess functions can reformat it by calling DateFormatter::format() 17 * with the desired parameters on the 'comment.created' variable. 18 * - changed: Formatted date and time for when the comment was last changed. 19 * Preprocess functions can reformat it by calling DateFormatter::format() 20 * with the desired parameters on the 'comment.changed' variable. 21 * - permalink: Comment permalink. 22 * - submitted: Submission information created from author and created 23 * during template_preprocess_comment(). 24 * - user_picture: The comment author's profile picture. 25 * - status: Comment status. Possible values are: 26 * unpublished, published, or preview. 27 * - title: Comment title, linked to the comment. 28 * - attributes: HTML attributes for the containing element. 29 * The attributes.class may contain one or more of the following classes: 30 * - comment: The current template type; e.g., 'theming hook'. 31 * - by-anonymous: Comment by an unregistered user. 32 * - by-{entity-type}-author: Comment by the author of the parent entity, 33 * eg. by-node-author. 34 * - preview: When previewing a new or edited comment. 35 * The following applies only to viewers who are registered users: 36 * - unpublished: An unpublished comment visible only to administrators. 37 * - title_prefix: Additional output populated by modules, intended to be 38 * displayed in front of the main title tag that appears in the template. 39 * - title_suffix: Additional output populated by modules, intended to be 40 * displayed after the main title tag that appears in the template. 41 * - content_attributes: List of classes for the styling of the comment content. 42 * - title_attributes: Same as attributes, except applied to the main title 43 * tag that appears in the template. 44 * - threaded: A flag indicating whether the comments are threaded or not. 45 * 46 * These variables are provided to give context about the parent comment (if 47 * any): 48 * - parent_comment: Full parent comment entity (if any). 49 * - parent_author: Equivalent to author for the parent comment. 50 * - parent_created: Equivalent to created for the parent comment. 51 * - parent_changed: Equivalent to changed for the parent comment. 52 * - parent_title: Equivalent to title for the parent comment. 53 * - parent_permalink: Equivalent to permalink for the parent comment. 54 * - parent: A text string of parent comment submission information created from 55 * 'parent_author' and 'parent_created' during template_preprocess_comment(). 56 * This information is presented to help screen readers follow lengthy 57 * discussion threads. You can hide this from sighted users using the class 58 * visually-hidden. 59 * 60 * These two variables are provided for context: 61 * - comment: Full comment object. 62 * - entity: Entity the comments are attached to. 63 * 64 * @see template_preprocess_comment() 65 */ 66#} 67{% if threaded %} 68 {{ attach_library('claro/classy.indented') }} 69{% endif %} 70{% 71 set classes = [ 72 'comment', 73 'js-comment', 74 status != 'published' ? status, 75 comment.owner.anonymous ? 'by-anonymous', 76 author_id and author_id == commented_entity.getOwnerId() ? 'by-' ~ commented_entity.getEntityTypeId() ~ '-author', 77 ] 78%} 79<article{{ attributes.addClass(classes) }}> 80 {# 81 Hide the "new" indicator by default, let a piece of JavaScript ask the 82 server which comments are new for the user. Rendering the final "new" 83 indicator here would break the render cache. 84 #} 85 <mark class="hidden" data-comment-timestamp="{{ new_indicator_timestamp }}"></mark> 86 87 <footer class="comment__meta"> 88 {{ user_picture }} 89 <p class="comment__submitted">{{ submitted }}</p> 90 91 {# 92 Indicate the semantic relationship between parent and child comments for 93 accessibility. The list is difficult to navigate in a screen reader 94 without this information. 95 #} 96 {% if parent %} 97 <p class="parent visually-hidden">{{ parent }}</p> 98 {% endif %} 99 100 {{ permalink }} 101 </footer> 102 103 <div{{ content_attributes.addClass('content') }}> 104 {% if title %} 105 {{ title_prefix }} 106 <h3{{ title_attributes }}>{{ title }}</h3> 107 {{ title_suffix }} 108 {% endif %} 109 {{ content }} 110 </div> 111</article> 112