toolkitConfirm.wxss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. page {
  2. height: 100%;
  3. width: 100%;
  4. background: #f4f4f4;
  5. }
  6. .container{
  7. padding-bottom:200rpx;
  8. }
  9. view,text{
  10. color:#333;
  11. font-size: 30rpx;
  12. box-sizing: border-box;
  13. }
  14. .top{
  15. width: 750rpx;
  16. height: 200rpx;
  17. background: linear-gradient(334deg, #8BF2F7 0%, #09AFFF 100%);
  18. display: flex;
  19. align-items: center;
  20. justify-content: space-between;
  21. padding:0 48rpx;
  22. margin-bottom:26rpx;
  23. }
  24. .top view{
  25. font-size: 50rpx;
  26. color:#fff;
  27. font-weight: bold;
  28. }
  29. .goods-block{
  30. width: 702rpx;
  31. background: #FFFFFF;
  32. border-radius: 18rpx;
  33. margin:0 24rpx;
  34. padding:20rpx 24rpx 12rpx;
  35. }
  36. .goods-item{
  37. border-bottom: 1rpx solid #DBDBDB;
  38. height:220rpx;
  39. padding:20rpx 10rpx 20rpx 24rpx;
  40. display: flex;
  41. }
  42. .goods-item:last-child{
  43. border-bottom:none;
  44. }
  45. .goods-img{
  46. width: 180rpx;
  47. height: 180rpx;
  48. border-radius: 4rpx;
  49. border: 1rpx solid #979797;
  50. margin-right:24rpx;
  51. }
  52. .goods-info{
  53. flex:1;
  54. }
  55. .goods-name{
  56. display: flex;
  57. justify-content: space-between;
  58. align-items: center;
  59. height: 54rpx;
  60. }
  61. .goods-name .left{
  62. line-height: 54rpx;
  63. width:320rpx;
  64. overflow: hidden;
  65. text-overflow: ellipsis;
  66. white-space: nowrap;
  67. }
  68. .goods-spec{
  69. height: 54rpx;
  70. line-height: 54rpx;
  71. margin-bottom:14rpx;
  72. display: flex;
  73. justify-content: space-between;
  74. align-items: center;
  75. }
  76. .goods-spec .spec{
  77. line-height: 54rpx;
  78. width:320rpx;
  79. overflow: hidden;
  80. text-overflow: ellipsis;
  81. white-space: nowrap;
  82. }
  83. .goods-spec .arrow{
  84. width:44rpx;
  85. height:44rpx;
  86. margin-right:-8rpx;
  87. }
  88. .goods-price{
  89. height: 54rpx;
  90. text-align: right;
  91. }
  92. .confirm-btn{
  93. width: 674rpx;
  94. height: 110rpx;
  95. line-height: 110rpx;
  96. background: #3D7FFF linear-gradient(270deg, rgba(0,202,255,0.5) 0%, rgba(9,175,255,0.5) 100%);
  97. border-radius: 110rpx;
  98. left:38rpx;
  99. right:38rpx;
  100. bottom:40rpx;
  101. position: fixed;
  102. font-size: 48rpx;
  103. text-align: center;
  104. color:#fff;
  105. }
  106. .tips{
  107. font-size: 24rpx;
  108. color:#999;
  109. text-align: center;
  110. margin-top:20rpx;
  111. }