App.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222
  1. <script>
  2. export default {
  3. onLaunch: function() {
  4. console.log('App Launch')
  5. },
  6. onShow: function() {
  7. console.log('App Show')
  8. wx.hideTabBar()
  9. },
  10. onHide: function() {
  11. console.log('App Hide')
  12. }
  13. }
  14. </script>
  15. <style>
  16. page {
  17. --color: #1D8AF6;
  18. --title-color: #383838;
  19. --color1: #44A2FF;
  20. --color2: #44A2FF;
  21. --color3: #a4ddf1;
  22. --color4: #f7c10b;
  23. --color5: #ff0200;
  24. --button-color: #13caca;
  25. --button-color1: #15B3B2;
  26. --link-color: #13caca;
  27. --color-red: #ff7878;
  28. --color-green: #00b600;
  29. --bg-color: #EDF5FF;
  30. --icon-color: #1D8AF6;
  31. --loading-color: #44A2FF;
  32. --padding-rl: 10rpx;
  33. --padding-tb: 10rpx;
  34. --text-color: #999999;
  35. --text-color1: #333;
  36. --text-color2: #808080;
  37. --text-color3: #6E6E6E;
  38. --padding-bottom: 8rpx;
  39. --card-bg: #15B3B2;
  40. --empty-color: #ccc;
  41. --modal-title-color: #D30303;
  42. }
  43. </style>
  44. <style lang="scss">
  45. /*每个页面公共css */
  46. @import '@/uni_modules/uni-scss/index.scss';
  47. @import '@/static/theme.css';
  48. @import '@/static/customicons.css';
  49. // 设置整个项目的背景色
  50. page {
  51. font-size: 16px;
  52. background-color: #F4F5F5;
  53. background-size: cover;
  54. min-height: 100%;
  55. }
  56. body {
  57. // height: 100%;
  58. font-weight: normal;
  59. font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  60. padding: 0;
  61. margin: 0;
  62. }
  63. /* #ifdef H5 */
  64. uni-page-body {
  65. background: transparent;
  66. }
  67. /* #endif */
  68. .red {
  69. color: var(--color-red) !important;
  70. }
  71. .text-red {
  72. color: #f8a2a2 !important;
  73. }
  74. .uv-status-bar {
  75. background: var(--color1);
  76. background-image: none !important;
  77. }
  78. .uv-popup {
  79. .uv-popup__content.bottom {
  80. color: red;
  81. .uv-action-sheet {
  82. .uv-action-sheet__header {
  83. .uv-action-sheet__header__title {
  84. color: var(--color);
  85. }
  86. }
  87. }
  88. }
  89. }
  90. ::-webkit-scrollbar {
  91. width: 2rpx;
  92. height: 2rpx;
  93. }
  94. ::-webkit-scrollbar-thumb {
  95. // background-color: var(--color);
  96. background-color: rgba(199, 226, 244, 0.2);
  97. border-radius: 10rpx;
  98. }
  99. ::-webkit-scrollbar-thumb:window-inactive {
  100. // background-color: rgba(199, 226, 244, 0.6);
  101. }
  102. .uni-tabbar .uni-tabbar__label {
  103. font-size: 11pt;
  104. /* 根据需要调整 */
  105. }
  106. .login-modal {
  107. ::v-deep .uni-modal {
  108. .uni-modal__title {
  109. text-align: center;
  110. }
  111. border-radius: .5rem !important;
  112. ::v-deep .uni-modal__bd {
  113. color: red;
  114. }
  115. .uni-modal__btn {
  116. background: linear-gradient(to right, var(--color1), var(--color));
  117. color: #fff !important;
  118. margin: .5rem 1.5rem;
  119. border-radius: 2rem;
  120. }
  121. }
  122. }
  123. .uv-new-modal {
  124. .slot-content {
  125. text-align: center;
  126. color: #999;
  127. padding: 1rem 0;
  128. font-size: .875rem;
  129. }
  130. .uv-popup {
  131. color: var(--color);
  132. ::v-deep .uv-modal {
  133. border-radius: .5rem;
  134. .uv-modal__title {
  135. color: var(--modal-title-color);
  136. font-size: 1.25rem;
  137. font-weight: normal;
  138. }
  139. .uv-line {
  140. width: 0 !important;
  141. }
  142. .uv-modal__button-group {
  143. height: auto !important;
  144. .uv-modal__button-group__wrapper {
  145. height: 2.4rem !important;
  146. // line-height: 3rem;
  147. }
  148. .uv-modal__button-group__wrapper--confirm {
  149. background: var(--color);
  150. color: #fff;
  151. margin: .75rem 1.75rem 1.75rem .875rem;
  152. border-radius: .5rem;
  153. .uv-modal__button-group__wrapper__text {
  154. color: #fff !important;
  155. }
  156. }
  157. .uv-modal__button-group__wrapper--cancel {
  158. background: #DCEEFF;
  159. color: var(--color);
  160. margin: .75rem .875rem 1.75rem 1.75rem;
  161. border-radius: .5rem;
  162. .uv-modal__button-group__wrapper__text {
  163. color: var(--color) !important;
  164. }
  165. }
  166. .uv-modal__button-group__wrapper--only-confirm {
  167. background: var(--color);
  168. color: #fff;
  169. margin: .75rem 1.75rem;
  170. border-radius: .5rem;
  171. .uv-modal__button-group__wrapper__text {
  172. color: #fff !important;
  173. }
  174. }
  175. }
  176. }
  177. }
  178. }
  179. .uv-tabbar {
  180. .uv-tabbar__content {
  181. padding-top: .5rem;
  182. }
  183. }
  184. </style>