金诚优选前端代码
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.

143 lines
3.0 KiB

  1. @import '../../../common/css/global';
  2. #collage{
  3. padding-bottom: 60px;
  4. .white{
  5. height: 22px;
  6. background-color: #FFFFFF;
  7. width: 100%;
  8. border-top: 1px solid #E1E2EA;
  9. &.b{
  10. border-bottom:1px solid #E1E2EA;
  11. border-top:0;
  12. }
  13. }
  14. .collage-progress{
  15. padding: 0 54px 21px 54px;
  16. position: relative;
  17. background-color:#FFFFFF;
  18. .launch,.invite,.success{
  19. text-align: center;
  20. position: absolute;
  21. top:-14px;
  22. .iconfont{
  23. color:#DBDBDB;
  24. font-size:18px;
  25. }
  26. .text{
  27. color:#9B9B9B;
  28. font-size:12px;
  29. line-height: 12px;
  30. padding-top:4px;
  31. }
  32. &.active-emj{
  33. .iconfont{
  34. color: #EA4448;
  35. }
  36. .text{
  37. color:#FF2741;
  38. }
  39. }
  40. }
  41. }
  42. .collage-goods{
  43. background-color: #FFFFFF;
  44. display: flex;
  45. justify-content: center;
  46. align-items: center;
  47. padding: 15px;
  48. .goods-img{
  49. flex: 1;
  50. image{
  51. width: 100%;
  52. }
  53. }
  54. .goods-infomation{
  55. flex: 1;
  56. padding-left: 12px;
  57. .info-name{
  58. color:#000000;
  59. font-size: 14px;
  60. line-height: 20px;
  61. height: 40px;
  62. word-break: break-all;
  63. text-overflow: ellipsis;
  64. display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
  65. -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
  66. -webkit-line-clamp: 2; /** 显示的行数 **/
  67. overflow: hidden; /** 隐藏超出的内容 **/
  68. }
  69. .original-cost,.purchase-cost{
  70. position: relative;
  71. width: 100%;
  72. border: 1px solid #DBDBDB;
  73. padding:15px 0;
  74. text-align:center;
  75. border-radius: 3px;
  76. .price{
  77. color:#4A4A4A;
  78. font-size: 14px;
  79. .zero{
  80. display: inline-block;
  81. font-size: 12px;
  82. padding-right: 5px;
  83. }
  84. .unit{
  85. display:inline-block;
  86. font-size: 10px;
  87. }
  88. }
  89. .o-text{
  90. position: absolute;
  91. color:#9B9B9B;
  92. font-size: 10px;
  93. top: -12px;
  94. left: 50%;
  95. width: 36px;
  96. margin-left: -18px;
  97. line-height:23px;
  98. background-color: #FFFFFF;
  99. }
  100. &.mar-t{
  101. margin-top:15px;
  102. }
  103. .bor-c{
  104. border-color:#FF2741;
  105. color:#FF2741;
  106. }
  107. .p-text{
  108. color:#000000;
  109. }
  110. &.marg-t{
  111. margin-top: 24px;
  112. }
  113. &.bor-c{
  114. border: 1px solid #FF2741;
  115. }
  116. }
  117. }
  118. }
  119. .btn-box {
  120. display: flex;
  121. align-items: center;
  122. padding: 30px 0px;
  123. .btn {
  124. flex: 1;
  125. height: 44px;
  126. line-height: 44px;
  127. text-align: center;
  128. border-radius: 3px;
  129. font-size: 18px;
  130. color: #FFFFFF;
  131. margin: 0 15px;
  132. background: @globalColor;
  133. border: 1px solid @globalColor;
  134. &.close {
  135. background: #FFFFFF;
  136. color: #999999;
  137. border-color: #999999;
  138. }
  139. }
  140. }
  141. }