Merge pull request #20 from CuBoulder/issue/563

Fixed Frame and Overlay
CuBoulder · Dec 11, 2023 · 93dacf3 · 93dacf3
2 parents 0ff9a8d + a023e14
commit 93dacf3
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+- ### Fixed Frame and Overlay
+  Fixed framing for single column rows (the frame wasn't showing on single column rows) 
+  - test this by adding a content frame
+
+  Added a new default for overlay classes. (caused css issues)
+  - This one is harder to actually see the results of because nothing should happen when you select overlays without images
+
+  Closes #21 
+---
+
 - ### Update LayoutBase.php
   Added an else statement to apply padding to section even when background images aren't used
 

diff --git a/layouts/four-column/layout--four-column.html.twig b/layouts/four-column/layout--four-column.html.twig
@@ -47,8 +47,10 @@
 {% if settings.background_image_styles %}
 	{% if settings.overlay_color == 'black' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-dark" %}
-	{% else %}
+	{% elseif settings.overlay_color == 'white' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-light" %}
+	{% else %}
+		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-none" %}
 	{% endif %}
 {% else %}
 	{% set row_overlay_settings = "" %}

diff --git a/layouts/one-column/layout--one-column.html.twig b/layouts/one-column/layout--one-column.html.twig
@@ -43,8 +43,10 @@
 {% if settings.background_image_styles %}
 	{% if settings.overlay_color == 'black' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-dark" %}
-	{% else %}
+	{% elseif settings.overlay_color == 'white' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-light" %}
+	{% else %}
+		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-none" %}
 	{% endif %}
 {% else %}
 	{% set row_overlay_settings = "" %}
@@ -73,7 +75,7 @@ jarallax(document.querySelectorAll('.jarallax'), {speed: 0.2});
 		{% else %}
 			<div class="ucb-edge-to-edge">
 		{% endif %}
-				<div{{attributes.addClass(row_classes,frame_classes|join(''))}}>
+				<div{{attributes.addClass(row_classes,frame_classes|join(' '))}}>
 					<div {{ region_attributes.first.addClass('column', 'column--first', 'col-12') }}>
 						{{ content.first }}
 					</div>

diff --git a/layouts/three-column/layout--three-column.html.twig b/layouts/three-column/layout--three-column.html.twig
@@ -47,8 +47,10 @@
 {% if settings.background_image_styles %}
 	{% if settings.overlay_color == 'black' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-dark" %}
-	{% else %}
+	{% elseif settings.overlay_color == 'white' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-light" %}
+	{% else %}
+		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-none" %}
 	{% endif %}
 {% else %}
 	{% set row_overlay_settings = "" %}

diff --git a/layouts/two-column/layout--two-column.html.twig b/layouts/two-column/layout--two-column.html.twig
@@ -47,8 +47,10 @@
 {% if settings.background_image_styles %}
 	{% if settings.overlay_color == 'black' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-dark" %}
-	{% else %}
+	{% elseif settings.overlay_color == 'white' %}
 		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-light" %}
+	{% else %}
+		{% set row_overlay_settings = "ucb-bootstrap-layout-section-overlay-none" %}
 	{% endif %}
 {% else %}
 	{% set row_overlay_settings = "" %}