nttdata_admin-1.0.x-dev/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>