nttdata_admin-1.0.x-dev/templates/section/help-section.html.twig
templates/section/help-section.html.twig
{#
/**
* @file
* Theme override for a section of the help page.
*
* This implementation divides the links into 4 columns.
*
* Available variables:
* - title: The section title.
* - description: The description text for the section.
* - links: Links to display in the section.
* - empty: Text to display if there are no links.
*/
#}
<div class="clearfix help-section">
<h2>{{ title }}</h2>
<p>{{ description }}</p>
{% if links %}
{# Calculate the column length, to divide links into 4 columns. #}
{% set size = links|length // 4 %}
{% if size * 4 < links|length %}
{% set size = size + 1 %}
{% endif %}
{# Output the links in 4 columns. #}
{% set count = 0 %}
{% for link in links %}
{% if count == 0 %}
{# Start a new column. #}
<div class="layout-column layout-column--quarter">
{% endif %}
<div class="section-item">{{ link }}
<div class="card-icon">
<div class="nttdata-icon">
<svg width="11px" height="11px" viewBox="0 0 11 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g class="arrow-group" transform="translate(-7.000000, -7.000000)">
<path d="M12.8824333,7 L18,12.5000197 L12.8824333,18 L11.8125183,16.8502914 L15.097,13.32 L7,13.3203142 L7,11.6788584 L15.097,11.678 L11.8125183,8.14970861 L12.8824333,7 Z" id="Combined-Shape-Copy-2"></path>
</g>
</g>
</svg>
</div>
</div>
</div>
{% set count = count + 1 %}
{% if count >= size %}
{# End the current column. #}
{% set count = 0 %}
</div>
{% endif %}
{% endfor %}
{# End the last column, if one is open. #}
{% if count > 0 %}
</div>
{% endif %}
{% else %}
<p>{{ empty }}</p>
{% endif %}
</div>
