main.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715
  1. /*building SAAS 0.1*/
  2. /*bootstrap 初始化*/
  3. body {
  4. font-size: 0.9rem;
  5. overflow: hidden;
  6. font-family: "Helvetica Neue","Hiragino Sans GB",stheiti,"Microsoft Yahei","微软雅黑",tahoma,sans-serif
  7. }
  8. a{
  9. outline: none
  10. }
  11. .dropdown-menu {
  12. font-size: 0.9rem
  13. }
  14. .btn.disabled, .btn:disabled {
  15. color:#999
  16. }
  17. .btn-link:focus, .btn-link:hover{
  18. text-decoration: none
  19. }
  20. .dropdown-menu {
  21. padding:.2rem 0;
  22. }
  23. .dropdown-item:focus, .dropdown-item:hover{
  24. background-color: #f7f7f9
  25. }
  26. .text-indent {
  27. text-indent:26px;
  28. }
  29. .modal-header{
  30. background:#f2f2f2;
  31. border-bottom:1px solid #ccc;
  32. padding:.8rem 1rem;
  33. }
  34. .modal-title{
  35. font-size:1rem;
  36. }
  37. .modal-footer{
  38. padding:.8rem 1rem;
  39. }
  40. .form-check .form-check-label,.form-radio .form-check-label{
  41. cursor: pointer;
  42. }
  43. .custom-file-sm,.custom-file-sm .custom-file-label{
  44. height: calc(1.5em + .5rem + 2px);
  45. padding-top: .25rem;
  46. padding-bottom: .25rem;
  47. padding-left: .5rem;
  48. }
  49. .custom-file-sm .custom-file-label:after{
  50. height: calc(1.4em + .5rem + 2px);
  51. padding-top: .25rem;
  52. padding-bottom: .25rem;
  53. font-size: .875rem;
  54. }
  55. .custom-file-sm input{
  56. height: calc(1.5em + .5rem + 2px);
  57. font-size: .875rem;
  58. }
  59. /*自定义css*/
  60. .login-body,.login-html{
  61. height:100%;
  62. }
  63. .login-bg{
  64. width: 100%;
  65. height: 100%;
  66. background: #f2f6f5 url("login-bg.jpg") bottom center no-repeat;
  67. background-size: 100% auto;
  68. display: inline-block;
  69. position: absolute;
  70. }
  71. .login-panel {
  72. width: 500px;
  73. margin: 0 auto;
  74. position: absolute;
  75. left: 0;
  76. right: 0;
  77. top: 20%;
  78. padding:30px;
  79. background:#fff;
  80. box-shadow:#333 1px 1px 5px
  81. }
  82. .ver-panel {
  83. width:100%;
  84. top:10%;
  85. }
  86. .header {
  87. border-bottom: 1px solid #ccc
  88. }
  89. .header .header-logo {
  90. background: #ff6501;
  91. float: left;
  92. margin-right: 1rem;
  93. font-size: 1rem;
  94. height:38px;
  95. background:url(logo.png) no-repeat 0 0;
  96. padding-left:50px;
  97. }
  98. .header-logo div.v-title{
  99. font-size:11px;
  100. color:#aeaeae;
  101. line-height: 12px;
  102. margin-top:3px;
  103. }
  104. .header-logo div.p-title{
  105. font-size:16px;
  106. color:#ff6501;
  107. }
  108. .header-logo div.b-title{
  109. font-size:24px;
  110. color:#ff6501;
  111. }
  112. .top-msg{
  113. position: fixed;
  114. top:10px;
  115. width:900px;
  116. z-index: 9999;
  117. left:50%;
  118. margin-left:-450px;
  119. }
  120. .main {
  121. position: relative;
  122. background: #f7f7f9;
  123. }
  124. .main-nav {
  125. position: absolute;
  126. text-align: center;
  127. z-index: 999;
  128. padding: 2px 0 0 2px
  129. }
  130. .main-nav .nav a {
  131. display: block;
  132. width: 28px;
  133. text-align: center;
  134. line-height: 18px;
  135. padding: 10px 0;
  136. border-right: 1px solid #ccc;
  137. }
  138. .main-nav .nav a:hover {
  139. background: #fff;
  140. color: #333;
  141. text-decoration: none;
  142. }
  143. .main-nav .nav a.active {
  144. border: 2px solid #ff6501;
  145. border-right: 1px solid #fff;
  146. background: #fff;
  147. color: #333
  148. }
  149. .main-nav .nav-tabs{
  150. border-bottom: none
  151. }
  152. .poj-manage .col-auto{
  153. background:#f7f7f9
  154. }
  155. .poj-cate {
  156. width:58px;
  157. margin-right:-1px;
  158. margin-top:2px;
  159. }
  160. .poj-cate .nav-pills .nav-link{
  161. border-radius: 0;
  162. font-size: 24px;
  163. color: #007bff
  164. }
  165. .poj-cate .nav-item{
  166. position: relative;
  167. }
  168. .poj-cate .nav-pills .badge{
  169. position: absolute;
  170. right:5px;
  171. top:5px;
  172. }
  173. .poj-cate .nav-pills .nav-link:hover{
  174. color:#0056b3
  175. }
  176. .poj-cate .nav-pills .nav-link.active, .nav-pills .show > .nav-link{
  177. background-color: #6c757d;
  178. color:#fff
  179. }
  180. .gl-side.gl-side-lg{
  181. width:200px;
  182. }
  183. .nav-side .nav-link{
  184. padding:.5rem;
  185. }
  186. .nav-side .nav-link.active{
  187. background:#ddd;
  188. color:#333;
  189. }
  190. .pm-side{
  191. position: fixed;
  192. left:0;
  193. height:100%;
  194. border-right:1px solid #ccc;
  195. background: #f7f7f9
  196. }
  197. .pm-content{
  198. padding-left:58px
  199. }
  200. .content {
  201. border-left: 1px solid #ccc;
  202. margin-left: 29px;
  203. background: #fff
  204. }
  205. .toolsbar,.toolsbar-f {
  206. background: #f7f7f9;
  207. border-bottom: 1px solid #ccc
  208. }
  209. .tools-btn {
  210. height: 30px;
  211. line-height: 30px
  212. }
  213. .toolsbar .tools-btn.btn:hover,.toolsbar-f .tools-btn.btn:hover {
  214. background: #f7f7f9;
  215. }
  216. .toolsbar .btn-light {
  217. color:#007bff;
  218. min-width: 34px;
  219. }
  220. .toolsbar .btn-light.disabled {
  221. color:#999;
  222. }
  223. .main-side {
  224. border-left: 1px solid #ccc;
  225. overflow-y: hidden;
  226. }
  227. .main-data-top,.main-data-full{
  228. overflow: hidden;
  229. width:100%
  230. }
  231. .main-data-top-side{
  232. overflow: hidden
  233. }
  234. .main-content.col-lg-8{
  235. width:66.666667%
  236. }
  237. .main-content.col-lg-12{
  238. width:100%
  239. }
  240. .main-side.col-lg-4{
  241. width: 33.333333%;
  242. }
  243. .main-side.col-lg-0{
  244. width:0%;
  245. }
  246. .sidebar-middle{
  247. height:80px;
  248. }
  249. .sidebar-bottom,.sidebar-bottom .col-lg-6,.sidebar-bottom .col-lg-12 {
  250. height:300px
  251. }
  252. .top-content, .fluid-content {
  253. overflow: auto;
  254. border-bottom: 1px solid #ccc;
  255. width: 100%
  256. }
  257. .bottom-content .nav {
  258. background: #f7f7f9;
  259. padding:1px 0 0 2px
  260. }
  261. .bottom-content .nav-tabs .nav-link, .side-tabs .nav-tabs .nav-link {
  262. border-radius: 0;
  263. padding: 0.2em 0.5em
  264. }
  265. .bottom-tools {
  266. height: 30px;
  267. line-height: 30px;
  268. background:#fff;
  269. bottom:20px;
  270. left:22px;
  271. z-index: 999
  272. }
  273. .side-tabs .nav-tabs .nav-item {
  274. z-index: 999
  275. }
  276. .side-tabs .nav-tabs {
  277. border-bottom: none;
  278. margin-bottom: -1px
  279. }
  280. .side-tabs .nav-tabs .nav-link {
  281. border-radius: 0;
  282. padding: 0em 0.5em;
  283. line-height: 30px;
  284. z-index: 999
  285. }
  286. .bottom-content .nav-tabs .nav-link.active {
  287. border:2px solid #ff6501;
  288. border-bottom: 1px solid #fff
  289. }
  290. .side-tabs .nav-tabs .nav-link.active {
  291. border-top: none;
  292. border-bottom:1px solid #fff
  293. }
  294. .side-tabs a.active, .sub-nav a.active {
  295. background: #ccc
  296. }
  297. .poj-manage {
  298. background: #fff
  299. }
  300. .slide-sidebar {
  301. border-left: 1px solid #E1E1E1;
  302. box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.1);
  303. background: none repeat scroll 0% 0% #ffffff;
  304. overflow: hidden;
  305. position: absolute;
  306. right: 0px;
  307. top: 0;
  308. z-index: 999;
  309. width: 0px;
  310. }
  311. .new-msg {
  312. -webkit-animation: tada 1s infinite .2s ease both;
  313. -moz-animation: tada 1s infinite .2s ease both;
  314. }
  315. @-webkit-keyframes tada {
  316. 0% {
  317. -webkit-transform: scale(1)
  318. }
  319. 10%, 20% {
  320. -webkit-transform: scale(0.9) rotate(-3deg)
  321. }
  322. 30%, 50%, 70%, 90% {
  323. -webkit-transform: scale(1.1) rotate(3deg)
  324. }
  325. 40%, 60%, 80% {
  326. -webkit-transform: scale(1.1) rotate(-3deg)
  327. }
  328. 100% {
  329. -webkit-transform: scale(1) rotate(0)
  330. }
  331. }
  332. @-moz-keyframes tada {
  333. 0% {
  334. -moz-transform: scale(1)
  335. }
  336. 10%, 20% {
  337. -moz-transform: scale(0.9) rotate(-3deg)
  338. }
  339. 30%, 50%, 70%, 90% {
  340. -moz-transform: scale(1.1) rotate(3deg)
  341. }
  342. 40%, 60%, 80% {
  343. -moz-transform: scale(1.1) rotate(-3deg)
  344. }
  345. 100% {
  346. -moz-transform: scale(1) rotate(0)
  347. }
  348. }
  349. .has-danger {
  350. -webkit-animation: shake 1s .2s ease both;
  351. -moz-animation: shake 1s .2s ease both;
  352. animation: shake 1s .2s ease both;
  353. }
  354. @-webkit-keyframes shake {
  355. 0%, 100% {
  356. -webkit-transform: translateX(0);
  357. }
  358. 10%, 30%, 50%, 70%, 90% {
  359. -webkit-transform: translateX(-10px);
  360. }
  361. 20%, 40%, 60%, 80% {
  362. -webkit-transform: translateX(10px);
  363. }
  364. }
  365. @-moz-keyframes shake {
  366. 0%, 100% {
  367. -moz-transform: translateX(0);
  368. }
  369. 10%, 30%, 50%, 70%, 90% {
  370. -moz-transform: translateX(-10px);
  371. }
  372. 20%, 40%, 60%, 80% {
  373. -moz-transform: translateX(10px);
  374. }
  375. }
  376. @keyframes shake {
  377. 0%, 100% {
  378. transform: translateX(0);
  379. }
  380. 10%, 30%, 50%, 70%, 90% {
  381. transform: translateX(-10px);
  382. }
  383. 20%, 40%, 60%, 80% {
  384. transform: translateX(10px);
  385. }
  386. }
  387. .gl-side{
  388. border-right:1px solid #ccc;
  389. width:120px
  390. }
  391. .bottom-content .tab-content .main-data-bottom{
  392. height: 300px;
  393. overflow: auto;
  394. }
  395. .bottom-content .main-data-bottom2{
  396. height: 331px;
  397. overflow: hidden;
  398. }
  399. .bottom-content .tab-content .ovf-hidden{
  400. overflow: hidden;
  401. }
  402. .tn-nav,.rn-nav{
  403. width:30px;
  404. height: 100%;
  405. border-left:1px solid #dee2e6 ;
  406. }
  407. .tn-nav,.cn-nav{
  408. border-right:1px solid #dee2e6 ;
  409. border-left:none;
  410. }
  411. .tn-nav > span{
  412. width:20px;
  413. }
  414. .tn-nav:hover{
  415. background:#f7f7f9;
  416. cursor: pointer;
  417. }
  418. .rn-nav {
  419. background: #f7f7f9
  420. }
  421. .rn-nav .nav{
  422. padding: 0
  423. }
  424. .rn-nav .nav-tabs {
  425. border:none;
  426. margin-top:2px;
  427. }
  428. .rn-nav .nav-tabs .nav-link{
  429. padding:0.4em 0.4em;
  430. line-height: 16px
  431. }
  432. .rn-nav .nav-tabs .nav-link.active {
  433. border:none;
  434. background-color: #fff;
  435. border-left:1px solid #fff;
  436. margin-left:-1px;
  437. border-top:1px solid #ccc;
  438. border-right:1px solid #ccc;
  439. border-bottom:1px solid #ccc;
  440. }
  441. .cn-nav .nav-tabs .nav-link.active {
  442. border:none;
  443. background-color: #fff;
  444. border-right:1px solid #fff;
  445. margin-right:-1px;
  446. border-top:1px solid #ccc;
  447. border-left:1px solid #ccc;
  448. border-bottom:1px solid #ccc;
  449. }
  450. .rn-nav .nav-tabs .nav-link span{
  451. display:none;
  452. }
  453. .rn-nav .nav-tabs .nav-link.active span{
  454. display: inline-block;
  455. }
  456. .poj-list, .side-content ,.form-view{
  457. overflow: auto;
  458. }
  459. .print-toolsbar{
  460. padding:5px
  461. }
  462. .print-toolsbar .panel {
  463. display:inline-block;
  464. vertical-align:top
  465. }
  466. .print-toolsbar .panel .panel-foot{
  467. text-align: center;
  468. font-size: 12px;
  469. padding-bottom:3px;
  470. background:#F2F2F2
  471. }
  472. .print-list {
  473. border-right:1px solid #ccc
  474. }
  475. .print-list .form-list {
  476. overflow: auto
  477. }
  478. .print-list .list-tools{
  479. height:50px;
  480. padding:10px 0;
  481. border-bottom:1px solid #f2f2f2
  482. }
  483. .pageContainer {
  484. text-align: center
  485. }
  486. .pageContainer .page{
  487. border:9px solid transparent;
  488. display: inline-block;
  489. }
  490. .pageContainer .page img{
  491. width:inherit;
  492. height: inherit;
  493. }
  494. .modal-auto-height {
  495. height: 400px;
  496. overflow-y: auto;
  497. }
  498. .modal-toolbar + .modal-auto-height{
  499. height:369px
  500. }
  501. .modal-fixed-height {
  502. height: 400px;
  503. overflow-y: hidden;
  504. }
  505. .sidebar-tools-bar {
  506. background:#fff
  507. }
  508. .side-search-box{
  509. background:#fff;
  510. border-bottom:1px solid #ddd
  511. }
  512. .navbar-crumb span{
  513. float:left;
  514. }
  515. .navbar-crumb span.text-truncate{
  516. max-width: 200px;
  517. }
  518. .dropdown-item{
  519. color:#007bff
  520. }
  521. .dropdown-item:hover{
  522. color:#0056b3
  523. }
  524. .dropdown-item.disabled, .dropdown-item:disabled{
  525. pointer-events:none
  526. }
  527. .tools-symbol{
  528. width:450px
  529. }
  530. .tools-symbol p{
  531. margin: 0
  532. }
  533. .tools-symbol a.btn{
  534. font-size: .95rem;
  535. width:26px;
  536. padding: 0;
  537. height:26px;
  538. }
  539. .custom-file-input:lang(zh) ~ .custom-file-label::after {
  540. content: "浏览";
  541. }
  542. .message-box {
  543. position:absolute;
  544. background:#000;
  545. padding:8px 10px;
  546. line-height: 18px;
  547. border-radius:4px;
  548. box-shadow:2px 2px 6px #ccc;
  549. color:#fff;
  550. }
  551. .triangle-border {
  552. position:absolute;
  553. left:10px;
  554. overflow:hidden;
  555. width:0;
  556. height:0;
  557. border-width:6px;
  558. border-style:solid dashed dashed dashed;
  559. }
  560. .tb-border {
  561. bottom:-12px;
  562. border-color:#000 transparent transparent transparent;
  563. }
  564. .tb-background {
  565. bottom:-11px;
  566. border-color:#000 transparent transparent transparent;
  567. }
  568. .box-text-style {
  569. font-size: 12px;
  570. font-family:"Microsoft YaHei"
  571. }
  572. .box-text-style p{
  573. margin:0 0 2px 0;
  574. }
  575. .box-text-style table{
  576. width: 100%;
  577. text-align: center;
  578. }
  579. .box-text-style table th,.box-text-style table td{
  580. border:1px solid #fff;
  581. }
  582. .box-text-style table p{
  583. text-align: left;
  584. }
  585. .sys-setting-nav .nav-link{
  586. padding:.3rem 1rem;
  587. }
  588. /*快捷切换单位工程*/
  589. .navbar-crumb{
  590. position: relative;
  591. }
  592. .navbar-crumb .f-nav,.navbar-crumb .s-nav{
  593. position: absolute;
  594. z-index: 999;
  595. width: 200px;
  596. background:#fff;
  597. border: 1px solid rgba(0,0,0,.15);
  598. padding: .5rem 0;
  599. }
  600. .navbar-crumb .f-nav{
  601. right:50px;
  602. top:35px;
  603. }
  604. .navbar-crumb .s-nav{
  605. left:200px
  606. }
  607. .navbar-crumb .f-nav li{
  608. padding: .25rem 1rem;
  609. cursor: default;
  610. }
  611. .navbar-crumb .f-nav li.focus{
  612. color: #16181b;
  613. background-color: #f7f7f9;
  614. }
  615. .navbar-crumb .f-nav li .s-nav{
  616. display: none
  617. }
  618. .navbar-crumb .f-nav li.focus .s-nav{
  619. display: block
  620. }
  621. /*书签颜色*/
  622. .annotate-color-1{
  623. background: #E2F2C5;
  624. color: #E2F2C5;
  625. }
  626. .annotate-color-1::before{
  627. color: #E2F2C5;
  628. -webkit-text-stroke:.5px #ced4da;
  629. }
  630. .annotate-color-2{
  631. background: #F9E2CF;
  632. color:#F9E2CF
  633. }
  634. .annotate-color-2::before{
  635. color: #F9E2CF;
  636. -webkit-text-stroke:.5px #ced4da;
  637. }
  638. .annotate-color-3{
  639. background: #F2EFD9;
  640. color:#F2EFD9
  641. }
  642. .annotate-color-3::before{
  643. color:#F2EFD9;
  644. -webkit-text-stroke:.5px #ced4da;
  645. }
  646. .annotate-color-4{
  647. background: #F5D1DA;
  648. color:#F5D1DA
  649. }
  650. .annotate-color-4::before{
  651. color:#F5D1DA;
  652. -webkit-text-stroke:.5px #ced4da;
  653. }
  654. .annotate-color-5{
  655. background: #E3E3E3;
  656. color:#E3E3E3
  657. }
  658. .annotate-color-5::before{
  659. color:#E3E3E3;
  660. -webkit-text-stroke:.5px #ced4da;
  661. }
  662. .annotate-color-6{
  663. background: #B6F3F2;
  664. color:#B6F3F2
  665. }
  666. .annotate-color-6::before{
  667. color:#B6F3F2;
  668. -webkit-text-stroke:.5px #ced4da;
  669. }
  670. .annotate-color-7{
  671. background: #ECE0F5;
  672. color:#ECE0F5
  673. }
  674. .annotate-color-7::before{
  675. color:#ECE0F5;
  676. -webkit-text-stroke:.5px #ced4da;
  677. }
  678. .input-group-text.active{
  679. color:#666;
  680. }
  681. /*宽屏菜单*/
  682. @media screen and (min-width: 900px) {
  683. #fluid-menu{
  684. }
  685. #min-menu{
  686. display: none
  687. }
  688. }
  689. @media screen and (min-width: 912px) {
  690. #share-info{
  691. overflow: auto;
  692. text-overflow: ellipsis;
  693. white-space: nowrap;
  694. max-width:inherit;
  695. }
  696. }
  697. /*窄屏菜单*/
  698. @media screen and (max-width: 900px) {
  699. #fluid-menu{
  700. display: none
  701. }
  702. #min-menu{
  703. }
  704. }
  705. @media screen and (max-width: 1018px) {
  706. #share-info{
  707. overflow: hidden;
  708. text-overflow: ellipsis;
  709. white-space: nowrap;
  710. max-width:80px;
  711. }
  712. }