feedback.css 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
  1. /*!
  2. * ======================================================
  3. * FeedBack Template For MUI (http://dev.dcloud.net.cn/mui)
  4. * =======================================================
  5. * @version:1.0.0
  6. * @author:cuihongbao@dcloud.io
  7. */
  8. .zy-alert{
  9. color:#323232!important;
  10. font-size: 16px;
  11. }
  12. .mui-popover.bg-w{
  13. width: 190px;
  14. }
  15. .img-bg{
  16. background: #fff;
  17. padding: 8px 10px;
  18. width: 100%;
  19. }
  20. .add-img{
  21. float: left;
  22. margin: 15px;
  23. }
  24. .add-img2{
  25. float: left;
  26. margin: 15px 15px 15px 0px;
  27. position: relative;
  28. }
  29. .delete-icon{
  30. position: absolute;
  31. top: -9px;
  32. right: -6px;
  33. }
  34. .feedback body {
  35. background-color: #EFEFF4;
  36. }
  37. .feedback input,
  38. .feedback textarea {
  39. border: none;
  40. font-size: 16px;
  41. }
  42. .feedback textarea {
  43. height: 150px;
  44. margin-bottom: 0 !important;
  45. padding-bottom: 0 !important;
  46. }
  47. .feedback .row {
  48. width: 100%;
  49. background-color: #fff;
  50. }
  51. .feedback p.text {
  52. font-size: 14px;
  53. padding: 10px 0px 5px 10px;
  54. color: #323232;
  55. margin-bottom: 0px;
  56. }
  57. input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
  58. font-size: 14px;
  59. }
  60. .feedback .hidden {
  61. display: none;
  62. }
  63. .feedback .image-list {
  64. width: 100%;
  65. height: 85px;
  66. background-size: cover;
  67. padding: 10px 10px;
  68. overflow: hidden;
  69. }
  70. .feedback .image-item {
  71. width: 65px;
  72. height: 65px;
  73. /*background-image: url(../images/iconfont-tianjia.png);*/
  74. background-size: 100% 100%;
  75. display: inline-block;
  76. position: relative;
  77. border-radius: 5px;
  78. margin-right: 10px;
  79. margin-bottom: 10px;
  80. border: solid 1px #e8e8e8;
  81. vertical-align: top;
  82. }
  83. .feedback .image-item .file {
  84. position: absolute;
  85. left: 0px;
  86. top: 0px;
  87. width: 100%;
  88. height: 100%;
  89. opacity: 0;
  90. cursor: pointer;
  91. z-index: 0;
  92. }
  93. .feedback .image-item.space {
  94. border: none;
  95. }
  96. .feedback .image-item .image-close {
  97. position: absolute;
  98. display: inline-block;
  99. right: -6px;
  100. top: -6px;
  101. width: 20px;
  102. height: 20px;
  103. text-align: center;
  104. line-height: 20px;
  105. border-radius: 12px;
  106. background-color: #FF5053;
  107. color: #f3f3f3;
  108. border: solid 1px #FF5053;
  109. font-size: 9px;
  110. font-weight: 200;
  111. z-index: 1;
  112. }
  113. .feedback .image-item .image-up{
  114. height: 65px;
  115. width: 65px;
  116. border-radius: 10px;
  117. line-height: 65px;
  118. border: 1px solid #ccc;
  119. color: #ccc;
  120. display: inline-block;
  121. text-align: center;
  122. }
  123. .feedback .image-item .image-up:after{
  124. font-family: "微软雅黑";
  125. content: '+';
  126. font-size: 60px;
  127. }
  128. .feedback .image-item.space .image-close {
  129. display: none;
  130. }
  131. .feedback .mui-inline{
  132. vertical-align: middle;
  133. font-size: 16px;
  134. color: #323232;
  135. }
  136. .mui-icon-star{
  137. color: #B5B5B5;
  138. font-size: 22px;
  139. }
  140. .mui-icon-star-filled{
  141. color: #FFB400;
  142. font-size: 22px;
  143. }
  144. .mui-popover {
  145. height: 180px;
  146. }
  147. .mui-popover.ab-h{
  148. height: 140px;
  149. }
  150. .stream{
  151. display: none;
  152. }
  153. .mui-plus-stream .stream{
  154. display: block;
  155. }
  156. .upload-img {
  157. overflow: hidden;
  158. display: inline-block;
  159. }
  160. .upload-img ul li {
  161. position: relative;
  162. display: inline;
  163. float: left;
  164. margin-right: 10px;
  165. }
  166. .c-btn-4DCD70{
  167. background-color: #4dcd70;
  168. }
  169. .upload-img .del-img {
  170. position: absolute;
  171. top: 0;
  172. right: 0;
  173. text-align: center;
  174. width: 26px;
  175. height: 26px;
  176. line-height: 20px;
  177. z-index: 10;
  178. background: rgba(0, 0, 0, .5);
  179. border-radius: 0 0 0 90%;
  180. overflow: hidden;
  181. }
  182. .upload-img .del-img .iconfont {
  183. color: #fff;
  184. font-size: 14px;
  185. line-height: 14px;
  186. margin-left: 4px;
  187. }
  188. .delimgpop { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #000; text-align: center; z-index: 2200; }
  189. .del-img-box { width: 100%; height: 100%; display: table; }
  190. .del-img-con { display: table-cell; vertical-align: middle; }
  191. .del-img-con img { width: auto; height: auto; }
  192. .del-img-con p { position: relative; display: inline-block; min-width: 100px; text-align: center; }
  193. .del-img-box p:after { position: absolute; top: 0; left: 0; content: ""; background: rgba(255,255,255,.6); width: 100%; height: 40px; z-index: 10; }
  194. .del-img-btn { display: inline-block; height: 40px; line-height: 40px; position: absolute; top: 0; right: 0; z-index: 20; padding: 0 15px; text-align: right; color: #000; }
  195. .del-img-btn .iconfont { font-size: 20px; margin-right: 4px; }
  196. .c-btn-rounded2{
  197. border: 1px solid #4dcd70;
  198. color: #4dcd70;
  199. border-radius: 5px;
  200. }
  201. .feedback input.border-input{
  202. margin: 0;
  203. border: 1px solid #e1e1e1;
  204. }
  205. .ml0{margin-left: 0px !important;}
  206. .pr0{padding-right: 0px !important;}
  207. .word-break{
  208. word-wrap: break-word;
  209. }
  210. .btn-full-green{
  211. text-align: center;
  212. padding: 10px;
  213. margin: 10px;
  214. background-color: #4dcd70;
  215. border-radius: 6px;
  216. color: #fff;
  217. }