index.css 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. .evaluate-dialog {
  2. position: fixed;
  3. right: 0;
  4. bottom: 0;
  5. left: 0;
  6. z-index: 56;
  7. max-height: 90%;
  8. padding: .5rem .3rem .4rem;
  9. padding: .5rem .3rem -webkit-calc(.4rem + constant(safe-area-inset-bottom));
  10. padding: .5rem .3rem -moz-calc(.4rem + constant(safe-area-inset-bottom));
  11. padding: .5rem .3rem calc(.4rem + constant(safe-area-inset-bottom));
  12. padding: .5rem .3rem -webkit-calc(.4rem + env(safe-area-inset-bottom));
  13. padding: .5rem .3rem -moz-calc(.4rem + env(safe-area-inset-bottom));
  14. padding: .5rem .3rem calc(.4rem + env(safe-area-inset-bottom));
  15. border-top-left-radius: .3rem;
  16. border-top-right-radius: .3rem;
  17. background-color: #fff;
  18. -webkit-overflow-scrolling: touch;
  19. overflow-y: auto;
  20. -webkit-transition: -webkit-transform .3s;
  21. transition: -webkit-transform .3s;
  22. -o-transition: -o-transform .3s;
  23. -moz-transition: transform .3s, -moz-transform .3s;
  24. transition: transform .3s;
  25. transition: transform .3s, -webkit-transform .3s, -moz-transform .3s, -o-transform .3s;
  26. transition: transform .3s, -webkit-transform .3s;
  27. -webkit-transform: translateY(100%);
  28. -moz-transform: translateY(100%);
  29. -ms-transform: translateY(100%);
  30. -o-transform: translateY(100%);
  31. transform: translateY(100%);
  32. }
  33. .evaluate-dialog.on {
  34. -webkit-transform: translateY(0);
  35. -moz-transform: translateY(0);
  36. -ms-transform: translateY(0);
  37. -o-transform: translateY(0);
  38. transform: translateY(0);
  39. }
  40. .evaluate-dialog .rate-section {
  41. display: -webkit-box;
  42. display: -webkit-flex;
  43. display: -ms-flexbox;
  44. display: -moz-box;
  45. display: flex;
  46. -webkit-box-align: center;
  47. -webkit-align-items: center;
  48. -ms-flex-align: center;
  49. -moz-box-align: center;
  50. align-items: center;
  51. font-size: .28rem;
  52. color: #282828;
  53. }
  54. .evaluate-dialog .rate-section div:nth-child(2) {
  55. margin-right: .3rem;
  56. margin-left: .2rem;
  57. font-size: .36rem;
  58. color: #ccc;
  59. }
  60. .evaluate-dialog .iconxing ~ .iconxing {
  61. margin-left: .16rem;
  62. }
  63. .evaluate-dialog .iconxing.on {
  64. color: #F78200;
  65. }
  66. .evaluate-dialog .rate-section div:last-child {
  67. font-size: .24rem;
  68. color: #aaa;
  69. }
  70. .evaluate-dialog .custom-section {
  71. padding: .3rem;
  72. border-radius: .1rem;
  73. margin-top: .5rem;
  74. background-color: #fafafa;
  75. }
  76. .evaluate-dialog textarea {
  77. display: block;
  78. width: 100%;
  79. resize: none;
  80. font-size: .28rem;
  81. }
  82. .evaluate-dialog textarea::-webkit-input-placeholder {
  83. color: #bbb;
  84. }
  85. .evaluate-dialog textarea::-webkit-input-placeholder,
  86. .evaluate-dialog textarea::placeholder {
  87. color: #bbb;
  88. }
  89. .evaluate-dialog .custom-section div {
  90. margin-top: .6rem;
  91. margin-right: -0.32rem;
  92. margin-bottom: -0.32rem;
  93. }
  94. .evaluate-dialog .custom-section div::after {
  95. content: " ";
  96. display: block;
  97. height: 0;
  98. clear: both;
  99. visibility: hidden;
  100. }
  101. .evaluate-dialog li {
  102. position: relative;
  103. float: left;
  104. width: 1.4rem;
  105. height: 1.4rem;
  106. margin-right: .32rem;
  107. margin-bottom: .32rem;
  108. }
  109. .evaluate-dialog img {
  110. display: block;
  111. width: 100%;
  112. height: 100%;
  113. border-radius: .06rem;
  114. -o-object-fit: cover;
  115. object-fit: cover;
  116. pointer-events: none;
  117. }
  118. .evaluate-dialog a {
  119. position: absolute;
  120. top: 0;
  121. right: 0;
  122. width: .36rem;
  123. height: .36rem;
  124. border-radius: 50%;
  125. margin-top: -0.12rem;
  126. margin-right: -0.12rem;
  127. background: #191C6E url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA1klEQVQ4T63TLVJDUQyG4edUlBkQrQYcawGDKCuAVbCE7gBThwAUi4BKNCyBH4nChknnlCnl3jt0bmPPyZvkS74SETs4wjs+SymhIyKiYBf7eCsRcYApnnGXoDZITR7hBBNcJSBpp7jAHDdNkLXkczzgOgHZ0pKaD38gnX9y3K4PVY7WAll9ES2QW3zhGI3d/QBaIE91OylYoz6/ACuQcVX5EgPcY4bX9Q1tF9Cgw/9H6CVirzX2PqQep/y4POV0VZrpZUMzneVq0wvDauePDey8h8O08zdMV6S1c4zvwQAAAABJRU5ErkJggg==") center/.16rem no-repeat;
  128. }
  129. .evaluate-dialog label {
  130. float: left;
  131. width: 1.4rem;
  132. height: 1.4rem;
  133. border: 1px solid #ddd;
  134. border-radius: .06rem;
  135. margin-right: .32rem;
  136. margin-bottom: .32rem;
  137. -webkit-box-sizing: border-box;
  138. -moz-box-sizing: border-box;
  139. box-sizing: border-box;
  140. font-size: 0;
  141. line-height: 1.4rem;
  142. text-align: center;
  143. }
  144. .evaluate-dialog label span {
  145. display: inline-block;
  146. padding-top: .5rem;
  147. background: url("data:image/png;base64,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") center top/.46rem no-repeat;
  148. vertical-align: middle;
  149. font-size: .22rem;
  150. line-height: 1.5;
  151. color: #bbb;
  152. }
  153. .evaluate-dialog button {
  154. display: block;
  155. width: 100%;
  156. height: .86rem;
  157. border-radius: .43rem;
  158. margin-top: .55rem;
  159. background: #191C6E;
  160. font-family: inherit;
  161. font-weight: normal;
  162. font-size: .3rem;
  163. color: #fff;
  164. }