DROOP-1081: Widescreen header image takes all viewport width

droptica · Jan 24, 2024 · ede9826 · ede9826
1 parent b2ad091
commit ede9826
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 6 deletions.
diff --git a/themes/custom/droopler_theme/src/components/d-p-tiles/d-p-tiles.twig b/themes/custom/droopler_theme/src/components/d-p-tiles/d-p-tiles.twig
@@ -8,16 +8,20 @@
   {{ title_suffix }}
 
   <div {{ bem('content', [], base_class) }}>
-    <div {{ bem('header', [], base_class, ['container']) }}>
+    <div {{ bem('header', [], base_class) }}>
       <div {{ bem('header-wrapper', [], base_class, ['row']) }}>
         <div {{ bem('header-column', [], base_class, ['col-12']) }}>
-          {% block content_header %}
+          {% block content_header_media_icon %}
           {% endblock %}
+          <div {{ bem('header-title-and-descrition', [], base_class, ['container']) }}>
+            {% block content_header %}
+            {% endblock %}
 
-          {% include '@droopler_theme/base/divider/divider.twig' %}
+            {% include '@droopler_theme/base/divider/divider.twig' %}
 
-          {% block content %}
-          {% endblock %}
+            {% block content %}
+            {% endblock %}
+          </div>
         </div>
       </div>
     </div>

diff --git a/themes/custom/droopler_theme/templates/paragraph/paragraph--d-p-tiles.html.twig b/themes/custom/droopler_theme/templates/paragraph/paragraph--d-p-tiles.html.twig
@@ -2,8 +2,13 @@
 
   {% block component_content %}
     {% embed '@droopler_theme/d-p-tiles/d-p-tiles.twig' %}
+
+      {% block content_header_media_icon %}
+        {{ content.group_d_tiles_content_header.field_d_media_icon }}
+      {% endblock %}
+
       {% block content_header %}
-        {{ content.group_d_tiles_content_header }}
+        {{ content.group_d_tiles_content_header|without('field_d_media_icon') }}
       {% endblock %}
 
       {% block content %}