Merge remote-tracking branch 'origin/master'

README.rst

@@ -28,6 +28,9 @@ Installation and Configuration
 * Run migrations: ``python manage.py migrate layouter``.
 * Done.
 
+Please note: Migrations are generated each release. If you checkout the current state of development
+migrations might be missing.
+
 Features
 --------
 
@@ -36,9 +39,9 @@ These are the core features of **Django-CMS Layouter**:
 * Flat tree in structure mode
 * Automatic arrangement of columns, for different screen sizes
 * Warning, due to too many plugins, in structure mode
+* Optional equal height for columns (uses CSS3 flexbox)
 * Toggle grid - show and hide grid in content mode
 
-
 ToDo's
 ------
 

layouter/cms_plugins.py

@@ -18,7 +18,7 @@ class ContainerCMSPlugin(CMSPluginBase):
 
     fieldsets = (
         (None, {
-            'fields': ('container_type', 'margin')
+            'fields': ('container_type', 'margin', 'equal_height')
         }),
         (_('Advanced'), {
             'classes': ('collapse',),

layouter/models.py

@@ -64,6 +64,12 @@ class ContainerPlugin(CMSPlugin):
     margin = models.IntegerField(choices=MARGIN_TYPES, null=False, blank=False, default=MARGIN_TYPES[0][0],
                                  help_text=_('How much margin is needed on the left and right side?'))
 
+    # To achieve same height columns we use the CSS3 flex box grid. For more information about it have a look at
+    # http://caniuse.com/flexbox
+    equal_height = models.BooleanField(_('Align height of all columns in this row. Please note: This setting is not '
+                                         'supported by Internet Explorer 9 and below.'), null=False, blank=False,
+                                       default=False)
+
     css_classes = models.CharField(max_length=512, blank=True, null=True)
 
     @property

layouter/static/layouter/css/layouter.css

@@ -71,4 +71,9 @@
 .full-width:before {
   content: "\e906";
 }
-
+.layouterRow--equalHeight {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}

layouter/templates/layouter/container.html

@@ -2,7 +2,10 @@
 {% load staticfiles %}
 <div class="row layouterRow--outer">
     <div class="col-md-offset-{{ instance.margin }} col-md-{{ width }}">
-        <div class="row layouterRow--inner {% if request.session.layouter_grid %}show-grid{% endif %} {{ instance.css_classes }}">
+        <div class="row layouterRow--inner
+        {% if request.session.layouter_grid %}show-grid{% endif %}
+        {% if instance.equal_height %}layouterRow--equalHeight{% endif %}
+        {{ instance.css_classes }}">
             {% include 'layouter/partials/one_col.html' %}
             {% include 'layouter/partials/two_cols.html' %}
             {% include 'layouter/partials/three_cols.html' %}