[WT-631] Changed the row's column splitting

patterns/molecules/row/row.html.twig

@@ -10,21 +10,21 @@
 {% set title_attributes = title_attributes.addClass("row-component-title") %}
 
 {% if variants.title_color.color %}
-  {% set title_attributes = title_attributes.setAttribute('style', "color:" ~ variants.title_color.color ~ "") %}
+	{% set title_attributes = title_attributes.setAttribute('style', "color:" ~ variants.title_color.color ~ "") %}
 {% endif %}
 
 {%
-    set classes = [
-    "component-row",
-    "component-row__display__" ~ variants.display.value,
-    "section-navigation"
-    ]
+	set classes = [
+	"component-row",
+	"component-row__display__" ~ variants.display.value,
+	"section-navigation"
+]
 %}
 
 {% if (variants.header.value == 1) %}
-  {%
-    set classes = classes|merge(["component-row__has-header"])
-  %}
+	{%
+		set classes = classes|merge(["component-row__has-header"])
+	%}
 {% endif %}
 
 {% set attributes = create_attribute() %}
@@ -36,137 +36,179 @@
 {% set attributes_bg_image_attachment = 'scroll' %}
 
 {% if variants.full_height.value == 1 %}
-  {% set attributes = attributes.addClass('is_full_height') %}
+	{% set attributes = attributes.addClass('is_full_height') %}
 {% endif %}
 
 {% if variants.height.value %}
-  {% set attributes = attributes.addClass(variants.height.value) %}
+	{% set attributes = attributes.addClass(variants.height.value) %}
 {% endif %}
 
 {% if variants.show_title.value == 1 and title | render %}
-  {% set attributes = attributes.addClass('has_title') %}
+	{% set attributes = attributes.addClass('has_title') %}
 {% endif %}
 
 {% if variants.lazy.value == 1 %}
-  {% set attributes = attributes.addClass('is-cern-lazy') %}
+	{% set attributes = attributes.addClass('is-cern-lazy') %}
 {% endif %}
 
 {% if variants.show_in_scroll.value == 1 and variants.scroll_menu_title.value != '' %}
