EU System

Search Page

Template for the search page.

{#
  This is an example and should not be used as it is.
#}

<div class="ecl-container ecl-u-mv-l">
  <div class="ecl-row ecl-u-mb-l">
    <div class="ecl-col">
      {% include '@ecl/eu-component-search-form' with { 'variant': 'internal', 'input': { 'id': 'internal-search' } } only %}
    </div>
  </div>
  <div class="ecl-row">
    <aside class="ecl-col-lg-3" role="complementary">
      <div class="ecl-u-d-flex ecl-u-d-lg-none ecl-u-justify-content-between ecl-u-align-items-baseline">
        <h2 class="ecl-heading ecl-heading--h2">Search results (65)</h2>
        {% include '@ecl/eu-component-button' with {
          'modifier': 'primary',
          'type_attribute': 'button',
          'label': 'Refine',
          'extra_classes': 'ecl-u-d-lg-none ecl-expandable__button',
          'extra_attributes': [
            { 'name': 'aria-controls', 'value': 'form-filter' },
            { 'name': 'aria-expanded', 'value': 'true' }
          ]
        } only %}
      </div>
      {% embed '@ecl/eu-component-form-form' with { 'extra_classes': 'ecl-u-d-lg-block ecl-u-aria', 'extra_attributes': [{ 'name': 'aria-hidden', 'value': 'false' }, { 'name': 'method', 'value': 'get' }, { 'name': 'id', 'value': 'form-filter' } ] } only %}
        {% block form %}
          {% embed '@ecl/eu-component-form-fieldset' with {} only %}
            {% block fieldset %}
              {% include '@ecl/eu-component-form-legend' with { content: 'Search options', level: 1 } only %}
              {% embed '@ecl/eu-component-form-form-group' with {} only %}
                {% block form_group %}
                  {% include '@ecl/eu-component-form-label' with { 'label': 'Source', 'for_attribute': 'search-option-source' } only %}
                  {% embed '@ecl/eu-component-form-select' with { 'name': 'source', 'id': 'search-option-source' } only %}
                    {% block options %}
                      <option value="all">All sources</option>
                      <option value="dg-trade" selected>DG Trade</option>
                    {% endblock %}
                  {% endembed %}
                {% endblock %}
              {% endembed %}
              {% embed '@ecl/eu-component-form-form-group' %}
                {% block form_group %}
                  {% include '@ecl/eu-component-form-label' with { 'label': 'Date', 'for_attribute': 'search-option-date' } only %}
                  {% embed '@ecl/eu-component-form-select' with { 'name': 'date', 'id': 'search-option-date' } only %}
                    {% block options %}
                      <option value="all">All dates</option>
                      <option value="today">Today</option>
                      <option value="last_week">Last week</option>
                      <option value="last_year">Last year</option>
                    {% endblock %}
                  {% endembed %}
                {% endblock %}
                {% endembed %}
              {% embed '@ecl/eu-component-form-form-group' %}
                {% block form_group %}
                  {% include '@ecl/eu-component-form-label' with { 'label': 'Language', 'for_attribute': 'search-option-language' } only %}
                  {% embed '@ecl/eu-component-form-select' with { 'name': 'language', 'id': 'search-option-language' } only %}
                    {% block options %}
                      <option value="en">English</option>
                      <option value="de">Deutsch</option>
                      <option value="fr">Français</option>
                    {% endblock %}
                  {% endembed %}
                {% endblock %}
              {% endembed %}
              {% embed '@ecl/eu-component-form-form-group' %}
                {% block form_group %}
                  {% include '@ecl/eu-component-form-label' with { 'label': 'File Format', 'for_attribute': 'search-option-file-format' } only %}
                  {% embed '@ecl/eu-component-form-select' with { 'name': 'file-format', 'id': 'search-option-file-format' } only %}
                    {% block options %}
                      <option value="all">All formats</option>
                      <option value="doc">Doc</option>
                      <option value="pdf">PDF</option>
                      <option value="web">Web</option>
                    {% endblock %}
                  {% endembed %}
                {% endblock %}
              {% endembed %}
            {% endblock %}
          {% endembed %}
          {% embed '@ecl/eu-component-form-fieldset' with {} only %}
            {% block fieldset %}
              {% include '@ecl/eu-component-form-legend' with { content: 'Filter by topic', level: 1 } only %}
              <p class="ecl-u-ph-m ecl-u-pv-xl" style="background-color:#e3e3e3;text-align:center">Custom component</p>
            {% endblock %}
          {% endembed %}
          <div class="ecl-u-mv-m">
            {% include '@ecl/eu-component-button' with {
              'modifier': 'primary',
              'is_block': true,
              'extra_classes': 'ecl-u-mv-s ecl-u-mh-auto',
              'label': 'Refine results'
            } only %}
            {% include '@ecl/eu-component-button' with {
              'label': 'Clear all',
              'type_attribute': 'reset',
              'is_block': true,
              'extra_classes': 'ecl-u-mv-s ecl-u-mh-auto'
            } only %}
          </div>
        {% endblock %}
      {% endembed %}
    </aside>
    <section class="ecl-col-lg-9">
      <h2 class="ecl-heading ecl-heading--h2 ecl-u-d-none ecl-u-d-lg-block">Search results (65)</h2>
      <h3 class="ecl-heading ecl-heading--h3">Showing results 11 to 20</h3>
      <div class="ecl-u-d-flex ecl-u-align-items-center ecl-u-flex-wrap">
        {% include '@ecl/eu-component-tag' with {
          'modifier': 'facet-close',
          'label': 'Source',
          'tags': [{ 'value': 'DG Trade', 'href': '../../example.html#remove-filter' }],
          'extra_classes': 'ecl-u-mv-xxxs'
        } only %}
        {% include '@ecl/eu-component-tag' with {
          'modifier': 'facet-close',
          'label': 'Topics',
          'tags': [{ 'value': 'Health, wellbeing & Consumer protection', 'href': '../../example.html#remove-filter' }],
          'extra_classes': 'ecl-u-mv-xxxs'
        } only %}
      </div>
      <ul class="ecl-list ecl-list--unstyled ecl-u-mv-m">
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          {% include '@ecl/eu-component-link' with {
            'label': 'Related docs',
            'href': '#',
            'extra_classes': 'ecl-expandable__button',
            'extra_attributes': [
              { 'name': 'aria-controls', 'value': 'example-expandable-1'},
              { 'name': 'aria-expanded', 'value': 'false'},
              { 'name': 'id', 'value': 'example-expandable-button-1' }
            ]
          } only %}
          <ul aria-hidden="true" class="ecl-u-aria" aria-labelledby="example-expandable-button-1" id="example-expandable-1" class="ecl-list ecl-list--unstyled ecl-u-mv-m ecl-u-ml-l">
            <li class="ecl-u-mv-m">
              {% include '@ecl/eu-component-meta' with {
                'meta_item_type_data': 'web',
                'meta_item_data': '17 October 2015',
              } only %}
              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
                {% include '@ecl/eu-component-link' with {
                  'label': 'EU funded Ebola treatment delivers encouraging results',
                  'href': 'https://ec.europa.eu/growth/index_en'
                } only %}
              </h4>
              {% include '@ecl/eu-component-link' with {
                'label': 'ec.europa.eu/growth/index_en',
                'href': 'https://ec.europa.eu/growth/index_en'
              } only %}
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
              <hr class="ecl-u-mt-m" />
            </li>
            <li class="ecl-u-mv-m">
              {% include '@ecl/eu-component-meta' with {
                'meta_item_type_data': 'web',
                'meta_item_data': '17 October 2015',
              } only %}
              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
                {% include '@ecl/eu-component-link' with {
                  'label': 'EU funded Ebola treatment delivers encouraging results',
                  'href': 'https://ec.europa.eu/growth/index_en'
                } only %}
              </h4>
              {% include '@ecl/eu-component-link' with {
                'label': 'ec.europa.eu/growth/index_en',
                'href': 'https://ec.europa.eu/growth/index_en'
              } only %}
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
              <hr class="ecl-u-mt-m" />
            </li>
            <li class="ecl-u-mv-m">
              {% include '@ecl/eu-component-meta' with {
                'meta_item_type_data': 'web',
                'meta_item_data': '17 October 2015',
              } only %}
              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
                {% include '@ecl/eu-component-link' with {
                  'label': 'EU funded Ebola treatment delivers encouraging results',
                  'href': 'https://ec.europa.eu/growth/index_en'
                } only %}
              </h4>
              {% include '@ecl/eu-component-link' with {
                'label': 'ec.europa.eu/growth/index_en',
                'href': 'https://ec.europa.eu/growth/index_en'
              } only %}
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
            </li>
          </ul>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'pdf',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'doc',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'doc',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'pdf',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">
          {% include '@ecl/eu-component-meta' with {
            'meta_item_type_data': 'web',
            'meta_item_data': '17 October 2015',
          } only %}
          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">
            {% include '@ecl/eu-component-link' with {
              'label': 'EU funded Ebola treatment delivers encouraging results',
              'href': 'https://ec.europa.eu/growth/index_en'
            } only %}
          </h4>
          {% include '@ecl/eu-component-link' with {
            'label': 'ec.europa.eu/growth/index_en',
            'href': 'https://ec.europa.eu/growth/index_en'
          } only %}
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <div aria-hidden="true" class="ecl-u-aria" aria-labelledby="example-expandable-button-10" id="example-expandable-10">Related docs</div>
        </li>
      </ul>
      {% include '@ecl/eu-component-pager' with {
        'current_page': 2,
        'max_page': 7
      } only %}
    </section>
  </div>
</div>
{
  "global": {
    "language": "en"
  },
  "_demo": {
    "scripts": "\n        document.addEventListener('DOMContentLoaded', function () {\n          ECL.initExpandables('.ecl-expandable__button');\n          ECL.dialogs({\n            dialogOverlayId: 'ecl-overlay-language-list',\n            triggerElementsSelector: '#ecl-lang-select-sites__overlay'\n          });\n        });\n      "
  }
}
<div class="ecl-container ecl-u-mv-l">
  <div class="ecl-row ecl-u-mb-l">
    <div class="ecl-col">

      <form class="ecl-search-form ecl-search-form--internal">
        <label class="ecl-search-form__textfield-wrapper">
          <span class="ecl-u-sr-only">Search this website</span>

          <input type="search" class="ecl-text-input ecl-search-form__textfield" id="internal-search" name="default-name" />
        </label>

        <button type="submit" class="ecl-button ecl-button--form-primary ecl-search-form__button">Search</button>
      </form>
    </div>
  </div>
  <div class="ecl-row">
    <aside class="ecl-col-lg-3" role="complementary">
      <div class="ecl-u-d-flex ecl-u-d-lg-none ecl-u-justify-content-between ecl-u-align-items-baseline">
        <h2 class="ecl-heading ecl-heading--h2">Search results (65)</h2>

        <button type="button" class="ecl-button ecl-button--primary ecl-u-d-lg-none ecl-expandable__button" aria-controls="form-filter" aria-expanded="true">Refine</button>
      </div>

      <form class="ecl-form ecl-u-d-lg-block ecl-u-aria" aria-hidden="false" method="get" id="form-filter">

        <fieldset class="ecl-fieldset">

          <legend class="ecl-form-legend ecl-form-legend--level-1">Search options</legend>

          <div class="ecl-form-group">

            <label class="ecl-form-label" for="search-option-source">Source</label>

            <select class="ecl-select" id="search-option-source" name="source">
              <option value="all">All sources</option>
              <option value="dg-trade" selected>DG Trade</option>
            </select> </div>

          <div class="ecl-form-group">

            <label class="ecl-form-label" for="search-option-date">Date</label>

            <select class="ecl-select" id="search-option-date" name="date">
              <option value="all">All dates</option>
              <option value="today">Today</option>
              <option value="last_week">Last week</option>
              <option value="last_year">Last year</option>
            </select> </div>

          <div class="ecl-form-group">

            <label class="ecl-form-label" for="search-option-language">Language</label>

            <select class="ecl-select" id="search-option-language" name="language">
              <option value="en">English</option>
              <option value="de">Deutsch</option>
              <option value="fr">Français</option>
            </select> </div>

          <div class="ecl-form-group">

            <label class="ecl-form-label" for="search-option-file-format">File Format</label>

            <select class="ecl-select" id="search-option-file-format" name="file-format">
              <option value="all">All formats</option>
              <option value="doc">Doc</option>
              <option value="pdf">PDF</option>
              <option value="web">Web</option>
            </select> </div>
        </fieldset>

        <fieldset class="ecl-fieldset">

          <legend class="ecl-form-legend ecl-form-legend--level-1">Filter by topic</legend>
          <p class="ecl-u-ph-m ecl-u-pv-xl" style="background-color:#e3e3e3;text-align:center">Custom component</p>
        </fieldset>
        <div class="ecl-u-mv-m">

          <button type="submit" class="ecl-button ecl-button--primary ecl-button--block ecl-u-mv-s ecl-u-mh-auto">Refine results</button>

          <button type="reset" class="ecl-button ecl-button--default ecl-button--block ecl-u-mv-s ecl-u-mh-auto">Clear all</button>
        </div>
      </form>
    </aside>
    <section class="ecl-col-lg-9">
      <h2 class="ecl-heading ecl-heading--h2 ecl-u-d-none ecl-u-d-lg-block">Search results (65)</h2>
      <h3 class="ecl-heading ecl-heading--h3">Showing results 11 to 20</h3>
      <div class="ecl-u-d-flex ecl-u-align-items-center ecl-u-flex-wrap">

        <div class="ecl-tag ecl-tag--facet-close ecl-u-mv-xxxs">
          <span class="ecl-tag__label">Source</span>
          <a class="ecl-tag__item" href="../../example.html#remove-filter">DG Trade</a>
        </div>

        <div class="ecl-tag ecl-tag--facet-close ecl-u-mv-xxxs">
          <span class="ecl-tag__label">Topics</span>
          <a class="ecl-tag__item" href="../../example.html#remove-filter">Health, wellbeing & Consumer protection</a>
        </div>
      </div>
      <ul class="ecl-list ecl-list--unstyled ecl-u-mv-m">
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>

          <a class="ecl-link ecl-expandable__button" href="#" aria-controls="example-expandable-1" aria-expanded="false" id="example-expandable-button-1">Related docs</a>
          <ul aria-hidden="true" class="ecl-u-aria" aria-labelledby="example-expandable-button-1" id="example-expandable-1" class="ecl-list ecl-list--unstyled ecl-u-mv-m ecl-u-ml-l">
            <li class="ecl-u-mv-m">

              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

                <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
              </h4>

              <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
              <hr class="ecl-u-mt-m" />
            </li>
            <li class="ecl-u-mv-m">

              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

                <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
              </h4>

              <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
              <hr class="ecl-u-mt-m" />
            </li>
            <li class="ecl-u-mv-m">

              <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

                <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
              </h4>

              <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
              <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
            </li>
          </ul>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <hr class="ecl-u-mt-m" />
        </li>
        <li class="ecl-u-mv-m">

          <h4 class="ecl-heading ecl-heading--h4 ecl-u-mt-xxs ecl-u-mb-xxxs">

            <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">EU funded Ebola treatment delivers encouraging results</a>
          </h4>

          <a class="ecl-link" href="https://ec.europa.eu/growth/index_en">ec.europa.eu/growth/index_en</a>
          <p class="ecl-paragraph ecl-u-mv-xxxs">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu iaculis elit. Aliquam luctus elit eget tellus ultrices venenatis. Morbi rutrum malesuada nibh nec sollicitudin.</p>
          <div aria-hidden="true" class="ecl-u-aria" aria-labelledby="example-expandable-button-10" id="example-expandable-10">Related docs</div>
        </li>
      </ul>

      <nav class="ecl-pager" aria-label="Pagination navigation">
        <ul class="ecl-pager__list">
          <li class="ecl-pager__item ecl-pager__item--previous">
            <a class="ecl-pager__link" title="Go to previous page" href="/page=1">‹ Previous</a>
          </li>
          <li class="ecl-pager__item ecl-pager__item--first">
            <a class="ecl-pager__link" title="Go to page 1" href="/page=1">
              <span class="ecl-u-sr-only">Page </span>1
            </a>
          </li>
          <li class="ecl-pager__item ecl-pager__item--current" aria-current="true">
            <span class="ecl-pager__item-text">Page</span> 2
          </li>
          <li class="ecl-pager__item">
            <a class="ecl-pager__link" title="Go to page 3" href="/page=3">
              <span class="ecl-u-sr-only">Page </span>3
            </a>
          </li>
          <li class="ecl-pager__item">
            <a class="ecl-pager__link" title="Go to page 4" href="/page=4">
              <span class="ecl-u-sr-only">Page </span>4
            </a>
          </li>
          <li class="ecl-pager__item ecl-pager__item--ellipsis"></li>
          <li class="ecl-pager__item ecl-pager__item--last">
            <a class="ecl-pager__link" title="Go to page 7" href="/page=7">
              <span class="ecl-u-sr-only">Page </span>7
            </a>
          </li>
          <li class="ecl-pager__item ecl-pager__item--next">
            <a class="ecl-pager__link" title="Go to next page" href="/page=3">Next ›</a>
          </li>
        </ul>
      </nav>
    </section>
  </div>
</div>
  • Handle: @ecl/eu-template-search
  • Tags: template
  • Preview:
  • Filesystem Path: ../../src/systems/eu/eu-template/eu-template-search/eu-template-search.twig