@@ -11,7 +11,8 @@

     ],

     "require": {

         "php": "^5.6 || ^7.0",

-        "contao/core-bundle": "^4.4"

+        "contao/core-bundle": "^4.4",

+        "madeyourday/contao-rocksolid-columns": "^2.0"

     },

     "conflict": {

         "contao/core": "*",

new file mode 100644

@@ -0,0 +1,30 @@

+<?php

+

+/*

+ * This file is part of eSales Media ContentHelperBundle

+ *

+ * (c) Benjamin Roth

+ *

+ * @license proprietary

+ */

+

+namespace EsalesMedia\ContentHelperBundle\EventListener;

+

+use Contao\CoreBundle\Framework\FrameworkAwareInterface;

+use Contao\CoreBundle\Framework\FrameworkAwareTrait;

+use Contao\LayoutModel;

+use Contao\PageModel;

+use Contao\PageRegular;

+

+class PageListener implements FrameworkAwareInterface

+{

+    use FrameworkAwareTrait;

+

+    public function onGeneratePage(PageModel $page, LayoutModel $layout, PageRegular $pageRegular)

+    {

+        if ($layout->rs_columns_load_css_flex) {

+            $assetsDir = 'web/bundles/esalesmediacontenthelper';

+            $GLOBALS['TL_CSS'][] = $assetsDir . '/css/columns-flex.scss||static';

+        }

+    }

+}

new file mode 100644

@@ -0,0 +1,56 @@

+<?php

+

+/*

+ * This file is part of eSales Media ContentHelperBundle

+ *

+ * (c) Benjamin Roth

+ *

+ * @license proprietary

+ */

+

+namespace EsalesMedia\ContentHelperBundle\FrontendController;

+

+

+/**

+ * Extends column start content element

+ */

+class ColumnStart extends \MadeYourDay\RockSolidColumns\Element\ColumnStart

+{

+

+  /**

+   * Add class if needed

+   * @param \ContentModel $objElement

+   * @param string $strColumn

+   */

+	public function __construct(\ContentModel $objElement, $strColumn = 'main')

+	{

+        parent::__construct($objElement, $strColumn);

+

+        if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'top')

+        {

+          $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-top');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'center')

+        {

+          $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-center');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'bottom')

+        {

+          $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-bottom');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'stretch')

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-stretch');

+        }

+

+        if ($this->es_rs_column_sort_large)

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -large-order-'.intval($this->es_rs_column_sort_large));

+        }

+        if ($this->es_rs_column_sort_medium)

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -medium-order-'.intval($this->es_rs_column_sort_medium));

+        }

+        if ($this->es_rs_column_sort_small)

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -small-order-'.intval($this->es_rs_column_sort_small));

+        }

+	}

+}

new file mode 100644

@@ -0,0 +1,43 @@

+<?php

+

+/*

+ * This file is part of eSales Media ContentHelperBundle

+ *

+ * (c) Benjamin Roth

+ *

+ * @license proprietary

+ */

+

+namespace EsalesMedia\ContentHelperBundle\FrontendController;

+

+

+/**

+ * Extends columns start content element

+ */

+class ColumnsStart extends \MadeYourDay\RockSolidColumns\Element\ColumnsStart

+{

+

+  /**

+   * Add class if needed

+   * @param \ContentModel $objElement

+   * @param string $strColumn

+   */

+	public function __construct(\ContentModel $objElement, $strColumn = 'main')

+	{

+        parent::__construct($objElement, $strColumn);

+

+        if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'top')

+        {

+          $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-top');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'center')

+        {

+          $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-center');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'bottom')

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-bottom');

+        } else if ($this->es_rs_columns_valign && $this->es_rs_columns_valign == 'stretch')

+        {

+            $this->arrData['cssID'][1] = trim($this->cssID[1].' -valign-stretch');

+        }

+	}

+}

@@ -10,3 +10,7 @@ services:

     esalesmedia_content_helper.listener.template:

         class: \EsalesMedia\ContentHelperBundle\EventListener\TemplateListener

         public: true

+

+    esalesmedia_content_helper.listener.page:

+        class: \EsalesMedia\ContentHelperBundle\EventListener\PageListener

