main.css 6.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418
  1. @charset "utf-8";
  2. html,
  3. body {
  4. width: 100%;
  5. height: 100%;
  6. -webkit-text-size-adjust: 100%;
  7. position: relative;
  8. color: #333;
  9. overflow-x: hidden;
  10. font-size: 13px;
  11. background: #fff;
  12. }
  13. * {
  14. margin: 0;
  15. padding: 0;
  16. font-family: '微软雅黑';
  17. -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
  18. -webkit-font-smoothing: antialiased;
  19. }
  20. body * {
  21. font-size: 13px;
  22. }
  23. a {
  24. text-decoration: none;
  25. }
  26. a:hover {
  27. cursor: pointer;
  28. }
  29. em {
  30. font-style: normal;
  31. }
  32. li {
  33. list-style: none;
  34. }
  35. img {
  36. border: 0;
  37. vertical-align: middle;
  38. }
  39. table {
  40. border-collapse: collapse;
  41. border-spacing: 0;
  42. }
  43. p {
  44. word-wrap: break-word;
  45. }
  46. b {
  47. font-weight: normal;
  48. }
  49. input,
  50. textarea {
  51. border: 0;
  52. -webkit-appearance: none;
  53. }
  54. input[type='input'] {
  55. -webkit-appearance: none;
  56. }
  57. input[type='checkbox'] {
  58. -webkit-appearance: checkbox;
  59. }
  60. .text-overflow-ellipsis {
  61. overflow: hidden;
  62. white-space: nowrap;
  63. text-overflow: ellipsis;
  64. }
  65. .centerLabel {
  66. display: block;
  67. position: absolute;
  68. left: 50%;
  69. top: 50%;
  70. transform: translate(-50%, -50%);
  71. -webkit-transform: translate(-50%, -50%);
  72. }
  73. .flex-h {
  74. display: flex;
  75. display: -webkit-flex;
  76. }
  77. .flex-v {
  78. display: flex;
  79. display: -webkit-flex;
  80. flex-direction: column;
  81. -webkit-flex-direction: column;
  82. }
  83. .flex-item {
  84. flex: 1;
  85. -webkit-flex: 1;
  86. position: relative;
  87. overflow: hidden;
  88. }
  89. *[class*='text-overflowEllipsis-line'] {
  90. overflow: hidden;
  91. text-overflow: ellipsis;
  92. display: -webkit-box;
  93. -webkit-box-orient: vertical;
  94. }
  95. .text-overflowEllipsis-line2 {
  96. -webkit-line-clamp: 2;
  97. }
  98. .text-overflowEllipsis-line3 {
  99. -webkit-line-clamp: 3;
  100. }
  101. .text-overflowEllipsis-line4 {
  102. -webkit-line-clamp: 4;
  103. }
  104. *[class*='overflow-scroll-y'] {
  105. overflow-x: hidden;
  106. overflow-y: scroll;
  107. -webkit-overflow-scrolling: touch;
  108. }
  109. *[class*='overflow-scroll-x'] {
  110. overflow-y: hidden;
  111. overflow-x: scroll;
  112. -webkit-overflow-scrolling: touch;
  113. }
  114. .overflow-scroll-y-3d,
  115. .overflow-scroll-x-3d {
  116. transform: translateZ(0);
  117. -webkit-transform: translateZ(0);
  118. }
  119. .overflow-scroll-x::-webkit-scrollbar,
  120. .overflow-scroll-x-3d::-webkit-scrollbar {
  121. width: 0;
  122. height: 0;
  123. color: transparent;
  124. display: none;
  125. }
  126. input:focus,
  127. textarea:focus,
  128. select:focus {
  129. outline: none;
  130. }
  131. .mainPage {
  132. width: 100%;
  133. height: 100%;
  134. position: relative;
  135. overflow: hidden;
  136. }
  137. .subPage{
  138. width: 100%;
  139. height: 100%;
  140. position: relative;
  141. overflow-y: auto;
  142. }
  143. * > img.cover {
  144. width: 100%;
  145. height: 100%;
  146. object-fit: cover;
  147. }
  148. * > img.contain {
  149. width: 100%;
  150. height: 100%;
  151. object-fit: contain;
  152. }
  153. ::-webkit-scrollbar {
  154. width: 8px;
  155. height: 4px;
  156. }
  157. ::-webkit-scrollbar-track {
  158. background: transparent;
  159. }
  160. ::-webkit-scrollbar-thumb {
  161. border-radius: 5px;
  162. background: rgba(0, 0, 0, 0.3);
  163. }
  164. .system-table-box{
  165. width: calc(100% - 40px);
  166. margin: 20px auto 0;
  167. box-sizing: border-box;
  168. border: 1px solid #eee;
  169. border-bottom: none;
  170. }
  171. .system-table-search{
  172. width: calc(100% - 40px);
  173. margin: 20px auto 0;
  174. }
  175. .el-pagination{
  176. text-align: right;
  177. margin: 20px auto 0;
  178. }
  179. .el-pagination>*:last-child{
  180. margin-right: 20px
  181. }
  182. .el-table .cell{
  183. text-align: center;
  184. }
  185. .moreFilter>ul{
  186. font-size: 0;
  187. }
  188. .moreFilter>ul>li{
  189. display: inline-block;
  190. margin: 10px 20px 0 0;
  191. }
  192. .system-table-search li{
  193. margin-right: 20px;
  194. }
  195. .tableImg{
  196. width: 100px;
  197. height: 100px;
  198. display: inline-block;
  199. position: relative;
  200. overflow: hidden;
  201. background: #eee;
  202. }
  203. .iframePage{
  204. width: 100%;
  205. position: absolute;
  206. left: 0;
  207. top: 0;
  208. bottom: 0;
  209. overflow: hidden;
  210. z-index: 90;
  211. display: none;
  212. background: #fff;
  213. }
  214. .iframePage.show{
  215. display: block;
  216. }
  217. .mainForm{
  218. width: calc(100% - 40px);
  219. position: relative;
  220. overflow: hidden;
  221. display: block;
  222. margin: 20px auto;
  223. }
  224. .mainForm>ul>li{
  225. align-items: flex-start;
  226. margin-top: 20px;
  227. }
  228. .mainForm>ul>li>span{
  229. line-height: 40px;
  230. min-width: 110px;
  231. }
  232. .mainForm>ul>li>span:first-child>em{
  233. color: red;
  234. }
  235. .mainForm>ul>li>div>div{
  236. min-height: 40px;
  237. vertical-align: top;
  238. }
  239. .mainForm>ul>li>div>div>*{
  240. vertical-align: top;
  241. }
  242. .mainForm>ul>li>div>div>button{
  243. margin-top: 5px;
  244. }
  245. .mainForm .formImg{
  246. width: 150px;
  247. height: 150px;
  248. display: inline-block;
  249. background: #eee;
  250. position: relative;
  251. overflow: hidden;
  252. }
  253. .mainForm .formImg img{
  254. z-index: 1;
  255. }
  256. .mainForm .formImg i{
  257. display: inline-block;
  258. position: absolute;
  259. right: 5px;
  260. top: 5px;
  261. font-size: 20px;
  262. color: red;
  263. z-index: 2;
  264. }
  265. .system-table-search ul{
  266. font-size: 0;
  267. white-space: nowrap;
  268. }
  269. .system-table-search ul>li{
  270. display: inline-block;
  271. }
  272. .switch,.radio {
  273. display: flex;
  274. align-items: center;
  275. }
  276. .avatar-uploader .el-upload {
  277. border: 1px dashed #d9d9d9;
  278. border-radius: 6px;
  279. cursor: pointer;
  280. position: relative;
  281. overflow: hidden;
  282. }
  283. .avatar-uploader .el-upload:hover {
  284. border-color: #409EFF;
  285. }
  286. .avatar-uploader-icon {
  287. font-size: 28px;
  288. color: #8c939d;
  289. width: 178px;
  290. height: 178px;
  291. line-height: 178px;
  292. text-align: center;
  293. }
  294. .avatar {
  295. width: 178px;
  296. height: 178px;
  297. display: block;
  298. }
  299. .el-checkbox-group{
  300. font-size: 0;
  301. }
  302. .el-checkbox{
  303. display: inline-block;
  304. }
  305. .el-checkbox>*{
  306. line-height: 40px;
  307. }
  308. .el-checkbox+.el-checkbox{
  309. margin: 0;
  310. margin-right: 20px;
  311. }
  312. .el-checkbox{
  313. margin-right: 20px;
  314. }
  315. .el-tag{
  316. height: 40px;
  317. line-height: 40px;
  318. margin-bottom: 10px;
  319. }
  320. .el-textarea__inner{
  321. line-height: 20px;
  322. padding: 10px 15px;
  323. }
  324. .el-radio{
  325. font-size: 0;
  326. white-space: nowrap;
  327. }
  328. .el-radio>*{
  329. display: inline-block;
  330. line-height: 40px;
  331. vertical-align: middle;
  332. }
  333. .comp-full-calendar{
  334. padding: 0 !important;
  335. width: 100%;
  336. max-width: 100% !important;
  337. }
  338. .comp-full-calendar .week{
  339. line-height: 40px;
  340. background: #409EFF;
  341. color: #fff;
  342. }
  343. .el-dialog--center .el-dialog__body{
  344. padding: 0 20px !important;
  345. }
  346. .avatar-uploader{
  347. display: inline-block;
  348. }
  349. .component,
  350. .component>div,
  351. #mountNode>div{
  352. width: 100%;
  353. height: 100%;
  354. }
  355. .el-table th>.cell,
  356. .el-table .cell{
  357. text-overflow: initial !important;
  358. }
  359. .el-breadcrumb__item:last-child .el-breadcrumb__inner a{
  360. font-weight: 700 !important;
  361. color: #ccc;
  362. }