backend.css 15 KB

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