index.wxss 1.2 KB

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