index.less 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
  1. :root:root {
  2. --k-primary: #1CACF1; // 主题色
  3. --k-font-primary: #1CACF1; // 字体色
  4. --van-pull-refresh-head-height: 55px;
  5. --van-skeleton-paragraph-background: #ECEEF3;
  6. --van-skeleton-avatar-background: #ECEEF3;
  7. --van-dialog-message-font-size: 16px;
  8. }
  9. // 默认输入框光标颜色
  10. input,
  11. textarea {
  12. caret-color: var(--k-font-primary) !important;
  13. }
  14. .van-skeleton {
  15. padding: 0;
  16. }
  17. * {
  18. padding: 0;
  19. margin: 0;
  20. border: 0;
  21. box-sizing: border-box;
  22. }
  23. #app {
  24. -webkit-font-smoothing: antialiased;
  25. -moz-osx-font-smoothing: grayscale;
  26. color: #333;
  27. min-height: 100vh;
  28. }
  29. body {
  30. background-color: #f8f9fc;
  31. user-select: none;
  32. }
  33. // tab 选项卡样式
  34. .van-picker .van-picker-column__item--selected {
  35. color: var(--k-font-primary);
  36. }
  37. // 下拉框样式重置
  38. .van-dropdown-menu__bar {
  39. box-shadow: none;
  40. --van-dropdown-menu-title-font-size: 14px;
  41. --van-button-normal-font-size: 16px;
  42. --van-dropdown-menu-height: 44px;
  43. }
  44. .van-dropdown-item {
  45. // 在某些浏览器上面会显示一条线
  46. margin-top: -1px;
  47. }
  48. .van-dropdown-item__content {
  49. border-radius: 0px 0px 12px 12px;
  50. .van-dropdown-item__option {
  51. margin: 0 13px;
  52. height: 44px;
  53. border-radius: 8px;
  54. width: auto;
  55. ;
  56. &:first-child {
  57. margin-top: 12px;
  58. }
  59. &:last-child {
  60. margin-bottom: 12px;
  61. }
  62. &:after {
  63. border: none;
  64. }
  65. .van-cell__title {
  66. white-space: nowrap;
  67. width: 100%;
  68. overflow: hidden;
  69. text-overflow: ellipsis;
  70. font-size: 16px;
  71. color: var(--k-gray-4);
  72. text-align: center;
  73. }
  74. .van-cell__value {
  75. display: none;
  76. }
  77. }
  78. .van-dropdown-item__option--active {
  79. background: #F6F6F6;
  80. .van-cell__title {
  81. font-weight: 600;
  82. color: var(--k-font-primary);
  83. }
  84. }
  85. }
  86. // 固定底部按钮样式
  87. .btnGroupFixed {
  88. padding: 0 25px;
  89. padding-bottom: calc(20px + constant(safe-area-inset-bottom));
  90. padding-bottom: calc(20px + env(safe-area-inset-bottom));
  91. }
  92. // 搜索公用样式
  93. .popupBottomSearch {
  94. --van-picker-toolbar-height: 44px !important;
  95. .van-picker__toolbar {
  96. position: relative;
  97. &::after {
  98. position: absolute;
  99. box-sizing: border-box;
  100. content: ' ';
  101. pointer-events: none;
  102. right: var(--van-padding-md);
  103. bottom: 0;
  104. left: var(--van-padding-md);
  105. border-bottom: 1px solid var(--van-cell-border-color);
  106. transform: scaleY(0.5);
  107. }
  108. }
  109. .van-picker__columns {
  110. padding: 0 24px;
  111. }
  112. .van-picker-column {
  113. position: relative;
  114. z-index: 1;
  115. }
  116. .van-picker__frame {
  117. z-index: 0;
  118. &::after {
  119. background: #f2f2f2;
  120. border-radius: 8px;
  121. }
  122. }
  123. }
  124. .btnGroupPopup {
  125. display: flex;
  126. align-items: center;
  127. justify-content: space-between;
  128. padding: 18px 13px;
  129. .van-button {
  130. font-weight: 400;
  131. width: 48%;
  132. font-size: 16px;
  133. }
  134. }
  135. .myClassM2 {
  136. .amap-marker-label {
  137. background: #FF5A56;
  138. }
  139. }
  140. // 地图样式
  141. .amap-marker-label {
  142. // border: 0;
  143. background: #00B2A7;
  144. border: 0;
  145. color: #fff;
  146. line-height: 18px;
  147. font-size: 12px;
  148. padding: 2px 4px;
  149. border-radius: 4px;
  150. }
  151. // 自定义动画基类
  152. .popup-custom {
  153. transition: all 0.25s;
  154. background: transparent;
  155. overflow: initial;
  156. }
  157. .popup-custom.van-scale {
  158. transform-origin: center -25%;
  159. }
  160. /* 缩放动画 */
  161. .van-scale-enter-from,
  162. .van-scale-leave-to {
  163. opacity: 0;
  164. transform: scale(0.3);
  165. }
  166. .van-scale-enter-active,
  167. .van-scale-leave-active {
  168. transition: all 0.25s;
  169. }
  170. .mb12 {
  171. margin-bottom: 12px !important;
  172. }
  173. .btnGroup {
  174. padding: 0 25px;
  175. padding-bottom: calc(20px + env(safe-area-inset-bottom));
  176. .van-button {
  177. font-size: 18px !important;
  178. font-weight: 500;
  179. }
  180. }
  181. .btnMore {
  182. padding-left: 13px;
  183. padding-right: 13px;
  184. display: flex !important;
  185. justify-content: center !important;
  186. // :global {
  187. .van-button {
  188. width: 100% !important;
  189. }
  190. .van-button+.van-button {
  191. margin-left: 15px;
  192. }
  193. }
  194. .van-overlay {
  195. transition: all 0.25s;
  196. }
  197. .popup-custom {
  198. transition: all 0.25s;
  199. background: transparent;
  200. overflow: initial;
  201. max-width: 100%;
  202. }
  203. .popup-custom.van-scale {
  204. transform-origin: center -25%;
  205. }
  206. /* 缩放动画 */
  207. .van-scale-enter-from,
  208. .van-scale-leave-to {
  209. opacity: 0;
  210. transform: scale(0.3);
  211. }
  212. .van-scale-enter-active,
  213. .van-scale-leave-active {
  214. transition: all 0.25s;
  215. }
  216. .van-toast {
  217. z-index: 9999 !important;
  218. }
  219. .fontBlod {
  220. font-weight: bold;
  221. }