questionnaire.less 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. .ques_page{
  2. width: 686rpx;
  3. // height: 379rpx;
  4. background: #FFFFFF;
  5. border-radius: 8px;
  6. position: absolute;
  7. top: 50%;
  8. left: 50%;
  9. transform: translate(-50%,-50%);
  10. z-index:1100;
  11. .bg_page{
  12. position: relative;
  13. width: 100%;
  14. height: 124px;
  15. z-index:11;
  16. top: -27px;
  17. }
  18. .bg_close{
  19. width: 18px;
  20. height: 18px;
  21. position: absolute;
  22. z-index:12;
  23. top: 12px;
  24. right: 12px;
  25. }
  26. .ques_txt{
  27. text{
  28. color: #F54E45;
  29. margin-right: 10rpx;
  30. }
  31. display: flex;
  32. // align-items: center;
  33. // margin: 40rpx 0 24rpx;
  34. margin: 40rpx 0 24rpx;
  35. font-size: 32rpx;
  36. font-weight: 500;
  37. line-height: 44rpx;
  38. }
  39. .ques_txt_list{
  40. margin: 40rpx 0 0rpx;
  41. }
  42. .ques_main{
  43. margin-top: -19px;
  44. padding: 0 48rpx 0rpx;
  45. .ques_title{
  46. height: 66rpx;
  47. font-size: 48rpx;
  48. font-weight: 400;
  49. color: #111111;
  50. line-height: 66rpx;
  51. text-align: center;
  52. }
  53. .ques_tips{
  54. margin-top: 24rpx;
  55. font-size: 28rpx;
  56. font-weight: 400;
  57. color: #666666;
  58. line-height: 44rpx;
  59. }
  60. .ques_star{
  61. width: 100%;
  62. height: 180rpx;
  63. display: flex;
  64. justify-content: center;
  65. align-items: center;
  66. flex-direction: column;
  67. background: #EFF0F1;
  68. border-radius: 4px;
  69. margin-bottom: 56rpx;
  70. text{
  71. margin-top: 20rpx;
  72. height: 40rpx;
  73. font-size: 28rpx;
  74. font-weight: 400;
  75. color: #666666;
  76. line-height: 40rpx;
  77. }
  78. }
  79. }
  80. .ques_list{
  81. // height: 670rpx;
  82. max-height: 450rpx;
  83. box-sizing: border-box;
  84. overflow: auto;
  85. padding: 0 48rpx 0rpx;
  86. margin-bottom: 30rpx;
  87. .ques_checkbox{
  88. font-size: 32rpx;
  89. padding: 36rpx 0 0;
  90. }
  91. .txtarea{
  92. width: 100%;
  93. height: 240rpx;
  94. margin-top: 10px;
  95. padding: 24rpx;
  96. border-radius: 4px;
  97. font-size: 28rpx;
  98. box-sizing: border-box;
  99. border: 1px solid #EFF0F1;
  100. }
  101. }
  102. .footer{
  103. padding: 0 48rpx 40rpx;
  104. .submit {
  105. height: 80rpx;
  106. font-size: 32rpx;
  107. margin-top: 40rpx;
  108. width: auto!important;
  109. color: #FFFFFF;
  110. background: #04B49C;
  111. border-radius: 20px;
  112. }
  113. .submit_noactive{
  114. background: #EFF0F1;
  115. color: #C3C7CB;
  116. }
  117. }
  118. .footer_active{
  119. border-top: 1px solid #ececed;
  120. box-shadow: 0px 6px 20px 0px rgba(43, 48, 54, 0.1);
  121. }
  122. }
  123. .ques_pop{
  124. position: absolute;
  125. width: 100%;
  126. height: 100%;
  127. top: 0;
  128. left: 0;
  129. background: #000000;
  130. opacity: 0.2;
  131. z-index:1100;
  132. overflow: hidden;
  133. }
  134. .ques_pop_active{
  135. z-index:1200;
  136. }
  137. .dialog_box{
  138. width: 590rpx;
  139. // height: 379rpx;
  140. padding-top: 56rpx;
  141. background: #FFFFFF;
  142. border-radius: 8px;
  143. position: absolute;
  144. top: 50%;
  145. left: 50%;
  146. transform: translate(-50%,-50%);
  147. z-index:1201;
  148. .title{
  149. text-align: center;
  150. font-size: 18px;
  151. font-weight: 500;
  152. color: #1F2529;
  153. line-height: 24px;
  154. }
  155. .content{
  156. padding: 66rpx 0 66rpx 64rpx;
  157. .radio_custom{
  158. display: inline-flex;
  159. width: 100px;
  160. margin-right: 15px;
  161. }
  162. }
  163. .dialog_footer{
  164. height: 102rpx;
  165. border-top: 1px solid #EFF0F1;
  166. justify-content: space-around;
  167. font-size: 16px;
  168. font-weight: 500;
  169. color: #1F2529;
  170. .dialog_btn{
  171. width: 49%;
  172. height: 100%;
  173. }
  174. .line{
  175. width: 1px;
  176. background: #EFF0F1;
  177. height: 100%;
  178. // border-right: 1px solid #EFF0F1 ;
  179. }
  180. }
  181. }
  182. .radio_span{
  183. color: #666666;
  184. }
  185. .radio_active{
  186. color: #000000;
  187. }