serviceDetails.wxss 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. /* pages/order/serviceDetails/serviceDetails.wxss */
  2. page {
  3. width: 750rpx;
  4. min-height: 100vh;
  5. background: #F6F6F6;
  6. padding: 24rpx;
  7. padding-bottom: 150rpx;
  8. overflow-x: hidden;
  9. }
  10. .topBox {
  11. width: 702rpx;
  12. background: #FFFFFF;
  13. border-radius: 12rpx;
  14. padding-top: 9rpx;
  15. padding-bottom: 48rpx;
  16. }
  17. .topBox .picture {
  18. width: 200rpx;
  19. height: 200rpx;
  20. background: #FFFFFF;
  21. box-shadow: 0px 10rpx 16rpx 0px rgba(17, 48, 105, 0.04);
  22. border-radius: 12rpx;
  23. display: block;
  24. margin: auto;
  25. }
  26. .topBox .tit {
  27. font-size: 36rpx;
  28. font-weight: 500;
  29. color: #191C27;
  30. margin: 20rpx auto;
  31. text-align: center;
  32. }
  33. .topBox .message {
  34. font-size: 30rpx;
  35. text-align: center;
  36. }
  37. .topBox .message .num {
  38. font-size: 48rpx;
  39. font-family: HelveticaNeue-BoldCond, HelveticaNeue;
  40. font-weight: bold;
  41. color: #191C27;
  42. }
  43. .topBox .message .old {
  44. font-size: 30rpx;
  45. color: #BDBDBD;
  46. margin-left: 10rpx;
  47. text-decoration: line-through;
  48. }
  49. .topBox .btn {
  50. width: 48rpx;
  51. height: 48rpx;
  52. border-radius: 50%;
  53. }
  54. .topBox .btnBox {
  55. margin-top: 48rpx;
  56. }
  57. .topBox .nums {
  58. margin: 0 30rpx;
  59. }
  60. .contioner {
  61. width: 702rpx;
  62. background: #FFFFFF;
  63. border-radius: 12rpx;
  64. margin: 24rpx 0;
  65. padding: 32rpx 24rpx;
  66. }
  67. .contioner .tit {
  68. font-size: 30rpx;
  69. font-weight: 500;
  70. color: #191C27;
  71. }
  72. .contioner .content {
  73. width: 654rpx;
  74. height: 100%;
  75. background: #F6F6F6;
  76. border-radius: 8rpx;
  77. padding: 40rpx 0;
  78. margin-top: 40rpx;
  79. padding-left: 24rpx;
  80. }
  81. .contioner .content .items {
  82. margin-bottom: 40rpx;
  83. }
  84. .contioner .content .items .t {
  85. font-size: 26rpx;
  86. font-weight: 500;
  87. color: #333333;
  88. }
  89. .contioner .content .items .message {
  90. font-size: 24rpx;
  91. color: #666666;
  92. margin-top: 20rpx;
  93. }
  94. .addressBox {
  95. width: 702rpx;
  96. background: #FFFFFF;
  97. border-radius: 12rpx;
  98. padding: 32rpx 24rpx;
  99. }
  100. .addressBox .top {
  101. font-size: 30rpx;
  102. font-weight: 500;
  103. color: #191C27;
  104. padding-bottom: 22rpx;
  105. margin-bottom: 32rpx;
  106. }
  107. .addressBox .top .btns {
  108. width: 112rpx;
  109. height: 50rpx;
  110. border-radius: 25rpx;
  111. line-height: 50rpx;
  112. color: #666666;
  113. }
  114. .addressBox .footer .address {
  115. width: 423rpx;
  116. font-size: 24rpx;
  117. color: #666666;
  118. }
  119. .addressBox .footer .iconBoxs image{
  120. width: 39rpx;
  121. height: 39rpx;
  122. margin-right: 10rpx;
  123. }
  124. .addressBox .footer .iconBoxs{
  125. font-size: 26rpx;
  126. color: #191C27;
  127. }
  128. .footerNav {
  129. width: 750rpx;
  130. height: 114rpx;
  131. background: #FFFFFF;
  132. position: fixed;
  133. left: 0;
  134. bottom: 0;
  135. z-index: 10;
  136. padding: 0 32rpx;
  137. }
  138. .footerNav .price {
  139. font-size: 32rpx;
  140. color: #191C27;
  141. }
  142. .footerNav .price .num {
  143. font-size: 48rpx;
  144. }
  145. .footerNav .footerBtn {
  146. width: 224rpx;
  147. height: 82rpx;
  148. line-height: 82rpx;
  149. background: linear-gradient(270deg, #467FFF 0%, #4699FF 100%);
  150. border-radius: 41rpx;
  151. }