pager.less 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. //
  2. // Pager
  3. // --------------------------------------------------
  4. .pager {
  5. background-color: @pager-bg;
  6. border-radius: @pager-border-radius;
  7. color: @pager-color;
  8. font-size: 16px;
  9. font-weight: 700;
  10. display: inline-block;
  11. li {
  12. &:first-child {
  13. > a,
  14. > span {
  15. border-left: none;
  16. border-radius: @pager-border-radius 0 0 @pager-border-radius;
  17. }
  18. }
  19. > a,
  20. > span {
  21. background: none;
  22. border: none;
  23. border-left: 2px solid mix(@brand-primary, black, 85%);
  24. color: @inverse;
  25. padding: @pager-padding;
  26. text-decoration: none;
  27. white-space: nowrap;
  28. border-radius: 0 @pager-border-radius @pager-border-radius 0;
  29. line-height: 1.313;
  30. &:hover,
  31. &:focus {
  32. background-color: @pager-hover-bg;
  33. }
  34. &:active {
  35. background-color: @pager-active-bg;
  36. }
  37. // Add some spacing between the icon and text
  38. [class*="fui-"] + span {
  39. margin-left: 8px;
  40. }
  41. span + [class*="fui-"] {
  42. margin-left: 8px;
  43. }
  44. }
  45. }
  46. }