my.css 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836
  1. body {
  2. font-family: "Microsoft Yahei", "微软雅黑";
  3. box-sizing: border-box;
  4. }
  5. .clearfix {
  6. clear: both;
  7. }
  8. /* 时间插件使用样式调整 */
  9. .el-input__prefix, .el-input__suffix {
  10. position: absolute;
  11. top: -4px;
  12. -webkit-transition: all .3s;
  13. height: 100%;
  14. color: #c0c4cc;
  15. text-align: center;
  16. }
  17. /* 调整消息提示样式 */
  18. .el-alert {
  19. width: 50%;
  20. margin-top: 10px;
  21. }
  22. .el-button {
  23. line-height: 0;
  24. }
  25. /* 调整模态框输入框大小 */
  26. #info-textarea {
  27. padding: 10px;
  28. height: 150px;
  29. width: 100%;
  30. }
  31. /*头部导航*/
  32. .header {
  33. padding: 0 40px 0 20px;
  34. width: 100%;
  35. height: 50px;
  36. line-height: 50px;
  37. background: #fff;
  38. box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
  39. -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
  40. -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
  41. -o-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
  42. z-index: 1000;
  43. }
  44. .header .navbar-left {
  45. position: relative;
  46. }
  47. .header a.logo {
  48. width: 100%;
  49. height: 100%;
  50. }
  51. .header a.logo img {
  52. width: 60px;
  53. height: 20px;
  54. }
  55. .header .logo-txt {
  56. margin: 0 30px 0 26px;
  57. font-size: 16px;
  58. font-weight: bold;
  59. color: #000;
  60. }
  61. .header .logo-txt:before {
  62. content: '';
  63. position: absolute;
  64. top: 18px;
  65. left: 75px;
  66. width: 1px;
  67. height: 18px;
  68. background: #000;
  69. }
  70. .header .logo-name {
  71. font-size: 12px;
  72. color: #333;
  73. }
  74. .header .logo-name i {
  75. margin-right: 5px;
  76. font-size: 16px;
  77. color: #7e7e7e;
  78. }
  79. .header .logo-name em {
  80. font-style: normal;
  81. font-size: 12px;
  82. color: #333;
  83. }
  84. .header .message {
  85. margin-left: 17px;
  86. position: relative;
  87. }
  88. .header .message i {
  89. font-size: 20px;
  90. font-weight: bold;
  91. color: #3a93f7;
  92. }
  93. .header .message .red {
  94. position: absolute;
  95. top: 0;
  96. right: -3px;
  97. width: 8px;
  98. height: 8px;
  99. background: #d82128;
  100. border-radius: 50%;
  101. }
  102. .header .navbar-right b {
  103. font-size: 12px;
  104. font-weight: normal;
  105. color: #333;
  106. }
  107. .header .navbar-right i {
  108. margin-right: 10px;
  109. font-size: 14px;
  110. }
  111. .header .navbar-right a:first-child i {
  112. color: #5777e0;
  113. }
  114. .header .navbar-right a:nth-child(2) i {
  115. color: #48bb20;
  116. }
  117. .header .navbar-right a:last-child i {
  118. color: #c83c3c;
  119. }
  120. .header .navbar-right a.line {
  121. position: relative;
  122. margin-right: 40px;
  123. }
  124. .header .navbar-right a.line b:after {
  125. content: '';
  126. position: absolute;
  127. top: 2px;
  128. right: -20px;
  129. display: inline-block;
  130. width: 1px;
  131. height: 16px;
  132. background: #adadad;
  133. }
  134. /*左侧菜单栏*/
  135. .main-sidebar, .left-side {
  136. margin-top: 50px;
  137. padding-top: 0;
  138. }
  139. .skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side {
  140. background-color: #4d4a49;
  141. }
  142. .sidebar-menu .treeview-menu {
  143. padding-left: 0;
  144. }
  145. .sidebar-menu > li {
  146. border-bottom: 1px solid rgba(0, 0, 0, .5);
  147. }
  148. .sidebar-menu > li:last-child {
  149. border-bottom: none;
  150. }
  151. .skin-blue .sidebar-menu > li > a {
  152. border-left: none;
  153. }
  154. .skin-blue .sidebar-menu > li > a, .skin-blue .sidebar-menu > li > a {
  155. height: 40px;
  156. color: #d7d7d7;
  157. background: #4d4a49;
  158. }
  159. .skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a {
  160. color: #d7d7d7;
  161. background: #696d70;
  162. }
  163. .skin-blue .sidebar-menu > li > .treeview-menu {
  164. margin: 0;
  165. background: #4d4a49;
  166. }
  167. .sidebar-menu .treeview-menu > li {
  168. border-bottom: 1px solid rgba(0, 0, 0, .5);
  169. }
  170. .sidebar-menu .treeview-menu > li:last-child {
  171. border-bottom: none;
  172. }
  173. .skin-blue .treeview-menu > li > a {
  174. color: #d7d7d7;
  175. padding-left: 55px;
  176. height: 40px;
  177. line-height: 40px;
  178. }
  179. .skin-blue .treeview-menu > li > a.active, .skin-blue .treeview-menu > li > a:hover {
  180. background: #696d70;
  181. }
  182. .sidebar .search {
  183. position: relative;
  184. margin: 0 auto;
  185. padding-top: 10px;
  186. height: 40px;
  187. line-height: 40px;
  188. text-align: center;
  189. }
  190. .sidebar .search input {
  191. margin: 0 auto;
  192. width: 178px;
  193. height: 24px;
  194. text-align: center;
  195. border-radius: 12px;
  196. background: #5f5c5c;
  197. border: 1px solid #5f5c5c;
  198. }
  199. .sidebar .search i {
  200. position: absolute;
  201. top: 13px;
  202. right: 38px;
  203. font-size: 16px;
  204. color: #a6a6a6;
  205. }
  206. .sidebar .search .close {
  207. position: absolute;
  208. top: 0;
  209. right: 0;
  210. display: inline-block;
  211. width: 16px;
  212. height: 16px;
  213. border-radius: 3px;
  214. background: #5f5c5c;
  215. }
  216. .sidebar .search .close i {
  217. font-size: 12px;
  218. color: #fff;
  219. }
  220. /*content*/
  221. .content {
  222. min-height: 250px;
  223. margin: 0 auto;
  224. }
  225. .content-wrapper, .right-side {
  226. background-color: #fff;
  227. box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
  228. -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
  229. -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
  230. -o-box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
  231. }
  232. .content .content-row {
  233. padding-top: 30px;
  234. padding-left: 35px;
  235. margin-bottom: 30px;
  236. }
  237. .content .list-inline .all {
  238. width: 100%;
  239. overflow: hidden;
  240. }
  241. .boxes {
  242. position: relative;
  243. border-radius: 3px;
  244. background: #ffffff;
  245. margin-bottom: 20px;
  246. width: 100%;
  247. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  248. }
  249. .info {
  250. position: relative;
  251. }
  252. .info span {
  253. font-size: 14px;
  254. font-weight: bold;
  255. color: #000;
  256. }
  257. .info b.line:after {
  258. content: '';
  259. position: absolute;
  260. top: 10px;
  261. right: 0;
  262. width: 95%;
  263. height: 1px;
  264. background: #b7b7b7;
  265. }
  266. .form-group {
  267. position: relative;
  268. margin-right: 5%;
  269. float: left;
  270. height: 24px;
  271. line-height: 24px;
  272. }
  273. .form-group1 {
  274. position: relative;
  275. margin-right: 5%;
  276. margin-bottom: 10px;
  277. }
  278. .form-group1 textarea {
  279. width: 693px;
  280. border-radius: 0;
  281. }
  282. .form-group:last-child {
  283. margin-right: 0;
  284. }
  285. .form-group label {
  286. float: left;
  287. margin-right: 5px;
  288. width: 140px;
  289. font-size: 13px;
  290. font-weight: normal;
  291. color: #666;
  292. text-align: right;
  293. }
  294. .form-group2 label {
  295. margin-left: 10%;
  296. font-size: 16px;
  297. font-weight: normal;
  298. color: #666;
  299. text-align: right;
  300. margin-bottom: 10px;
  301. margin-top: 20px;
  302. }
  303. .form-group2 input {
  304. float: right;
  305. display: inline-block;
  306. margin-right: 30%;
  307. margin-bottom: 10px;
  308. margin-top: 20px;
  309. font-size: 13px;
  310. }
  311. .form-group1 label {
  312. float: left;
  313. margin-right: 5px;
  314. width: 140px;
  315. font-size: 13px;
  316. font-weight: normal;
  317. color: #666;
  318. text-align: right;
  319. }
  320. .form-group input {
  321. float: left;
  322. width: 250px;
  323. height: 30px;
  324. border-radius: 0;
  325. }
  326. .form-group1 input {
  327. float: left;
  328. width: 250px;
  329. height: 30px;
  330. border-radius: 0;
  331. }
  332. .form-group select {
  333. float: left;
  334. width: 250px;
  335. height: 30px;
  336. border-radius: 0;
  337. padding-top:0;
  338. padding-bottom: 0;
  339. }
  340. .icon {
  341. position: absolute;
  342. top: 0;
  343. right: 3px;
  344. width: 25px;
  345. height: 24px;
  346. text-align: center;
  347. border-left: 1px solid #cfcfcf;
  348. cursor: pointer;
  349. }
  350. .icon i {
  351. font-size: 14px;
  352. color: #9d9d9d;
  353. }
  354. .find {
  355. position: absolute;
  356. top: 0;
  357. right: -80px;
  358. }
  359. .find a {
  360. display: inline-block;
  361. width: 62px;
  362. height: 24px;
  363. text-align: center;
  364. border-radius: 4px;
  365. color: #fff;
  366. background: #059eff;
  367. }
  368. .table > thead > tr {
  369. border: 1px solid #dcdcdc;
  370. height: 28px;
  371. background: #e4e4e4;
  372. text-align: left;
  373. }
  374. .table > thead > tr > th {
  375. font-size: 13px;
  376. font-weight: normal;
  377. color: #666;
  378. vertical-align: bottom;
  379. border: 1px solid #dcdcdc;
  380. }
  381. .table > tbody > tr {
  382. height: 28px;
  383. background: #fff;
  384. text-align: left;
  385. cursor: pointer;
  386. }
  387. .table > tbody > tr > td {
  388. font-size: 13px;
  389. color: #333;
  390. vertical-align: bottom;
  391. border: 1px solid #dcdcdc;
  392. }
  393. .table > tbody > tr > td.grey {
  394. /*background: #eee;*/
  395. z-index: 100;
  396. }
  397. .table > tbody > tr:hover {
  398. background: #bcd2ee !important;
  399. z-index: 1000;
  400. }
  401. .pagination {
  402. padding-left: 22px;
  403. margin: 0;
  404. }
  405. .pagination span {
  406. font-size: 12px;
  407. color: #5a5a5a;
  408. }
  409. .pagination span em {
  410. margin: 0 5px;
  411. font-size: 12px;
  412. font-style: normal;
  413. color: #2f95dd;
  414. }
  415. .pagination a {
  416. margin-left: 5px;
  417. text-decoration: none;
  418. font-size: 12px;
  419. color: #2f95dd;
  420. }
  421. .x-step {
  422. background: #e8e8e8;
  423. text-align: center;
  424. margin-left: 0;
  425. width: 100%;
  426. margin: 0 auto;
  427. height: 34px;
  428. margin-bottom: 10px;
  429. }
  430. .x-step-lg {
  431. font-size: 18px
  432. }
  433. .x-step-x li {
  434. width: 100%;
  435. cursor: pointer;
  436. font-weight: bold;
  437. }
  438. .x-step-2x li {
  439. width: 50%;
  440. float: left;
  441. cursor: pointer;
  442. font-weight: bold;
  443. }
  444. .x-step-2x li a:hover {
  445. color: #666;
  446. cursor: pointer;
  447. }
  448. .x-step-3x li {
  449. width: 33.3%;
  450. float: left;
  451. cursor: pointer;
  452. font-weight: bold;
  453. }
  454. .x-step-3x li a:hover {
  455. color: #666;
  456. cursor: pointer;
  457. }
  458. .x-step-10x li {
  459. width: 11%;
  460. float: left;
  461. }
  462. .step li{
  463. padding: 0;
  464. height: 34px;
  465. line-height: 34px;
  466. position: relative;
  467. padding: 0 10px;
  468. }
  469. .step li.active {
  470. background: #5078cb;
  471. color: #fff;
  472. }
  473. #info{
  474. background: #e8e8e8;
  475. margin-bottom: 20px;
  476. }
  477. .x-step li {
  478. padding: 0;
  479. height: 34px;
  480. line-height: 34px;
  481. position: relative;
  482. }
  483. .x-step-lg li {
  484. height: 46px;
  485. line-height: 46px;
  486. }
  487. .x-step li.active {
  488. background: #5078cb;
  489. color: #fff;
  490. }
  491. .x-step li.active:before, .x-step li.active:after, .x-step .x-split:before, .x-step .x-split:after {
  492. position: absolute;
  493. top: 0;
  494. display: inline-block;
  495. /* border-top: 17px solid transparent;
  496. border-bottom: 17px solid transparent;
  497. border-left: 17px solid transparent;*/
  498. content: '';
  499. }
  500. .x-step-lg li.active:before, .x-step-lg li.active:after, .x-step-lg .x-split:before, .x-step-lg .x-split:after {
  501. border-width: 23px
  502. }
  503. .x-step li.active:after {
  504. border-left-color: #5078cb;
  505. right: -17px;
  506. }
  507. .x-step-lg li.active:after {
  508. right: -23px;
  509. }
  510. .x-step li.active:before {
  511. border-left-color: #e8e8e8;
  512. left: -17px;
  513. z-index: 3
  514. }
  515. .x-step-lg li.active:before {
  516. left: -23px;
  517. }
  518. .x-step strong {
  519. font-style: italic;
  520. font-size: 120%;
  521. color: #777;
  522. margin-right: 5px;
  523. text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  524. }
  525. .x-step li.active strong {
  526. color: #fff;
  527. }
  528. .x-step .x-split {
  529. float: right;
  530. }
  531. .x-step .x-split:after {
  532. border-left-color: #f5f8fa;
  533. right: -20px;
  534. z-index: 1
  535. }
  536. .x-step-lg .x-split:after {
  537. right: -26px
  538. }
  539. .x-step .x-split:before {
  540. border-left-color: #e8e8e8;
  541. right: -18px;
  542. z-index: 2
  543. }
  544. .x-step-lg .x-split:before {
  545. right: -24px
  546. }
  547. .x-step li:first-child:before, .x-step li:last-child:after {
  548. border-width: 0
  549. }
  550. .x-step li:nth-of-type(1) .x-split:after {
  551. border-left-color: #e8e8e8;
  552. right: -18px;
  553. z-index: 1;
  554. }
  555. .x-step li:nth-of-type(1) .x-split:before {
  556. border-left-color: #5078cb;
  557. right: -17px;
  558. z-index: 4;
  559. }
  560. .x-step li:nth-of-type(2).active .x-split:after {
  561. border-left-color: #e8e8e8;
  562. right: -18px;
  563. z-index: 1;
  564. }
  565. .x-step li:nth-of-type(2).active .x-split:before {
  566. border-left-color: #5078cb;
  567. right: -17px;
  568. z-index: 4;
  569. }
  570. .x-step li:nth-of-type(1).active:after, .x-step li:nth-of-type(2).active:before, .x-step li:nth-of-type(3).active:before {
  571. border-width: 0
  572. }
  573. .tab table thead th {
  574. text-align: center;
  575. }
  576. .tab table td {
  577. background-color: white;
  578. text-align: center;
  579. }
  580. .tab table tr td input {
  581. display: inline-block;
  582. border: 0px;
  583. height: 20px;
  584. width: 100%;
  585. }
  586. .tab table tr input[type='button'] {
  587. display: inline-block;
  588. line-height: 20px;
  589. text-align: center;
  590. background-color: white;
  591. font-size: 25px;
  592. }
  593. .toggle {
  594. width: 80px;
  595. height: 20px;
  596. border: 1px solid #dcdcdc;
  597. font-size: 12px;
  598. text-align: center;
  599. background-color: #5078cb;
  600. color: white;
  601. font-size: 15px;
  602. }
  603. .buttons {
  604. margin-left: 3%;
  605. }
  606. .buttons button {
  607. width: 80px;
  608. height: 30px;
  609. background-color: #5078cb;
  610. color: white;
  611. font-size: 15px;
  612. }
  613. #tabTitle {
  614. cursor: pointer;
  615. }
  616. input.el-upload__input {
  617. display: none;
  618. }
  619. .upload-demo {
  620. margin-left: 100px;
  621. }
  622. .el-upload-list__item {
  623. width: 30%;
  624. }
  625. /*弹框*/
  626. .modal-dialog {
  627. position: absolute;
  628. top: 0;
  629. bottom: 0;
  630. left: 0;
  631. right: 0;
  632. }
  633. .modal-content {
  634. /*overflow-y: scroll; */
  635. position: absolute;
  636. top: 0;
  637. bottom: 0;
  638. width: 100%;
  639. }
  640. .modal-body {
  641. overflow-y: scroll;
  642. position: absolute;
  643. top: 55px;
  644. bottom: 65px;
  645. width: 100%;
  646. }
  647. .modal-header .close {
  648. margin-right: 15px;
  649. }
  650. .modal-footer {
  651. position: absolute;
  652. width: 100%;
  653. bottom: 0;
  654. }
  655. .ul {
  656. float: left;
  657. }
  658. .ul li {
  659. font-size: 16px;
  660. font-weight: normal;
  661. color: #666;
  662. margin-bottom: 10px;
  663. margin-top: 20px;
  664. }
  665. .filebutton {
  666. position: absolute;
  667. top: 660px;
  668. padding-left: 60px;
  669. }
  670. .filebutton button {
  671. width: 80px;
  672. height: 30px;
  673. background-color: #5078cb;
  674. color: white;
  675. font-size: 15px;
  676. }
  677. .form-control[readonly], fieldset[disabled] .form-control {
  678. background-color: white;
  679. opacity: 1;
  680. }
  681. .el-date-editor.el-input, .el-date-editor.el-input__inner {
  682. width: 150px;
  683. }
  684. a{
  685. cursor: pointer;
  686. }
  687. .modal-dialog {
  688. position: absolute;
  689. top: 0;
  690. bottom: 0;
  691. left: 0;
  692. right: 0;
  693. }
  694. a{
  695. cursor: pointer;
  696. }
  697. .delete{
  698. color:dodgerblue;
  699. margin-left: 20px;
  700. cursor:pointer;
  701. }
  702. input[type="file"] {
  703. color: transparent;
  704. }
  705. .all .form-group2 label{
  706. color:blue;
  707. }