Newer
Older
* Custom Paragraphs template for displaying a Four Column layout.
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
*
* Available variables:
* - paragraph: Full paragraph entity.
* - id: The paragraph ID.
* - bundle: The type of the paragraph, for example, "image" or "text".
* - authorid: The user ID of the paragraph author.
* - createdtime: Formatted creation date. Preprocess functions can
* reformat it by calling format_date() with the desired parameters on
* $variables['paragraph']->getCreatedTime().
* - content: All paragraph items. Use {{ content }} to print them all,
* or print a subset such as {{ content.field_example }}. Use
* {{ content|without('field_example') }} to temporarily suppress the printing
* of a given child element.
* - attributes: HTML attributes for the containing element.
* The attributes.class element may contain one or more of the following
* classes:
* - paragraphs: The current template type (also known as a "theming hook").
* - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an
* "Image" it would result in "paragraphs--type--image". Note that the machine
* name will often be in a short form of the human readable label.
* - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a
* preview would result in: "paragraphs--view-mode--preview", and
* default: "paragraphs--view-mode--default".
* - view_mode: View mode; for example, "preview" or "full".
* - logged_in: Flag for authenticated user status. Will be true when the
* current user is a logged-in member.
* - is_admin: Flag for admin user status. Will be true when the current user
* is an administrator.
*
* @see template_preprocess_paragraph()
*
*/
#}
{# Setting up variables that determines the width for left, middle and right columns #}
{% if content.field_column_style_3['#items'].getString() == "paragraph--style--25-25-25-25" %}
{% set leftwidth, mleftwidth, mrightwidth, rightwidth = 'col-xs-12 col-md-3', 'col-xs-12 col-md-3', 'col-xs-12 col-md-3', 'col-xs-12 col-md-3' %}
{% else %}
{% set leftwidth, mleftwidth, mrightwidth, rightwidth = 'col-xs-12 col-md-3', 'col-xs-12 col-md-3', 'col-xs-12 col-md-3', 'col-xs-12 col-md-3' %}
{% endif %}
{# Setting up variable that determines the background color for section #}
{% set bgcolor = content.field_background_color['#items'].getString() %}
{% if bgcolor == ''%}
{% set bgcolor = 'transparent-bg' %}
{% endif %}
{# Prints div with classes, and content without Width and Background. #}
<div{{ attributes.addClass(classes) }}>
<div class="paragraph__column {{ bgcolor }} para_4_col">
{% set thecont = [] %}
{% for item in content|without('field_column_style_4')|without('field_background_color') %}
{% set thecont = thecont|merge(item) %}
{% endfor %}
{% if page_content_type == 'landing_page' and thecont[0]['#paragraph'].type.target_id != 'advanced_callout_box' %}
<div class="container">
{% endif %}
{# Advanced Callout Box Mobile #}
{% if thecont[0]['#paragraph'].type.target_id == 'advanced_callout_box' %}
{% set contcount = thecont|length - 17 %}
<div id="carousel-mobile-{{ rand }}" class="carousel slide adv-callout-carousel adv-callout-mobile" data-ride="false" data-interval="0">
{% if page_content_type == 'landing_page' %}
<div class="container">
<div class="carousel-inner adv-call-mob-inner" role="listbox">
{% for item in thecont|slice(0, contcount) %}
<div class="item {% if loop.first %}active{% endif %}">
<div class="card">
{{ thecont[loop.index0] }}
</div>
</div>
</div>
{% endfor %}
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
{% if page_content_type != 'page' %}
<!-- Controls -->
<div class="col-12 text-center">
<a class="btn btn-primary mb-3 mr-1 control-l" href="#carousel-mobile-{{ rand }}" role="button" data-slide="prev">
<i class="fa fa-angle-left" aria-hidden="true"></i>
</a>
<a class="btn btn-primary mb-3 control-r" href="#carousel-mobile-{{ rand }}" role="button" data-slide="next">
<i class="fa fa-angle-right" aria-hidden="true"></i>
</a>
</div>
{% endif %}
</div>
{# Advanced Callout box #}
{% set counter = 1 %}
{% set contcount = thecont|length - 17 %}
<div id="carousel-desktop-{{ rand }}" class="carousel slide adv-callout-carousel adv-callout-desktop" data-ride="false" data-interval="0">
{% if page_content_type == 'landing_page' %}
<div class="container">
{% endif %}
<div class="carousel-inner" role="listbox">
{% for item in thecont|slice(0, contcount) %}
{% if counter == 1 %}
<div class="item {% if loop.first %}active{% endif %}">
<div class="row {% if loop.last %}last-row{% endif %}">
{% endif %}
<div class="{% if counter == 1 %}col-xs-12 col-md-3 col-l{% elseif counter == 2 or counter == 3 %}col-xs-12 col-md-3 col-m{% else %}col-xs-12 col-md-3 col-r{% endif %}">
<div class="card">
{{ thecont[loop.index0] }}
</div>
</div>
{% if counter == 4 or loop.last %}
</div>
</div>
{% set counter = 5 %}
{% endif %}
{% if counter <= 3 %}
{% set counter = counter + 1 %}
{% endif %}
{% if counter == 5 %}
{% set counter = 1 %}
{% endif %}
{% endfor %}
</div>
{% if page_content_type == 'landing_page' %}
</div>
{% endif %}
{% if page_content_type != 'page' %}
{% if contcount > 4 %}
<!-- Controls -->
<div class="col-6 text-right">
<a class="btn btn-primary mb-3 mr-1 control-l" href="#carousel-desktop-{{ rand }}" role="button" data-slide="prev">
<i class="fa fa-angle-left" aria-hidden="true"></i>
</a>
<a class="btn btn-primary mb-3 control-r" href="#carousel-desktop-{{ rand }}" role="button" data-slide="next">
<i class="fa fa-angle-right" aria-hidden="true"></i>
</a>
</div>
{% endif %}
{% endif %}
</div>
{% elseif thecont[0]['#paragraph'].type.target_id != 'advanced_callout_box' %}
<div class="{{ leftwidth }} col-l">
{{ thecont[0] }}
</div>
{{ thecont[1] }}
</div>
{{ thecont[2] }}
</div>
<div class="{{ rightwidth }} col-r">
{{ thecont[3] }}
</div>
{% endif %}
{% if page_content_type == 'landing_page' and thecont[0]['#paragraph'].type.target_id != 'advanced_callout_box' %}
</div>
{% endif %}
</div>
</div>