pagination.html 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. {% assign children = collections.docs | collection-children: page %}
  2. {% if children.size > 0 %}
  3. <div class="mt-6 pt-6">
  4. <div class="row row-deck row-cards">
  5. {% for c in children %}
  6. {% include "docs/docs-card.html" href=c.url title=c.data.title description=c.data.description icon=c.data.icon %}
  7. {% endfor %}
  8. </div>
  9. </div>
  10. {% else %}
  11. {% assign next-prev = collections.docs | next-prev: page %}
  12. <div class="mt-6 pt-6">
  13. <ul class="pagination">
  14. {% if next-prev.prev %}
  15. <li class="page-item page-prev">
  16. <a class="page-link" href="{{ next-prev.prev.url }}">
  17. <div class="row align-items-center">
  18. <div class="col-auto">
  19. {% include "ui/icon.html" icon="chevron-left" %}
  20. </div>
  21. <div class="col">
  22. <div class="page-item-subtitle">previous</div>
  23. <div class="page-item-title">{{ next-prev.prev.data.title }}</div>
  24. </div>
  25. </div>
  26. </a>
  27. </li>
  28. {% endif %}
  29. {% if next-prev.next %}
  30. <li class="page-item page-next">
  31. <a class="page-link" href="{{ next-prev.next.url }}">
  32. <div class="row align-items-center">
  33. <div class="col">
  34. <div class="page-item-subtitle">next</div>
  35. <div class="page-item-title">{{ next-prev.next.data.title }}</div>
  36. </div>
  37. <div class="col-auto">
  38. {% include "ui/icon.html" icon="chevron-right" %}
  39. </div>
  40. </div>
  41. </a>
  42. </li>
  43. {% endif %}
  44. </ul>
  45. </div>
  46. {% endif %}