main.css 14 KB

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