patterns-overview-page.html.twig in UI Patterns 8

UI Pattern library page template, override this in your theme.

1 theme call to patterns-overview-page.html.twig

PatternsLibraryController::overview in modules/ui_patterns_library/src/Controller/PatternsLibraryController.php

Render pattern library page.

File

modules/ui_patterns_library/templates/patterns-overview-page.html.twig

{#
/**
 * @file
 * UI Pattern library page template, override this in your theme.
 */
#}

{% if patterns is not empty %}
  <h2>{{ "Available patterns"|t }}</h2>

  {# List of available patterns with anchor links. #}
  <ul>
    {% for pattern_name, pattern in patterns %}
      <li>
        <a href="#{{ pattern_name }}">{{ pattern.label }}</a>
      </li>
    {% endfor %}
  </ul>

  <hr>

  {% for pattern_name, pattern in patterns %}

    <div class="pattern-preview pattern-preview__{{ pattern.definition.id }}">
      {# Pattern name and desciption. #}
      <a name="{{ pattern_name }}"></a>
      {{ pattern.meta }}

      {# Rendered pattern preview. #}
      <fieldset class="pattern-preview__preview">
        <legend>{{ "Preview"|t }}</legend>
        {{ pattern.rendered }}
      </fieldset>

      {# Link to standalone pattern preview page.#}
      <p>
        <a href="{{ url('ui_patterns.patterns.single', {'name': pattern_name}) }}" class="pattern-preview__view">
          {% trans %}View {{ pattern.label }} as stand-alone{% endtrans %}
        </a>
      </p>
    </div>

    <hr>
  {% endfor %}
{% endif %}