diff --git a/atomic.libraries.yml b/atomic.libraries.yml index eb167d053..0b0d93d13 100644 --- a/atomic.libraries.yml +++ b/atomic.libraries.yml @@ -87,3 +87,10 @@ event-localist: js: node_modules/@yalesites-org/component-library-twig/dist/js/02-molecules/meta/event-meta/event-meta-localist.js: {} +chosen-select: + js: + node_modules/@yalesites-org/component-library-twig/dist/js/01-atoms/forms/select/yds-select.js: + {} + dependencies: + - core/once + - libraries/chosen diff --git a/atomic.theme b/atomic.theme index 0d6632237..c7027564f 100644 --- a/atomic.theme +++ b/atomic.theme @@ -91,3 +91,17 @@ function atomic_preprocess_paragraph__accordion_item(&$variables) { } } } + +/** + * Implements hook_theme_suggestions_HOOK_alter() for field templates. + */ +function atomic_theme_suggestions_field_alter(array &$suggestions, array $variables) { + // Check if the field is attached to a node. + if ($variables['element']['#entity_type'] == 'node') { + $view_mode = $variables['element']['#view_mode']; + $field_name = $variables['element']['#field_name']; + + // Add a theme suggestion for the field based on the parent node's view mode. + $suggestions[] = 'field__' . $variables['element']['#entity_type'] . '__' . $field_name . '__' . $view_mode; + } +} diff --git a/css/layout-builder.css b/css/layout-builder.css index f2e5ede2e..acdbf57e9 100644 --- a/css/layout-builder.css +++ b/css/layout-builder.css @@ -33,6 +33,18 @@ would be used instead resulting in top margin of size-spacing-6. */ margin-top: 0; } +/* We allow spotlights in the banner now, but they appear a little to close to + * the top of the page. This allows us to adjust the top margin to give a + * little more space to just the first one. + */ +.main-content .layout--banner .layout__region > .text-with-image:first-child, +.main-content + .layout--banner + .layout__region + > .content-spotlight-portrait:first-child { + margin-top: var(--size-spacing-8); +} + /* The last item inside the `.main-content` area should have some space between // it and the site footer (size-spacing-12 below) - unless it is designated as // `$flush-bottom` above. Then it will have no bottom-margin separating it from diff --git a/package-lock.json b/package-lock.json index dd878f965..6c069431f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -438,6 +438,13 @@ "postcss-selector-parser": "^6.0.10" } }, + "node_modules/@drupal/once": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@drupal/once/-/once-1.0.1.tgz", + "integrity": "sha512-O8tQmNDBgSm3ADuFZ5OZlGxsrdsc+pEqd1NBoMpSzWwiOnWwC91tqDwnlX+mDh7sBJoJ+4vVwFh0NLUV4LPFvg==", + "inBundle": true, + "license": "GPL-2.0-or-later" + }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -2068,12 +2075,13 @@ "inBundle": true }, "node_modules/@yalesites-org/component-library-twig": { - "version": "1.44.2", - "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.44.2/a352874fa5ddf8b7d56e1408d16045e096ed7587", - "integrity": "sha512-+ESlETph5sDehuduDFJLkydhfpBQ0G385YczG7zBu47tBmd+n8OWaD9bWaDunVmICD9MOymQY48hwtR551fbjQ==", + "version": "1.45.0", + "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.45.0/d4fe31c39d7913364cd8d6dbcde1a803ab39474e", + "integrity": "sha512-E9y4IYMgOzaf0m0Lh7/t7mamDdRaZCulR7cTnl13Fll5RRL+0CW0uz2M68woxbOB3/SvrDviTjWcmZQM1Ao9HA==", "hasInstallScript": true, "inBundle": true, "dependencies": { + "@drupal/once": "^1.0.1", "@storybook/storybook-deployer": "^2.8.11", "@yalesites-org/tokens": "^1.20.0", "add-attributes-twig-extension": "^0.1.0", @@ -2083,6 +2091,7 @@ "glob": "^7.2.0", "highlight.js": "^11.9.0", "imagemin-webpack-plugin": "^2.4.2", + "jquery": "^3.7.1", "mini-css-extract-plugin": "^1.6.2", "node-sass-glob-importer": "^5.3.2", "normalize.css": "^8.0.1", @@ -10002,6 +10011,13 @@ "node": ">=6" } }, + "node_modules/jquery": { + "version": "3.7.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", + "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", + "inBundle": true, + "license": "MIT" + }, "node_modules/js-base64": { "version": "2.6.4", "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz", @@ -21515,6 +21531,11 @@ "peer": true, "requires": {} }, + "@drupal/once": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@drupal/once/-/once-1.0.1.tgz", + "integrity": "sha512-O8tQmNDBgSm3ADuFZ5OZlGxsrdsc+pEqd1NBoMpSzWwiOnWwC91tqDwnlX+mDh7sBJoJ+4vVwFh0NLUV4LPFvg==" + }, "@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -22730,10 +22751,11 @@ "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==" }, "@yalesites-org/component-library-twig": { - "version": "1.44.2", - "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.44.2/a352874fa5ddf8b7d56e1408d16045e096ed7587", - "integrity": "sha512-+ESlETph5sDehuduDFJLkydhfpBQ0G385YczG7zBu47tBmd+n8OWaD9bWaDunVmICD9MOymQY48hwtR551fbjQ==", + "version": "1.45.0", + "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.45.0/d4fe31c39d7913364cd8d6dbcde1a803ab39474e", + "integrity": "sha512-E9y4IYMgOzaf0m0Lh7/t7mamDdRaZCulR7cTnl13Fll5RRL+0CW0uz2M68woxbOB3/SvrDviTjWcmZQM1Ao9HA==", "requires": { + "@drupal/once": "^1.0.1", "@storybook/storybook-deployer": "^2.8.11", "@yalesites-org/tokens": "^1.20.0", "add-attributes-twig-extension": "^0.1.0", @@ -22743,6 +22765,7 @@ "glob": "^7.2.0", "highlight.js": "^11.9.0", "imagemin-webpack-plugin": "^2.4.2", + "jquery": "^3.7.1", "mini-css-extract-plugin": "^1.6.2", "node-sass-glob-importer": "^5.3.2", "normalize.css": "^8.0.1", @@ -28372,6 +28395,11 @@ "logalot": "^2.0.0" } }, + "jquery": { + "version": "3.7.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", + "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==" + }, "js-base64": { "version": "2.6.4", "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz", diff --git a/templates/block/layout-builder/block--inline-block--content-spotlight-portrait.html.twig b/templates/block/layout-builder/block--inline-block--content-spotlight-portrait.html.twig index ccca18c6e..9919a0e24 100644 --- a/templates/block/layout-builder/block--inline-block--content-spotlight-portrait.html.twig +++ b/templates/block/layout-builder/block--inline-block--content-spotlight-portrait.html.twig @@ -5,10 +5,13 @@ {% embed "@molecules/content-spotlight-portrait/yds-content-spotlight-portrait.twig" with { content_spotlight_portrait__heading: content.field_heading.0, + content_spotlight_portrait__heading_level: content.field_heading_level.0['#markup'], content_spotlight_portrait__subheading: content.field_subheading.0, content_spotlight_portrait__text: content.field_text, content_spotlight_portrait__link__content: content.field_link.0['#title'], content_spotlight_portrait__link__url: content.field_link.0['#url_title'], + content_spotlight_portrait__link_two__content: content.field_link_two.0['#title'], + content_spotlight_portrait__link_two__url: content.field_link_two.0['#url_title'], content_spotlight_portrait__style: content.field_style_variation.0['#markup'], content_spotlight_portrait__position: content.field_style_position.0['#markup'], content_spotlight_portrait__theme: content.field_style_color.0['#markup'], diff --git a/templates/block/layout-builder/block--inline-block--content-spotlight.html.twig b/templates/block/layout-builder/block--inline-block--content-spotlight.html.twig index d61fea94e..4f6b063cd 100644 --- a/templates/block/layout-builder/block--inline-block--content-spotlight.html.twig +++ b/templates/block/layout-builder/block--inline-block--content-spotlight.html.twig @@ -5,10 +5,13 @@ {% embed "@molecules/text-with-image/yds-text-with-image.twig" with { text_with_image__heading: content.field_heading.0, + text_with_image__heading_level: content.field_heading_level.0['#markup'], text_with_image__subheading: content.field_subheading.0, text_with_image__text: content.field_text, text_with_image__link__content: content.field_link.0['#title'], text_with_image__link__url: content.field_link.0['#url_title'], + text_with_image__link_two__content: content.field_link_two.0['#title'], + text_with_image__link_two__url: content.field_link_two.0['#url_title'], text_with_image__focus: content.field_style_variation.0['#markup'], text_with_image__position: content.field_style_position.0['#markup'], text_with_image__width: content.field_style_width.0['#markup'], diff --git a/templates/block/layout-builder/block--inline-block--image-banner.html.twig b/templates/block/layout-builder/block--inline-block--image-banner.html.twig new file mode 100644 index 000000000..bf58154f1 --- /dev/null +++ b/templates/block/layout-builder/block--inline-block--image-banner.html.twig @@ -0,0 +1,23 @@ +{% extends "@atomic/block/layout-builder/_layout-builder-block-template.twig" %} + +{% set image_banner__video = paragraph.field_media.entity.field_media_video_file.entity.uri.value is not empty %} + +{% block content %} + {% embed "@molecules/banner/image/yds-image-banner.twig" with { + image_banner__video: image_banner__video, + image_banner__content_background: image_banner__content_background + } %} + {% block image_banner__video %} + {% if image_banner__video %} + {% set image_banner__video = true %} + {{ content.field_media }} + {% endif %} + {% endblock %} + + {% block image_banner__image %} + {% if not image_banner__video %} + {{ content.field_media }} + {% endif %} + {% endblock %} + {% endembed %} +{% endblock %} diff --git a/templates/block/layout-builder/block--inline-block--video.html.twig b/templates/block/layout-builder/block--inline-block--video.html.twig index d98f8aa2a..2ac55a70b 100644 --- a/templates/block/layout-builder/block--inline-block--video.html.twig +++ b/templates/block/layout-builder/block--inline-block--video.html.twig @@ -1,13 +1,13 @@ {% extends "@atomic/block/layout-builder/_layout-builder-block-template.twig" %} +{% set video__width = "site" %} +{% set video__alignment = content.field_style_alignment.0['#markup']|default('left') %} + {% block content %} {% if parentNode == 'post' or parentNode == 'event' %} {% set video__width = "content" %} {% set video__alignment = "center" %} - {% else %} - {% set video__width = "site" %} - {% set video__alignment = "left" %} {% endif %} {% embed "@molecules/video/yds-video.twig" with { diff --git a/templates/block/layout-builder/block--inline-block--view.html.twig b/templates/block/layout-builder/block--inline-block--view.html.twig index 016896840..abab5f68c 100644 --- a/templates/block/layout-builder/block--inline-block--view.html.twig +++ b/templates/block/layout-builder/block--inline-block--view.html.twig @@ -17,13 +17,18 @@ class: bem(view__base_class, view__modifiers), } %} {% endif %} - +