main.css 12 KB

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