create.wxss 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. /* pages/order/index.wxss */
  2. .center {
  3. text-align: center;
  4. }
  5. .van-button--primary {
  6. background-color: rgb(15, 179, 123) !important;
  7. border-color:rgb(15, 179, 123) !important;
  8. }
  9. .my-swipe {
  10. width: 100%;
  11. z-index: 1;
  12. height: 185px;
  13. }
  14. .my-swipe .img {
  15. width: 100%;
  16. height:100%;
  17. border-radius: 20rpx;
  18. }
  19. .wx-swiper-dots {
  20. margin-bottom: 20px;
  21. }
  22. .box {
  23. box-sizing: border-box;
  24. width: 100%;
  25. min-height: 60vh;
  26. background-color: #ffffff;
  27. border-radius: 20px 20px 0 0;
  28. position: absolute;
  29. top: 185px;
  30. left: 0;
  31. z-index: 0;
  32. box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1);
  33. padding: 0 15px 80px 15px;
  34. }
  35. .box .h3 {
  36. font-size: 16px;
  37. padding: 15px 0;
  38. }
  39. .box .h3 .small {
  40. font-size: 12px;
  41. color: rgb(255, 0, 0);
  42. font-weight: normal;
  43. }
  44. .box .h3 .small2 {
  45. font-size: 12px;
  46. color: #afa8a8;
  47. font-weight: normal;
  48. }
  49. .box .h3 .span {
  50. font-size: 14px;
  51. color: #ccc;
  52. font-weight: normal;
  53. float: right;
  54. }
  55. .box .input-box {
  56. position: relative;
  57. margin-bottom: 10px;
  58. }
  59. .box .input-box .my-input {
  60. box-sizing: border-box;
  61. width: 100%;
  62. height: 44px;
  63. line-height: 44px;
  64. border: 0;
  65. border-radius: 5px;
  66. box-shadow: 0 1px 2px 2px rgba(15, 179, 123, 0.1);
  67. padding-left: 25px;
  68. font-size: 18px;
  69. font-weight: bold;
  70. color:red;
  71. }
  72. .box .input-box .input-left, .input-right {
  73. position: absolute;
  74. top: 0;
  75. z-index: 999;
  76. line-height: 44px;
  77. font-size: 12px;
  78. color: red;
  79. }
  80. .box .input-box .input-left {
  81. left: 10px;
  82. font-weight: bold;
  83. line-height: 46px;
  84. }
  85. .box .input-box .input-right {
  86. right: 10px;
  87. color: #999;
  88. }
  89. .box .gas .van-button {
  90. line-height: 1.5em;
  91. border-radius: 3px;
  92. margin-bottom: 10px;
  93. height: 54px;
  94. }
  95. .box .gas .van-button .p {
  96. font-size: 9px;
  97. margin-block: 0;
  98. }
  99. .box .gas .van-button--default {
  100. background-color: #eee;
  101. color: rgb(102,101,104);
  102. }
  103. .box .btn-money .van-button {
  104. border: 0;
  105. box-shadow: 0 1px 2px 2px rgba(15, 179, 123, 0.1);
  106. color: rgb(168, 170, 170);
  107. height: 40px;
  108. }
  109. .box .tips {
  110. padding: 10px;
  111. color: rgb(240, 180, 80);
  112. }
  113. .box .tips van-icon {
  114. vertical-align: middle;
  115. }
  116. .box .tips .span {
  117. font-size: 14px;
  118. }
  119. .box .van-popup {
  120. box-sizing: border-box;
  121. padding: 10px 20px 0 20px;
  122. top: 20vh;
  123. }
  124. .van-goods-action {
  125. position: fixed;
  126. right: 0;
  127. bottom: 0;
  128. left: 0;
  129. display: flex;
  130. align-items: center;
  131. box-sizing: content-box;
  132. height: 80px;
  133. padding: 0 15px;
  134. background-color: #fff;
  135. }
  136. /* ---弹窗css--- */
  137. .modal-mask {
  138. width: 100%;
  139. height: 100%;
  140. position: fixed;
  141. top: 0;
  142. left: 0;
  143. background: #000;
  144. opacity: 0.5;
  145. overflow: hidden;
  146. color: #fff;
  147. }
  148. .modal-dialog {
  149. width: 72%;
  150. position: absolute;
  151. top: 30%;
  152. left: 14%;
  153. background: #fff;
  154. border-radius: 12rpx;
  155. }
  156. .modal-content{
  157. text-align: center;
  158. }
  159. .modal-content .show{
  160. width: 450rpx;
  161. height: 323rpx;
  162. display: block;
  163. margin: 0 auto;
  164. margin-top: -118rpx;
  165. z-index: 10000;
  166. }
  167. .iconWx{
  168. width:52rpx;
  169. height: 41rpx;
  170. padding-right: 20rpx;
  171. }
  172. .iconPhone{
  173. width:56rpx;
  174. height: 56rpx;
  175. padding-right: 15rpx;
  176. }
  177. .modal-content view:nth-of-type(2){
  178. font-size: 38rpx;
  179. color: #333333;
  180. line-height: 1;
  181. }
  182. .modal-content view:nth-of-type(3){
  183. font-size: 26rpx;
  184. color: #9c9c9c;
  185. margin: 18rpx 0 29rpx;
  186. line-height: 1;
  187. }
  188. .modal-content button:nth-of-type(1){
  189. width: 80%;
  190. height: 80rpx;
  191. border-radius: 60rpx;
  192. margin: 0 auto 80rpx;
  193. font-size: 30rpx;
  194. color: #fff;
  195. background: #31cc32;
  196. display: flex;
  197. flex-direction: row;
  198. align-items: center;
  199. justify-content: center;
  200. padding: 0;
  201. box-sizing: border-box;
  202. }
  203. .modal-content button:nth-of-type(1)::after{
  204. border: none;
  205. }
  206. .modal-content .wxLogin{
  207. font-size: 26rpx;
  208. color: #424242;
  209. display: flex;
  210. flex-direction: row;
  211. align-items: center;
  212. justify-content: center;
  213. margin: 38rpx 0 80rpx;
  214. }
  215. button::after{
  216. border: none;
  217. }
  218. .mask_layer {
  219. width: 100%;
  220. height: 100%;
  221. position: fixed;
  222. z-index: 999;
  223. left:0;top:0;
  224. background: #000;
  225. opacity: 0.5;
  226. overflow: hidden;
  227. }
  228. .modal_box {
  229. width: 76%;
  230. overflow: hidden;
  231. position: fixed;
  232. top: 50%;
  233. left: 0;
  234. z-index: 1001;
  235. background: #fafafa;
  236. margin: -150px 12% 0 12%;
  237. border-radius: 3px;
  238. }
  239. .title {
  240. padding: 15px;
  241. text-align: center;
  242. background-color: gazure;
  243. }
  244. .content {
  245. overflow-y: scroll; /*超出父盒子高度可滚动*/
  246. }
  247. .input_show1{
  248. margin: 0 auto;
  249. width: 80%;
  250. margin-left: 10%;
  251. font-size: 32rpx;
  252. text-align: center;
  253. }
  254. .btn1 {
  255. width: 100%;
  256. margin-top: 65rpx;
  257. display: flex;
  258. flex-direction: row;
  259. align-items: center;
  260. justify-content: space-between;
  261. box-sizing: border-box;
  262. background-color: white;
  263. }
  264. .btn2 {
  265. width: 100%;
  266. margin-top: 65rpx;
  267. display: flex;
  268. flex-direction: row;
  269. align-items: center;
  270. justify-content: space-between;
  271. box-sizing: border-box;
  272. background-color: white;
  273. }
  274. .cancel {
  275. width: 100%;
  276. padding: 10px;
  277. text-align: center;
  278. color: black;
  279. }
  280. .Sure {
  281. width: 100%;
  282. padding: 10px;
  283. color: #44b549;
  284. background-color: white;
  285. border-left: 1px solid #d0d0d0;
  286. text-align: center;
  287. }
  288. .modalMsg {
  289. text-align: center;
  290. margin-top: 45rpx;
  291. display: block;
  292. }