index.wxss 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. .i-load-more {
  2. width: 65%;
  3. font-size: 24rpx;
  4. display: flex;
  5. align-items: center;
  6. justify-content: center;
  7. padding: 60rpx 0;
  8. margin: 0 auto;
  9. }
  10. .i-load-more-loading {
  11. display: inline-block;
  12. margin-right: 24rpx;
  13. vertical-align: middle;
  14. width: 28rpx;
  15. height: 28rpx;
  16. background: 0 0;
  17. border-radius: 50%;
  18. border: 4rpx solid #e9eaec;
  19. border-color: #e9eaec #e9eaec #e9eaec #2d8cf0;
  20. animation: btn-spin 0.6s linear;
  21. animation-iteration-count: infinite;
  22. }
  23. .i-load-more-tip {
  24. display: inline-block;
  25. vertical-align: middle;
  26. color: #999;
  27. }
  28. .i-load-more-line {
  29. display: flex;
  30. border-top: 0;
  31. }
  32. .i-load-more-line .i-load-more-tip {
  33. position: relative;
  34. top: -.1em;
  35. padding: 0 0.55em;
  36. }
  37. .i-load-more-empty {
  38. /* width: 8rpx;
  39. height: 8rpx; */
  40. border-radius: 50%;
  41. background-color: #e5e5e5;
  42. display: inline-block;
  43. position: relative;
  44. vertical-align: 0;
  45. top: -.16em;
  46. }
  47. @-webkit-keyframes btn-spin {
  48. 0% {
  49. transform: rotate(0);
  50. }
  51. 100% {
  52. transform: rotate(360deg);
  53. }
  54. }
  55. @keyframes btn-spin {
  56. 0% {
  57. transform: rotate(0);
  58. }
  59. 100% {
  60. transform: rotate(360deg);
  61. }
  62. }