diff --git a/templates/blocks/block--entity-browser-block--uw-ebr-image.html.twig b/templates/blocks/block--entity-browser-block--uw-ebr-image.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..bf0ad418b677c89c3fc90da207571b1badbedf80 --- /dev/null +++ b/templates/blocks/block--entity-browser-block--uw-ebr-image.html.twig @@ -0,0 +1,22 @@ +{# +/** + * @file + * Theme override to display a region. + * + * Available variables: + * - content: The content for this region, typically blocks. + * + * @see template_preprocess_block() + */ +#} +{% set class = "uw-resp-image" %} + +{% embed '@layouts/block/_block.twig' with { + 'class': class +}%} + + {% block content %} + {{ content }} + {% endblock %} + +{% endembed %} diff --git a/templates/content/media.html.twig b/templates/content/media.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..4934a7b51e5d77d7dd6639832761f05e7ddaf738 --- /dev/null +++ b/templates/content/media.html.twig @@ -0,0 +1,32 @@ +{# +/** + * @file + * Theme override to display a media item. + * + * Available variables: + * - name: Name of the media. + * - content: Media content. + * + * @see template_preprocess_media() + * + * @ingroup themeable + */ +#} +{% + set classes = [ + 'media', + 'media--type-' ~ media.bundle()|clean_class, + not media.isPublished() ? 'media--unpublished', + view_mode ? 'media--view-mode-' ~ view_mode|clean_class, +] +%} + +{% embed '@layouts/media/media.twig' with { + 'classes': classes +}%} + + {% block content %} + {{ content }} + {% endblock %} + +{% endembed %} diff --git a/templates/fields/field.html.twig b/templates/fields/field.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..6fc0237c6a34de70fd674679cdd4f3a86e7a768d --- /dev/null +++ b/templates/fields/field.html.twig @@ -0,0 +1,38 @@ +{# +/** + * @file + * Theme override for a field. + */ +#} +{% + set classes = [ + 'uw-field', + 'uw-field--name-' ~ field_name|clean_class, + 'uw-field--type-' ~ field_type|clean_class, + 'uw-field--label-' ~ label_display, +] +%} +{% + set title_classes = [ + 'uw-field__label', + label_display == 'visually_hidden' ? 'visually-hidden', +] +%} +{% if display_field_tag %} + <{{ field_tag|default('div') }}{{ attributes.addClass(classes, 'uw-field__items') }}> +{% endif %} + {% if not label_hidden and display_label_tag %} + <{{ label_tag|default('div') }}{{ title_attributes.addClass(title_classes) }}>{{ label }}</{{ label_tag|default('div') }}> + {% endif %} + {% for item in items %} + {% if display_item_tag %} + <{{ field_item_tag|default('div') }}{{ item.attributes.addClass('uw-field__item') }}> + {% endif %} + {{ item.content }} + {% if display_item_tag %} + </{{ field_item_tag|default('div') }}> + {% endif %} + {% endfor %} +{% if display_field_tag %} + </{{ field_tag|default('div') }}> +{% endif %} diff --git a/templates/fields/responsive-image.html.twig b/templates/fields/responsive-image.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..6aa2ac7d1f589dc8ec3797231c03c4d3e5865cef --- /dev/null +++ b/templates/fields/responsive-image.html.twig @@ -0,0 +1,20 @@ +{# +/** + * @file + * Theme override of a responsive image. + * + * Available variables: + * - sources: The attributes of the <source> tags for this <picture> tag. + * - img_element: The controlling image, with the fallback image in srcset. + * - output_image_tag: Whether or not to output an <img> tag instead of a + * <picture> tag. + * + * @see template_preprocess() + * @see template_preprocess_responsive_image() + */ +#} +{% include "@components/responsive-image/responsive-image.twig" with { + "sources": sources, + "img_element": img_element['#uri'], + "alt": img_element['#alt'] +} %} diff --git a/uw_fdsu_theme_resp.theme b/uw_fdsu_theme_resp.theme index 317e9cd0fdd14e506709e9e9f0abe652842289c5..8d237c7989900d4c6d828f1aa85b789bfbfc0a85 100644 --- a/uw_fdsu_theme_resp.theme +++ b/uw_fdsu_theme_resp.theme @@ -22,6 +22,26 @@ function uw_fdsu_theme_resp_preprocess_html(&$variables) { $variables['attributes']['class'][] = theme_get_setting('wcms_colour_scheme', 'uw_fdsu_theme_resp') ? theme_get_setting('wcms_colour_scheme', 'uw_fdsu_theme_resp') : 'default'; } +/** + * Implements hook_preprocess_responsive_image(). + */ +function uw_fdsu_theme_resp_preprocess_responsive_image(&$variables) { + + // Step through each of the responsive image objects and get out source info. + foreach ($variables['sources'] as $source) { + + // Set the a variable with the actual source info that we need. + $new_sources[] = array( + 'srcset' => $source['srcset']->value(), + 'media' => $source['media']->value(), + 'type' => $source['type']->value(), + ); + } + + // Set the sources variable to the new sources. + $variables['sources'] = $new_sources; +} + /** * Implements hook_preprocess_region(). */