pagination.scss 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. // Pagination (multiple pages)
  2. // --------------------------------------------------
  3. .pagination {
  4. display: inline-block;
  5. padding-left: 0;
  6. margin: var(--spacing-08) 0;
  7. > li {
  8. display: inline-block;
  9. > a,
  10. > span {
  11. position: relative;
  12. float: left; // Collapse white-space
  13. padding: var(--spacing-04) var(--spacing-06);
  14. line-height: var(--line-height-base);
  15. text-decoration: none;
  16. color: var(--neutral-90);
  17. background-color: #fff;
  18. border: 1px solid var(--neutral-30);
  19. margin-left: -1px;
  20. font-weight: 600;
  21. &:hover,
  22. &:focus {
  23. color: var(--neutral-90);
  24. background-color: var(--neutral-10);
  25. border-color: var(--neutral-30);
  26. text-decoration: none;
  27. }
  28. }
  29. &:first-child {
  30. > a,
  31. > span {
  32. margin-left: 0;
  33. }
  34. }
  35. }
  36. > .active > a,
  37. > .active > span {
  38. &,
  39. &:hover,
  40. &:focus {
  41. z-index: 2;
  42. color: var(--green-70);
  43. background-color: var(--green-10);
  44. border-color: var(--neutral-30);
  45. cursor: default;
  46. }
  47. }
  48. .ellipses {
  49. pointer-events: none;
  50. }
  51. }