diff --git a/atomic.libraries.yml b/atomic.libraries.yml
index 0cc0fd78b..f748680cf 100644
--- a/atomic.libraries.yml
+++ b/atomic.libraries.yml
@@ -5,6 +5,7 @@ global:
node_modules/@yalesites-org/component-library-twig/dist/style.css: {}
components/_settings/_config.css: {}
css/admin-theme.css: {}
+ css/ckeditor-overrides.css: {}
js:
node_modules/@yalesites-org/component-library-twig/dist/js/02-molecules/menu/menu-toggle/yds-menu-toggle.js: {}
node_modules/@yalesites-org/component-library-twig/dist/js/00-tokens/layout/yds-layout.js: {}
diff --git a/atomic.theme b/atomic.theme
index 414774821..0d6632237 100644
--- a/atomic.theme
+++ b/atomic.theme
@@ -77,3 +77,17 @@ function atomic_preprocess_node(&$variables) {
$variables['date_formatted'] = \Drupal::service('date.formatter')->format($date, '', 'c');
}
}
+
+/**
+ * Implements hook_preprocess_paragraph__accordion_item().
+ *
+ * Inject the heading_level based on the parent's heading presence.
+ */
+function atomic_preprocess_paragraph__accordion_item(&$variables) {
+ if ($accordion = $variables['paragraph']->getParentEntity()) {
+ if ($accordion->hasField('field_heading')) {
+ $heading = $accordion->field_heading->value;
+ $variables['attributes']['heading_level'] = empty($heading) ? 2 : 3;
+ }
+ }
+}
diff --git a/css/admin-theme.css b/css/admin-theme.css
index c672e22df..5b73a5c6f 100644
--- a/css/admin-theme.css
+++ b/css/admin-theme.css
@@ -1,4 +1,3 @@
-@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&display=swap");
:root {
--peacock-green: #376c74;
@@ -7,6 +6,25 @@
--wool: #fbfbf6;
--light-gray: #d4d4d4;
--darkest-gray: #1f1f1f;
+ --dark-theme-gray-rgb: 78, 89, 89;
+ --dark-theme-gray: #4E5959;
+ --dark-theme-gray-selected: #edfbfb;
+ --dark-theme-gray-lightest: #d0e0e0;
+ --dark-theme-gray-lightest-rgb: 208, 224, 224;
+ --dark-theme-gray-light: #606A6A;
+ --dark-theme-gray-hover: #353d3d;
+ --dark-primary-link: var(--wool);
+ --dark-primary-link-hover: #ffffff;
+ --dark-theme-gray-text-light: var(--wool);
+ --dark-theme-gray-text-dark: var(--dark-theme-gray);
+ --custom-button-color: var(--robin-egg);
+ --custom-button-color-hover: var(--wool);
+ --custom-button-color-text: var(--dark-theme-gray-hover);
+ --custom-button-color-text-hover: var(--dark-theme-gray-hover);
+
+ --dark-gin-icon-color: var(--wool);
+ --gin-color-text-light: var(--wool);
+
--gin-font: "DM Mono", monospace;
--gin-font-size-h1: 1.75rem;
--gin-font-size-h2: 1.5rem;
@@ -20,19 +38,30 @@
--gin-bg-warning: #605328;
--gin-color-danger-light: #f39b9d;
--gin-bg-danger: #583333;
+ --gin-bg-item-hover: var(--dark-theme-gray-hover);
}
:root [data-gin-accent=light_blue] {
- --gin-color-primary-rgb: 55, 108, 116;
- --gin-color-primary-active: var(--peacock-green);
+ --gin-color-primary-rgb: 217, 241, 243;
+ --gin-color-primary-active: var(--wool);
--gin-color-secondary: var(--mediterranean-blue);
- --gin-color-primary-hover: var(--peacock-green);
- --gin-color-primary-light: var(--robin-egg);
+ --gin-color-text-light: var(--wool);
+ --gin-icon-color: var(--dark-gin-icon-color);
+ --gin-bg-item-hover: var(--dark-theme-gray-hover);
+ --gin-bg-header: var(--dark-theme-gray);
+ --gin-color-primary-hover: var(--dark-primary-link-hover);
+ --gin-color-primary-light: var(--gin-bg-item-hover) !important;
--gin-border-color-layer: var(--light-gray);
- --gin-bg-layer: var(--wool);
+ --gin-bg-layer: var(--dark-theme-gray);
--gin-dark-gray: var(--darkest-gray);
--colorGinText: var(--darkest-gray);
--gin-border-color-table-header: var(--darkest-gray);
+ --gin-bg-layer3: var(--dark-theme-gray-hover);
+ --gin-color-title: var(--dark-theme-gray-text);
+ --gin-color-dark-text: var(--wool);
+ --gin-color-title: var(--dark-theme-gray);
+ --gin-color-button-text: var(--dark-theme-gray);
+ --gin-color-button-text-hover: var(--dark-theme-gray-hover);
}
[data-gin-accent=light_blue] {
@@ -47,12 +76,79 @@
}
+/* media modal */
+
+.glb-view-header a.views-display-link.views-display-link-widget_table {
+ color: var(--wool) !important;
+}
+
+.glb-view-header .views-display-link.views-display-link-widget.is-active {
+ color: var(--wool) !important;
+}
+
+.glb-view-header .views-display-link::before {
+ background-color: var(--wool) !important;
+}
+
+#views-exposed-form-media-library-widget .glb-form-item__label {
+ color: var(--wool) !important;
+}
+
+.glb-form-checkbox:checked {
+ background-color: var(--dark-theme-gray) !important;
+}
+
+.media-library-selected-count {
+ color: var(--dark-theme-gray) !important;
+}
+
+.glb-pager .pager__link {
+ color: var(--mediterranean-blue) !important;
+}
+
+.glb-pager .pager__link:hover,
+.glb-pager .pager__link:focus {
+ background: var(--dark-theme-gray-lightest) !important;
+ border-color: var(--dark-theme-gray) !important;
+}
+
+.glb-pager .pager__item .pager__link--action-link::before,
+.glb-pager .pager__item .pager__link--action-link::after {
+ background: var(--dark-theme-gray) !important;
+}
+
+.glb-pager .pager__item .pager__link--action-link:hover::before,
+.glb-pager .pager__item .pager__link--action-link:focus::after,
+.glb-pager .pager__item .pager__link:hover::after,
+.glb-pager .pager__item .pager__link:focus::after {
+ background: var(--dark-theme-gray) !important;
+}
+
+.glb-pager .pager__link.is-active,
+.glb-pager .pager__item--current {
+ color: var(--dark-theme-gray) !important;
+}
+
+/* linkit ui autocomplete */
+.ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
+ background-color: var(--dark-theme-gray-lightest);
+}
+
/* Off-canvas overrides */
#drupal-off-canvas {
background-color: var(--wool);
color: var(--darkest-gray);
}
+.ui-dialog-content,
+.ui-dialog-off-canvas .ui-dialog-titlebar {
+ background: var(--wool) !important;
+}
+
+#layout-builder-modal {
+ background: var(--wool) !important;
+}
+
.ui-dialog-off-canvas #drupal-off-canvas {
padding-inline: var(--size-spacing-5) var(--size-spacing-8);
}
@@ -62,10 +158,64 @@
color: var(--darkest-gray);
}
+.ui-widget-content a {
+ color: var(--dark-theme-gray) !important;
+}
+
+.ui-menu-item-wrapper:hover {
+ background-color: var(--dark-theme-gray-lightest);
+}
+
.ui-widget.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
display: flex;
align-items: center;
- border-color: var(--peacock-green);
+ border-color: var(--dark-theme-gray);
+}
+
+.ui-widget.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
+ background-color: var(--dark-theme-gray-hover) !important;
+}
+
+.glb-claro-details[open]>.glb-claro-details__summary {
+ color: var(--gin-color-primary) !important;
+ background-color: var(--dark-theme-gray-hover) !important;
+}
+
+.glb-claro-details[open]>.glb-claro-details__summary::before {
+ background: var(--gin-color-primary) !important;
+}
+
+.glb-claro-details__summary:hover::before {
+ background: var(--gin-color-primary) !important;
+}
+
+.glb-form-item__description,
+.glb-fieldset__description {
+ color: var(--dark-theme-gray) !important;
+}
+
+.glb-form-wrapper .cke .cke_top,
+.glb-form-wrapper .cke .cke_bottom {
+ background: var(--dark-theme-gray-lightest) !important;
+}
+
+.glb-form-wrapper .cke a.cke_path_item,
+.glb-form-wrapper .cke span.cke_path_empty {
+ color: var(--dark-theme-gray) !important;
+}
+
+.glb-form-wrapper .cke a.cke_button_off:hover,
+.glb-form-wrapper .cke a.cke_button_off:focus,
+.glb-form-wrapper .cke a.cke_button_off:active {
+ background: var(--wool) !important;
+}
+
+:not(.glb-form-checkboxes):not(td):not(.media-library-item__click-to-select-checkbox):not(.field-content)>.glb-form-type--checkbox label {
+ color: var(--wool) !important;
+}
+
+[dir="ltr"] .gin-secondary-toolbar .toolbar-secondary .toolbar-bar div:last-child .toolbar-tray {
+ border-radius: 0 0 var(--gin-border-l) var(--gin-border-l);
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-title,
@@ -79,8 +229,17 @@
#drupal-off-canvas input[type="submit"].button {
box-sizing: border-box;
padding: var(--size-spacing-5);
+ background-color: var(--custom-button-color) !important;
+ color: var(--custom-button-color-text) !important;
}
+.ui-widget.ui-dialog.ui-dialog-off-canvas #drupal-off-canvas .button--primary[type="submit"]:hover,
+.ui-widget.ui-dialog.ui-dialog-off-canvas #drupal-off-canvas .button--primary[type="submit"]:focus {
+ background-color: var(--dark-theme-gray-hover) !important;
+ color: var(--wool) !important;
+}
+
+
/* Modal */
.ui-widget-overlay {
background: var(--gin-color-primary) !important;
@@ -111,6 +270,23 @@
top: calc(var(--gin-toolbar-secondary-height) - 7px) !important;
}
+.gin-breadcrumb__item:first-of-type .gin-breadcrumb__link:hover::before {
+ background-color: var(--dark-primary-link-hover) !important;
+}
+
+.gin-breadcrumb__link:hover {
+ text-decoration: underline;
+}
+
+.gin-breadcrumb__link:hover,
+.gin-breadcrumb__link:hover em {
+ color: var(--dark-primary-link-hover) !important;
+}
+
+.gin-breadcrumb__item:first-of-type .gin-breadcrumb__link:hover::before {
+ background-color: var(--dark-primary-link-hover) !important;
+}
+
body.gin--horizontal-toolbar {
padding-top: calc(var(--gin-toolbar-y-offset) + var(--gin-toolbar-secondary-height)) !important;
}
@@ -120,66 +296,35 @@ body.gin--horizontal-toolbar {
}
[data-gin-accent=light_blue] .ui-dialog-titlebar {
- background: var(--mediterranean-blue) !important;
-}
-
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item:hover
- > .toolbar-icon::before,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item:hover
- > .toolbar-box
- > a.toolbar-icon::before,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item
- > .toolbar-icon:focus::before,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item.menu-item--active-trail
- > .toolbar-icon::before,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item.menu-item--active-trail:hover
- > .toolbar-icon::before,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item.menu-item--active-trail
- > .toolbar-box
- > a.toolbar-icon::before {
+ background: var(--dark-theme-gray) !important;
+}
+
+.toolbar-menu-administration>.toolbar-menu>.menu-item:hover>.toolbar-icon::before,
+.toolbar-menu-administration>.toolbar-menu>.menu-item:hover>.toolbar-box>a.toolbar-icon::before,
+.toolbar-menu-administration>.toolbar-menu>.menu-item>.toolbar-icon:focus::before,
+.toolbar-menu-administration>.toolbar-menu>.menu-item.menu-item--active-trail>.toolbar-icon::before,
+.toolbar-menu-administration>.toolbar-menu>.menu-item.menu-item--active-trail:hover>.toolbar-icon::before,
+.toolbar-menu-administration>.toolbar-menu>.menu-item.menu-item--active-trail>.toolbar-box>a.toolbar-icon::before {
z-index: 1;
}
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item.menu-item--active-trail
- > .toolbar-icon::after,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item.menu-item--active-trail
- > .toolbar-box
- > a.toolbar-icon::after,
-.toolbar-menu-administration
- > .toolbar-menu
- > .menu-item
- > .toolbar-icon.is-active::after {
+.toolbar-menu-administration>.toolbar-menu>.menu-item.menu-item--active-trail>.toolbar-icon::after,
+.toolbar-menu-administration>.toolbar-menu>.menu-item.menu-item--active-trail>.toolbar-box>a.toolbar-icon::after,
+.toolbar-menu-administration>.toolbar-menu>.menu-item>.toolbar-icon.is-active::after {
background-color: var(--gin-color-primary-light) !important;
}
.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab:hover .trigger::before,
.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab:focus .trigger::before {
- background-color: var(--gin-color-primary) !important;
+ background-color: var(--wool) !important;
}
-.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab > .toolbar-icon-edit.toolbar-item:hover
-.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab > .toolbar-icon-edit.toolbar-item:focus {
+.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab>.toolbar-icon-edit.toolbar-item:hover .gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab>.toolbar-icon-edit.toolbar-item:focus {
background-color: var(--wool);
}
.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab:hover .trigger {
- color: var(--gin-color-primary) !important;
+ color: var(--wool) !important;
}
.is-horizontal .tabs__link:hover,
@@ -193,7 +338,7 @@ body.gin--horizontal-toolbar {
border-radius: 0.625rem !important;
}
-.block-system > .views-form [data-drupal-selector*="edit-header"],
+.block-system>.views-form [data-drupal-selector*="edit-header"],
.view-content .views-form [data-drupal-selector*="edit-header"] {
background-color: transparent !important;
}
@@ -203,22 +348,12 @@ body.gin--horizontal-toolbar {
background: rgba(var(--gin-color-primary-rgb), 0.15) !important;
}
-.gin-secondary-toolbar
- .toolbar-secondary
- .toolbar-bar
- .toolbar-tab
- .toolbar-tray
- a:hover,
-.gin-secondary-toolbar
- .toolbar-secondary
- .toolbar-bar
- .toolbar-tab
- .toolbar-tray
- a:active,
+.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab .toolbar-tray a:hover,
+.gin-secondary-toolbar .toolbar-secondary .toolbar-bar .toolbar-tab .toolbar-tray a:active,
table tr:hover,
table .draggable-table.tabledrag-disabled tr:hover {
- --gin-color-button-text: var(--gin-color-primary);
color: var(--wool);
+ background: var(--dark-theme-gray);
}
#block-atomic-local-tasks ul:not(.contextual-links) {
@@ -262,6 +397,24 @@ table .draggable-table.tabledrag-disabled tr:hover {
.form-actions .layout-builder__link--add,
.glb-action-link--icon-trash.glb-action-link {
border-radius: 2.5rem !important;
+ border: 2px solid transparent !important;
+}
+
+.glb-button:hover,
+.inline-block-create-button:hover,
+.layout-builder__link--add:hover,
+.glb-button:not(:focus):hover,
+.inline-block-create-button:not(:focus):hover,
+.layout-builder__link--add:not(:focus):hover,
+.form-actions .glb-button:hover,
+.form-actions .inline-block-create-button:hover,
+.form-actions .layout-builder__link--add:hover,
+.glb-action-link--icon-trash.glb-action-link:hover {
+ border-color: var(--dark-theme-gray-hover) !important;
+}
+
+.glb-button:hover {
+ color: var(--dark-theme-gray) !important;
}
.glb-button:not(:focus) {
@@ -273,6 +426,16 @@ table .draggable-table.tabledrag-disabled tr:hover {
box-shadow: 0 0 0 3px #d4d4d4 !important;
}
+.glb-table .tabledrag-handle::after {
+ background-color: var(--dark-theme-gray) !important;
+}
+
+.glb-table tr:hover,
+.glb-table .draggable-table.tabledrag-disabled tr:hover {
+ background: var(--dark-theme-gray-lightest);
+}
+
+
.meta-sidebar__trigger,
.meta-sidebar__close {
background-color: var(--gin-color-primary-light);
@@ -291,11 +454,16 @@ table .draggable-table.tabledrag-disabled tr:hover {
}
.layout-builder__link--configure {
- --gin-border-color-form-element: var(--darkest-gray);
+ color: var(--dark-theme-gray);
}
+
.layout-builder__link--add-section-to-library,
.layout-builder__link--remove {
- --gin-border-color-form-element: var(--darkest-gray);
+ background-color: var(--dark-theme-gray-hover);
+}
+
+.layout-builder__section:not(.gin-lb--disable-section-focus):hover::after {
+ border: 0.25rem solid var(--dark-theme-gray-hover) !important;
}
#media-library-messages .messages {
@@ -307,27 +475,51 @@ table .draggable-table.tabledrag-disabled tr:hover {
color: var(--gin-color-danger-light);
background-color: var(--gin-bg-danger);
}
+
#media-library-messages .messages--warning {
color: var(--gin-color-warning-light);
background-color: var(--gin-bg-warning);
}
+.layout-builder__section {
+ margin-inline-start: 0.5rem;
+ margin-inline-end: 0.5rem;
+}
+
+.layout-builder__section:hover .layout-builder__link--add-section-to-library {
+ background-color: var(--dark-theme-gray-hover) !important;
+}
+
+.layout-builder__section:hover .layout-builder__link--remove {
+ background-color: var(--dark-theme-gray-hover) !important;
+}
+
+.layout-builder__section:hover .layout-builder__link--configure {
+ background-color: var(--dark-theme-gray-hover) !important;
+ color: var(--gin-color-primary) !important;
+}
+
/* yalb-1261 - fix hover color on table */
.layout-builder-components-table__block-label:hover {
- color: var(--darkest-gray);
+ color: var(--dark-theme-gray-hover);
text-decoration: underline;
}
+.layout-builder-components-table th:hover {
+ color: var(--dark-theme-gray-hover);
+}
+
.layout-builder-components-table tr:hover {
- color: var(--darkest-gray);
+ color: var(--dark-theme-gray);
+ background-color: var(--dark-theme-gray-lightest);
}
/* yalb-1296 - table tr hover in text component */
.text table tr:hover {
color: var(--color-text);
}
-
+
/* yalb-1251 - AX: pencil icon difficulty editing blocks */
/* change the contextual pencil icon to the left-hand side of each component
// instead of the right
@@ -345,13 +537,13 @@ table .draggable-table.tabledrag-disabled tr:hover {
.layout-builder-block.contextual-region .contextual {
left: 15vw;
}
-}
+}
@media only screen and (min-width: 2500px) {
.layout-builder-block.contextual-region .contextual {
left: 20vw;
}
-}
+}
.layout-builder-block.contextual-region .contextual .contextual-links {
left: 0;
@@ -360,7 +552,7 @@ table .draggable-table.tabledrag-disabled tr:hover {
}
/* increase the size of the clickable/hoverable area */
-.layout-builder-block.contextual-region .contextual .trigger {
+.layout-builder-block.contextual-region .contextual .trigger {
width: 50px !important;
height: 50px !important;
}
@@ -388,3 +580,11 @@ table .draggable-table.tabledrag-disabled tr:hover {
align-items: center;
padding-inline: 2rem;
}
+
+
+/* Blocks - accordion block, button block */
+.field--name-field-accordion-items th h4,
+.field--name-field-button-link th h4 {
+ color: var(--wool) !important;
+}
+
diff --git a/css/ckeditor-overrides.css b/css/ckeditor-overrides.css
new file mode 100644
index 000000000..7a19b46a3
--- /dev/null
+++ b/css/ckeditor-overrides.css
@@ -0,0 +1,60 @@
+@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&display=swap");
+
+/* Fix CKEditor modal table dialog from displaying borders where it should not */
+.cke_dialog td {
+ border-bottom: 0 !important;
+}
+
+/* Set font over all of the dialog */
+.cke_dialog * {
+ font-family: var(--gin-font) !important;
+}
+
+/* Generic button overrides */
+.cke_dialog .cke_dialog_ui_button {
+ border-radius: 2.5rem !important;
+}
+
+/* Restyle Ok button */
+.cke_dialog .cke_dialog_ui_button_ok {
+ background-color: var(--gin-color-primary) !important;
+}
+
+/* Round inputs */
+.cke_dialog input, .cke_dialog select {
+ border-radius: 6px !important;
+}
+
+/* Mimic selects in other areas, like the divider */
+.cke_dialog select.cke_dialog_ui_input_select {
+ appearance: none;
+ -webkit-appearance: none;
+ padding-right: calc(2.5em - 1px) !important;
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3e%3cpath fill='none' stroke-width='1.5' d='M1 1l6 6 6-6' stroke='%23545560'/%3e%3c/svg%3e") !important;
+ background-repeat: no-repeat !important;
+ background-position: 100% 50% !important;
+ background-size: 2.75em .5625em !important;
+ line-height: 1.5em !important;
+}
+
+/* Remove the alternating background color */
+.cke_dialog tr:nth-child(even) {
+ background-color: inherit !important;
+}
+
+/* Make the title similar to other titles on the admin side */
+.cke_dialog .cke_dialog_title {
+ background: var(--mediterranean-blue) !important;
+ color: #fff !important;
+}
+
+/* Make the body color similar to the other displays on the admin side */
+.cke_dialog .cke_dialog_content_body {
+ background: var(--gin-bg-layer) !important;
+ color: var(--gin-color-text) !important;
+}
+
+/* Remake the X button so we can color it white--it was a png before */
+.cke_dialog .cke_dialog_close_button {
+ background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22100%22%20height%3D%22100%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Cline%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%22100%22%20y2%3D%22100%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%2F%3E%0A%20%20%3Cline%20x1%3D%220%22%20y1%3D%22100%22%20x2%3D%22100%22%20y2%3D%220%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%2F%3E%0A%3C%2Fsvg%3E") !important;
+}
diff --git a/css/layout-builder.css b/css/layout-builder.css
index 6e76dfdb0..89df0b0e3 100644
--- a/css/layout-builder.css
+++ b/css/layout-builder.css
@@ -57,3 +57,19 @@ need to have margin-bottom set to 0 */
.main-content .layout.layout--onecol:last-child {
margin-bottom: 0;
}
+
+/*
+// Pull quotes has a element provided by the WYSIWYG
+// we need to make the `-` character and the attribution text in line,
+// and remove margin from the
+display: flex;
+*/
+
+.pull-quote__attribution {
+ display: flex;
+}
+
+.pull-quote__attribution p {
+ margin-top: 0;
+ margin-bottom: 0;
+}
diff --git a/package-lock.json b/package-lock.json
index 27dd88126..fec58c23b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1418,9 +1418,9 @@
"inBundle": true
},
"node_modules/@yalesites-org/component-library-twig": {
- "version": "1.32.3",
- "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.32.3/1856f1f83599ed811201c418edbc7816da358137",
- "integrity": "sha512-jWw5IEoS9CRtlMkUImPfYS5gFyjZjrGM5p2CVqAQwOjei5cKyLTgkNPETCgbMSZSqT5RSuZPSdbKuhoCSQd6PA==",
+ "version": "1.33.0",
+ "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.33.0/50113fd913003e69f540f9da94a822bdd7c8cae8",
+ "integrity": "sha512-8KyDdKmvbEmbDstqGutIhOjEzYlr3PlkwLJXgfno0PE+TntbbgMUjjXX8Dq9duQtez561ve7ItdvInHlUslHWw==",
"hasInstallScript": true,
"inBundle": true,
"dependencies": {
@@ -20835,9 +20835,9 @@
"integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ=="
},
"@yalesites-org/component-library-twig": {
- "version": "1.32.3",
- "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.32.3/1856f1f83599ed811201c418edbc7816da358137",
- "integrity": "sha512-jWw5IEoS9CRtlMkUImPfYS5gFyjZjrGM5p2CVqAQwOjei5cKyLTgkNPETCgbMSZSqT5RSuZPSdbKuhoCSQd6PA==",
+ "version": "1.33.0",
+ "resolved": "https://npm.pkg.github.com/download/@yalesites-org/component-library-twig/1.33.0/50113fd913003e69f540f9da94a822bdd7c8cae8",
+ "integrity": "sha512-8KyDdKmvbEmbDstqGutIhOjEzYlr3PlkwLJXgfno0PE+TntbbgMUjjXX8Dq9duQtez561ve7ItdvInHlUslHWw==",
"requires": {
"@storybook/storybook-deployer": "^2.8.11",
"@yalesites-org/tokens": "^1.20.0",
diff --git a/templates/block/layout-builder/block--inline-block--button-link.html.twig b/templates/block/layout-builder/block--inline-block--button-link.html.twig
index f9b978abb..b61e160c2 100644
--- a/templates/block/layout-builder/block--inline-block--button-link.html.twig
+++ b/templates/block/layout-builder/block--inline-block--button-link.html.twig
@@ -11,7 +11,7 @@
{% endif %}
{% embed "@organisms/component-wrapper/yds-component-wrapper.twig" with {
- component_wrapper__width: component_width,
+ component_wrapper__width: component_wrapper__width,
component_wrapper__label: content.field_heading,
component__modifiers: ['no-top-margin'],
} %}
diff --git a/templates/block/layout-builder/block--inline-block--embed.html.twig b/templates/block/layout-builder/block--inline-block--embed.html.twig
index d31514ccb..a7aa01955 100644
--- a/templates/block/layout-builder/block--inline-block--embed.html.twig
+++ b/templates/block/layout-builder/block--inline-block--embed.html.twig
@@ -2,7 +2,15 @@
{% block content %}
- {% embed "@molecules/embed/yds-embed.twig" %}
+ {% if parentNode == 'post' or parentNode == 'event' %}
+ {% set embed__width = "content" %}
+ {% else %}
+ {% set embed__width = "site" %}
+ {% endif %}
+
+ {% embed "@molecules/embed/yds-embed.twig" with {
+ embed__width: embed__width,
+ }%}
{% block embed__block %}
{{ content }}
diff --git a/templates/block/layout-builder/block--inline-block--gallery.html.twig b/templates/block/layout-builder/block--inline-block--gallery.html.twig
index 8257307bc..625911026 100644
--- a/templates/block/layout-builder/block--inline-block--gallery.html.twig
+++ b/templates/block/layout-builder/block--inline-block--gallery.html.twig
@@ -11,7 +11,7 @@
{% endif %}
{% embed "@organisms/galleries/media-grid/yds-media-grid.twig" with {
- media_grid__heading: content.field_heading,
+ media_grid__heading: content.field_heading.0,
media_grid__variation: 'interactive',
media_grid__width: media_grid__width,
} %}
diff --git a/templates/block/layout-builder/block--inline-block--media-grid.html.twig b/templates/block/layout-builder/block--inline-block--media-grid.html.twig
index c1c70afcd..dff8abccc 100644
--- a/templates/block/layout-builder/block--inline-block--media-grid.html.twig
+++ b/templates/block/layout-builder/block--inline-block--media-grid.html.twig
@@ -8,7 +8,7 @@
{% endif %}
{% embed "@organisms/galleries/media-grid/yds-media-grid.twig" with {
- media_grid__heading: content.field_heading,
+ media_grid__heading: content.field_heading.0,
media_grid__width: media_grid__width,
} %}
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 b6f30adf0..d98f8aa2a 100644
--- a/templates/block/layout-builder/block--inline-block--video.html.twig
+++ b/templates/block/layout-builder/block--inline-block--video.html.twig
@@ -11,7 +11,7 @@
{% endif %}
{% embed "@molecules/video/yds-video.twig" with {
- video__heading: content.field_heading,
+ video__heading: content.field_heading.0,
video__text: content.field_text,
video__width: video__width|default('site'),
video__alignment: video__alignment|default('left'),
diff --git a/templates/layout/html.html.twig b/templates/layout/html.html.twig
new file mode 100644
index 000000000..5c546c6bf
--- /dev/null
+++ b/templates/layout/html.html.twig
@@ -0,0 +1,58 @@
+{#
+/**
+ * @file
+ * Theme override for the basic structure of a single Drupal page.
+ *
+ * Variables:
+ * - logged_in: A flag indicating if user is logged in.
+ * - root_path: The root path of the current page (e.g., node, admin, user).
+ * - node_type: The content type for the current node, if the page is a node.
+ * - head_title: List of text elements that make up the head_title variable.
+ * May contain one or more of the following:
+ * - title: The title of the page.
+ * - name: The name of the site.
+ * - slogan: The slogan of the site.
+ * - page_top: Initial rendered markup. This should be printed before 'page'.
+ * - page: The rendered page markup.
+ * - page_bottom: Closing rendered markup. This variable should be printed after
+ * 'page'.
+ * - db_offline: A flag indicating if the database is offline.
+ * - placeholder_token: The token for generating head, css, js and js-bottom
+ * placeholders.
+ *
+ * @see template_preprocess_html()
+ */
+#}
+
+
+
+
+ {{ head_title|safe_join(' | ') }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#
+ Keyboard navigation/accessibility link to main content section in
+ page.html.twig.
+ #}
+
+ {{ 'Skip to main content'|t }}
+
+ {{ page_top }}
+ {{ page }}
+ {{ page_bottom }}
+
+
+