-  {% set attributes = attributes.setAttribute('data-title', variants.scroll_menu_title.value) %}
+	{% set attributes = attributes.setAttribute('data-title', variants.scroll_menu_title.value) %}
 {% endif %}
 
 {# bootstrap classes : left #}
 {% if left_column | render is not empty or left_column_blocks | render is not empty or left_column_views | render is not empty is not empty or left_column_content | render is not empty %}
-  {% set hasleft = create_attribute() %}
-  {% set hasleft = true %}
+	{% set hasleft = create_attribute() %}
+	{% set hasleft = true %}
 {% endif %}
 
 {# bootstrap classes : right #}
 {% if right_column | render is not empty or right_column_blocks | render is not empty or right_column_views | render is not empty is not empty or right_column_content | render is not empty %}
-  {% set hasright = create_attribute() %}
-  {% set hasright = true %}
+	{% set hasright = create_attribute() %}
+	{% set hasright = true %}
 {% endif %}
 
-{% if hasleft and hasright %}
-  {%
-    set mainclasses = [
-      'component-row__column',
-      'component-row__center',
-      'col-md-6',
-      'col-sm-12',
-      'col-xs-12',
-    ]
-  %}
+{# bootstrap classes : center #}
+{% if main | render is not empty or main_column_blocks | render is not empty or main_column_views | render is not empty is not empty or main_column_content | render is not empty %}
+	{% set hasmain = create_attribute() %}
+	{% set hasmain = true %}
 {% endif %}
 
-{% if hasleft and hasright is empty %}
-  {%
-    set mainclasses = [
-      'component-row__column',
-      'component-row__center',
-      'col-md-9',
-      'col-sm-12',
-      'col-xs-12',
-    ]
-  %}
+
+{% set leftclasses = [
+	'component-row__column',
+	'component-row__sidebar-left',
+	'col-md-6',
+	'col-sm-12',
+	'col-xs-12'
+]
+%}
+
+{% set rightclasses = [
+	'component-row__column',
+	'component-row__sidebar-left',
+	'col-md-6',
+	'col-sm-12',
+	'col-xs-12'
+]
+%}
+
+{%  set mainclasses = [
+	'component-row__column',
+	'component-row__center',
+	'col-md-9',
+	'col-sm-12',
+	'col-xs-12',
+]
+%}
+
+{% if hasright and hasleft is empty and hasmain is empty %}
+	{% set rightclasses = [
+		'component-row__column',
+		'component-row__sidebar-left',
+		'col-md-offset-6',
+		'col-md-6',
+		'col-sm-12',
+		'col-xs-12'
+	]
+	%}
 {% endif %}
 
-{% if hasleft is empty and hasright %}
-  {%
-    set mainclasses = [
-      'component-row__column',
-      'component-row__center',
-      'col-md-9',
-      'col-sm-12',
-      'col-xs-12',
-    ]
-  %}
+{% if hasmain %}
+
+	{% set leftclasses = [
+		'component-row__column',
+		'component-row__sidebar-left',
+		'col-md-3',
+		'col-sm-12',
+		'col-xs-12'
+	]
+	%}
+
+	{% set rightclasses = [
+		'component-row__column',
+		'component-row__sidebar-right',
+		'col-md-3',
+		'col-sm-12',
+		'col-xs-12'
+	]
+	%}
+
 {% endif %}
 
 {% if hasleft is empty and hasright is empty %}
-  {%
-    set mainclasses = [
-      'component-row__column',
-      'component-row__center',
-      'section-has-no-column',
-      'col-md-12',
-      'col-sm-12',
-      'col-xs-12',
-    ]
-  %}
+	{%
+		set mainclasses = [
+		'component-row__column',
+		'component-row__center',
+		'section-has-no-column',
+		'col-md-12',
+		'col-sm-12',
+		'col-xs-12',
+	]
+	%}
 {% endif %}
 
 {% if variants.box_effects.value == 1 and variants.box_effects.value != '' %}
-  {% set attributes = attributes.addClass('box-effects') %}
+	{% set attributes = attributes.addClass('box-effects') %}
 {% endif %}
 
 <div{{ attributes }}>
 
-  {% if background | render %}
-    {{ background }}
-  {% endif %}
-
-  {% if variants.show_title.value == 1 %}
-    <h1 {{ title_attributes }}>
-      {{ title }}
-    </h1>
-  {% endif %}
-
-  {% set inner_attributes = create_attribute() %}
-  {% set inner_attributes = inner_attributes.addClass(mainclasses) %}
-
-  <div class="component-row__row">
-
-    {# left column #}
-    {% if left_column | render is not empty or left_column_blocks | render is not empty or left_column_views | render is not empty is not empty or left_column_content | render is not empty %}
-      <div class="component-row__column component-row__sidebar-left col-md-3 col-sm-12 col-xs-12">
-        {{ left_column }}
-        {{ left_column_blocks }}
-        {{ left_column_views }}
-        {{ left_column_content }}
-      </div>
-    {% endif %}
-
-    {# main column #}
-    <div{{ inner_attributes }}>
-      <div class="box-effects-wrapper {% if variants.box_effects.value == 1 and variants.box_effects.value != '' %} enable-effects {% endif %}">
-        {{ main }}
-        {{ main_column_blocks }}
-        {{ main_column_views }}
-        {{ main_column_content }}
-      </div>
-    </div>
-
-    {# right column #}
-    {% if right_column | render is not empty or right_column_blocks | render is not empty or right_column_views | render is not empty is not empty or right_column_content | render is not empty %}
-      <div class="component-row__column component-row__sidebar-right col-md-3 col-sm-12 col-xs-12">
-        {{ right_column }}
-        {{ right_column_blocks }}
-        {{ right_column_views }}
-        {{ right_column_content }}
-      </div>
-    {% endif %}
-
-  </div>
+	{% if background | render %}
+		{{ background }}
+	{% endif %}
+
+	{% if variants.show_title.value == 1 %}
+		<h1 {{ title_attributes }}>
+			{{ title }}
+		</h1>
+	{% endif %}
+
+	{% set inner_attributes = create_attribute() %}
+	{% set inner_attributes = inner_attributes.addClass(mainclasses) %}
+
+	{% set left_attributes = create_attribute() %}
+	{% set left_attributes = left_attributes.addClass(leftclasses) %}
+
+	{% set right_attributes = create_attribute() %}
+	{% set right_attributes = right_attributes.addClass(rightclasses) %}
+
+	<div class="component-row__row">
+
+		{# left column #}
+		{% if left_column | render is not empty or left_column_blocks | render is not empty or left_column_views | render is not empty is not empty or left_column_content | render is not empty %}
+			<div{{ left_attributes }}>
+				{{ left_column }}
+				{{ left_column_blocks }}
+				{{ left_column_views }}
+				{{ left_column_content }}
+			</div>
+		{% endif %}
+
+		{# main column #}
+		{% if hasmain %}
+			<div{{ inner_attributes }}>
+				<div class="box-effects-wrapper {% if variants.box_effects.value == 1 and variants.box_effects.value != '' %} enable-effects {% endif %}">
+					{{ main }}
+					{{ main_column_blocks }}
+					{{ main_column_views }}
+					{{ main_column_content }}
+				</div>
+			</div>
+
+		{% endif %}
+
+
+		{# right column #}
+		{% if right_column | render is not empty or right_column_blocks | render is not empty or right_column_views | render is not empty is not empty or right_column_content | render is not empty %}
+			<div{{ right_attributes }}>
+				{{ right_column }}
+				{{ right_column_blocks }}
+				{{ right_column_views }}
+				{{ right_column_content }}
+			</div>
+		{% endif %}
+
+	</div>
 
 </div>