+        public: true

@@ -8,8 +8,15 @@

  * @license proprietary

  */

+/**

+ * Content elements

+ */

+$GLOBALS['TL_CTE']['rs_columns']['rs_columns_start'] = 'EsalesMedia\\ContentHelperBundle\\FrontendController\\ColumnsStart';

+$GLOBALS['TL_CTE']['rs_columns']['rs_column_start'] = 'EsalesMedia\\ContentHelperBundle\\FrontendController\\ColumnStart';

+

 /**

  * Hooks

  */

 $GLOBALS['TL_HOOKS']['parseTemplate'][] = array('esalesmedia_content_helper.listener.template','onParseTemplate');

+$GLOBALS['TL_HOOKS']['generatePage'][] = array('esalesmedia_content_helper.listener.page','onGeneratePage');

@@ -13,8 +13,10 @@

  */

 foreach ($GLOBALS['TL_DCA']['tl_content']['palettes'] as $key => $palette)

 {

-  $GLOBALS['TL_DCA']['tl_content']['palettes'][$key] = str_replace(',cssID;', ',cssID,es_spacing;', $palette);

+    \Contao\CoreBundle\DataContainer\PaletteManipulator::create()->addField('es_spacing','cssID')->addField('es_padding','es_spacing')->applyToPalette($key,'tl_content');

 }

+\Contao\CoreBundle\DataContainer\PaletteManipulator::create()->addLegend('col_layout_legend','rs_columns_legend')->addField('es_rs_columns_valign','col_layout_legend',\Contao\CoreBundle\DataContainer\PaletteManipulator::POSITION_APPEND)->applyToPalette('rs_columns_start','tl_content');

+\Contao\CoreBundle\DataContainer\PaletteManipulator::create()->addLegend('col_layout_legend','protected_legend')->addField('es_rs_column_sort_large','col_layout_legend',\Contao\CoreBundle\DataContainer\PaletteManipulator::POSITION_APPEND)->addField('es_rs_column_sort_medium','es_rs_column_sort_large')->addField('es_rs_column_sort_small','es_rs_column_sort_medium')->addField('es_rs_columns_valign','es_rs_column_sort_small')->applyToPalette('rs_columns_start','tl_content');

 /*

  * Add fields

@@ -27,6 +29,54 @@ $GLOBALS['TL_DCA']['tl_content']['fields']['es_spacing'] = array

   'inputType'               => 'select',

   'options'                 => array('default','paragraph'),

   'reference'               => &$GLOBALS['TL_LANG']['tl_content']['REF']['es_spacing'],

-  'eval'                    => array('tl_class'=>'w50','mandatory'=>false,'includeBlankOption'=>true),

+  'eval'                    => array('tl_class'=>'clr w50','mandatory'=>false,'includeBlankOption'=>true),

   'sql'                     => "varchar(32) NOT NULL default ''"

 );

+

+$GLOBALS['TL_DCA']['tl_content']['fields']['es_padding'] = array

+(

+    'label'                   => &$GLOBALS['TL_LANG']['tl_content']['es_padding'],

+    'exclude'                 => true,

+    'inputType'               => 'checkbox',

+    'reference'               => &$GLOBALS['TL_LANG']['tl_content']['REF']['es_padding'],

+    'eval'                    => array('tl_class'=>'w50 m12'),

+    'sql'                     => "char(1) NOT NULL default ''"

+);

+

+$GLOBALS['TL_DCA']['tl_content']['fields']['es_rs_columns_valign'] = array

+(

+    'label'                   => &$GLOBALS['TL_LANG']['tl_content']['es_rs_columns_valign'],

+    'exclude'                 => true,

+    'inputType'               => 'select',

+    'options'                 => array('top','center','bottom','stretch'),

+    'reference'               => &$GLOBALS['TL_LANG']['tl_content']['REF']['es_rs_columns_valign'],

+    'eval'                    => array('tl_class'=>'w50','mandatory'=>false,'includeBlankOption'=>true),

+    'sql'                     => "varchar(16) NOT NULL default ''"

+);

+

+$GLOBALS['TL_DCA']['tl_content']['fields']['es_rs_column_sort_small'] = array

+(

+    'label'                   => &$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_small'],

+    'exclude'                 => true,

+    'inputType'               => 'text',

+    'eval'                    => array('tl_class'=>'rs_columns_w33', 'rgxp'=>'natural','maxval'=>6),

+    'sql'                     => "varchar(255) NOT NULL default ''"

+);

+

+$GLOBALS['TL_DCA']['tl_content']['fields']['es_rs_column_sort_medium'] = array

+(

+    'label'                   => &$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_medium'],

+    'exclude'                 => true,

+    'inputType'               => 'text',

+    'eval'                    => array('tl_class'=>'rs_columns_w33', 'rgxp'=>'natural','maxval'=>6),

+    'sql'                     => "varchar(255) NOT NULL default ''"

+);

+

+$GLOBALS['TL_DCA']['tl_content']['fields']['es_rs_column_sort_large'] = array

+(

+    'label'                   => &$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_large'],

+    'exclude'                 => true,

+    'inputType'               => 'text',

+    'eval'                    => array('tl_class'=>'rs_columns_w33', 'rgxp'=>'natural','maxval'=>6),

+    'sql'                     => "varchar(255) NOT NULL default ''"

+);

new file mode 100644

@@ -0,0 +1,28 @@

+<?php

+

+/*

+ * This file is part of eSales Media ContentHelperBundle

+ *

+ * (c) Benjamin Roth

+ *

+ * @license proprietary

+ */

