<div class="row">
	<div class="col">
		{% for release in changelog %}
			<div class="row dynamicChangelog">
				<div class="offset-2 col-8">

					<div class="card">
						<div class="card-header">
							<h5 class="m-0">
								{{ strings.version }}: {{ release.version }}
								<a class="float-end btn btn-sm btn-outline-dark"
								   title="{{ strings.collapse_label }}"
								   data-bs-toggle="collapse" href="#Release-{{ release.released_at }}"
								>&#9660;</a>
							</h5>
						</div>
						<div class="card-body collapse show" id="Release-{{ release.released_at }}">

							{% if release.title|default('') is not empty %}
								<h5 class="card-title">{{ release.title }}</h5>
							{% endif %}

							<p class="card-text">
								<strong>{{ strings.release_date }}</strong>{{ strings.translated_colon_space }}
								{{ release.released_at|date("Y-m-d") }}
							</p>

							{% for desc in release.description|default([]) %}
								<p class="card-text">{{ desc }}</p>
							{% endfor %}

							{% if release.hrefs.upgrade|default('') is not empty %}
								<p><strong>{{ strings.important_label }}</strong>{{ strings.translated_colon_space }}
									<span>{{ strings.upgrade_notice_sentence_1 }}
									{{ strings.upgrade_notice_sentence_2 }}
										  <a href="{{ release.hrefs.upgrade }}" target="_blank">{{ strings.upgrade_guide_label }}</a>.</span>
								</p>
							{% endif %}

							<ul class="list-group list-group-flush">
								{% for item in release.items %}
									<li class="list-group-item">
										<dl>
											<dt class="mb-1">
												<span class="badge bg-{{ attribute(vars.badge_types,item.type) }}">{{ item.type|upper }}</span>
												{% if item.pro_only|default(false) == true %}
													<span class="badge bg-success">{{ strings.pro_only }}</span>
												{% endif %}
												{% if item.patch|default('') is not empty %}
													<span class="badge bg-dark">
														{{ strings.patch_label }}{{ strings.translated_colon_space }}{{ item.patch }}
													</span>
												{% endif %}
												<span>{{ item.title }}</span>
											</dt>
											{% if item.description|default([]) is not empty %}
												<dd>
													{% for desc in item.description %}
														<p class="mb-2">{{ desc }}</p>
													{% endfor %}
													{% if item.href|default('') is not empty %}
														<p class="text-start">
															<a href="{{ item.href }}" target="_blank">{{ strings.more_info_label }}</a>
														</p>
													{% endif %}
												</dd>
											{% endif %}
										</dl>
									</li>
								{% endfor %}
							</ul>
						</div>
						{% if release.hrefs.release|default('') is not empty %}
							<div class="card-footer text-end">
								<a href="{{ release.hrefs.release }}"
								   class="btn btn-outline-primary"
								   target="_blank">{{ strings.full_release }}</a>
							</div>
						{% endif %}
					</div>

					<hr class="w-50 my-4"/>

				</div>
			</div>
		{% endfor %}
	</div>
</div>
