diff --git a/docroot/themes/custom/mass_admin_theme/templates/paragraphs/paragraph--image.html.twig b/docroot/themes/custom/mass_admin_theme/templates/paragraphs/paragraph--image.html.twig new file mode 100644 index 0000000000..ce5a7c7349 --- /dev/null +++ b/docroot/themes/custom/mass_admin_theme/templates/paragraphs/paragraph--image.html.twig @@ -0,0 +1,74 @@ +{# +/** + * @file + * Theme implementation to display an image paragraph. + * + * Available variables: + * - paragraph: Full paragraph entity. + * - id: The paragraph ID. + * - bundle: The type of the paragraph, for example, "image" or "text". + * - authorid: The user ID of the paragraph author. + * - createdtime: Formatted creation date. Preprocess functions can + * reformat it by calling format_date() with the desired parameters on + * $variables['paragraph']->getCreatedTime(). + * - content: All paragraph items. Use {{ content }} to print them all, + * or print a subset such as {{ content.field_example }}. Use + * {{ content|without('field_example') }} to temporarily suppress the printing + * of a given child element. + * - attributes: HTML attributes for the containing element. + * The attributes.class element may contain one or more of the following + * classes: + * - paragraphs: The current template type (also known as a "theming hook"). + * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an + * "Image" it would result in "paragraphs--type--image". Note that the machine + * name will often be in a short form of the human readable label. + * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a + * preview would result in: "paragraphs--view-mode--preview", and + * default: "paragraphs--view-mode--default". + * - view_mode: View mode; for example, "preview" or "full". + * - logged_in: Flag for authenticated user status. Will be true when the + * current user is a logged-in member. + * - is_admin: Flag for admin user status. Will be true when the current user + * is an administrator. + * + * @see template_preprocess_paragraph() + * + * @ingroup themeable + */ +#} +{% + set classes = [ + 'paragraph', + 'paragraph--type--' ~ paragraph.bundle|clean_class, + view_mode ? 'paragraph--view-mode--' ~ view_mode|clean_class, + not paragraph.isPublished() ? 'paragraph--unpublished' +] +%} + +{% block paragraph %} + + {% block content %} + {% include "@atoms/09-media/figure--image.twig" with { + "figure": { + "image": { + "alt": paragraph.field_image.alt, + "src": file_url(paragraph.field_image.entity.fileuri ?? '') + }, + "align": paragraph.field_image_alignment.value, + "size": paragraph.field_image_display_size.value, + "caption": paragraph.field_image_caption.value ? content.field_image_caption : null, + "wrap": paragraph.field_image_wrapping.value ? TRUE : FALSE, + "title": { + "text": paragraph.field_image_administrative_title.value + } + } + } %} + {% endblock %} + +{% endblock paragraph %}