+

+/*

+ * Modify palettes

+ */

+

+\Contao\CoreBundle\DataContainer\PaletteManipulator::create()->addField('rs_columns_load_css_flex','rs_columns_load_css')->applyToPalette('default','tl_layout');

+

+/*

+ * Add fields

+ */

+

+$GLOBALS['TL_DCA']['tl_layout']['fields']['rs_columns_load_css_flex'] = array

+(

+  'label'                   => &$GLOBALS['TL_LANG']['tl_layout']['rs_columns_load_css_flex'],

+  'exclude'                 => true,

+  'inputType'               => 'checkbox',

+  'eval'                    => array('tl_class'=>'w50'),

+  'sql'                     => "char(1) NOT NULL default '1'",

+);

@@ -1,13 +1,11 @@

 <?php

-/**

- * Tweaks for Contao

+/*

+ * This file is part of eSales Media ContentHelperBundle

  *

- * Copyright (c) 2014 Benjamin Roth [http://www.esales-media.de]

+ * (c) Benjamin Roth

  *

- * @package eSM_tweaks

- * @link    http://www.esales-media.de

- * @license commercial

+ * @license proprietary

  */

 /**

@@ -15,9 +13,28 @@

  */

 $GLOBALS['TL_LANG']['tl_content']['es_spacing'][0] = 'Abstand nach dem Element';

 $GLOBALS['TL_LANG']['tl_content']['es_spacing'][1] = 'Fügt einen Abstand nach dem Element ein.';

+$GLOBALS['TL_LANG']['tl_content']['es_padding'][0] = 'Innenabstand';

+$GLOBALS['TL_LANG']['tl_content']['es_padding'][1] = 'Es wird Oben und Unten ein Innenabstand angewendet.';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_columns_valign'][0] = 'Vertikale Ausrichtung';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_columns_valign'][1] = 'Vertikale Ausrichtung des Spalteninhalts.';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_large'][0] = 'Desktop-Sortierung';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_large'][1] = 'Anordnung der Spalte am Desktop.';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_medium'][0] = 'Tablet-Sortierung';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_medium'][1] = 'Anordnung der Spalte am Tablet.';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_small'][0] = 'Mobile-Sortierung';

+$GLOBALS['TL_LANG']['tl_content']['es_rs_column_sort_small'][1] = 'Anordnung der Spalte am Mobilgerät.';

+

+/**

+ * Legends

+ */

+$GLOBALS['TL_LANG']['tl_content']['col_layout_legend'] = 'Spaltenlayout';

 /**

  * References

  */

 $GLOBALS['TL_LANG']['tl_content']['REF']['es_spacing']['default'] = 'Standard';

 $GLOBALS['TL_LANG']['tl_content']['REF']['es_spacing']['paragraph'] = 'Absatz';

