_pagination.scss 910 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. // Pagination
  2. //-------------------------------
  3. // Super lightweight (HTML-wise) blog pagination. `span`s are provided for when there are no more previous or next posts to show.
  4. .pagination {
  5. overflow: hidden;
  6. max-width: 30%;
  7. margin: 0 auto 4rem auto;
  8. color: var(--text-color-light);
  9. > ul {
  10. overflow: hidden;
  11. list-style: none;
  12. max-height: 3rem;
  13. padding: 0;
  14. margin: 2rem 0;
  15. }
  16. hr {
  17. max-width: 100%;
  18. margin-bottom: 0;
  19. }
  20. }
  21. // Pagination items can be `span`s or `a`s
  22. .pagination-item {
  23. display: inline-block;
  24. width: auto;
  25. &-prev {
  26. margin-bottom: 0;
  27. float: left;
  28. a {
  29. color: var(--link-color);
  30. @include border-slide(right);
  31. }
  32. }
  33. &-next {
  34. margin-left: -1px;
  35. text-align: right;
  36. float: right;
  37. a {
  38. color: var(--link-color);
  39. @include border-slide(left);
  40. }
  41. }
  42. }