{{>header this.style}}
<main class="results">
  {{>search_bar this}}
  <div class="results_aggregated">
    {{#if results}} {{#each results}}
    <div class="result">
      <h1><a href="{{{this.url}}}">{{{this.title}}}</a></h1>
      <small>{{{this.url}}}</small>
      <p>{{{this.description}}}</p>
      <div class="upstream_engines">
        {{#each engine}}
        <span>{{{this}}}</span>
        {{/each}}
      </div>
    </div>
    {{/each}} {{else}}
    <div class="result_not_found">
      <p>Your search - {{{this.pageQuery}}} - did not match any documents.</p>
      <p class="suggestions">Suggestions:</p>
      <ul>
        <li>Make sure that all words are spelled correctly.</li>
        <li>Try different keywords.</li>
        <li>Try more general keywords.</li>
      </ul>
      <img src="./images/no_results.gif" alt="Man fishing gif" />
    </div>
    {{/if}}
  </div>
  <div class="page_navigation">
    <button type="button" onclick="navigate_backward()">
      &#8592; previous
    </button>
    <button type="button" onclick="navigate_forward()">next &#8594;</button>
  </div>
</main>
<script src="static/index.js"></script>
<script src="static/pagination.js"></script>
<script src="static/error_box.js"></script>
{{>footer}}