common.scss 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. /* ==================
  2. 扩展ColorUI
  3. ==================== */
  4. .cu-load.info::before {
  5. content: "\e6e5";
  6. }
  7. .cu-load.info::after {
  8. content: "上滑加载更多";
  9. }
  10. /* ==================
  11. 覆盖UniApp
  12. ==================== */
  13. /* 防止 uni.showToast 被遮盖 */
  14. uni-toast{
  15. z-index: 999999;
  16. }
  17. /* ==================
  18. 覆盖ColorUI
  19. ==================== */
  20. .wrap{
  21. flex-wrap: wrap;
  22. }
  23. .direction{
  24. flex-direction: column;
  25. }
  26. .item-center{
  27. align-items: center;
  28. }
  29. .item-end{
  30. align-items: flex-end;
  31. }
  32. .content-center{
  33. justify-content: center;
  34. }
  35. .content-between{
  36. justify-content: space-between;
  37. }
  38. .relative{
  39. position: relative;
  40. }
  41. .absolute{
  42. position: absolute;
  43. }
  44. .fixed{
  45. position: fixed;
  46. }
  47. .b0{
  48. bottom: 0;
  49. }
  50. .l0{
  51. left: 0;
  52. }
  53. .t0{
  54. top: 0;
  55. }
  56. .r0{
  57. right: 0;
  58. }
  59. .fff{
  60. color: #fff;
  61. }
  62. .p-5{
  63. padding: 5px;
  64. }
  65. .p-10{
  66. padding: 10px;
  67. }
  68. .p-15{
  69. padding: 15px;
  70. }
  71. .p-20{
  72. padding: 20px;
  73. }
  74. .mr-10{
  75. margin-right: 10px;
  76. }
  77. .ml-auto{
  78. margin-left: auto;
  79. }
  80. .w100{
  81. width: 100%;
  82. }
  83. .h100{
  84. height: 100%;
  85. }
  86. .gap{
  87. gap: 10px;
  88. }
  89. .space-nowrap{
  90. white-space: nowrap;
  91. }
  92. .overflow-ellipsis{
  93. text-overflow: ellipsis;
  94. }
  95. .overflow-hidden{
  96. overflow: hidden;
  97. }
  98. .grow{
  99. flex-grow: 1;
  100. }
  101. .cursor-pointer {
  102. cursor: pointer;
  103. }
  104. // 悬浮变色
  105. .hover:hover{
  106. background-color: #8d8da01a;
  107. transition-duration: 0.2s;
  108. }
  109. // 边框颜色
  110. [class*="border"]{
  111. border-width: 1px;
  112. border-style: solid;
  113. }
  114. [class*="border-info"]{
  115. border-color: #FFF3;
  116. }
  117. [class*="border-gray"]{
  118. border-color: rgba(0,0,0, 0.1);
  119. }
  120. .radius{
  121. border-radius: 8px;
  122. }
  123. .z-index{
  124. z-index: 999;
  125. }
  126. // 字大小
  127. [class*="size-mini"]{
  128. font-size: 12px;
  129. }
  130. [class*="size-normal"]{
  131. font-size: 14px;
  132. }
  133. [class*="size-large"]{
  134. font-size: 16px;
  135. }
  136. [class*="size-huge"]{
  137. font-size: 18px;
  138. }
  139. .box-shadow{
  140. box-shadow: 0 0 15px rgba(0,0,0,.1);
  141. }
  142. .background-color-white{
  143. background-color: #FFF;
  144. }
  145. .background-color-gray{
  146. background-color: #ececf1;
  147. }
  148. .background-color-active{
  149. background-color: #8d8da01a;
  150. }
  151. .button-none::after{
  152. border: none;
  153. }