From 7576c2457abdcd0f3fe63ef26c30afeee104e68f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?benjamin=20melan=C3=A7on?= <ben@agaric.com>
Date: Sun, 22 Sep 2019 19:23:35 -0400
Subject: [PATCH] Add a background to take the place of an image if none

---
 .../custom/geofresco/src/global/_layout.scss  |  5 ++
 .../layout/ds-2col-stacked.html.twig          | 75 +++++++++++++++++++
 2 files changed, 80 insertions(+)
 create mode 100644 web/themes/custom/geofresco/src/templates/layout/ds-2col-stacked.html.twig

diff --git a/web/themes/custom/geofresco/src/global/_layout.scss b/web/themes/custom/geofresco/src/global/_layout.scss
index b0f2418..5331cdd 100644
--- a/web/themes/custom/geofresco/src/global/_layout.scss
+++ b/web/themes/custom/geofresco/src/global/_layout.scss
@@ -37,3 +37,8 @@
 .content.no-featured-image {
   margin-top: 6rem;
 }
+
+.background-replacement-for-no-image {
+  height: 12rem;
+  background-color: cadetblue;
+}
diff --git a/web/themes/custom/geofresco/src/templates/layout/ds-2col-stacked.html.twig b/web/themes/custom/geofresco/src/templates/layout/ds-2col-stacked.html.twig
new file mode 100644
index 0000000..0cb5b92
--- /dev/null
+++ b/web/themes/custom/geofresco/src/templates/layout/ds-2col-stacked.html.twig
@@ -0,0 +1,75 @@
+{#
+/**
+ * @file
+ * Display Suite 2 column stacked template.
+ *
+ * Available variables:
+ * - outer_wrapper: outer wrapper element
+ * - header_wrapper: wrapper element around header region
+ * - left_wrapper: wrapper element around left region
+ * - right_wrapper: wrapper element around right region
+ * - footer_wrapper: wrapper element around footer region
+ * - attributes: layout attributes
+ * - header_attributes: attributes for header region
+ * - left_attributes: attributes for left region
+ * - right_attributes: attributes for right region
+ * - footer_attributes: attributes for footer region
+ * - header: content of header region
+ * - left: content of left region
+ * - right: content of right region
+ * - footer: content of footer region
+ */
+#}
+{% set attributes = attributes.addClass('columns is-multiline') %}
+{%
+  set header_classes = [
+    'column',
+    'is-12'
+  ]
+%}
+{% set header_attributes = header_attributes.addClass(header_classes) %}
+{%
+  set left_classes = [
+    'column',
+    'is-3'
+  ]
+%}
+{% set left_attributes = left_attributes.addClass(left_classes) %}
+{%
+  set right_classes = [
+    'column',
+    'is-9'
+  ]
+%}
+{% set right_attributes = right_attributes.addClass(right_classes) %}
+{%
+  set footer_classes = [
+    'column',
+    'is-12'
+  ]
+%}
+{% set footer_attributes = footer_attributes.addClass(footer_classes) %}
+<{{ outer_wrapper }}{{ attributes.addClass('ds-2col-stacked', 'clearfix') }}>
+
+  {{ title_suffix.contextual_links }}
+
+  <{{ header_wrapper }}{{ header_attributes.addClass('group-header') }}>
+    {% if header.field_image|render is empty %}
+      <div class="background-replacement-for-no-image"></div>
+    {% endif %}
+    {{ header }}
+  </{{ header_wrapper }}>
+
+  <{{ left_wrapper }}{{ left_attributes.addClass('group-left') }}>
+    {{ left }}
+  </{{ left_wrapper }}>
+
+  <{{ right_wrapper }}{{ right_attributes.addClass('group-right') }}>
+    {{ right }}
+  </{{ right_wrapper }}>
+
+  <{{ footer_wrapper }}{{ footer_attributes.addClass('group-footer') }}>
+    {{ footer }}
+  </{{ footer_wrapper }}>
+
+</{{ outer_wrapper }}>