addRecode.css 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315
  1. *{
  2. box-sizing: border-box;
  3. }
  4. .template_my_record{
  5. display: flex;
  6. justify-content: space-between;
  7. align-items: center;
  8. }
  9. .template_name{
  10. font-size: 20px;
  11. font-weight: bold;
  12. color: #009FE8;
  13. padding: 10px 0;
  14. }
  15. .my_record{
  16. color: #009FE8;
  17. font-size: 14px
  18. }
  19. .recode_contents{
  20. background: #fff;
  21. padding: 8px;
  22. border-radius: 5px;
  23. }
  24. .row_col>label{
  25. color: #333;
  26. font-size: 16px;
  27. padding: 15px 0 ;
  28. position: relative;
  29. width: 100%;
  30. }
  31. .row_col>label:after{
  32. content: '';
  33. position: absolute;
  34. bottom: 0;
  35. left: 0;
  36. width: 100%;
  37. height: 1px;
  38. background: #ECF0F1;
  39. }
  40. .recode-warp{
  41. padding: 10px 15px;
  42. background: #009FE8;
  43. }
  44. .input-recode{
  45. position: relative;
  46. }
  47. .title{
  48. font-size: 16px;
  49. color: #97A3B4;
  50. font-weight: normal;
  51. margin-bottom: 10px;
  52. }
  53. .title span{
  54. color: red;
  55. position: relative;
  56. top: 2px;
  57. }
  58. .input-recode .input{
  59. margin: 0;
  60. height: 45px;
  61. border: 1px solid #e1e5e9;
  62. background: #ffffff;
  63. font-size: 14px;
  64. width: 100%;
  65. -webkit-border-radius: 3px;
  66. border-radius: 3px;
  67. padding-left: 15px;
  68. padding-right: 30px;
  69. -webkit-box-sizing: border-box;
  70. box-sizing: border-box;
  71. color: #333;
  72. }
  73. .modula:not(:first-child){
  74. margin-top: 18px;
  75. }
  76. .ico{
  77. display: block;
  78. position: absolute;
  79. top: 16px;
  80. right: 8px;
  81. width: 18px;
  82. height: 13px;
  83. background: url(../icon/ico.png) no-repeat;
  84. background-size: cover;
  85. }
  86. /*录音*/
  87. .input-recode audio{
  88. width: 100%;
  89. }
  90. .upload-btn{
  91. width: 100px;
  92. height: 33px;
  93. background: url(../icon/mp3.jpg);
  94. background-size: cover;
  95. display: block;
  96. cursor: pointer;
  97. }
  98. .del-btn{
  99. display: none;
  100. width: 60px;
  101. height: 30px;
  102. line-height: 30px;
  103. text-align: center;
  104. color: #fff;
  105. background: #07c160;
  106. border-radius: 3px;
  107. font-size: 14px;
  108. margin-bottom: 10px;
  109. }
  110. /*文件*/
  111. .file-items-add{
  112. border: 1px dashed #D9D9D9;
  113. padding: 10px 10px 0 10px;
  114. display: flex;
  115. justify-content: flex-start;
  116. flex-wrap: wrap;
  117. box-sizing: border-box;
  118. }
  119. .file-width{
  120. width: 33.3333333%;
  121. box-sizing: border-box;
  122. font-size: 14px;
  123. color: #333;
  124. margin-bottom: 10px;
  125. }
  126. .file-item-add{
  127. text-align: center;
  128. }
  129. .file-item-add img{
  130. width: 35px;
  131. height: 35px;
  132. margin-bottom: 5px;
  133. }
  134. .file-item-add p{
  135. padding: 0 5px;
  136. overflow: hidden;
  137. text-overflow: ellipsis;
  138. display: -webkit-box;
  139. -webkit-line-clamp: 2;
  140. -webkit-box-orient: vertical;
  141. height: auto;
  142. }
  143. .upload img{
  144. width: 80px;
  145. height: 80px;
  146. margin-left: 15px;
  147. }
  148. /*图片*/
  149. .img-item{
  150. text-align: center;
  151. }
  152. .img-item img{
  153. width: 80px;
  154. height: 80px;
  155. border-radius: 3px;
  156. object-fit: cover;
  157. }
  158. .img-items .upload{
  159. text-align: center;
  160. }
  161. .img-items .upload img{
  162. width: 80px;
  163. height: 80px;
  164. margin: 0;
  165. }
  166. /*视频*/
  167. .upload-btn1{
  168. width: 100px;
  169. height: 33px;
  170. background: url(../icon/vedio.png);
  171. background-size: cover;
  172. display: block;
  173. cursor: pointer;
  174. }
  175. .submit-btn{
  176. width: 100%;
  177. font-size: 18px;
  178. background: #009fe8;
  179. height: 55px;
  180. line-height: 55px;
  181. letter-spacing: 5px;
  182. color: #fff;
  183. border-radius: 3px;
  184. margin-top: 20px;
  185. margin-bottom: 10px;
  186. }
  187. /*检查项*/
  188. .radio-wrap{
  189. font-size: 14px;
  190. display: flex;
  191. justify-content: flex-start;
  192. flex-wrap: wrap;
  193. padding-top: 10px;
  194. }
  195. .radio-wrap label{
  196. margin-right: 10px;
  197. padding: 5px 0;
  198. }
  199. .radio-wrap label input{
  200. margin-right: 10px;
  201. }
  202. /*position*/
  203. .flex-space-between{
  204. display: flex;
  205. justify-content: space-between;
  206. white-space: nowrap;
  207. align-items: center;
  208. }
  209. .flex-space{
  210. display: flex;
  211. justify-content: space-between;
  212. white-space: nowrap;
  213. align-items: center;
  214. }
  215. .ico-map{
  216. width: 25px;
  217. height: 25px;
  218. background: url("../icon/position.png") no-repeat;
  219. background-position: center;
  220. background-size: cover;
  221. }
  222. .position{
  223. padding: 5px 0;
  224. padding-left: 15px;
  225. padding-right: 10px;
  226. border-radius: 50px;
  227. background: #F0F0F0;
  228. font-size: 14px;
  229. margin-top:10px;
  230. }
  231. .map1{
  232. color: #009FE8;
  233. margin-bottom: 5px;
  234. }
  235. .again{
  236. color: #6C6F74;
  237. }
  238. .map-name {
  239. width: 78%;
  240. }
  241. .names{
  242. width: 85%;
  243. white-space: normal;
  244. }
  245. #position_warp{
  246. /*padding: 0 ;*/
  247. padding-bottom: 5px;
  248. }
  249. .textarea{
  250. height: 45px;
  251. line-height: 1.5;
  252. }
  253. /*a类型 图标显示 css*/
  254. .a-recodeWrap-ul {
  255. padding: 16px 16px;
  256. background: #009FE8;
  257. color: #232627;
  258. font-size: 16px;
  259. padding-bottom: 6px;
  260. }
  261. .a-recodeWrap-ul li{
  262. padding: 12px 16px;
  263. background: #fff;
  264. border-radius: 3px;
  265. position: relative;
  266. padding-right: 32px;
  267. overflow: hidden;
  268. text-overflow: ellipsis;
  269. white-space: nowrap;
  270. margin-bottom: 10px;
  271. }
  272. .a-recodeWrap-ul li .a-addRecode{
  273. position: absolute;
  274. top: 15px;
  275. right: 16px;
  276. width: 12px;
  277. height: 12px;
  278. background: url('../icon/add.png') no-repeat;
  279. background-size: cover;
  280. }
  281. /*图标*/
  282. .a-recodeWrap-ul-icon{
  283. padding: 14px 16px;
  284. background: #009FE8;
  285. color: #FFFFFF;
  286. font-size: 14px;
  287. padding-bottom: 6px;
  288. text-align: center;
  289. display: flex;
  290. justify-content: flex-start;
  291. align-items: center;
  292. flex-wrap: wrap;
  293. }
  294. .a-recodeWrap-ul-icon li{
  295. width: 25%;
  296. margin-bottom: 10px;
  297. }
  298. .a-recodeWrap-ul-icon img{
  299. width: 45px;
  300. height: 45px;
  301. display: block;
  302. margin: auto;
  303. margin-bottom: 7px;
  304. border-radius: 50%;
  305. object-fit: cover;
  306. }
  307. .a-recodeWrap-ul-icon span{
  308. display: block;
  309. padding: 0 5px;
  310. overflow: hidden;
  311. text-overflow: ellipsis;
  312. white-space: nowrap;
  313. }