new card style

app/views/merged/view/_section_half_image.haml

@@ -13,6 +13,6 @@
       -if section.has_option?("text")
         %p.mt-8.md:block
           = section.option("text")
-      .mt-8.md:mt-8
       -if section.has_option?("button_text")
+        .mt-8.md:mt-8
           = render 'merged/view/elements/button' , section: section

app/views/merged/view/cards/_card_gap_square.haml

@@ -0,0 +1,8 @@
+.grid.grid-cols-1.gap-16.m-16
+  %div{ order_option(card)}
+    = image_for( card , "h-70 w-full object-cover grid")
+  %div.grid.h-70{options(card , :align , :color , :background )}
+    %h3.p-4.mt-10.text-3xl.font-bold= card.header
+    -if card.has_option?("subheader")
+      %h4.p-4.text-xl= card.option("subheader")
+    %p.m-10= card.text

config/styles.yaml

@@ -85,6 +85,19 @@ cards:
     - background
     - color
     - align
+- template: card_gap_square
+  header: Narrow card with up down section
+  text: Smaller image, large margins, possible subheader
+    Order turns it upside down, image bottom
+  fields:
+    - header
+    - text
+  options:
+    - background
+    - color
+    - order
+    - align
+    - subheader
 - template: card_normal_square
   header: Standard card with square image
   text: Image, header, text, normal stuff