index.scss 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. /*
  2. * @Author: jmy
  3. * @Date: 2026-01-01 12:02:41
  4. * @LastEditors: Please set LastEditors
  5. * @LastEditTime: 2025-12-13 16:48:17
  6. * @Description:
  7. */
  8. //加载动画
  9. .scroll-loading {
  10. display: inline-block;
  11. width: 26rpx;
  12. height: 26rpx;
  13. border-radius: 50%;
  14. border: 4rpx solid #999999;
  15. border-bottom-color: transparent !important;
  16. vertical-align: middle;
  17. position: relative;
  18. top: 2rpx;
  19. }
  20. // 加载动画旋转
  21. .scroll-rotate {
  22. animation: mescrollDownRotate 0.6s linear infinite;
  23. }
  24. @keyframes mescrollDownRotate {
  25. from {
  26. transform: rotate(0deg);
  27. }
  28. to {
  29. transform: rotate(360deg);
  30. }
  31. }
  32. //暂无数据
  33. .scs-no-data {
  34. width: 100%;
  35. display: flex;
  36. flex-direction: column;
  37. align-items: center;
  38. .no-image {
  39. width: 280rpx;
  40. height: 180rpx;
  41. margin-top: 200rpx;
  42. }
  43. .no-desc {
  44. font-size: 28rpx;
  45. color: #999999;
  46. }
  47. }
  48. //文本2行
  49. .text-two-line {
  50. -webkit-line-clamp: 2;
  51. display: -webkit-box;
  52. -webkit-box-orient: vertical;
  53. overflow: hidden;
  54. text-overflow: ellipsis;
  55. word-break: break-all;
  56. white-space: normal;
  57. }
  58. // 文本1行
  59. .text-ellipsis {
  60. -webkit-line-clamp: 1;
  61. display: -webkit-box;
  62. -webkit-box-orient: vertical;
  63. overflow: hidden;
  64. text-overflow: ellipsis;
  65. word-break: break-all;
  66. white-space: normal;
  67. }
  68. // 头部压底背景
  69. .scs-bg-top {
  70. width: 100%;
  71. height: 600rpx;
  72. position: fixed;
  73. top: 0;
  74. left: 0;
  75. }
  76. //旋转360度
  77. .rotate-360 {
  78. transform: rotate(360deg)
  79. }
  80. .rotate-180 {
  81. transform: rotate(180deg)
  82. }
  83. .rotate-90 {
  84. transform: rotate(90deg)
  85. }
  86. .rotateY-360 {
  87. transform: rotateY(360deg)
  88. }
  89. .rotateY-180 {
  90. transform: rotateY(180deg)
  91. }
  92. .rotateY-90 {
  93. transform: rotateY(90deg)
  94. }
  95. //y轴翻转180度
  96. // 搜索栏
  97. .scs-search {
  98. display: flex;
  99. justify-content: center;
  100. align-items: center;
  101. font-size: 32rpx;
  102. background-color: transparent;
  103. /* #ifndef APP-NVUE */
  104. gap: 0 28rpx;
  105. /* #endif */
  106. box-sizing: border-box;
  107. .search_title {
  108. width: 176rpx;
  109. height: 44rpx;
  110. }
  111. .search-input {
  112. flex: 1;
  113. height: 72rpx;
  114. background: #ffffff;
  115. border-radius: 36rpx;
  116. display: flex;
  117. align-items: center;
  118. padding: 0 4rpx 0 24rpx;
  119. border: 3rpx solid #02B176;
  120. color: #ffffff;
  121. box-sizing: border-box;
  122. .icon-search {
  123. width: 28rpx;
  124. height: 28rpx;
  125. margin-right: 20rpx;
  126. margin-top: 4rpx;
  127. }
  128. .input-value {
  129. height: 60rpx;
  130. line-height: 60rpx;
  131. flex: 1;
  132. }
  133. button {
  134. background: linear-gradient(90deg, #38D97D 0%, #02B176 100%);
  135. }
  136. }
  137. }
  138. // 文字删除线
  139. .text-line-through::after {
  140. content: ""; /* 必须有content属性,即使是空字符串 */
  141. display: block; /* 或者 inline-block, 根据需要 */
  142. }