+$GLOBALS['TL_LANG']['tl_content']['REF']['es_rs_columns_valign']['top'] = 'Oben';

+$GLOBALS['TL_LANG']['tl_content']['REF']['es_rs_columns_valign']['center'] = 'Mitte';

+$GLOBALS['TL_LANG']['tl_content']['REF']['es_rs_columns_valign']['bottom'] = 'Unten';

+$GLOBALS['TL_LANG']['tl_content']['REF']['es_rs_columns_valign']['stretch'] = 'Gleiche Höhe';

new file mode 100644

@@ -0,0 +1,15 @@

+<?php

+

+/*

+ * This file is part of eSales Media ContentHelperBundle

+ *

+ * (c) Benjamin Roth

+ *

+ * @license proprietary

+ */

+

+/**

+ * Fields

+ */

+$GLOBALS['TL_LANG']['tl_layout']['rs_columns_load_css_flex'][0] = 'Flexbox Spalten-Stylesheet laden';

+$GLOBALS['TL_LANG']['tl_layout']['rs_columns_load_css_flex'][1] = 'Ermöglicht die Verwendung der Spaltenumschlagelemente. Alternativ können Sie Ihr eigenes Stylesheet einbinden.';

new file mode 100644

@@ -0,0 +1,97 @@

+@mixin column-classes($gutter-width, $max-columns, $class-name) {

+  @for $cols from 1 through $max-columns {

+    @for $span from 1 through $cols {

+      &.-#{unquote($class-name)}-col-#{$cols}-#{$span} {

+        flex-basis: 100% / $cols * $span - ($gutter-width * 100%);

+        order: 6;

+      }

+    }

+  }

+

+  @for $cols from 1 through $max-columns {

+    &.-#{unquote($class-name)}-order-#{$cols} {

+      order: $cols;

+    }

+  }

+}

+

+$gutter-width: floor((1 / 960) * 1000000) / 1000000 * 30;

+

+.rs-columns {

+  display: flex;

+  align-items: flex-start;

+  flex-wrap: wrap;

+  margin-left: -#{$gutter-width * 100%};

+  margin-top: -#{$gutter-width * 100%};

+

+  &.-valign-center {

+    align-items: center;

+  }

+  &.-valign-bottom {

+    align-items: flex-end;

+  }

+  &.-valign-stretch {

+    align-items: stretch;

+  }

+}

+

+.rs-column {

+  flex: 0;

+  max-width: 100%;

+  min-width: 0;

+  margin-top: $gutter-width * 100%;

+  margin-left: $gutter-width * 100%;

+  order: 6;

+

+  > * + * {

+    margin-top: 30px;

+  }

+

+  @include column-classes($gutter-width, 6, large);

+

+  &.-valign-center {

+    align-self: center;

+  }

+  &.-valign-bottom {

+    align-self: flex-end;

+  }

+  &.-valign-stretch {

+    align-self: stretch;

+  }

+}

+

+// Tablet portrait format (viewport width 900px and below)

+@media screen and (max-width: 900px) {

+  $gutter-width: floor((1 / 900) * 1000000) / 1000000 * 30;

+

+  .rs-columns {

+    margin-left: -#{$gutter-width * 100%};

+    margin-top: -#{$gutter-width * 100%};

+  }

+

+  .rs-column {

+    margin-top: $gutter-width * 100%;

+    margin-left: $gutter-width * 100%;

+    order: 6;

+

+    @include column-classes($gutter-width, 6, medium);

+  }

+}

+

+// Mobile (viewport width 599px and below)

+@media screen and (max-width: 599px) {

+  $gutter-width: floor((1 / 599) * 1000000) / 1000000 * 30;

+

+  .rs-columns {

+    margin-left: -#{$gutter-width * 100%};

+    margin-top: -#{$gutter-width * 100%};

+  }

+

+  .rs-column {

+    margin-top: $gutter-width * 100%;

+    margin-left: $gutter-width * 100%;

+    order: 6;

+

+    @include column-classes($gutter-width, 6, small);

+  }

+}