backend.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714
  1. @import url("../css/bootstrap.min.css");
  2. @import url("../css/fastadmin.min.css");
  3. @import url("../css/skins/skin-green.css");
  4. @import url("../css/iconfont.css");
  5. @import url("../libs/font-awesome/css/font-awesome.min.css");
  6. @import url("../libs/toastr/toastr.min.css");
  7. @import url("../libs/layer/build/skin/default/layer.css");
  8. @import url("../libs/bootstrap-table/dist/bootstrap-table.min.css");
  9. @import url("../libs/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css");
  10. @import url("../libs/bootstrap-daterangepicker/daterangepicker.css");
  11. @import url("../libs/nice-validator/dist/jquery.validator.css");
  12. @import url("../libs/selectpage/selectpage.css");
  13. body {
  14. background: #f1f4f6;
  15. }
  16. body.is-dialog {
  17. background: #fff;
  18. }
  19. .selection {
  20. position: absolute;
  21. border: 1px solid #8B9;
  22. background-color: #BEC;
  23. }
  24. .main-header .logo,
  25. .main-header .navbar {
  26. -webkit-transition: none;
  27. -moz-transition: none;
  28. -o-transition: none;
  29. transition: none;
  30. }
  31. .main-header .navbar {
  32. position: relative;
  33. }
  34. .main-header .navbar .sidebar-toggle {
  35. position: absolute;
  36. width: 45px;
  37. text-align: center;
  38. }
  39. .main-header .navbar #nav {
  40. position: absolute;
  41. left: 45px;
  42. }
  43. .main-header .navbar .navbar-custom-menu {
  44. position: absolute;
  45. right: 0;
  46. }
  47. .note-dialog .modal {
  48. z-index: 1060;
  49. }
  50. .bootstrap-dialog .modal-dialog {
  51. /*width: 70%;*/
  52. max-width: 885px;
  53. }
  54. /*iOS兼容*/
  55. html.ios-fix,
  56. html.ios-fix body {
  57. height: 100%;
  58. overflow: auto;
  59. -webkit-overflow-scrolling: touch;
  60. }
  61. .content {
  62. min-height: 500px;
  63. }
  64. #header {
  65. background: #fff;
  66. box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(0, 0, 0, 0.05);
  67. }
  68. .content-wrapper {
  69. position: relative;
  70. }
  71. .control-relative {
  72. position: relative;
  73. }
  74. .tab-addtabs {
  75. overflow: hidden;
  76. }
  77. .tab-addtabs .tab-pane {
  78. height: 100%;
  79. width: 100%;
  80. }
  81. .row-between .col-xs-6 + .col-xs-6:before {
  82. content: "-";
  83. position: absolute;
  84. left: -2%;
  85. top: 6px;
  86. }
  87. @media only screen and (min-width: 481px) {
  88. .row-flex {
  89. display: flex;
  90. flex-wrap: wrap;
  91. }
  92. .row-flex > [class*='col-'] {
  93. display: flex;
  94. flex-direction: column;
  95. }
  96. .row-flex.row:after,
  97. .row-flex.row:before {
  98. display: flex;
  99. }
  100. }
  101. .common-search-table {
  102. min-height: 20px;
  103. padding: 15px;
  104. margin-bottom: 15px;
  105. background-color: #f5f5f5;
  106. }
  107. .searchit {
  108. border-bottom: 1px dashed #3c8dbc;
  109. }
  110. /* 固定的底部按钮 */
  111. .fixed-footer {
  112. position: fixed;
  113. bottom: 0;
  114. background-color: #ecf0f1;
  115. width: 100%;
  116. margin-bottom: 0;
  117. padding: 10px;
  118. }
  119. /* 包裹在layer外层 */
  120. .layer-footer {
  121. display: none;
  122. }
  123. table.table-template {
  124. overflow: hidden;
  125. }
  126. .sp_container .msg-box {
  127. position: absolute;
  128. right: 0;
  129. top: 0;
  130. }
  131. .toast-top-right-index {
  132. top: 62px;
  133. right: 12px;
  134. }
  135. .bootstrap-select .status {
  136. background: #f0f0f0;
  137. clear: both;
  138. color: #999;
  139. font-size: 12px;
  140. font-weight: 500;
  141. line-height: 1;
  142. margin-bottom: -5px;
  143. padding: 10px 20px;
  144. }
  145. .img-center {
  146. margin: 0 auto;
  147. display: inline;
  148. float: none;
  149. }
  150. /*
  151. * RIBBON
  152. */
  153. #ribbon {
  154. overflow: hidden;
  155. padding: 15px 15px 0 15px;
  156. position: relative;
  157. }
  158. #ribbon a {
  159. color: #777 !important;
  160. text-decoration: none !important;
  161. }
  162. #ribbon .breadcrumb {
  163. display: inline-block;
  164. margin: 0;
  165. padding: 0;
  166. background: none;
  167. vertical-align: top;
  168. }
  169. #ribbon .breadcrumb > .active,
  170. #ribbon .breadcrumb li {
  171. color: #aaa;
  172. }
  173. #ribbon .shortcut a {
  174. margin-left: 10px;
  175. }
  176. .is-dialog #main {
  177. background: #fff;
  178. }
  179. .is-dialog form label {
  180. font-weight: normal;
  181. }
  182. .user-panel > .image img {
  183. width: 45px;
  184. height: 45px;
  185. }
  186. /*panel扩展描述样式*/
  187. .panel-intro {
  188. margin-bottom: 0;
  189. border: none;
  190. }
  191. .panel-intro > .panel-heading {
  192. padding: 15px;
  193. padding-bottom: 0;
  194. background: #e8edf0;
  195. border-color: #e8edf0;
  196. position: relative;
  197. }
  198. .panel-intro > .panel-heading .panel-lead {
  199. margin-bottom: 15px;
  200. }
  201. .panel-intro > .panel-heading .panel-lead em {
  202. display: block;
  203. font-weight: bold;
  204. font-style: normal;
  205. }
  206. .panel-intro > .panel-heading .panel-title {
  207. height: 25px;
  208. font-weight: normal;
  209. white-space: nowrap;
  210. overflow: hidden;
  211. text-overflow: ellipsis;
  212. }
  213. .panel-intro > .panel-heading .panel-control {
  214. height: 42px;
  215. position: absolute;
  216. top: 8px;
  217. right: 8px;
  218. }
  219. .panel-intro > .panel-heading .panel-control .fa {
  220. font-size: 14px;
  221. }
  222. .panel-intro > .panel-heading .nav-tabs {
  223. border-bottom: 0;
  224. margin-bottom: 0;
  225. }
  226. .panel-intro > .panel-heading .nav-tabs > li > a {
  227. margin-right: 4px;
  228. color: #95a5a6;
  229. background-color: #d8e0e6;
  230. border: 1px solid #e8edf0;
  231. border-bottom-color: transparent;
  232. }
  233. .panel-intro > .panel-heading .nav-tabs > li > a:hover,
  234. .panel-intro > .panel-heading .nav-tabs > li > a:focus {
  235. border: 1px solid #e8edf0;
  236. color: #7b8a8b;
  237. background-color: #c9d4dc;
  238. }
  239. .panel-intro > .panel-heading .nav-tabs > li.active > a,
  240. .panel-intro > .panel-heading .nav-tabs > li.active > a:hover,
  241. .panel-intro > .panel-heading .nav-tabs > li.active > a:focus {
  242. color: #7b8a8b;
  243. background-color: #ffffff;
  244. border-bottom-color: transparent;
  245. cursor: default;
  246. }
  247. /*单表格*/
  248. .panel-tabs .panel-heading {
  249. padding: 12px 15px 12px 15px;
  250. }
  251. .panel-tabs .panel-heading .panel-lead {
  252. margin-bottom: 0px;
  253. }
  254. /*选项卡*/
  255. .panel-nav .panel-heading {
  256. padding: 0px;
  257. padding-bottom: 0;
  258. background: #f1f4f6;
  259. border-color: #f1f4f6;
  260. }
  261. .panel-nav .nav-tabs > li > a {
  262. padding: 12px 15px;
  263. background-color: #e8edf0;
  264. border: 1px solid #f1f4f6;
  265. }
  266. .panel-nav .nav-tabs > li > a:hover,
  267. .panel-nav .nav-tabs > li > a:focus {
  268. border: 1px solid #e8edf0;
  269. background-color: #e8edf0;
  270. }
  271. .panel-nav .nav-tabs > li.active > a,
  272. .panel-nav .nav-tabs > li.active > a:hover,
  273. .panel-nav .nav-tabs > li.active > a:focus {
  274. border-color: #f1f4f6;
  275. border-bottom-color: transparent;
  276. }
  277. /*顶栏addtabs*/
  278. .nav-addtabs {
  279. border: none;
  280. }
  281. .nav-addtabs.disable-top-badge > li > a > .pull-right-container {
  282. display: none;
  283. }
  284. .nav-addtabs > li {
  285. margin: 0;
  286. }
  287. .nav-addtabs > li > a {
  288. height: 49px;
  289. line-height: 49px;
  290. padding: 0 15px;
  291. border-radius: 0;
  292. border: none;
  293. border-right: 1px solid rgba(0, 0, 0, 0.05);
  294. margin: 0;
  295. color: #95a5a6;
  296. }
  297. .nav-addtabs > li > a:hover,
  298. .nav-addtabs > li > a:focus {
  299. border: none;
  300. color: #2c3e50;
  301. border-right: 1px solid rgba(0, 0, 0, 0.05);
  302. }
  303. .nav-addtabs > li > a i {
  304. margin-right: 3px;
  305. }
  306. .nav-addtabs > li.active > a {
  307. height: 49px;
  308. line-height: 49px;
  309. padding: 0 15px;
  310. border-radius: 0;
  311. border: none;
  312. border-right: 1px solid rgba(0, 0, 0, 0.05);
  313. background: #f1f4f6;
  314. color: #2c3e50;
  315. overflow: hidden;
  316. }
  317. .nav-addtabs > li.active > a:hover,
  318. .nav-addtabs > li.active > a:focus {
  319. border: none;
  320. color: #2c3e50;
  321. border-right: 1px solid rgba(0, 0, 0, 0.05);
  322. background: #f1f4f6;
  323. }
  324. .nav-addtabs > li .close-tab {
  325. font-size: 10px;
  326. position: absolute;
  327. right: 5px;
  328. top: 50%;
  329. margin-top: -7px;
  330. z-index: 100;
  331. cursor: hand;
  332. cursor: pointer;
  333. color: #fff;
  334. display: none;
  335. }
  336. .nav-addtabs .open > a:hover,
  337. .nav-addtabs .open > a:focus {
  338. border-right: 1px solid rgba(0, 0, 0, 0.05);
  339. }
  340. .nav-addtabs ul li {
  341. position: relative;
  342. }
  343. .nav-addtabs li:hover > .close-tab {
  344. display: block;
  345. }
  346. .main-sidebar .sidebar-form {
  347. overflow: visible;
  348. }
  349. .main-sidebar .sidebar-form .menuresult {
  350. z-index: 999;
  351. position: absolute;
  352. top: 34px;
  353. left: -1px;
  354. width: 100%;
  355. max-height: 250px;
  356. overflow: auto;
  357. margin: 0;
  358. border-top: none;
  359. border-top-left-radius: 0;
  360. border-top-right-radius: 0;
  361. }
  362. .main-sidebar .sidebar-form .menuresult a {
  363. border-top: 1px solid #eee;
  364. background-color: #fff;
  365. border-bottom: 1px solid #eee;
  366. margin-bottom: -1px;
  367. display: block;
  368. padding: 10px 15px;
  369. color: #222d32;
  370. }
  371. .main-sidebar .sidebar-form .menuresult a:hover {
  372. background: #eee;
  373. }
  374. .input-group .sp_result_area {
  375. width: 100%;
  376. }
  377. .sidebar-menu.show-submenu .treeview-menu {
  378. display: block;
  379. }
  380. .sidebar-menu > li .badge {
  381. margin-top: 0;
  382. }
  383. .sidebar-collapse .user-panel > .image img {
  384. width: 25px;
  385. height: 25px;
  386. }
  387. @media (min-width: 768px) {
  388. .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  389. top: 41px;
  390. }
  391. }
  392. .fieldlist dd {
  393. display: block;
  394. margin: 5px 0;
  395. }
  396. .fieldlist dd input {
  397. display: inline-block;
  398. width: 300px;
  399. }
  400. .fieldlist dd input:first-child {
  401. width: 110px;
  402. }
  403. .fieldlist dd ins {
  404. width: 110px;
  405. display: inline-block;
  406. text-decoration: none;
  407. font-weight: bold;
  408. }
  409. #treeview .jstree-container-ul .jstree-node {
  410. display: block;
  411. clear: both;
  412. }
  413. #treeview .jstree-leaf:not(:first-child) {
  414. float: left;
  415. background: none;
  416. margin-left: 0;
  417. width: 80px;
  418. clear: none;
  419. }
  420. #treeview .jstree-leaf {
  421. float: left;
  422. margin-left: 0;
  423. padding-left: 24px;
  424. width: 80px;
  425. clear: none;
  426. color: #777;
  427. }
  428. #treeview .jstree-leaf > .jstree-icon,
  429. #treeview .jstree-leaf .jstree-themeicon {
  430. display: none;
  431. }
  432. #treeview .jstree-last {
  433. background-image: url("../img/32px.png");
  434. background-position: -292px -4px;
  435. background-repeat: repeat-y;
  436. }
  437. #treeview .jstree-children:before,
  438. #treeview .jstree-children:after {
  439. content: " ";
  440. display: table;
  441. }
  442. #treeview .jstree-children:after {
  443. clear: both;
  444. }
  445. #treeview .jstree-children:before,
  446. #treeview .jstree-children:after {
  447. content: " ";
  448. display: table;
  449. }
  450. #treeview .jstree-children:after {
  451. clear: both;
  452. }
  453. #treeview .jstree-themeicon {
  454. display: none;
  455. }
  456. /*去除bootstrap-table的边框*/
  457. .fixed-table-container {
  458. border: none!important;
  459. }
  460. /*修复nice-validator和summernote的编辑框冲突*/
  461. .nice-validator .note-editor .note-editing-area .note-editable {
  462. display: inherit;
  463. }
  464. /*预览区域*/
  465. .plupload-preview {
  466. padding: 10px;
  467. margin-bottom: 0;
  468. }
  469. .plupload-preview li {
  470. margin-bottom: 10px;
  471. }
  472. .plupload-preview .thumbnail {
  473. margin-bottom: 10px;
  474. }
  475. .plupload-preview a {
  476. display: block;
  477. }
  478. .plupload-preview a:first-child {
  479. height: 90px;
  480. }
  481. .plupload-preview a img {
  482. height: 80px;
  483. object-fit: cover;
  484. }
  485. .pjax-loader-bar .progress {
  486. position: fixed;
  487. top: 0;
  488. left: 0;
  489. height: 2px;
  490. background: #77b6ff;
  491. box-shadow: 0 0 10px rgba(119, 182, 255, 0.7);
  492. -webkit-transition: width 0.4s ease;
  493. transition: width 0.4s ease;
  494. }
  495. .dropdown-menu.text-left a,
  496. .dropdown-menu.text-left li {
  497. text-align: left!important;
  498. }
  499. .bootstrap-table .fixed-table-toolbar .dropdown-menu {
  500. overflow: auto;
  501. }
  502. .bootstrap-table table tbody tr:first-child td .bs-checkbox {
  503. vertical-align: middle;
  504. }
  505. .bootstrap-table td.bs-checkbox {
  506. vertical-align: middle;
  507. }
  508. .dropdown-submenu {
  509. position: relative;
  510. }
  511. .dropdown-submenu > .dropdown-menu {
  512. overflow: auto;
  513. top: 0;
  514. left: 100%;
  515. margin-top: -6px;
  516. margin-left: -1px;
  517. -webkit-border-radius: 0 6px 6px 6px;
  518. -webkit-background-clip: padding-box;
  519. -moz-border-radius: 0 6px 6px 6px;
  520. -moz-background-clip: padding;
  521. border-radius: 0 6px 6px 6px;
  522. background-clip: padding-box;
  523. }
  524. .dropdown-submenu:hover > .dropdown-menu {
  525. display: block;
  526. }
  527. .dropdown-submenu:hover > a:after {
  528. border-left-color: #fff;
  529. }
  530. .dropdown-submenu > a:after {
  531. display: block;
  532. content: " ";
  533. float: right;
  534. width: 0;
  535. height: 0;
  536. border-color: transparent;
  537. border-style: solid;
  538. border-width: 5px 0 5px 5px;
  539. border-left-color: #ccc;
  540. margin-top: 5px;
  541. margin-right: -10px;
  542. }
  543. .dropdown-submenu.pull-left {
  544. float: none;
  545. }
  546. .dropdown-submenu.pull-left > .dropdown-menu {
  547. left: -100%;
  548. margin-left: 10px;
  549. -webkit-border-radius: 6px 0 6px 6px;
  550. -webkit-background-clip: padding-box;
  551. -moz-border-radius: 6px 0 6px 6px;
  552. -moz-background-clip: padding;
  553. border-radius: 6px 0 6px 6px;
  554. background-clip: padding-box;
  555. }
  556. /*重写toast的几个背景色*/
  557. .toast-primary {
  558. background-color: #48c9b0!important;
  559. }
  560. .toast-success {
  561. background-color: #18bc9c!important;
  562. }
  563. .toast-error {
  564. background-color: #e74c3c!important;
  565. }
  566. .toast-info {
  567. background-color: #5dade2!important;
  568. }
  569. .toast-warning {
  570. background-color: #f1c40f!important;
  571. }
  572. .toast-inverse {
  573. background-color: #34495e!important;
  574. }
  575. .toast-default {
  576. background-color: #bdc3c7!important;
  577. }
  578. #toast-container > div,
  579. #toast-container > div:hover {
  580. -webkit-box-shadow: 0 0 3px #eee;
  581. -moz-box-shadow: 0 0 3px #eee;
  582. box-shadow: 0 0 3px #eee;
  583. }
  584. .layui-layer-fast {
  585. /*自定义底部灰色操作区*/
  586. }
  587. .layui-layer-fast .layui-layer-title {
  588. background: #2c3e50!important;
  589. color: #fff!important;
  590. border-bottom: none;
  591. }
  592. .layui-layer-fast .layui-layer-title ~ .layui-layer-setwin {
  593. top: 0px;
  594. height: 42px;
  595. }
  596. .layui-layer-fast .layui-layer-title ~ .layui-layer-setwin > a {
  597. height: 42px;
  598. line-height: 42px;
  599. display: inline-block;
  600. }
  601. .layui-layer-fast.layui-layer-border {
  602. border: none!important;
  603. box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.3) !important;
  604. }
  605. .layui-layer-fast.layui-layer-iframe {
  606. overflow: visible;
  607. }
  608. .layui-layer-fast .layui-layer-moves {
  609. -webkit-box-sizing: content-box;
  610. -moz-box-sizing: content-box;
  611. box-sizing: content-box;
  612. }
  613. .layui-layer-fast .layui-layer-btn {
  614. text-align: center!important;
  615. padding: 10px!important;
  616. background: #ecf0f1;
  617. overflow: hidden;
  618. }
  619. .layui-layer-fast .layui-layer-btn a {
  620. background-color: #95a5a6!important;
  621. border-color: #95a5a6!important;
  622. color: #fff!important;
  623. }
  624. .layui-layer-fast .layui-layer-btn .layui-layer-btn0 {
  625. background-color: #18bc9c!important;
  626. border-color: #18bc9c!important;
  627. }
  628. .layui-layer-fast .layui-layer-footer {
  629. padding: 8px 20px;
  630. background-color: #ecf0f1;
  631. height: auto;
  632. text-align: inherit!important;
  633. }
  634. .layui-layer-fast .layui-layer-setwin > a {
  635. background: none!important;
  636. }
  637. .layui-layer-fast .layui-layer-setwin > a cite {
  638. display: none;
  639. }
  640. .layui-layer-fast .layui-layer-setwin > a:after {
  641. content: "\e625";
  642. font-family: iconfont;
  643. font-style: normal;
  644. font-weight: normal;
  645. text-decoration: inherit;
  646. position: absolute;
  647. font-size: 18px;
  648. color: #fff;
  649. margin: 0;
  650. z-index: 1;
  651. }
  652. .layui-layer-fast .layui-layer-setwin > a:hover {
  653. text-decoration: none!important;
  654. background: none!important;
  655. }
  656. .layui-layer-fast .layui-layer-setwin > a:focus {
  657. text-decoration: none!important;
  658. }
  659. .layui-layer-fast .layui-layer-setwin .layui-layer-min {
  660. display: none;
  661. }
  662. .layui-layer-fast .layui-layer-setwin .layui-layer-min:after {
  663. content: "\e625";
  664. }
  665. .layui-layer-fast .layui-layer-setwin .layui-layer-max {
  666. display: none;
  667. }
  668. .layui-layer-fast .layui-layer-setwin .layui-layer-max:after {
  669. content: "\e623";
  670. }
  671. .layui-layer-fast .layui-layer-setwin .layui-layer-maxmin {
  672. display: none;
  673. }
  674. .layui-layer-fast .layui-layer-setwin .layui-layer-maxmin:after {
  675. content: "\e624";
  676. }
  677. .layui-layer-fast .layui-layer-setwin .layui-layer-close1:after {
  678. content: "\e626";
  679. }
  680. .layui-layer-fast .layui-layer-setwin .layui-layer-close2,
  681. .layui-layer-fast .layui-layer-setwin .layui-layer-close2:hover {
  682. background: url('../libs/layer/build/skin/default/icon.png') no-repeat -149px -31px !important;
  683. top: -30px;
  684. right: -30px;
  685. }
  686. .layui-layer-fast .layui-layer-setwin .layui-layer-close2:after,
  687. .layui-layer-fast .layui-layer-setwin .layui-layer-close2:hover:after {
  688. display: none;
  689. }
  690. @media (min-width: 768px) {
  691. .form-inline .form-control {
  692. padding-right: 20px;
  693. }
  694. }
  695. /*手机版样式*/
  696. @media (max-width: 480px) {
  697. .nav-addtabs {
  698. display: none;
  699. }
  700. .fixed-table-toolbar .columns-right.btn-group {
  701. display: none;
  702. }
  703. }
  704. /*平板样式*/
  705. /*修复radio和checkbox样式对齐*/
  706. .radio > label,
  707. .checkbox > label {
  708. margin-right: 10px;
  709. }
  710. .radio > label > input,
  711. .checkbox > label > input {
  712. margin: 2px 0 0;
  713. }
  714. /*# sourceMappingURL=backend.css.map */