index.wxss 906 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. .ar-page {
  2. position: absolute;
  3. inset: 0;
  4. overflow: hidden;
  5. }
  6. .loading-mask {
  7. position: fixed;
  8. inset: 0;
  9. z-index: 9999;
  10. display: flex;
  11. align-items: center;
  12. justify-content: center;
  13. background: rgba(0, 0, 0, 0.55);
  14. }
  15. .loading-card {
  16. width: 360rpx;
  17. padding: 32rpx 28rpx;
  18. border-radius: 16rpx;
  19. background: rgba(0, 0, 0, 0.6);
  20. color: #fff;
  21. display: flex;
  22. flex-direction: column;
  23. align-items: center;
  24. }
  25. .loading-spinner {
  26. width: 64rpx;
  27. height: 64rpx;
  28. border-radius: 50%;
  29. border: 6rpx solid rgba(255, 255, 255, 0.35);
  30. border-top-color: #fff;
  31. animation: arSpin 0.9s linear infinite;
  32. }
  33. .loading-text {
  34. margin-top: 18rpx;
  35. font-size: 28rpx;
  36. line-height: 40rpx;
  37. text-align: center;
  38. }
  39. .loading-progress {
  40. margin-top: 6rpx;
  41. font-size: 24rpx;
  42. opacity: 0.8;
  43. }
  44. @keyframes arSpin {
  45. from { transform: rotate(0deg); }
  46. to { transform: rotate(360deg); }
  47. }