Add column layouts

bootstrap_barrio.layouts.yml

@@ -16,7 +16,8 @@ bb_cardtopimage:
   template: card-top-image
   default_region: second
   icon_map:
-    - [top, middle]
+    - [top]
+    - [middle]
   regions:
     first:
       label: Image
@@ -29,7 +30,8 @@ bb_cardimageoverlay:
   template: card-image-overlay
   default_region: second
   icon_map:
-    - [top, middle]
+    - [top]
+    - [middle]
   regions:
     first:
       label: Image
@@ -42,7 +44,9 @@ bb_cardheaderfooter:
   template: card-header-footer
   default_region: second
   icon_map:
-    - [top, middle, bottom]
+    - [top]
+    - [middle]
+    - [bottom]
   regions:
     first:
       label: Header
@@ -57,7 +61,9 @@ bb_card3stack:
   template: card-3stack
   default_region: second
   icon_map:
-    - [top, middle, bottom]
+    - [top]
+    - [middle]
+    - [bottom]
   regions:
     first:
       label: First
@@ -78,3 +84,74 @@ bb_media:
       label: Image
     second:
       label: Content
+bb_col2-equal:
+  label: 2 Columns Equal
+  category: Barrio
+  path: layouts
+  template: col2-equal
+  default_region: first
+  icon_map:
+    - [first, second]
+  regions:
+    first:
+      label: First
+    second:
+      label: Second
+bb_col2-3-9:
+  label: 2 Columns 3 and 9
+  category: Barrio
+  path: layouts
+  template: col2-3-9
+  default_region: first
+  icon_map:
+    - [first, second]
+  regions:
+    first:
+      label: First
+    second:
+      label: Second
+bb_col2-9-3:
+  label: 2 Columns 9 and 3
+  category: Barrio
+  path: layouts
+  template: col2-9-3
+  default_region: first
+  icon_map:
+    - [first, second]
+  regions:
+    first:
+      label: First
+    second:
+      label: Second
+bb_col3-equal:
+  label: 3 Columns Equal
+  category: Barrio
+  path: layouts
+  template: col3-equal
+  default_region: first
+  icon_map:
+    - [first, second, third]
+  regions:
+    first:
+      label: First
+    second:
+      label: Second
+    third:
+      label: Third
+bb_col4-equal:
+  label: 4 Columns Equal
+  category: Barrio
+  path: layouts
+  template: col4-equal
+  default_region: first
+  icon_map:
+    - [first, second, third, fourth]
+  regions:
+    first:
+      label: First
+    second:
+      label: Second
+    third:
+      label: Third
+    fourth:
+      label: Fourth
\ No newline at end of file

layouts/col2-3-9.html.twig

+{#
+/**
+ * @file
+ * Default theme implementation for a media layout.
+ *
+ * Available variables:
+ * - content: The content for this layout.
+ * - attributes: HTML attributes for the layout <div>.
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes.addClass('row') }}>
+
+  <div{{ region_attributes.first.addClass('col-sm-3') }}>
+    {{ content.first }}
+  </div>
+
+  <div{{ region_attributes.second.addClass('col-sm-9') }}>
+    {{ content.second }}
+  </div>
+
+</div>

layouts/col2-9-3.html.twig

+{#
+/**
+ * @file
+ * Default theme implementation for a media layout.
+ *
+ * Available variables:
+ * - content: The content for this layout.
+ * - attributes: HTML attributes for the layout <div>.
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes.addClass('row') }}>
+
+  <div{{ region_attributes.first.addClass('col-sm-9') }}>
+    {{ content.first }}
+  </div>
+
+  <div{{ region_attributes.second.addClass('col-sm-3') }}>
+    {{ content.second }}
+  </div>
+
+</div>

layouts/col2-equal.html.twig

+{#
+/**
+ * @file
+ * Default theme implementation for a media layout.
+ *
+ * Available variables:
+ * - content: The content for this layout.
+ * - attributes: HTML attributes for the layout <div>.
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes.addClass('row') }}>
+
+  <div{{ region_attributes.first.addClass('col-sm-6') }}>
+    {{ content.first }}
+  </div>
+
+  <div{{ region_attributes.second.addClass('col-sm-6') }}>
+    {{ content.second }}
+  </div>
+
+</div>

layouts/col3-equal.html.twig

+{#
+/**
+ * @file
+ * Default theme implementation for a media layout.
+ *
+ * Available variables:
+ * - content: The content for this layout.
+ * - attributes: HTML attributes for the layout <div>.
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes.addClass('row') }}>
+
+  <div{{ region_attributes.first.addClass('col-sm-4') }}>
+    {{ content.first }}
+  </div>
+
+  <div{{ region_attributes.second.addClass('col-sm-4') }}>
+    {{ content.second }}
+  </div>
+
+  <div{{ region_attributes.third.addClass('col-sm-4') }}>
+    {{ content.second }}
+  </div>
+
+</div>

layouts/col4-equal.html.twig

+{#
+/**
+ * @file
+ * Default theme implementation for a media layout.
+ *
+ * Available variables:
+ * - content: The content for this layout.
+ * - attributes: HTML attributes for the layout <div>.
+ *
+ * @ingroup themeable
+ */
+#}
+<div{{ attributes.addClass('row') }}>
+
+  <div{{ region_attributes.first.addClass('col-sm-3', 'col-sm-6') }}>
+    {{ content.first }}
+  </div>
+
+  <div{{ region_attributes.second.addClass('col-sm-3', 'col-sm-6') }}>
+    {{ content.second }}
+  </div>
+
+  <div{{ region_attributes.third.addClass('col-sm-3', 'col-sm-6') }}>
+    {{ content.third }}
+  </div>
+
+  <div{{ region_attributes.fourth.addClass('col-sm-3', 'col-sm-6') }}>
+    {{ content.fourth }}
+  </div>
+
+</div>