index.less 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. @import (reference) './variable.less';
  2. @toastPrefix: ant-toast;
  3. .@{toastPrefix} {
  4. color: #fff;
  5. position: fixed;
  6. top: 50%;
  7. left: 50%;
  8. transform: translate3d(-50%, -50%, 0);
  9. z-index: 999;
  10. padding: 24 * @rpx;
  11. display: flex;
  12. flex-direction: column;
  13. justify-content: center;
  14. align-items: center;
  15. background: #000;
  16. border-radius: 16 * @rpx;
  17. &-icon,
  18. &-image,
  19. &-normal {
  20. margin-bottom: 16 * @rpx;
  21. }
  22. &-normal {
  23. height: 80 * @rpx;
  24. }
  25. &-icon {
  26. display: flex;
  27. justify-content: center;
  28. align-items: center;
  29. font-size: 100 * @rpx;
  30. }
  31. &-image,
  32. &-icon {
  33. width: 80 * @rpx;
  34. height: 80 * @rpx;
  35. background-size: contain;
  36. background-repeat: no-repeat;
  37. }
  38. &-text {
  39. &-body {
  40. display: flex;
  41. max-width: 380 * @rpx;
  42. max-height: 84 * @rpx;
  43. justify-content: center;
  44. }
  45. &-box {
  46. min-width: 0;
  47. max-height: 84 * @rpx;
  48. }
  49. &-content {
  50. font-size: 30 * @rpx;
  51. line-height: 42 * @rpx;
  52. max-width: 100%;
  53. overflow: hidden;
  54. text-overflow: ellipsis;
  55. }
  56. }
  57. &-icon-wrapper {
  58. width: 280 * @rpx;
  59. height: 280 * @rpx;
  60. display: flex;
  61. align-items: center;
  62. justify-content: center;
  63. flex-direction: column;
  64. }
  65. &-mask {
  66. z-index: 998;
  67. }
  68. }