Fix: add 2 column layout and reverse section layout

css/layouts.css

+.layouts-dashboards-3,
+.layouts-dashboards-2,
 .layouts-dashboards-1 {
   display: flex;
   justify-content: space-between;
@@ -8,14 +10,17 @@
   flex-direction: column;
 }
 
+.layouts-dashboards-3 .drow:first-child,
 .layouts-dashboards-1 .drow:first-child {
   flex: 1 3;
 }
 
+.layouts-dashboards-3 .drow:last-child,
 .layouts-dashboards-1 .drow:last-child {
   flex: 2 3;
 }
 
+.layouts-dashboards-3 .drow > div,
 .layouts-dashboards-2 .drow > div,
 .layouts-dashboards-1 .drow > div {
   flex: 1;
@@ -24,8 +29,9 @@
   margin-bottom: 1em;
 }
 
-.layouts-dashboards-2 {
-  display: flex;
+.layouts-dashboards-3.dashboard-reverse,
+.layouts-dashboards-1.dashboard-reverse {
+  flex-direction: row-reverse;
 }
 
 .layouts-dashboards-2 .drow {

dashboards.layouts.yml

 layout_1:
-  label: '2 and one column'
+  label: 'Dashboard: 2 and one column'
   path: templates/layouts
   template: layouts--1
   category: 'Dashboards'
+  class: '\Drupal\dashboards\Layouts\SectionLayout'
   icon_map:
     - [one, three]
     - [two, three]
@@ -16,7 +17,7 @@ layout_1:
       label: Right
 
 layout_2:
-  label: '3 columns'
+  label: 'Dashboard: 3 columns'
   path: templates/layouts
   template: layouts--2
   category: 'Dashboards'
@@ -30,3 +31,18 @@ layout_2:
       label: Middle
     three:
       label: Right
+
+layout_3:
+  label: 'Dashboard: 2 Columns'
+  path: templates/layouts
+  template: layouts--3
+  category: 'Dashboards'
+  class: '\Drupal\dashboards\Layouts\SectionLayout'
+  icon_map:
+    - [one, two]
+  library: dashboards/layouts
+  regions:
+    one:
+      label: Left
+    two:
+      label: Right

src/Layouts/SectionLayout.php

+<?php
+
+namespace Drupal\dashboards\Layouts;
+
+use Drupal\Core\Layout\LayoutDefault;
+use Drupal\Core\Form\FormStateInterface;
+use Drupal\Core\Plugin\PluginFormInterface;
+
+/**
+ * Add layout settings.
+ *
+ * Layout plugin settings class.
+ */
+class SectionLayout extends LayoutDefault implements PluginFormInterface {
+
+  /**
+   * {@inheritdoc}
+   */
+  public function defaultConfiguration() {
+    return parent::defaultConfiguration() + [
+      'reverse' => FALSE,
+    ];
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function buildConfigurationForm(array $form, FormStateInterface $form_state) {
+    $configuration = $this->getConfiguration();
+    $form['reverse'] = [
+      '#type' => 'checkbox',
+      '#title' => $this->t('Reverse columns'),
+      '#default_value' => $configuration['reverse'],
+    ];
+    return $form;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function submitConfigurationForm(array &$form, FormStateInterface $form_state) {
+    $this->configuration['reverse'] = $form_state->getValue('reverse');
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function build(array $regions) {
+    $configuration = $this->getConfiguration();
+    $build = parent::build($regions);
+    if ($configuration['reverse']) {
+      $build['#attributes']['class'][] = 'dashboard-reverse';
+    }
+    return $build;
+  }
+
+}

templates/layouts/layouts--3.html.twig

+<section {{ attributes.addClass('layouts-dashboards-3', 'layouts-dashboards') }}>
+{% if content.one %}
+  <div class="drow">
+    <div {{ region_attributes.one }}>
+      {{ content.one }}
+    </div>
+  </div>
+  {% endif %}
+  {% if content.two %}
+  <div class="drow">
+    <div {{ region_attributes.two }}>
+      {{ content.two }}
+    </div>
+  </div>
+  {% endif %}
+</section>