Home Verkennen Help
Registreren Inloggen
zouling
/
qianshanxm_ui
1
0
Vork 0
Bestanden Issues 0 Pull-aanvragen 0 Wiki
Aftakking: master
Aftakkingen Labels
qianshanxm_ui
/
qianshandangjian
/
static
/
css
/
style.css

style.css 12 KB
Permalink Geschiedenis Ruwe

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228 
  1. .qbox{min-height: 100vh;background: url(../images/pic_bg.png) no-repeat center;width: 100%;background-size: 100% 100%;padding-bottom: 1.5rem;position: relative;}
    2. 

  2. .qup{width: 100%;}
    3. 

  3. .qdown{width: 100%;position: absolute;left: 0;right: 0;bottom: 0;}
    4. 

  4. 

  5. .qbox .el-message{min-width: 4rem;}
    6. 

  6. 

  7. /* 扫码 */
    8. 

  8. * {
    9. 

  9.   padding: 0;
    10. 

  10.   margin: 0;
    11. 

  11. }
    12. 

  12. 

  13. #app .btnBox {
    14. 

  14.   display: flex;
    15. 

  15.   justify-content: space-around;
    16. 

  16.   padding: 0.2rem;
    17. 

  17. }
    18. 

  18. #app .btnBox a{
    19. 

  19.   padding: 0.4rem;
    20. 

  20.   color: aliceblue;
    21. 

  21.   background-color: #015cf2;
    22. 

  22.   display: block;
    23. 

  23. }
    24. 

  24. /* #mumuQrcode canvas{display: none;} */
    25. 

  25. #mumuQrcode canvas{position: absolute;
    26. 

  26.     left: 0;
    27. 

  27.     top: 0;
    28. 

  28.     right: 0;
    29. 

  29.     bottom: 0;}
    30. 

  30. /* 扫码 */
    31. 

  31. 

  32. 

  33. #app{width: 100%;padding: 0 0.3rem;box-sizing: border-box;}
    34. 

  34. .qtitimg{width: 5.39rem;margin: -0.16rem auto 0.36rem;}
    35. 

  35. 

  36. .qd_txtbox{width: 100%;height: 3.5rem;background: url(../images/txt_bg.png) no-repeat center top;background-size: 100% 100%;padding-top: 0.2rem;margin-bottom: 0.36rem;}
    37. 

  37. .qd_txtt{font-weight: 500;font-style: italic;color: #FFFFFF;line-height: 0.42rem;opacity: 0.84;text-align: center;font-size: 0.32rem;}
    38. 

  38. .qd_txtb{padding: 0 0.3rem 0 0.24rem;margin-top: 0.67rem;}
    39. 

  39. .qd_txtbt{font-size: 0.24rem;font-family: PingFang SC;font-weight: bold;font-style: italic;color: #BD5626;
    40. 

  40. background: linear-gradient(0deg, #B54A1D 0%, #FFB97D 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom: 0.42rem;padding-left: 0.28rem;}
    41. 

  41. .qd_txtbtn{font-size: 0.28rem;font-family: PingFang SC;font-weight: bold;color: #BD5626;
    42. 

  42. background: linear-gradient(0deg, #B54A1D 0%, #FFB97D 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-align: center;}
    43. 

  43. .qd_txtbti{font-size: 0.24rem;font-family: PingFang SC;font-weight: bold;font-style: italic;color: #BD5626;
    44. 

  44. background: linear-gradient(0deg, #353535 0%, #797979 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom: 0.42rem;}
    45. 

  45. .qd_txtbxa{width: 50%;display: flex;align-items: flex-end;justify-content: center;position: relative;}
    46. 

  46. .qd_txtbxa::after{content: "";width: 0.01rem;
    47. 

  47. height:0.4rem;
    48. 

  48. background: #E5E5E5;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
    49. 

  49. .qd_txtbxa:first-child::after{display: none;}
    50. 

  50. .qd_txtbxa span{margin-right: 0.06rem;}
    51. 

  51. 

  52. .qd_txtbxal{width: 0.57rem;height: 0.57rem;margin-right: 0.1rem;flex: 0 0 auto;}
    53. 

  53. .qd_txtbxal img{max-width: 100%;max-height: 100%;}
    54. 

  54. 

  55. .qd_fun a{width: 25%;margin-bottom: 0.52rem;}
    56. 

  56. .qd_funimg{width: 1.17rem;height: 1.17rem;margin:0 auto 0.13rem;}
    57. 

  57. .qd_funa{width: 6.56rem;margin: 0 auto;}
    58. 

  58. 

  59. .qd_wel{}
    60. 

  60. .qd_weltit{position: relative;}
    61. 

  61. .qd_weltita{font-size: 0.32rem;font-weight: bold;
    62. 

  62. font-style: italic;
    63. 

  63. color: #FFFFFF;
    64. 

  64. text-shadow: 1px 5px 6px rgba(125, 9, 11, 0.21);position: absolute;left: 0;right: 0;text-align: 
    65. 

  65. center;top: 0.16rem;}
    66. 

  66. .qd_weltit img{width: 5.15rem;margin: 0 auto;}
    67. 

  67. .qd_weltxt{font-size: 0.26rem;font-family: PingFang SC;font-weight: 500;font-style: italic;color: #B3471A;}
    68. 

  68. .qd_weltxt span{display: inline-block;width: 0.82rem;border-bottom: 0.01rem solid #E59A59;margin: 0 0.2rem;}
    69. 

  69. .qd_welb{width: 100%;background: #F9EBDF;
    70. 

  70. box-shadow: -1px 7px 9px 0px rgba(131, 46, 15, 0.36);border-radius:0.13rem;padding: 0.04rem 0.16rem;box-sizing: border-box;display: flex;justify-content: space-between;flex-wrap: wrap;margin-bottom: 0.22rem;position: relative;}
    71. 

  71. 

  72. .qd_welb a{background: #FFFFFF;
    73. 

  73. box-shadow: -1px 7px 9px 0px rgba(131, 46, 15, 0.36);border-radius: 0.13rem;width: 2.96rem;
    74. 

  74. min-height: 1.85rem;margin: 0.13rem 0;position: relative;padding: 0.22rem 0.36rem 0.2rem 0.32rem;box-sizing: border-box;}
    75. 

  75. .qd_welb a::before{content: '';width: 0.13rem;
    76. 

  76. height: 0.52rem;background: #F43637;position: absolute;left: 0;top: 0.67rem;}
    77. 

  77. .qd_welbt{font-size: 0.28rem;
    78. 

  78. font-family: PingFang SC;
    79. 

  79. font-weight: bold;
    80. 

  80. color: #B54D1F;background: linear-gradient(0deg, #B54A1D 21.58203125%, #F3A461 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin-bottom: 0.16rem;min-height: 0.37rem;}
    81. 

  81. .qd_welbox{flex: 1;overflow: hidden;}
    82. 

  82. .qd_welbtx{opacity: 0.89;font-size: 0.2rem;color: #2A2928;min-height: 0.52rem;}
    83. 

  83. .qd_welimg{width: 0.68rem;flex: 0 0 auto;}
    84. 

  84. .qd_welbm{font-size: 0.16rem;font-weight: 400;
    85. 

  85. color: #AAAAAA;display: flex;justify-content: flex-end;align-items: center;margin-top: 0.18rem;}
    86. 

  86. .qd_welbm img{width: 0.24rem;margin-left: 0.09rem;height: 0.18rem;}
    87. 

  87. 

  88. .qd_fixed{width: 100%;height: 0.93rem;
    89. 

  89. background: #D17642;
    90. 

  90. box-shadow: 0px 0px 0.18rem 0px #B1856C;position: fixed;left: 0;right: 0;bottom: 0;display: flex;align-items: center;justify-content: center;font-size: 0.28rem;color: #FFFFFF;z-index: 2;}
    91. 

  91. .qd_fixedi{width: 0.29rem;height: 0.3rem;margin-right: 0.2rem;}
    92. 

  92. 

  93. 

  94. @media (max-width: 310px) {
    95. 

  95. 	.qd_welb a{
    96. 

  96. 		width: 100%;
    97. 

  97. 	}
    98. 

  98. }
    99. 

  99. 

  100. /* 使用记录 */
    101. 

  101. .qduse{min-height: 100vh;background: #FFFFFF;box-sizing: border-box;padding-top:1rem;}
    102. 

  102. 

  103. .quset{font-size: 0.32rem;font-weight: bold;
    104. 

  104. color: #000000;text-align: center;position: relative;padding: 0 0.4rem;overflow: hidden;white-space: normal;text-overflow: ellipsis;height: 0.8rem;line-height: 0.8rem;position: fixed;left: 0;top: 0;right: 0;background: #FFFFFF;z-index: 10;}
    105. 

  105. .qsback{position: fixed;left: 0.32rem;top: 0.81rem;z-index: 1;}
    106. 

  106. .qsback img{width: 0.39rem;height: 0.39rem;}
    107. 

  107. .qusetimg{width: 0.8rem;height: 0.8rem;position: absolute;left: 0;top: 0;display: flex;align-items: center;justify-content: center;}
    108. 

  108. .qusetimg img{width: 0.18rem;height: 0.32rem;}
    109. 

  109. 

  110. 

  111. 

  112. 

  113. 

  114. .quseup{width: 0.2rem;margin-left: 0.15rem;}
    115. 

  115. .quse_txt{padding: 0 0.56rem;}
    116. 

  116. .quse_icon{font-size: 0.26rem;font-weight: bold;
    117. 

  117. color: #000000;display: flex;align-items: center;}
    118. 

  118. .quse_icon span{width: 0.16rem;height:0.16rem;background: #DF0024;border-radius:0.08rem;margin-right: 0.26rem;display: block;}
    119. 

  119. .quse_txt{display: none;}
    120. 

  120. .quse_txt ul{padding: 0.24rem 0.43rem 0.36rem;position: relative;}
    121. 

  121. .quse_txt ul li{font-size: 0.26rem;color: #666666;display:flex; padding:0.08rem 0;}
    122. 

  122. .quse_txt ul:before{content: "";border-right: 0.01rem solid #CDCDCD;height: 100%;position: absolute;left:0.08rem;top: 0;}
    123. 

  123. .qusetime.act .quse_txt{display: block;}
    124. 

  124. .qusetime.act .quseup{transform: rotate(180deg);}
    125. 

  125. .qusetime .quse_txt:last-child ul:before{display: none;}
    126. 

  126. 

  127. 

  128. 

  129. 

  130. /* 详情 */
    131. 

  131. .qd_medal{display: flex;flex-direction: column;align-items: center;justify-content: center;position: absolute;left: 0.13rem;top: 0.46rem;width: 1rem;}
    132. 

  132. .qd_medal img{width: 0.66rem;margin-bottom: 0.02rem;}
    133. 

  133. .qd_medalt{color: #D37641;font-size: 0.16rem;font-style: italic;font-weight: bold;}
    134. 

  134. .qd_medalx{color: #1b1b1b;font-size: 0.16rem;}
    135. 

  135. .qd_medab{background: #FFFFFF;
    136. 

  136. box-shadow: -1px 7px 9px 0px rgba(131, 46, 15, 0.36);
    137. 

  137. border-radius: 0.13rem;position: relative;padding-bottom: 0.45rem;width: 100%;box-sizing: border-box;min-height: 2.2rem;}
    138. 

  138. 

  139. 

  140. .qd_medab ul{padding-top: 0.46rem;margin-bottom: 0.1rem;}
    141. 

  141. .qd_medab li{position: relative;padding: 0 0.4rem 0.3rem  1.27rem;}
    142. 

  142. .qd_medab li:before{width: 0.13rem;
    143. 

  143. height:0.52rem;
    144. 

  144. background: #F43637;content: "";position: absolute;left: 0;top: 0;}
    145. 

  145. .qd_medab li p{font-size: 0.24rem; color: #464545;line-height: 0.4rem;}
    146. 

  146. 

  147. .qd_medab ul li:last-child{padding-bottom: 0;}
    148. 

  148. 

  149. 

  150. 

  151. 

  152. /* 扫码页面 */
    153. 

  153. .qscan{height: 100vh;background: linear-gradient(60deg, #F4B271, #D57640);box-sizing: border-box;display: flex;flex-direction: column;
    154. 

  154. }
    155. 

  155. .qscan .qscant{flex: 0 0 auto; font-size: 0.32rem;font-weight: bold;color: #FFFFFF;text-align: center;position: relative;padding: 0 0.4rem;overflow: hidden;white-space: normal;text-overflow: ellipsis;height: 0.8rem; line-height: 0.8rem;}
    156. 

  156. 

  157. 

  158. .qsmain{flex: 1;overflow: auto;padding-top: 0.85rem !important;display: flex;flex-direction: column;}
    159. 

  159. .qsbox{background: #FFFFFF;border-radius: 0.13rem;position: relative;padding-top: 0.72rem;padding-bottom: 0.4rem;}
    160. 

  160. .qsboxtimg{width: 1.03rem;height: 1.03rem;position: absolute;left: 50%;top: -0.42rem;transform: translateX(-50%);}
    161. 

  161. 

  162. 

  163. 

  164. .qsfoot{flex: 0 0 auto;display: flex;align-items: center;padding-bottom: 0.2rem;}
    165. 

  165. .qsfoota{width: 50%;flex: 0 0 auto;display: flex;align-items: center;justify-content: center;flex-direction: column;padding: 0.2rem 0;}
    166. 

  166. .qsfootb{width: 0.67rem;height: 0.67rem;margin-bottom: 0.13rem;}
    167. 

  167. 

  168. .qscode{width: 3.08rem;height: 3.08rem;margin: 0 auto 0.42rem;background: url(../images/scodebg.png) no-repeat center top;background-size: 100% 100%;display: flex;align-items: center;justify-content: center;position: relative;}
    169. 

  169. .qscodeimg img{width: 2.67rem;height: 2.67rem;}
    170. 

  170. .qscodeimg canvas{width: 2.67rem !important;height: 2.67rem !important;opacity: 0;}
    171. 

  171. #myTime{min-height:0.62rem ;}
    172. 

  172. 

  173. .qscodetit{font-size: 0.3rem;color: #000000;position: absolute;left: 0;top: 0;right: 0;bottom: 0;display: flex;align-items: center;justify-content: center;}
    174. 

  174. 

  175. 

  176. .qslines{background: linear-gradient(60deg, #eea667, #dd864d);}
    177. 

  177. .qsline{position: relative;justify-content: space-between;padding: 0 0.53rem;background: url(../images/picline.png) no-repeat center top;background-size: 100% 100%;width: 100%;box-sizing: border-box;min-height: 0.33rem;}
    178. 

  178. /* .qsline::before{width: 0.4rem;height: 0.4rem;content: '';position: absolute;left: -0.2rem;top: 50%;background: #F4B271;border-radius: 50%;clip: rect(0px 0.4rem 0.4rem 0.2rem);margin-top: -0.2rem;}
    179. 

  179. .qsline::after{width: 0.4rem;height: 0.4rem;content: '';position:absolute; right:-0.2rem;top: 50%;background: #D57640 ;border-radius: 50%;clip: rect(0px 0.2rem 0.4rem 0px);;margin-top: -0.2rem;} */
    180. 

  180. .qslinea{width: 1.73rem;height: 0.01rem;background-color: #AAAAAA;}
    181. 

  181. .qslooka{width: 0.32rem;height: 0.22rem;margin-right: 0.15rem;}
    182. 

  182. .qslook{display: flex;justify-content: flex-end;padding-right: 0.58rem;align-items: center;margin-top: 0.2rem;}
    183. 

  183. .nobox{padding-top: 1rem;}
    184. 

  184. .noimg{width: 5rem;margin: 0 auto;}
    185. 

  185. 

  186. 

  187. /* 政策指南 */
    188. 

  188. .qpolicy{height: 100vh; background: #f5f5f5;box-sizing: border-box;overflow: scroll;}
    189. 

  189. .policylist{background: #FFFFFF;border-bottom: 0.01rem solid #E5E5E5;padding: 0.32rem 0.4rem 0.3rem;}
    190. 

  190. .poloding{font-size: 0.26rem;color: #666666;text-align: center;padding: 0.2rem 0;}
    191. 

  191. .policylist p{font-size: 0.24rem;}
    192. 

  192. .policyd p{font-size: 0.26rem;}
    193. 

  193. 

  194. 

  195. 

  196. /* 选择 类别 */
    197. 

  197. .qdcate.qduse{background: #f5f5f5;}
    198. 

  198. .qdcate #app{padding:0.16rem 0.32rem 0.2rem;}
    199. 

  199. /* .qcate{} */
    200. 

  200. .qcateli{width:100%;background: #FFFFFF;border-radius: 0.14rem;margin-bottom:0.24rem;}
    201. 

  201. .qcatelit{padding: 0.2rem 0.3rem 0.24rem 0.28rem;border-bottom: 0.01rem solid #E5E5E5;}
    202. 

  202. .qcatelitl{width: 0.26rem;height: 0.26rem;margin-left: 0.2rem;}
    203. 

  203. .qcatelitr{width: 0.16rem;height: 0.26rem;margin-left: 0.2rem;}
    204. 

  204. .qcatelif{padding: 0.24rem 0.3rem 0.24rem 0.22rem;}
    205. 

  205. .qcatelif span{padding-right:0.1rem;}
    206. 

  206. .qcatelif span:last-child{padding: 0 0 0 0.1rem;}
    207. 

  207. .qcatelif .flex0{min-width:1.6rem ;}
    208. 

  208. .bgbox{position: fixed;left: 0;right: 0;bottom: 0;top: 0;background: rgba(0, 0, 0, 0.5);z-index: 20;}
    209. 

  209. .pawfixed{width:5.34rem;background: #FFFFFF;border-radius: 0.06rem;position: fixed;left: 50%;z-index: 22;top: 50%;margin-left: -2.67rem;box-sizing: border-box;padding-top: 0.24rem;top: 50%;margin-top: -1.8rem;}
    210. 

  210. 

  211. .pawfixedbtns{display: flex;align-items: center;border-top: 0.02rem solid #DDDDDD;}
    212. 

  212. .pawfixedbtn{flex: 1;height: 0.8rem;display: flex;align-items: center;justify-content: center;font-size: 0.26rem;box-sizing: border-box;}
    213. 

  213. .pawfixedbtn.btn1{color: #0074FF;}
    214. 

  214. .pawfixedbtn.btn2{color: #E80000;border-left: 0.02rem solid #DDDDDD;}
    215. 

  215. .pawfixedtit{font-size: 0.22rem;color: #666666;width: 3.56rem;margin:0 auto 0.4rem;}
    216. 

  216. .pawfixedtit span{color: #DF0024;margin-right: 0.12rem;}
    217. 

  217. 

  218. 

  219. .pawfixedin{margin-top: 0.4rem;display: flex;align-items: center;justify-content: center;margin-bottom: 0.36rem;}
    220. 

  220. .pawfixedin input{width: 0.46rem;border: none;border-bottom: 0.01rem solid #E5E5E5;padding: 0.12rem 0;margin:0 0.08rem ;text-align: center;}
    221. 

  221. .pawfixedin input.act{border-bottom: 0.01rem solid #DF0024;}
    222. 

  222. 

  223. /* .pawfixedin{margin-top: 0.4rem;margin-bottom: 0.36rem;position: relative;}
    224. 

  224. .pawfixedin input{position: absolute;left: 0;right: 0;bottom: 0;top: 0;opacity: 0;}
    225. 

  225. .pwd-wrap{display: flex;align-items: center;justify-content: center;}
    226. 

  226. .pawfixedin li{width: 0.46rem;border: none;border-bottom: 0.01rem solid #E5E5E5;margin:0 0.08rem ;text-align: center;font-size: 0.34rem;font-weight: bold;
    227. 

  227. color: #000000;height: 0.7rem;box-sizing: border-box;line-height: 0.7rem;}
    228. 

  228. .pawfixedin li:focus{border-bottom: 0.01rem solid #DF0024;} */
    229.