| | |
| | | |
| | | .add-button-hover { |
| | | opacity: 0.8; |
| | | } |
| | | |
| | | /* 加载更多样式 */ |
| | | .loading-more-container { |
| | | padding: 20rpx 0; |
| | | text-align: center; |
| | | } |
| | | |
| | | .loading-more { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | padding: 20rpx 0; |
| | | } |
| | | |
| | | .loading-dot { |
| | | width: 16rpx; |
| | | height: 16rpx; |
| | | border-radius: 50%; |
| | | background-color: #0052d9; |
| | | margin: 0 8rpx; |
| | | animation: loading 1.4s infinite ease-in-out both; |
| | | } |
| | | |
| | | .loading-dot:nth-child(1) { |
| | | animation-delay: -0.32s; |
| | | } |
| | | |
| | | .loading-dot:nth-child(2) { |
| | | animation-delay: -0.16s; |
| | | } |
| | | |
| | | @keyframes loading { |
| | | 0%, 80%, 100% { |
| | | transform: scale(0); |
| | | } |
| | | 40% { |
| | | transform: scale(1); |
| | | } |
| | | } |
| | | |
| | | .loading-more text { |
| | | margin-left: 12rpx; |
| | | font-size: 28rpx; |
| | | color: #999; |
| | | } |
| | | |
| | | .no-more-data { |
| | | color: #999; |
| | | font-size: 26rpx; |
| | | line-height: 80rpx; |
| | | } |
| | | |
| | | /* 刷新动画样式 */ |
| | | .refresh-view { |
| | | text-align: center; |
| | | height: 80rpx; |
| | | line-height: 80rpx; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | |
| | | .refresh-view .dot { |
| | | width: 16rpx; |
| | | height: 16rpx; |
| | | background-color: #0052d9; |
| | | border-radius: 50%; |
| | | margin: 0 8rpx; |
| | | animation: refresh 1.4s infinite ease-in-out both; |
| | | } |
| | | |
| | | .refresh-view .dot:nth-child(1) { |
| | | animation-delay: -0.32s; |
| | | } |
| | | |
| | | .refresh-view .dot:nth-child(2) { |
| | | animation-delay: -0.16s; |
| | | } |
| | | |
| | | @keyframes refresh { |
| | | 0%, 80%, 100% { |
| | | transform: scale(0); |
| | | } |
| | | 40% { |
| | | transform: scale(1); |
| | | } |
| | | } |