common.scss 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
  1. .main {
  2. padding: 15px;
  3. .form {
  4. border-radius: 6px;
  5. background-color: white;
  6. overflow: hidden;
  7. }
  8. }
  9. .tab {
  10. padding: 0px 5px 5px 5px;
  11. /* #ifdef H5 */
  12. margin-top: -1px;
  13. /* #endif */
  14. overflow: hidden;
  15. }
  16. .omit {
  17. white-space: nowrap;
  18. text-overflow: ellipsis;
  19. overflow: hidden;
  20. }
  21. .ellip {
  22. -webkit-line-clamp: 3;
  23. text-overflow: ellipsis;
  24. display: -webkit-box;
  25. -webkit-box-orient: vertical;
  26. overflow: hidden;
  27. margin-top: 7px;
  28. color: #666666;
  29. }
  30. .mt10 {
  31. margin-top: 10px !important;
  32. }
  33. .mt20 {
  34. margin-top: 20px !important;
  35. }
  36. .pdt0 {
  37. padding-top: 0px;
  38. }
  39. .pl5 {
  40. padding-left: 5px;
  41. }
  42. .flex {
  43. display: flex;
  44. text-align: center;
  45. .f {
  46. flex: 1;
  47. overflow: hidden;
  48. }
  49. }
  50. .btn {
  51. color: white;
  52. background-color: $main-color;
  53. border-radius: 30px;
  54. font-size: 15px;
  55. text-align: center;
  56. padding: 5px;
  57. margin-top: 15px;
  58. }
  59. .search {
  60. padding: 5px 15px 5px 15px;
  61. }
  62. .msilde {
  63. .top {
  64. padding: 10px;
  65. text-align: center;
  66. font-size: 15px;
  67. color: #535353;
  68. .icon {
  69. padding-left: 5px;
  70. }
  71. }
  72. .left {
  73. position: fixed;
  74. width: 33%;
  75. overflow-y: auto;
  76. z-index: 2;
  77. height: 95%;
  78. .item {
  79. padding: 13px 8px 13px 8px;
  80. font-size: 14px;
  81. text-align: center;
  82. &.active {
  83. background-color: white;
  84. color: $main-color;
  85. }
  86. }
  87. }
  88. .right {
  89. position: fixed;
  90. height: 100%;
  91. width: 67%;
  92. overflow-y: auto;
  93. left: 33%;
  94. z-index: 1;
  95. background-color: white;
  96. .contents {
  97. padding: 10px 10px 50px 10px;
  98. font-size: 14px;
  99. }
  100. .list {
  101. padding: 10px 10px 85px 10px;
  102. .item {
  103. padding: 15px 5px 15px 0px;
  104. overflow: hidden;
  105. border-bottom: 1px solid $line;
  106. &:first-child {
  107. padding-top: 0px;
  108. }
  109. .avatar {
  110. width: 70px;
  111. height: 100px;
  112. border-radius: 5px;
  113. float: left;
  114. }
  115. .con {
  116. float: left;
  117. width: 60%;
  118. padding-left: 12px;
  119. .name {
  120. font-weight: bold;
  121. }
  122. .brief {
  123. font-size: 13px;
  124. color: $font-c;
  125. line-height: 20px;
  126. }
  127. }
  128. }
  129. }
  130. }
  131. }
  132. /*****设置**********/
  133. .cmd {
  134. margin-top: 15px;
  135. border-radius: 5px;
  136. overflow: hidden;
  137. .s_item {
  138. padding: 10px;
  139. background-color: white;
  140. color: $font-c;
  141. overflow: hidden;
  142. border-bottom: 1px solid #f0f2f7;
  143. font-size: 15px;
  144. .ic {
  145. display: block;
  146. float: left;
  147. width: 27px;
  148. height: 27px;
  149. font-size: 25px;
  150. text-align: center;
  151. padding: 7px;
  152. border-radius: 50%;
  153. margin-right: 5px;
  154. line-height: 29px;
  155. }
  156. .title {
  157. color: #545555;
  158. padding-top: 11px;
  159. float: left;
  160. }
  161. .arrow {
  162. font-size: 20px;
  163. float: right;
  164. color: #9a9a9a;
  165. margin-top: 10px;
  166. }
  167. }
  168. }
  169. .xy {
  170. color: $font-c;
  171. padding-top: 15px;
  172. font-size: 14px;
  173. .checkbox {
  174. float: left;
  175. font-size: 14px;
  176. margin-top: 1px;
  177. }
  178. .a {
  179. color: blue;
  180. }
  181. }
  182. /**底部按钮操作******/
  183. .mfooter {
  184. position: fixed;
  185. width: 100%;
  186. bottom: 30px;
  187. text-align: center;
  188. .btn {
  189. border-radius: 35px;
  190. width: 40%;
  191. .icon {
  192. padding-right: 5px;
  193. }
  194. }
  195. }
  196. .form_group {
  197. padding: 9px 15px 9px 15px;
  198. overflow: hidden;
  199. position: relative;
  200. background-color: white;
  201. border-bottom: 1px solid $line;
  202. &.form_group:last-child {
  203. border-bottom: 0px;
  204. }
  205. .lable {
  206. font-size: 17px;
  207. text-align: left;
  208. position: relative;
  209. font-weight: bold;
  210. float: left;
  211. color: $font-c;
  212. margin-top: 7px;
  213. .limit {
  214. padding-left: 8px;
  215. font-size: 13px;
  216. font-weight: normal;
  217. color: darkgray;
  218. }
  219. }
  220. .re {
  221. &::before {
  222. content: '*';
  223. width: 0px;
  224. height: 0px;
  225. color: red;
  226. position: absolute;
  227. top: -7px;
  228. left: -8px;
  229. font-weight: bold;
  230. }
  231. }
  232. .bgm {
  233. color: white;
  234. border-radius: 5px;
  235. margin-top: 12px;
  236. position: relative;
  237. .input {
  238. border: 0px;
  239. width: 75%;
  240. margin-top: 0px;
  241. }
  242. .msg {
  243. position: absolute;
  244. right: 10px;
  245. top: 9px;
  246. }
  247. }
  248. .avatar {
  249. position: absolute;
  250. top: 0px;
  251. right: 0px;
  252. width: 55px;
  253. height: 55px;
  254. border-radius: 50%;
  255. }
  256. .desc {
  257. float: right;
  258. padding-top: 5px;
  259. width: 72%;
  260. text-align: right;
  261. }
  262. input {
  263. font-size: 15px;
  264. border-radius: 5px;
  265. padding: 10px 5px 10px 10px;
  266. width: 72%;
  267. float: right;
  268. text-align: right;
  269. }
  270. picker {
  271. position: relative;
  272. text-align: right;
  273. width: 72%;
  274. float: right;
  275. line-height: 0px;
  276. }
  277. textarea {
  278. font-size: 15px;
  279. border-radius: 5px;
  280. padding: 10px;
  281. margin-top: 40px;
  282. height: 120px;
  283. width: 93%;
  284. background-color: #f1f1f1;
  285. }
  286. .more {
  287. position: absolute;
  288. right: -13px;
  289. top: 20px;
  290. font-weight: normal;
  291. color: $font-c;
  292. }
  293. }
  294. .detail {
  295. padding: 15px;
  296. background-color: white;
  297. border-radius: 8px;
  298. .top {
  299. text-align: center;
  300. .avatar {
  301. width: 55%;
  302. border-radius: 5px;
  303. }
  304. .title {
  305. font-size: 18px;
  306. padding-top: 3px;
  307. }
  308. }
  309. .desc {
  310. padding-top: 15px;
  311. font-size: 13px;
  312. color: #7c8388;
  313. .time {
  314. padding-right: 25px;
  315. }
  316. .fx {
  317. background-color: white;
  318. float: right;
  319. font-size: 15px;
  320. margin-right: -14px;
  321. margin-top: -13px;
  322. color: $main-color;
  323. .icon {
  324. padding-right: 3px;
  325. }
  326. }
  327. }
  328. .con {
  329. font-size: 14px;
  330. line-height: 23px;
  331. image {
  332. border-radius: 5px !important;
  333. }
  334. }
  335. }
  336. .bz {
  337. font-size: 12px;
  338. color: $font-c;
  339. margin-top: 7px;
  340. .icon {
  341. padding-right: 3px;
  342. }
  343. .contact {
  344. background-color: #f1f1f1;
  345. float: right;
  346. font-size: 13px;
  347. color: $main-color;
  348. margin-top: -5px;
  349. }
  350. }
  351. .message-bubble-received {
  352. background: white;
  353. border-radius: 10px;
  354. padding: 13px;
  355. width: 85%;
  356. word-wrap: break-word;
  357. position: relative;
  358. margin-left: 10px;
  359. float: left;
  360. clear: both;
  361. font-size: 14px;
  362. color: #262626;
  363. margin-bottom: 15px;
  364. &::before {
  365. content: '';
  366. position: absolute;
  367. width: 0;
  368. height: 0;
  369. border-style: solid;
  370. border-width: 0 10px 10px 10px;
  371. border-color: transparent transparent white transparent;
  372. left: -10px;
  373. }
  374. }
  375. .ql-editor.ql-blank:before {
  376. font-style: normal !important;
  377. }
  378. .listv {
  379. padding: 5px 12px 5px 10px;
  380. background-color: white;
  381. margin: 10px;
  382. border-radius: 10px;
  383. .item {
  384. border-radius: 5px;
  385. padding: 13px 8px 13px 8px;
  386. margin-bottom: 10px;
  387. overflow: hidden;
  388. border-bottom: 1px solid $line;
  389. &:last-child {
  390. border: 0px;
  391. }
  392. .title {
  393. font-size: 15px;
  394. font-weight: bold;
  395. .icon {
  396. color: orangered;
  397. padding-right: 3px;
  398. }
  399. }
  400. .desc {
  401. font-size: 14px;
  402. padding-top: 10px;
  403. color: $font-c;
  404. text {
  405. padding-right: 15px;
  406. }
  407. .state {
  408. float: right;
  409. }
  410. .edit{
  411. float: right;
  412. }
  413. .del {
  414. color: red;
  415. float: right;
  416. padding-right: 0px;
  417. }
  418. }
  419. }
  420. }