main.css 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329
  1. /*building SAAS 0.1*/
  2. /*bootstrap 初始化*/
  3. body {
  4. font-size: 0.9rem;
  5. overflow: hidden;
  6. background: #e4e7ea;
  7. }
  8. .text-warning {
  9. color: #da9500 !important;
  10. }
  11. .dropdown-menu {
  12. font-size: 12px
  13. }
  14. .btn.text-primary.disabled, .btn.text-primary:disabled {
  15. color:#666!important
  16. }
  17. .btn,.btn-group {
  18. vertical-align: baseline;
  19. }
  20. .nav-pills .nav-link.active, .nav-pills .show > .nav-link{
  21. background-color: #e4e7ea;
  22. color:#333;
  23. font-weight: 600
  24. }
  25. .custom-file-sm,.custom-file-sm .custom-file-label{
  26. height: calc(1.5em + .5rem + 2px);
  27. padding-top: .25rem;
  28. padding-bottom: .25rem;
  29. padding-left: .5rem;
  30. }
  31. .custom-file-sm .custom-file-label:after{
  32. height: calc(1.4em + .5rem + 2px);
  33. padding-top: .25rem;
  34. padding-bottom: .25rem;
  35. font-size: .875rem;
  36. }
  37. .custom-file-sm input{
  38. height: calc(1.5em + .5rem + 2px);
  39. font-size: .875rem;
  40. }
  41. .table th {
  42. background: #e9ecef;
  43. font-weight: normal;
  44. color:#000;
  45. }
  46. .form-check,.form-check-label{
  47. cursor: pointer;
  48. line-height: 22px;
  49. }
  50. .input-group-text .group-checkbox[type="checkbox"],.input-group-text .group-checkbox[type="radio"]{
  51. margin-top: .3rem;
  52. }
  53. .custom-control-label::before {
  54. top:.1rem;
  55. }
  56. .custom-control-label::after{
  57. top:.1rem;
  58. }
  59. .dropdown-menu .custom-control-label::before {
  60. top:.5rem;
  61. }
  62. .dropdown-menu .custom-control-label::after{
  63. top:.5rem;
  64. }
  65. .custom-switch .custom-control-label::after{
  66. top:.25rem;
  67. }
  68. .custom-control {
  69. min-height: 1.2rem
  70. }
  71. .custom-control-label {
  72. cursor: pointer;
  73. }
  74. .popover {
  75. background-color: #000
  76. }
  77. .popover-body{
  78. color:#fff;
  79. }
  80. .bs-popover-auto[x-placement^="bottom"] .arrow::after, .bs-popover-bottom .arrow::after{
  81. border-bottom-color:#000;
  82. }
  83. .custom-control-warning-input:checked ~ .custom-control-warning-label::before{
  84. border-color:#da9500 ;
  85. background-color:#da9500
  86. }
  87. .custom-control-warning-label{
  88. color:#da9500;
  89. }
  90. /*
  91. .btn.disabled, .btn:disabled {
  92. opacity:.4
  93. }*/
  94. .btn-primary.disabled, .btn-primary:disabled {
  95. color:#fff;
  96. border-color:#666;
  97. background: #666
  98. }
  99. .btn-outline-primary.disabled, .btn-outline-primary:disabled {
  100. color:#666;
  101. border-color:#666;
  102. background: #ddd
  103. }
  104. .btn-outline-primary.disabled .badge, .btn-outline-primary:disabled .badge{
  105. background: #999
  106. }
  107. .group-tab .btn-light{
  108. color:#007bff;
  109. border-color:#d3d9df;
  110. cursor: pointer;
  111. }
  112. .group-tab .btn-light.active{
  113. cursor: default;
  114. }
  115. .group-tab .btn-light.active a{
  116. text-decoration: none;
  117. color:#212529;
  118. cursor: default;
  119. }
  120. .group-tab .btn-light a:hover{
  121. text-decoration: none;
  122. }
  123. .text-info-50{
  124. color: #bee5eb;
  125. }
  126. .text-danger-50{
  127. color: #ed969e;
  128. }
  129. .text-success-50{
  130. color: #c3e6cb;
  131. }
  132. .text-primary-50{
  133. color: #cce5ff;
  134. }
  135. .text-warning-50{
  136. color: #ffddc5;
  137. }
  138. .text-secondary-50{
  139. color: #dcdcdc;
  140. }
  141. .bg-info-50{
  142. background-color: #d0f6fd;
  143. }
  144. .bg-danger-50{
  145. background-color: #f8d7da;
  146. }
  147. .bg-success-50{
  148. background-color: #d4edda;
  149. }
  150. .bg-primary-50{
  151. background-color: #cce5ff;
  152. }
  153. .bg-warning-50{
  154. background-color: #ffddc5;
  155. }
  156. .bg-secondary-50{
  157. background-color: #dcdcdc;
  158. }
  159. .border-info-50{
  160. border:1px solid #9be6f4;
  161. }
  162. .border-danger-50{
  163. border:1px solid #f5c6cb;
  164. }
  165. .border-success-50{
  166. border:1px solid #c3e6cb;
  167. }
  168. .border-primary-50{
  169. border:1px solid #b8daff;
  170. }
  171. .border-warning-50{
  172. border:1px solid #fbc7a3;
  173. }
  174. .border-secondary-50{
  175. border:1px solid #ccc;
  176. }
  177. .input-group-cancel{
  178. position: absolute;
  179. margin-left: -15px;
  180. margin-top: 2px;
  181. font-size: 14px
  182. }
  183. .nav-lists {
  184. border-bottom:1px solid #ddd;
  185. }
  186. .nav-lists .nav-item{
  187. margin-bottom: -1px
  188. }
  189. .nav-lists .nav-link{
  190. color:#666;
  191. padding:.4rem 1.5rem
  192. }
  193. .nav-lists .nav-link:focus, .nav-lists .nav-link:hover{
  194. background:#f7f7f7;
  195. color:#333;
  196. }
  197. .nav-lists .nav-item.show .nav-link, .nav-lists .nav-link.active{
  198. border-bottom:2px solid #007bff;
  199. background:#fbfcfd;
  200. color:#333;
  201. }
  202. /*在谷歌下移除input[number]的上下箭头*/
  203. input.nospin[type='number']::-webkit-outer-spin-button,
  204. input.nospin[type='number']::-webkit-inner-spin-button{
  205. -webkit-appearance: none !important;
  206. margin: 0;
  207. }
  208. /*在firefox下移除input[number]的上下箭头*/
  209. input.nospin[type="number"]{-moz-appearance:textfield;}
  210. /*自定义css*/
  211. .in-1{padding-left:5px!important}
  212. .in-2{padding-left:21px!important}
  213. .in-3{padding-left:42px!important}
  214. .in-4{padding-left:63px!important}
  215. .in-5{padding-left:84px!important}
  216. .in-6{padding-left:105px!important}
  217. /*滚动条*/
  218. /* 滚动条 */
  219. /*水平滚动条的样式*/
  220. /*::-webkit-scrollbar-thumb:horizontal {
  221. width: 5px;
  222. background-color: #e9ecef;
  223. -webkit-border-radius: 0;
  224. }*/
  225. /*滚动条的背景颜色,滚动条的圆角宽度*/
  226. /*::-webkit-scrollbar-track-piece {
  227. background-color: #efefef;
  228. -webkit-border-radius: 0;
  229. }*/
  230. /*滚动条的宽度,滚动条的高度*/
  231. /*::-webkit-scrollbar {
  232. width: 14px;
  233. height: 14px;
  234. }*/
  235. /*垂直滚动条的样式*/
  236. /*::-webkit-scrollbar-thumb:vertical {
  237. height: 50px;
  238. background-color: #e9ecef;
  239. -webkit-border-radius: 0;
  240. outline: 1px solid #fff;
  241. outline-offset: -1px;
  242. border: 1px solid #ced4da;
  243. }*/
  244. /*滚动条的hover样式*/
  245. /*::-webkit-scrollbar-thumb:hover {
  246. height: 50px;
  247. background-color: #ced4da;
  248. -webkit-border-radius: 0;
  249. }*/
  250. .sjs-height-1,.sjs-height-2,.sjs-sh,.sjs-sh-1,.sjs-sh-2,.sjs-sh-3,.sjs-sh-4,.sjs-sh-5{
  251. overflow: hidden;
  252. }
  253. .sjs-height-4,.sjs-height-5,.sjs-height-6,.sjs-option-height{
  254. overflow: auto;
  255. }
  256. .sjs-bar-1,.sjs-bar-2,.sjs-bar-3,.sjs-bar-4,.sjs-bar-5{
  257. height:30px;
  258. padding-top:3px;
  259. }
  260. .sjs-bar{
  261. height:30px;
  262. padding-top:3px;
  263. }
  264. .sjs-bar .nav {
  265. margin-top:-3px;
  266. }
  267. .sjs-bottom{
  268. height:250px;
  269. }
  270. .sjs-bottom-2{
  271. height:360px;
  272. overflow-y: auto;
  273. }
  274. .form-signin {
  275. max-width:400px;
  276. margin-left:auto;
  277. background: #fff;
  278. padding:30px;
  279. border:1px solid #ddd;
  280. border-radius: .25rem
  281. }
  282. .bg-404{
  283. background:#dcdcdc url("404.png") bottom center no-repeat;
  284. }
  285. .has-danger {
  286. -webkit-animation: shake 1s .2s ease both;
  287. -moz-animation: shake 1s .2s ease both;
  288. animation: shake 1s .2s ease both;
  289. }
  290. @-webkit-keyframes shake {
  291. 0%, 100% {
  292. -webkit-transform: translateX(0);
  293. }
  294. 10%, 30%, 50%, 70%, 90% {
  295. -webkit-transform: translateX(-10px);
  296. }
  297. 20%, 40%, 60%, 80% {
  298. -webkit-transform: translateX(10px);
  299. }
  300. }
  301. @-moz-keyframes shake {
  302. 0%, 100% {
  303. -moz-transform: translateX(0);
  304. }
  305. 10%, 30%, 50%, 70%, 90% {
  306. -moz-transform: translateX(-10px);
  307. }
  308. 20%, 40%, 60%, 80% {
  309. -moz-transform: translateX(10px);
  310. }
  311. }
  312. @keyframes shake {
  313. 0%, 100% {
  314. transform: translateX(0);
  315. }
  316. 10%, 30%, 50%, 70%, 90% {
  317. transform: translateX(-10px);
  318. }
  319. 20%, 40%, 60%, 80% {
  320. transform: translateX(10px);
  321. }
  322. }
  323. /*2.主体框架*/
  324. .header {
  325. background:#fff;
  326. position: fixed;
  327. z-index: 10;
  328. width: 100%;
  329. height: 50px;
  330. top: 0;
  331. left: 0
  332. }
  333. .main{
  334. position: relative;
  335. z-index: 4;
  336. }
  337. .main-nav {
  338. position: fixed;
  339. z-index: 99;
  340. width:55px;
  341. left: 0;
  342. top: 0;
  343. height: 100%;
  344. background: #33425b;
  345. }
  346. .main-panel{
  347. padding-left:55px;
  348. box-sizing: border-box;
  349. }
  350. .panel-sidebar{
  351. box-sizing: border-box;
  352. background: #fbfcfd;
  353. position: fixed;
  354. height: 100%;
  355. z-index: 4;
  356. left:55px;
  357. /*padding-top:50px;*/
  358. border-right: 1px solid #ddd;
  359. width: 200px;
  360. }
  361. .side-fold{
  362. position: absolute;
  363. bottom:10px;
  364. right:20px;
  365. }
  366. .min-side .side-fold{
  367. position: absolute;
  368. bottom:15px;
  369. right:5px;
  370. height: 20px
  371. }
  372. .min-side{
  373. border-right: 1px solid #ddd;
  374. margin-right:10px;
  375. padding-right:15px;
  376. position: relative;
  377. }
  378. .min-side .side-switch i{
  379. font-size: 20px
  380. }
  381. .min-side .side-menu{
  382. position: absolute;
  383. left:-15px;
  384. top:50px;
  385. background:#fff;
  386. width:150px;
  387. border-right:1px solid #ddd;
  388. border-bottom:1px solid #ddd;
  389. box-shadow: 0 1px 3px rgba(0,0,0,.1);
  390. }
  391. .panel-content{
  392. padding:65px 0 0;
  393. position: relative;
  394. z-index: 3;
  395. box-sizing: border-box;
  396. overflow-y: auto;
  397. height: 100vh;
  398. }
  399. .panel-content .content-wrap{
  400. margin:0 15px 15px;
  401. position: relative;
  402. }
  403. .panel-sidebar+.panel-content{
  404. padding: 65px 0 0 200px;
  405. }
  406. .panel-title, .panel-title>.title-bar {
  407. height:50px;
  408. line-height: 50px
  409. }
  410. .panel-title .dropdown-item,.panel-title .dropdown-item-text,.panel-title .form-group {
  411. line-height: normal;
  412. }
  413. .panel-title{
  414. position: fixed;
  415. top:0px;
  416. z-index: 98;
  417. width: 100%;
  418. box-sizing: border-box;
  419. background: #fff;
  420. box-shadow: 0 1px 3px rgba(0,0,0,.05);
  421. border-top: 1px solid #ddd;
  422. }
  423. .panel-sidebar .panel-title{
  424. width:200px;
  425. border-right: 1px solid #ddd;
  426. box-shadow: 0 1px 3px rgba(0,0,0,.1);
  427. }
  428. .panel-content .panel-title{
  429. left: 0;
  430. padding-left: 255px;
  431. padding-right: 20px;
  432. }
  433. .panel-content .panel-title.fluid{
  434. padding-left:55px
  435. }
  436. .panel-title>.title-bar{
  437. padding-left: 20px
  438. }
  439. .panel-title>.title-bar>h2,.panel-title>.title-main>h2{
  440. font-size: 16px;
  441. margin:0;
  442. height: 50px;
  443. line-height: 50px;
  444. display:block
  445. }
  446. .panel-title>.title-bar>h2 .btn{
  447. margin-right:15px
  448. }
  449. .panel-title>.title-main .btn.pull-right {
  450. margin:10px 0 0 10px
  451. }
  452. .panel-title>.title-main .form-control {
  453. margin:10px 0 0 0
  454. }
  455. .panel-title>.title-main{
  456. padding-left: 15px
  457. }
  458. .panel-title .alert {
  459. line-height: normal;
  460. z-index: 999
  461. }
  462. .sidebar-title{
  463. padding: 10px;
  464. border-bottom: 1px solid #ddd;
  465. margin-bottom: 10px;
  466. }
  467. .side-menu{
  468. position: fixed;
  469. right:15px;
  470. top:65px
  471. }
  472. .side-menu .nav-link{
  473. line-height: 16px;
  474. font-size: 14px;
  475. color:#007bff;
  476. }
  477. .side-menu .nav-link:hover{
  478. background:#dcdee3;
  479. color:#333;
  480. }
  481. .sub-content{
  482. margin:0;
  483. }
  484. .pr-46{
  485. padding-right:36px
  486. }
  487. .bcontent-wrap{
  488. height: 350px
  489. }
  490. @media only screen and (max-height: 768px) {
  491. .bcontent-wrap{
  492. height: 250px
  493. }
  494. }
  495. .modal-xl {
  496. max-width: 1200px
  497. }
  498. .border-right-1 {
  499. border-right:1px solid #dee2e6;
  500. }
  501. .border-left-1 {
  502. border-left:1px solid #dee2e6;
  503. }
  504. .border-top-1 {
  505. border-top:1px solid #dee2e6;
  506. }
  507. .border-bottom-1 {
  508. border-bottom:1px solid #dee2e6;
  509. }
  510. /*滚动*/
  511. .scrollbar-auto {
  512. overflow-y: auto;
  513. position: absolute;
  514. bottom: 0;
  515. left: 0;
  516. top: 0;
  517. right: 0;
  518. }
  519. .panel-sidebar .scrollbar-auto{
  520. padding-top: 20px;
  521. box-sizing: border-box;
  522. }
  523. .panel-sidebar .scrollbar-auto {
  524. height: calc(100vh - 100px);
  525. width: 100%;
  526. overflow-y: auto;
  527. position: static;
  528. }
  529. /*结构宽度高度调整条*/
  530. .resize-y{
  531. height:5px;
  532. width:100%;
  533. float: left;
  534. margin-top:-5px;
  535. cursor: s-resize;
  536. z-index: 999
  537. }
  538. .resize-x{
  539. width:5px;
  540. height:100%;
  541. float: left;
  542. margin-left:-5px;
  543. cursor: w-resize;
  544. z-index: 999
  545. }
  546. /*头部*/
  547. .header .logo {
  548. float: left;
  549. box-shadow: 1px 0 6px rgba(0,0,0,.06);
  550. margin-right: 20px;
  551. margin:0
  552. }
  553. .header .logo>a{
  554. width:120px;
  555. height:50px;
  556. line-height: 50px;
  557. display: inline-block;
  558. color:#fff;
  559. font-size:24px;
  560. padding:0 10px;
  561. transition: all ease .4s;
  562. background:#207fd1 url(logo.png) no-repeat;
  563. text-indent: -9999px;
  564. vertical-align: top
  565. }
  566. .header .logo>a:hover{
  567. background-color:#5596cf;
  568. text-decoration: none;
  569. }
  570. .header-user > div {
  571. float:left
  572. }
  573. .avatar .pic {
  574. height: 35px;
  575. width: 35px;
  576. border-radius: 100%;
  577. display: inline-block;
  578. float:left;
  579. margin:7px 7px 0 0
  580. }
  581. .avatar .pic img{
  582. display: block;
  583. width: 100%;
  584. height: 100%;
  585. border-radius: 100%;
  586. }
  587. .avatar > a,.msg >a{
  588. display: block;
  589. height:50px;
  590. line-height: 50px;
  591. color:#666;
  592. padding:0 15px;
  593. cursor: pointer;
  594. }
  595. .avatar > a:hover,.msg > a:hover{
  596. text-decoration: none;
  597. box-shadow: inset 0 3px 5px rgba(0,0,0,.125)
  598. }
  599. .avatar.s-1x{
  600. height: 26px;
  601. line-height: 26px;
  602. width: 26px;
  603. font-size: 11px;
  604. border: none
  605. }
  606. .header-user .msg{
  607. border-left:1px solid #eee
  608. }
  609. .header-user .msg .glyphicon{
  610. font-size:20px;
  611. vertical-align: middle;
  612. }
  613. .header-user .msg .badge{
  614. margin:0 0 0 5px
  615. }
  616. .header .poj-name {
  617. float:left;
  618. padding:0 0 0 15px;
  619. font-size:18px
  620. }
  621. .header .poj-name a{
  622. color:#666
  623. }
  624. .header .poj-name > span{
  625. height:50px;
  626. line-height:50px;
  627. }
  628. /*登陆相关*/
  629. .login-body{
  630. background:linear-gradient(#192948,#33425b);
  631. height:100%
  632. }
  633. .login-infoinput {
  634. margin-top:15%
  635. }
  636. .login-body .container{
  637. position:absolute;
  638. top:10%;
  639. margin:0 auto;
  640. left:0;
  641. right:0;
  642. }
  643. .login-bg.img-1{
  644. background:url("undraw_all_the_data_h4ki.svg") no-repeat;
  645. }
  646. .login-bg.img-2{
  647. background:url("undraw_order_a_car_3tww.svg") no-repeat;
  648. }
  649. .login-bg.img-3{
  650. background:url("undraw_work_chat_erdt.svg") no-repeat;
  651. }
  652. .login-body .login-bg{
  653. width: 100%;
  654. height: 100%;
  655. background-position:25% 95%;
  656. background-size: 40% auto;
  657. display: inline-block;
  658. opacity: .8
  659. }
  660. /*侧栏主菜单*/
  661. .nav-top,.nav-bottom{
  662. width: 55px
  663. }
  664. .bg-nav a{
  665. color:#7786ab;
  666. width:55px;
  667. text-align: center;
  668. display: inline-block;
  669. padding:15px 0;
  670. font-size: 12px
  671. }
  672. .bg-nav a i{
  673. font-size:22px;
  674. }
  675. .bg-nav a span{
  676. display: none;
  677. }
  678. .bg-nav > li{
  679. width:120px
  680. }
  681. .bg-nav > li.active{
  682. background: #192948
  683. }
  684. .bg-nav > li.active a{
  685. border-radius: 0;
  686. background: #192948
  687. }
  688. .bg-nav > li > a:hover,.bg-nav > li.active > a:hover{
  689. background: #192948;
  690. color:#f2f2f2;
  691. text-decoration: none;
  692. }
  693. .bg-nav > li > a.maintain-icon:hover{
  694. background:none;
  695. color:none;
  696. text-decoration: none;
  697. }
  698. .bg-nav > li.active a span{
  699. display: block;
  700. }
  701. .bg-nav > li + li {
  702. margin-top:0;
  703. }
  704. .bg-nav .sub-menu {
  705. list-style:none;
  706. padding:0 0 0 20px;
  707. width:120px;
  708. display: none
  709. }
  710. .bg-nav .sub-menu a {
  711. width:100px;
  712. height:30px;
  713. line-height:30px
  714. }
  715. .bg-nav .sub-menu:last-child{
  716. margin:0 0 20px 0
  717. }
  718. .bg-nav .menu-arrow{
  719. margin:22px 8px 0 0
  720. }
  721. .nav-box h3{
  722. font-size: 14px;
  723. font-weight: 700;
  724. padding-bottom: 4px;
  725. border-bottom: 1px solid #e2eaec;
  726. padding-right: 15px;
  727. margin-bottom: 10px;
  728. margin-left: 17px
  729. }
  730. .nav-box > .sub-list > li > a{
  731. padding-left: 40px
  732. }
  733. .nav-box .tips-dot {
  734. right:20px;
  735. top:8px
  736. }
  737. .nav-box .nav-list li{
  738. position: relative;
  739. }
  740. .contarl-box{
  741. padding:1rem 2rem 1rem 2rem;
  742. border-top:1px solid #ddd;
  743. }
  744. .nav-list li a{
  745. color: #333;
  746. display: block;
  747. height: 35px;
  748. line-height: 35px;
  749. box-sizing: border-box;
  750. padding-left: 17px;
  751. padding-right: 45px;
  752. text-overflow: ellipsis;
  753. position: relative;
  754. }
  755. .nav-list li a:hover{
  756. text-decoration: none;
  757. background:#e4e7ea;
  758. cursor: pointer;
  759. border-right:1px solid #007bff;;
  760. }
  761. .nav-list li a .badge{
  762. position: absolute;
  763. right:17px;
  764. top:9px
  765. }
  766. .nav-list li.active a{
  767. background:#e4e7ea;
  768. border-right:2px solid #007bff;;
  769. }
  770. .side-menu .nav-link{
  771. padding:.6rem .6rem;
  772. }
  773. /*内容区*/
  774. .c-header {
  775. padding:0 0 5px
  776. }
  777. .c-body{
  778. padding:1px;
  779. background:#fff;
  780. }
  781. .right-nav{
  782. width:36px;
  783. }
  784. .right-nav .nav-link {
  785. color:#666;
  786. }
  787. .right-nav .nav-link:focus, .right-nav .nav-link:hover {
  788. background: #f7f7f7;
  789. }
  790. .right-nav .nav-item.show .nav-link, .right-nav .nav-link.active {
  791. border-left: 2px solid #007bff;
  792. background: #fbfcfd;
  793. margin-left:-1px;
  794. color:#333;
  795. }
  796. .form-group .necessary{
  797. font-size:18px;
  798. color:#f90000
  799. }
  800. .bg-gray {
  801. background-color:#bbb!important;
  802. }
  803. .datepickers-container {
  804. z-index: 9999
  805. }
  806. .modal-height-500{
  807. height:450px;
  808. overflow: hidden
  809. }
  810. .modal-height-300{
  811. height:300px;
  812. overflow:auto
  813. }
  814. .scroll-y {
  815. overflow-y: auto;
  816. }
  817. .scroll-x {
  818. overflow-x: auto;
  819. }
  820. .modal-lgx {
  821. max-width:1000px
  822. }
  823. .title-main .nav{
  824. line-height: 16px;
  825. margin-top:8px
  826. }
  827. .msg-content {
  828. font-size: 14px
  829. }
  830. .bd-toc {
  831. position: sticky;
  832. top:3rem;
  833. height: calc(100vh - 10rem);
  834. overflow-y: auto;
  835. }
  836. /*草图编辑器*/
  837. .img-view{
  838. height:400px;
  839. border:.2rem solid #ccc;
  840. position: relative;
  841. width:100%;
  842. overflow: hidden;
  843. }
  844. .img-view::after{
  845. content:"草图编辑区";
  846. color:#ddd;
  847. position: absolute;
  848. left:50%;
  849. top:50%;
  850. margin-left:-80px;
  851. margin-top:-24px;
  852. font-size:36px
  853. }
  854. .img-view .img-item{
  855. position: absolute;
  856. }
  857. .img-view .img-item .img-bar{
  858. position:absolute;
  859. right:0;
  860. top:0;
  861. display:none
  862. }
  863. .img-item:hover .img-bar{
  864. display: block;
  865. }
  866. .batch-l-t{
  867. height: 180px;
  868. overflow: hidden
  869. }
  870. .batch-l-b{
  871. height: 320px;
  872. overflow: hidden
  873. }
  874. .batch-r {
  875. height:522px;
  876. overflow: hidden
  877. }
  878. /*打印工具栏*/
  879. .print-toolsbar{
  880. padding-bottom:5px
  881. }
  882. .print-toolsbar .panel {
  883. display:inline-block;
  884. vertical-align:top;
  885. background:#f7f7f9
  886. }
  887. .print-toolsbar .panel .panel-foot{
  888. text-align: center;
  889. font-size: 12px
  890. }
  891. .print-list {
  892. border-right:1px solid #ccc
  893. }
  894. .print-list .form-list {
  895. overflow: auto
  896. }
  897. .print-list .list-tools{
  898. height:50px;
  899. padding:10px 0;
  900. border-bottom:1px solid #f2f2f2
  901. }
  902. .pageContainer {
  903. background: #ededed;
  904. text-align: center
  905. }
  906. .pageContainer .page{
  907. border:9px solid transparent;
  908. display: inline-block;
  909. }
  910. .pageContainer .page img{
  911. width:inherit;
  912. height: inherit;
  913. }
  914. .pageContainer canvas{
  915. background: #fff
  916. }
  917. .m-close-side{
  918. position: absolute;
  919. right:-1px;
  920. top:250px;
  921. background: #f2f2f2;
  922. padding:30px 3px;
  923. }
  924. .m-close-side:hover{
  925. background:#eae9e9;
  926. }
  927. .baobiao-close-side{
  928. position: absolute;
  929. left:15px;
  930. top:250px;
  931. background: #e1e1e1
  932. }
  933. .baobiao-close-side a{
  934. color:#007bff;
  935. height:80px;
  936. line-height: 80px;
  937. display: inline-block
  938. }
  939. .baobiao-close-side:hover{
  940. background:#007bff;
  941. }
  942. .baobiao-close-side:hover a{
  943. color:#fff;
  944. }
  945. .edit-tag-btn{
  946. display: none
  947. }
  948. .tag-item:hover .edit-tag-btn{
  949. display: block
  950. }
  951. /*电子签名*/
  952. .add-sign-list-item{
  953. padding:.5rem .5rem .5rem 1rem;
  954. }
  955. .add-sign-list-item:hover{
  956. box-shadow:0 0 3px rgba(0,0,0,.18)
  957. }
  958. .add-sign-list-item .btn-link {
  959. display: none
  960. }
  961. .add-sign-list-item:hover .btn-link {
  962. display: block
  963. }
  964. /*标段类表折叠收起*/
  965. .fold-switch {
  966. cursor: pointer;
  967. }
  968. .fold-switch:hover{
  969. color:#0056b3;
  970. }
  971. /*界面紧凑相关代码*/
  972. body{
  973. font-size:12px;
  974. }
  975. .btn-group-sm > .btn, .btn-sm{
  976. font-size: 12px;
  977. padding:1px 0.6rem;
  978. }
  979. .panel-title, .panel-title > .title-bar{
  980. height:34px;
  981. line-height: 30px;
  982. }
  983. .panel-title > .title-main .btn.pull-right {
  984. margin: 5px 0 0 0
  985. }
  986. .panel-content{
  987. padding-top:35px;
  988. overflow: hidden
  989. }
  990. .panel-content .content-wrap{
  991. margin:0;
  992. }
  993. .table td, .table th {
  994. padding:.3rem;
  995. }
  996. .form-control-sm {
  997. font-size:12px;
  998. padding-top:.1rem;
  999. }
  1000. label{
  1001. margin-bottom:.3rem;
  1002. color:#757575;
  1003. }
  1004. .form-control-plaintext.form-control-lg, .form-control-plaintext.form-control-sm {
  1005. padding-left:.5rem;
  1006. background: #f2f2f280
  1007. }
  1008. .invalid-feedback{
  1009. font-size:100%;
  1010. }
  1011. .modal-header{
  1012. padding:.5rem 1rem
  1013. }
  1014. .modal-title{
  1015. font-size:16px;
  1016. }
  1017. .modal-footer {
  1018. padding:.5rem 1rem
  1019. }
  1020. .modal-body h6,.modal-body h5{
  1021. font-size:12px;
  1022. }
  1023. .panel-title > .title-bar{
  1024. padding-left:10px;
  1025. }
  1026. .panel-sidebar .panel-title{
  1027. width:120px;
  1028. }
  1029. .panel-title > .title-bar > h2, .panel-title > .title-main > h2{
  1030. height:34px;
  1031. line-height: 34px;
  1032. font-size: 12px
  1033. }
  1034. .panel-title > .title-main .form-control {
  1035. margin: 4px 0 0 0;
  1036. }
  1037. .panel-sidebar {
  1038. width:120px;
  1039. }
  1040. .panel-sidebar .scrollbar-auto{
  1041. padding-top:0;
  1042. }
  1043. .nav-list li a{
  1044. padding-right:0px;
  1045. height:30px;
  1046. line-height: 30px
  1047. }
  1048. .nav-box h3{
  1049. margin-left:12px;
  1050. }
  1051. .nav-box > .sub-list > li > a{
  1052. padding-left:32px;
  1053. }
  1054. .panel-sidebar + .panel-content{
  1055. padding:35px 0 0 120px;
  1056. overflow: hidden;
  1057. }
  1058. .contarl-box{
  1059. padding:1rem 1rem;
  1060. }
  1061. .min-side .side-menu {
  1062. top:34px;
  1063. }
  1064. .panel-content .panel-title{
  1065. padding-left:175px;
  1066. background: linear-gradient( #ccc,2%, #ffffff);
  1067. }
  1068. .nav-link{
  1069. padding:.3rem .5rem;
  1070. }
  1071. .side-menu .nav-link{
  1072. font-size:12px;
  1073. }
  1074. legend {
  1075. font-size:16px;
  1076. }
  1077. .input-group-sm > .custom-select, .input-group-sm > .form-control:not(textarea) {
  1078. height: calc(1.4125rem + 2px);
  1079. }
  1080. .input-group-sm>.form-control, .input-group-sm>.input-group-append>.btn, .input-group-sm>.input-group-append>.input-group-text, .input-group-sm>.input-group-prepend>.btn, .input-group-sm>.input-group-prepend>.input-group-text{
  1081. height: calc(1.4125rem + 2px);
  1082. }
  1083. .input-group-sm > .custom-select, .input-group-sm > .form-control, .input-group-sm > .input-group-append > .btn, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-prepend > .input-group-text {
  1084. font-size:12px;
  1085. padding:.1rem .5rem;
  1086. }
  1087. .side-menu{
  1088. right:0;
  1089. top:35px;
  1090. height: 100%;
  1091. background:#fff;
  1092. border-left: 1px solid #ddd;
  1093. }
  1094. .form-control-sm{
  1095. height:calc(1.4125rem + 2px);
  1096. }
  1097. .form-group {
  1098. margin-bottom:.5rem;
  1099. }
  1100. .badge{
  1101. font-size:100%;
  1102. }
  1103. .sjs-height-0{
  1104. overflow: auto;
  1105. }
  1106. .nav-box h3{
  1107. margin-bottom:5px;
  1108. }
  1109. .min-side .side-menu{
  1110. padding-bottom:10px;
  1111. }
  1112. .side-fold {
  1113. right:50px;
  1114. bottom:5px;
  1115. }
  1116. .side-fold a{
  1117. font-size:24px;
  1118. }
  1119. .min-side {
  1120. padding-bottom:5px;
  1121. }
  1122. .min-side .side-fold{
  1123. bottom:10px;
  1124. }
  1125. .min-side .side-fold a{
  1126. font-size:18px;
  1127. }
  1128. .form-text{
  1129. font-size:12px;
  1130. }
  1131. .btn-sm .badge{
  1132. font-size:10px;
  1133. padding:.2em .4em;
  1134. top:0;
  1135. }
  1136. .search-group {
  1137. position: relative;
  1138. }
  1139. .search-group .remove-btn {
  1140. position:absolute;
  1141. right:10px;
  1142. top:3px;
  1143. }
  1144. /*菜单栏系统维护图标*/
  1145. a.maintain-icon{
  1146. position:relative;
  1147. }
  1148. a.maintain-icon span{
  1149. position: absolute;
  1150. left:55px;
  1151. height:53px;
  1152. line-height: 53px;
  1153. width:390px;
  1154. top:0;
  1155. display:none;
  1156. font-size:14px;
  1157. }
  1158. a.maintain-icon:hover span{
  1159. display: inline-block;
  1160. }
  1161. a.maintain-icon .fa{
  1162. -webkit-animation: shake_a 2s .2s ease both;
  1163. -moz-animation: shake_a 2s .2s ease both;
  1164. animation: shake_a 2s .2s ease both;
  1165. animation-iteration-count:infinite
  1166. }
  1167. @-webkit-keyframes shake_a {
  1168. 0%, 100% {
  1169. -webkit-transform: rotate(0);
  1170. }
  1171. 10%, 30%, 50%, 70%, 90% {
  1172. -webkit-transform: rotate(5deg);
  1173. }
  1174. 20%, 40%, 60%, 80% {
  1175. -webkit-transform: rotate(-5deg);
  1176. }
  1177. }
  1178. @-moz-keyframes shake_a {
  1179. 0%, 100% {
  1180. -moz-transform: rotate(0);
  1181. }
  1182. 10%, 30%, 50%, 70%, 90% {
  1183. -moz-transform: rotate(5deg);
  1184. }
  1185. 20%, 40%, 60%, 80% {
  1186. -moz-transform: rotate(-5deg);
  1187. }
  1188. }
  1189. @keyframes shake_a {
  1190. 0%, 100% {
  1191. transform: rotate(0);
  1192. }
  1193. 10%, 30%, 50%, 70%, 90% {
  1194. transform: rotate(5deg);
  1195. }
  1196. 20%, 40%, 60%, 80% {
  1197. transform: rotate(-5deg);
  1198. }
  1199. }
  1200. a.maintain-icon:hover .fa{
  1201. animation-iteration-count:0
  1202. }
  1203. /*审批列表*/
  1204. .timeline-list .timeline-list-item{
  1205. position: relative;
  1206. }
  1207. .timeline-list-item .timeline-item-date{
  1208. width:50px;
  1209. position:absolute;
  1210. left:0px;
  1211. text-align: center;
  1212. color:#ccc;
  1213. }
  1214. .timeline-list-item .timeline-item-date span{
  1215. display: block;
  1216. color: #333;
  1217. text-align: center;
  1218. }
  1219. .timeline-list-item .timeline-item-tail{
  1220. position: absolute;
  1221. top: 10px;
  1222. left: 55px;
  1223. height: calc(100% - 10px);
  1224. border-left: 1px solid #ddd ;
  1225. }
  1226. .timeline-list-item .timeline-item-icon{
  1227. width:20px;
  1228. height:20px;
  1229. position: absolute;
  1230. border-radius: 100px;
  1231. text-align: center;
  1232. line-height: 20px;
  1233. left:45px;
  1234. }
  1235. .timeline-list-item .timeline-item-content{
  1236. position: relative;
  1237. margin: 0 0 0 70px;
  1238. word-break: break-word;
  1239. }
  1240. .book-list{
  1241. padding: 0;
  1242. margin: 0;
  1243. height: 285px;
  1244. overflow-y: auto;
  1245. }
  1246. .book-list dt{
  1247. padding:5px 0 5px 5px;
  1248. background-color: #f2f2f2;
  1249. }
  1250. .book-list dd{
  1251. padding-left:15px;
  1252. cursor: pointer;
  1253. }
  1254. .book-list dd:hover{
  1255. background-color: #f2f2f2
  1256. }
  1257. .dd-content {
  1258. display: none;
  1259. }
  1260. .fold-card {
  1261. display: none;
  1262. }
  1263. .att-file-btn {
  1264. display: none;
  1265. }
  1266. .list-table tr:hover .att-file-btn{
  1267. display: inline-block;
  1268. }
  1269. /*头像颜色*/
  1270. .avatar{
  1271. height: 40px;
  1272. line-height:38px;
  1273. width:40px;
  1274. border-radius: 20px;
  1275. color:#fff;
  1276. font-size: 11px;
  1277. text-align: center;
  1278. display: inline-block;
  1279. border:1px solid #fff;
  1280. }
  1281. .avatar:hover{
  1282. text-decoration:none;
  1283. color:#fff;
  1284. }
  1285. .avatar.bg-1{
  1286. background:rgb(16,109,156)
  1287. }
  1288. .avatar.bg-2{
  1289. background:rgb(90,146,173)
  1290. }
  1291. .avatar.bg-3{
  1292. background:rgb(132, 118, 104)
  1293. }
  1294. .avatar.bg-4{
  1295. background:rgb(196, 160, 93)
  1296. }
  1297. .avatar.bg-5{
  1298. background:rgb(148, 129, 170)
  1299. }
  1300. .avatar.bg-6{
  1301. background:rgb(61,89,171)
  1302. }
  1303. .avatar.bg-7{
  1304. background:rgb(200, 132, 146)
  1305. }
  1306. .avatar.bg-8{
  1307. background:rgb(102, 138, 92)
  1308. }
  1309. .avatar.bg-9{
  1310. background:rgb(215, 75, 75)
  1311. }
  1312. .avatar.bg-0{
  1313. background:rgb(134, 131, 131)
  1314. }
  1315. .avatar.bg-10{
  1316. border:1px solid #007bff;
  1317. color:#007bff;
  1318. line-height: 24px
  1319. }
  1320. .avatar.bg-10:hover{
  1321. background-color: #007bff;
  1322. color:#fff;
  1323. }