main.css 11 KB

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