微信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

add.wxss 5.3 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
  1. /* pages/billUse/flowAdd/flowAdd.wxss */
  2. .inComeUnit{
  3. border:1rpx solid #ddd;
  4. width:90%;
  5. margin:0 auto;
  6. }
  7. .top{
  8. display: flex;
  9. width: 94%;
  10. margin: 0 auto;
  11. border-radius: 10rpx;
  12. margin-top: 3vw;
  13. overflow: hidden;
  14. }
  15. .top view{
  16. padding: 40rpx 15rpx;
  17. align-items: center;
  18. justify-content: center;
  19. position: relative;
  20. }
  21. .top image{
  22. position: absolute;
  23. width: 94%;
  24. }
  25. .top-title{
  26. flex: 1;
  27. text-align: center;
  28. }
  29. .top-tit{
  30. color: #fff;
  31. }
  32. .rules:before{
  33. content:'*';
  34. color:red;
  35. position: absolute;
  36. right: -10px;
  37. }
  38. .rules.no::before{
  39. content:' ';
  40. padding-left: 14rpx;
  41. color:'#fff';
  42. }
  43. .main-title{
  44. background-image: linear-gradient(to right, #2C8E68 , #B3DB62);
  45. color: #ffffff;
  46. font-size: 18rpx;
  47. padding: 10rpx 0;
  48. text-align: center;
  49. }
  50. .main-box{
  51. background: #ffffff;
  52. padding: 20px;
  53. width: 94%;
  54. margin: 0 auto;
  55. border-radius: 10px;
  56. box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.16);
  57. }
  58. .main-box block{
  59. float: right;
  60. }
  61. .main-box .color-gray{
  62. color: #888;
  63. }
  64. .title{
  65. padding: 10px calc(3% + 20px);
  66. display: block;
  67. }
  68. .van-cell{
  69. padding-left: 0!important;
  70. padding-right: 0!important;
  71. padding-top: 0!important;
  72. margin-bottom: 15px;
  73. }
  74. .table-box .flex-block{
  75. margin-bottom: 5px;
  76. display: flex;
  77. justify-content: space-between;
  78. align-items: center;
  79. padding: 0 20px;
  80. }
  81. .table-box .flex-block text{
  82. }
  83. .table-box .payerBox .flex-block{
  84. padding: 0 ;
  85. }
  86. .table-box .flex-block:last-child{
  87. margin-bottom: 0px;
  88. }
  89. .table-box .rules{
  90. position: relative;
  91. }
  92. .table-box .picker_wrap{
  93. /* display: flex;
  94. justify-content: flex-end;
  95. align-items: center; */
  96. }
  97. .table-box .picker{text-align: right;}
  98. .table-box .wrap{
  99. flex:1;
  100. text-align: right;
  101. border-bottom: 1px solid #DCDCDC;
  102. margin-left: 15px;
  103. height: 40px;
  104. line-height: 40px;
  105. }
  106. .fjLable{
  107. display: flex;
  108. width:24px;
  109. margin:25rpx 5rpx;
  110. color:#fff;
  111. background:#07c160;
  112. text-align: center;
  113. border-radius: 10rpx;
  114. justify-content: center; /* 相对父元素水平居中 */
  115. align-items: center;
  116. padding:25rpx 0;
  117. }
  118. .content {
  119. width: 100%;
  120. background-color: #fff;
  121. }
  122. .img-list {
  123. display: flex;
  124. display: -webkit-flex;
  125. flex-direction: row;
  126. justify-content: flex-start;
  127. align-items: center;
  128. flex-wrap: wrap;
  129. }
  130. .img-item {
  131. width: 30%;
  132. text-align: left;
  133. margin-right: 3%;
  134. margin-bottom: 10rpx;
  135. position: relative;
  136. }
  137. .img-item .close-ico{
  138. position: absolute;
  139. right: -10rpx;
  140. top: -10rpx;
  141. }
  142. .img-item .imagea {
  143. width: 160rpx;
  144. height: 160rpx;
  145. }
  146. .submit-btn {
  147. width: 100%;
  148. background-color: #fff;
  149. height: 80rpx;
  150. text-align: center;
  151. line-height: 80rpx;
  152. font-size: 30rpx;
  153. position: fixed;
  154. bottom: 100rpx;
  155. }
  156. .chooseimg {
  157. height: 160rpx;
  158. background-color: #fff;
  159. display: flex;
  160. justify-content: center; /* 相对父元素水平居中 */
  161. align-items: center;
  162. }
  163. .weui-uploader__input-box {
  164. float: left;
  165. position: relative;
  166. /* margin-right: 9rpx;
  167. margin-bottom: 9rpx; */
  168. width: 120rpx;
  169. height: 120rpx;
  170. border: 1px solid #d9d9d9;
  171. }
  172. .weui-uploader__input-box:before {
  173. width: 2px;
  174. height: 39.5px;
  175. }
  176. .weui-uploader__input-box:after, .weui-uploader__input-box:before {
  177. content: " ";
  178. position: absolute;
  179. top: 50%;
  180. left: 50%;
  181. -webkit-transform: translate(-50%, -50%);
  182. transform: translate(-50%, -50%);
  183. background-color: #d9d9d9;
  184. }
  185. .weui-uploader__input-box:after {
  186. width: 39.5px;
  187. height: 2px;
  188. }
  189. .weui-uploader__input-box:after, .weui-uploader__input-box:before {
  190. content: " ";
  191. position: absolute;
  192. top: 50%;
  193. left: 50%;
  194. -webkit-transform: translate(-50%, -50%);
  195. transform: translate(-50%, -50%);
  196. background-color: #d9d9d9;
  197. }
  198. .tips {
  199. color: #666;
  200. font-size: 24rpx;
  201. padding-bottom: 20rpx;
  202. }
  203. .img-box {
  204. width: 92%;
  205. margin: auto;
  206. padding-top: 20rpx;
  207. }
  208. .btn button{
  209. line-height: 1.7;
  210. padding-left:80rpx;
  211. padding-right:80rpx;
  212. border-radius: 30rpx;
  213. }
  214. .fj-box text{
  215. background-color: #5CAE77;
  216. color: #ffffff;
  217. text-align: center;
  218. border-radius: 5px;
  219. white-space:pre-wrap;
  220. padding: 22px 8px;
  221. display: block;
  222. }
  223. .fj-li{
  224. margin-top: 20px;
  225. display: flex;
  226. /* flex-wrap: wrap; */
  227. }
  228. .fj-li .img_li{
  229. width: 100%;
  230. height: 18.5vw;
  231. }
  232. .fj-li .img_add{
  233. overflow: hidden;
  234. }
  235. .img_box{
  236. position: relative;
  237. width: 100%;
  238. display: flex;
  239. flex-wrap: wrap;
  240. }
  241. .img_box .img_list{
  242. width: 25%;
  243. margin-left: 5%;
  244. position: relative;
  245. }
  246. .img_box .img_list .van-icon{
  247. font-size: 20px;
  248. position: absolute;
  249. top: 0;
  250. right: 0;
  251. transform: translate(50%,-50%);
  252. }
  253. .img_box .img_list:nth-child(n+4){
  254. margin-top: 15px;
  255. }
  256. .bottom{
  257. width: 84%;
  258. margin: 0 auto;
  259. text-align: center;
  260. margin-top: 50px;
  261. margin-bottom: 50px;
  262. display: flex;
  263. justify-content: center;
  264. }
  265. .bottom view {
  266. width: 47%;
  267. margin: 0 auto;
  268. border-radius: 30px;
  269. display: inline-block;
  270. }
  271. .bottom .btn1{
  272. border: 1px solid #2C8E68;
  273. padding: 8px 0px;
  274. color: #2C8E68;
  275. }
  276. .bottom .btn2{
  277. border: 1px solid transparent;
  278. padding: 8px 0px;
  279. background-image: linear-gradient(to right, #2C8E68, #5CAE77);
  280. color: #fff;
  281. }
  282. .bottom .btn3{
  283. border: 1px solid transparent;
  284. padding: 8px 0px;
  285. background-image: linear-gradient(to right, #2C8E68, #5CAE77);
  286. color: #fff;
  287. width: 100%;
  288. }
  289. .headTit{
  290. text-align: center;
  291. margin-bottom: 15px;
  292. }
  293. .headTit text{
  294. width: 60%;
  295. display: block;
  296. margin: 0 auto;
  297. border-bottom: 1px solid #333333;
  298. font-size: 18px;
  299. line-height: 38px;
  300. }