daily_riding.wxss 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. page{
  2. width: 100%;
  3. height: 100%;
  4. }
  5. map{
  6. width: 100%;
  7. position: relative;
  8. }
  9. cover{
  10. line-height: normal !important;
  11. overflow: visible !important;
  12. }
  13. .index {
  14. -webkit-box-orient: vertical;
  15. -webkit-box-direction: normal;
  16. -webkit-flex-direction: column;
  17. -ms-flex-direction: column;
  18. flex-direction: column;
  19. width: 100%;
  20. height: 100%;
  21. display: flex;
  22. justify-content: space-between;
  23. }
  24. /* 四个图标 begin */
  25. .circle{
  26. height: 85rpx;
  27. width: 85rpx;
  28. border-radius: 50%;
  29. display: flex;
  30. justify-content: center;
  31. align-items: center;
  32. /* margin-bottom: 30rpx; */
  33. position: absolute;
  34. z-index: 10;
  35. }
  36. .circlee1{
  37. bottom: 220rpx;
  38. left: 50rpx;
  39. }
  40. .circlee2{
  41. bottom: 220rpx;
  42. right: 50rpx;
  43. }
  44. .circlee3{
  45. bottom: 100rpx;
  46. left: 50rpx;
  47. }
  48. .circlee4{
  49. bottom: 100rpx;
  50. right: 50rpx;
  51. }
  52. .circle1{
  53. left: 50rpx;
  54. top: 336rpx;
  55. }
  56. .circle2{
  57. right: 50rpx;
  58. top: 336rpx;
  59. }
  60. .circle3{
  61. left: 50rpx;
  62. top: 430rpx;
  63. }
  64. .circle4{
  65. right: 50rpx;
  66. top: 430rpx;
  67. }
  68. .circle5{
  69. right: 0rpx;
  70. top: 120rpx;
  71. width: 100rpx;
  72. height: 70rpx;
  73. display: flex;
  74. align-items: center;
  75. justify-content: center;
  76. background: #fff;
  77. border-radius: 40rpx 0rpx 0rpx 40rpx;
  78. }
  79. /* 四个图标 end */
  80. .content{
  81. width: 100%;
  82. display: flex;
  83. flex-direction: column;
  84. padding-bottom: 30rpx;
  85. }
  86. .content .timeout{
  87. font-size:30rpx;
  88. font-family:PingFang SC;
  89. font-weight:bold;
  90. color:rgba(42,42,42,1);
  91. padding-left: 33rpx;
  92. display: flex;
  93. align-items: center;
  94. /* padding-top: ; */
  95. padding-bottom: 50rpx;
  96. }
  97. .content .timeout image{
  98. margin: 0 !important;
  99. }
  100. .content .text{
  101. font-size:32rpx;
  102. font-family:PingFang-SC-Regular;
  103. font-weight:400;
  104. color:rgba(42,42,42,1);
  105. /* padding-top: 37rpx; */
  106. padding-left: 28rpx;
  107. }
  108. .content .text{
  109. font-size:32rpx;
  110. font-family:PingFang-SC-Regular;
  111. font-weight:400;
  112. color:rgba(42,42,42,1);
  113. /* padding-top: 37rpx; */
  114. padding-left: 28rpx;
  115. }
  116. .content image{
  117. margin: 0 auto;
  118. }
  119. .content .code{
  120. width: 500rpx;
  121. margin: 0 auto;
  122. display: flex;
  123. align-items: center;
  124. justify-content: space-between;
  125. padding-bottom:18rpx;
  126. border-bottom: 2rpx solid #DEDEDE;
  127. margin-top: 28rpx;
  128. }
  129. .content .posi{
  130. position: absolute;
  131. right: 0rpx;
  132. }
  133. .content .code text:nth-of-type(1){
  134. font-size:32rpx;
  135. font-family:PingFang-SC-Regular;
  136. font-weight:800;
  137. color:rgba(42,42,42,1);
  138. }
  139. .content .message{
  140. width: 500rpx;
  141. display: flex;
  142. margin: 0 auto;
  143. align-items: center;
  144. justify-content: space-between;
  145. margin-top: 18rpx;
  146. }
  147. .content .message view{
  148. display: flex;
  149. flex-direction: column;
  150. align-items: center;
  151. }
  152. .content .message view text:nth-of-type(1){
  153. font-size:36rpx;
  154. font-family:PingFang-SC-Bold;
  155. font-weight:bold;
  156. color:rgba(42,42,42,1);
  157. }
  158. .content .message view text:nth-of-type(2){
  159. font-size:24rpx;
  160. font-family:PingFang-SC-Regular;
  161. font-weight:400;
  162. color:rgba(153,153,153,1);
  163. padding-top: 5rpx;
  164. }
  165. .btn{
  166. display: flex;
  167. justify-content: space-around;
  168. margin-top: 40rpx !important;
  169. margin: 0 auto;
  170. width: 75%;
  171. }
  172. .btn .btn-left{
  173. display: flex;
  174. align-items: center;
  175. justify-content: center;
  176. box-sizing: border-box;
  177. width:296rpx;
  178. height:76rpx;
  179. border:2rpx solid #2FB9FD;
  180. border-radius:10rpx;
  181. font-family:PingFang-SC-Regular;
  182. }
  183. .btn .btn-left view{
  184. width: 50%;
  185. display: flex;
  186. align-items: center;
  187. justify-content: center;
  188. height: 100%;
  189. }
  190. .btn .btn-left view:nth-of-type(1){
  191. background: #42C6FD;
  192. color: white;
  193. font-size: 32rpx;
  194. }
  195. .btn .btn-left view:nth-of-type(2){
  196. color: #36BBFD;
  197. font-size: 32rpx;
  198. }
  199. .btn .btn-right{
  200. width:204rpx;
  201. height:76rpx;
  202. background: #10D6BB;
  203. color:white;
  204. border-radius:10rpx;
  205. font-size:32rpx;
  206. font-family:PingFang-SC-Regular;
  207. font-weight:400;
  208. display: flex;
  209. align-items: center;
  210. justify-content: center;
  211. }
  212. .container1{
  213. z-index: 9999;
  214. position: absolute;
  215. width: 100%;
  216. height: 100%;
  217. }
  218. .content1{
  219. width: 100%;
  220. height: 100%;
  221. position: absolute;
  222. }
  223. .content1 .txt .top{
  224. height: 180rpx;
  225. display: flex;
  226. flex-direction: column;
  227. align-items: center;
  228. justify-content: center;
  229. font-size:28rpx;
  230. font-family:PingFang SC;
  231. font-weight:400;
  232. color:rgba(42,42,42,1);
  233. }
  234. .content1 .txt .bottom{
  235. display: flex;
  236. align-items: center;
  237. height: 60rpx;
  238. font-size: 17px;
  239. width: 100%;
  240. border-top: 1rpx solid #D5D5D6;
  241. justify-content: space-between;
  242. }
  243. .content1 .txt .bottom .bottom_a{
  244. width: 49%;
  245. display: flex;
  246. flex-direction: column;
  247. align-items: center;
  248. }