xadmin.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888
  1. @charset "utf-8";
  2. @import url(../lib/layui/css/layui.css);
  3. * {
  4. margin: 0px;
  5. padding: 0px;
  6. font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  7. }
  8. a {
  9. text-decoration: none;
  10. }
  11. html {
  12. width: 100%;
  13. height: 100%;
  14. overflow-x: hidden;
  15. overflow-y: auto;
  16. }
  17. body {
  18. width: 100%;
  19. min-height: 100%;
  20. }
  21. .clear {
  22. clear: both;
  23. }
  24. .login-bg {
  25. /*background: #eeeeee ;*/
  26. background: url(../images/bg.png) no-repeat center;
  27. background-size: cover;
  28. overflow: hidden;
  29. }
  30. .login {
  31. margin: 120px auto 0 auto;
  32. min-height: 420px;
  33. max-width: 420px;
  34. padding: 40px;
  35. background-color: #ffffff;
  36. margin-left: auto;
  37. margin-right: auto;
  38. border-radius: 4px;
  39. /* overflow-x: hidden; */
  40. box-sizing: border-box;
  41. }
  42. .login a.logo {
  43. display: block;
  44. height: 58px;
  45. width: 167px;
  46. margin: 0 auto 30px auto;
  47. background-size: 167px 42px;
  48. }
  49. .login .message {
  50. margin: 10px 0 0 -58px;
  51. padding: 18px 10px 18px 60px;
  52. background: #1890ff;
  53. position: relative;
  54. color: #fff;
  55. font-size: 16px;
  56. }
  57. .login #darkbannerwrap {
  58. background: url(../images/aiwrap.png);
  59. width: 18px;
  60. height: 10px;
  61. margin: 0 0 20px -58px;
  62. position: relative;
  63. }
  64. .login input[type="text"],
  65. .login input[type="file"],
  66. .login input[type="password"],
  67. .login input[type="email"],
  68. select {
  69. border: 1px solid #dcdee0;
  70. vertical-align: middle;
  71. border-radius: 3px;
  72. height: 32px;
  73. padding: 0px 16px;
  74. font-size: 14px;
  75. color: #555555;
  76. outline: none;
  77. /* width: 100%; */
  78. box-sizing: border-box;
  79. }
  80. .login input[type="text"]:focus,
  81. .login input[type="file"]:focus,
  82. .login input[type="password"]:focus,
  83. .login input[type="email"]:focus,
  84. select:focus {
  85. border: 1px solid #1890ff;
  86. }
  87. .login input[type="submit"],
  88. .login input[type="button"] {
  89. display: inline-block;
  90. vertical-align: middle;
  91. padding: 12px 24px;
  92. margin: 0px;
  93. font-size: 18px;
  94. line-height: 24px;
  95. text-align: center;
  96. white-space: nowrap;
  97. vertical-align: middle;
  98. cursor: pointer;
  99. color: #ffffff;
  100. background-color: #1890ff;
  101. border-radius: 3px;
  102. border: none;
  103. -webkit-appearance: none;
  104. outline: none;
  105. width: 100%;
  106. }
  107. .login hr {
  108. background: #fff;
  109. }
  110. .login hr.hr15 {
  111. height: 15px;
  112. border: none;
  113. margin: 0px;
  114. padding: 0px;
  115. width: 100%;
  116. }
  117. .login hr.hr20 {
  118. height: 20px;
  119. border: none;
  120. margin: 0px;
  121. padding: 0px;
  122. width: 100%;
  123. }
  124. .x-body {
  125. padding: 20px;
  126. }
  127. .x-nav {
  128. padding: 0 20px;
  129. position: relative;
  130. z-index: 99;
  131. border-bottom: 1px solid #e5e5e5;
  132. line-height: 39px;
  133. height: 39px;
  134. overflow: hidden;
  135. }
  136. xblock {
  137. display: block;
  138. margin-bottom: 10px;
  139. padding: 5px;
  140. line-height: 22px;
  141. /* border-left: 5px solid #009688; */
  142. border-radius: 0 2px 2px 0;
  143. background-color: #f2f2f2;
  144. }
  145. .x-right {
  146. float: right;
  147. }
  148. .x-so {
  149. /*text-align: center;*/
  150. /*background: #f2f2f2 ;*/
  151. margin-bottom: 20px;
  152. }
  153. .x-so input.layui-input {
  154. width: 300px;
  155. }
  156. .x-so .layui-form-label {
  157. display: inline-block;
  158. }
  159. .x-so input.layui-input,
  160. .x-so input.layui-btn {
  161. display: inline-block;
  162. }
  163. .x-red {
  164. color: red;
  165. }
  166. .x-a {
  167. color: #1890ff;
  168. }
  169. .x-a:hover {
  170. color: #1890ff;
  171. }
  172. .x-sort {
  173. height: 30px;
  174. }
  175. .x-show {
  176. cursor: pointer;
  177. }
  178. .layui-form-switch {
  179. margin-top: 0px;
  180. }
  181. .layui-input:focus,
  182. .layui-textarea:focus {
  183. border-color: #1890ff !important;
  184. }
  185. .page {
  186. margin-top: 20px;
  187. text-align: center;
  188. }
  189. .page a {
  190. display: inline-block;
  191. background: #fff;
  192. color: #888;
  193. padding: 10px;
  194. min-width: 15px;
  195. border: 1px solid #e2e2e2;
  196. }
  197. .span1 {
  198. display: inline-block;
  199. float: left;
  200. line-height: 28px;
  201. }
  202. .page span {
  203. display: inline-block;
  204. padding: 10px;
  205. min-width: 15px;
  206. border: 1px solid #e2e2e2;
  207. }
  208. .page span.current {
  209. display: inline-block;
  210. background: #1890ff;
  211. color: #fff;
  212. padding: 10px;
  213. min-width: 15px;
  214. border: 1px solid #1890ff;
  215. }
  216. .page .pagination li {
  217. display: inline-block;
  218. margin-right: 5px;
  219. text-align: center;
  220. }
  221. .page .pagination li.active span {
  222. background: #1890ff;
  223. color: #fff;
  224. border: 1px solid #1890ff;
  225. }
  226. /*登录样式*/
  227. /*头部*/
  228. .container {
  229. width: 100%;
  230. /* height: 60px; */
  231. border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  232. }
  233. .container .logo {
  234. padding-left: 10px;
  235. width: 100%;
  236. /* padding-top: 10px; */
  237. }
  238. .container .logo a {
  239. float: left;
  240. color: #000;
  241. font-weight: 600;
  242. font-size: 22px;
  243. padding-left: 20px;
  244. line-height: 45px;
  245. }
  246. .container .right {
  247. background-color: rgba(0, 0, 0, 0);
  248. float: right;
  249. }
  250. .container .left_open {
  251. height: 45px;
  252. float: left;
  253. margin-left: 20px;
  254. }
  255. .container .left_open i {
  256. display: block;
  257. background: rgba(255, 255, 255, 0.1);
  258. color: #000;
  259. width: 32px;
  260. height: 32px;
  261. line-height: 32px;
  262. border-radius: 3px;
  263. text-align: center;
  264. margin-top: 7px;
  265. cursor: pointer;
  266. }
  267. .container .left_open i:hover {
  268. background: rgba(255, 255, 255, 0.3);
  269. }
  270. .container .left {
  271. background-color: rgba(0, 0, 0, 0);
  272. float: left;
  273. }
  274. .container .layui-nav-item {
  275. line-height: 45px;
  276. }
  277. .container .layui-nav-more {
  278. top: 20px;
  279. }
  280. .container .layui-nav-child {
  281. top: 50px;
  282. }
  283. .container .layui-nav-child i {
  284. margin-right: 10px;
  285. }
  286. .layui-nav .layui-nav-item a {
  287. color: #000;
  288. cursor: pointer;
  289. }
  290. .layui-nav .layui-nav-item a:hover {
  291. color: #000;
  292. }
  293. .layui-nav .layui-nav-child a {
  294. color: #333;
  295. cursor: pointer;
  296. }
  297. .left-nav {
  298. position: absolute;
  299. top: 45px;
  300. bottom: 0;
  301. left: 0;
  302. z-index: 2;
  303. padding-top: 10px;
  304. /* background-color: #1E90FF; */
  305. background: url("../images/icon4.png");
  306. background-repeat: repeat-x;
  307. background-size:100% 100%;
  308. /* opacity: 0.7; */
  309. width: 220px;
  310. max-width: 220px;
  311. overflow: auto;
  312. overflow-x: hidden;
  313. border-right: 1px solid #e5e5e5;
  314. /*width: 0px;*/
  315. }
  316. .left-nav #nav li:hover>a {
  317. /*color: blue;*/
  318. }
  319. .left-nav #nav .current {
  320. background-color: rgba(0, 0, 0, 0.3);
  321. }
  322. .left-nav #nav li {
  323. text-align: center;
  324. }
  325. .left-nav #nav li a {
  326. font-size: 14px;
  327. padding: 10px;
  328. display: block;
  329. cursor: pointer;
  330. color: #fff;
  331. }
  332. .left-nav #nav li a cite {
  333. font-size: 14px;
  334. }
  335. .left-nav #nav li.active,
  336. .left-nav #nav li:hover {
  337. background: #1890ff;
  338. }
  339. .left-nav #nav li .sub-menu {
  340. display: none;
  341. }
  342. .left-nav #nav li .opened {
  343. display: block;
  344. }
  345. .left-nav #nav li .opened:hover {
  346. /*background: #fff ;*/
  347. }
  348. .left-nav #nav li .opened .current {}
  349. .left-nav #nav li .sub-menu li:hover {
  350. /*color: blue;*/
  351. /*background: #fff ;*/
  352. }
  353. .left-nav #nav li .sub-menu li a {
  354. padding: 12px 15px 12px 30px;
  355. font-size: 14px;
  356. cursor: pointer;
  357. }
  358. .left-nav #nav li .sub-menu li .sub-menu li a {
  359. padding-left: 45px;
  360. }
  361. .left-nav #nav li .sub-menu li a:hover {
  362. color: #148cf1;
  363. }
  364. .left-nav #nav li .sub-menu li a i {
  365. font-size: 12px;
  366. }
  367. .left-nav #nav li a i {
  368. padding-right: 10px;
  369. line-height: 14px;
  370. }
  371. .left-nav #nav li .nav_right {
  372. float: right;
  373. font-size: 16px;
  374. }
  375. .x-slide_left {
  376. width: 17px;
  377. height: 61px;
  378. background: url(../images/icon.png) 0 0 no-repeat;
  379. position: absolute;
  380. top: 200px;
  381. left: 220px;
  382. cursor: pointer;
  383. z-index: 3;
  384. }
  385. .page-content {
  386. position: absolute;
  387. top: 45px;
  388. right: 0;
  389. bottom: 42px;
  390. left: 161px;
  391. overflow: hidden;
  392. z-index: 1;
  393. }
  394. .page-content-bg {
  395. position: absolute;
  396. top: 46px;
  397. right: 0;
  398. bottom: 42px;
  399. left: 220px;
  400. background: rgba(0, 0, 0, 0.5);
  401. overflow: hidden;
  402. z-index: 100;
  403. display: none;
  404. }
  405. .page-content .tab {
  406. height: 100%;
  407. width: 100%;
  408. background: #efeef0;
  409. margin: 0px;
  410. }
  411. .page-content .layui-tab-title {
  412. /*padding-top: 5px;*/
  413. height: 35px;
  414. /* background: #330099; */
  415. background: #446388;
  416. color: #fff;
  417. position: relative;
  418. z-index: 100;
  419. }
  420. .page-content .layui-tab-title li.home i {
  421. padding-right: 5px;
  422. }
  423. .page-content .layui-tab-title li.home .layui-tab-close {
  424. display: none;
  425. }
  426. .page-content .layui-tab-title li {
  427. line-height: 35px;
  428. }
  429. .page-content .layui-tab-title .layui-this:after {
  430. height: 36px;
  431. }
  432. .page-content .layui-tab-title li .layui-tab-close {
  433. border-radius: 50%;
  434. }
  435. .page-content .layui-tab-title .layui-this {
  436. background: #fff;
  437. }
  438. .page-content .layui-tab-bar {
  439. height: 34px;
  440. line-height: 35px;
  441. }
  442. .page-content .layui-tab-content {
  443. position: absolute;
  444. top: 36px;
  445. bottom: 0;
  446. width: 100%;
  447. background: #fff;
  448. padding: 0;
  449. overflow: hidden;
  450. }
  451. .page-content .layui-tab-content .layui-tab-item {
  452. width: 100%;
  453. height: 100%;
  454. }
  455. .page-content .layui-tab-content .layui-tab-item iframe {
  456. width: 100%;
  457. height: 100%;
  458. }
  459. .x-admin-carousel,
  460. .layui-carousel,
  461. .x-admin-carousel>[carousel-item]>* {
  462. background-color: #fff;
  463. }
  464. .x-admin-backlog .x-admin-backlog-body {
  465. display: block;
  466. padding: 10px 15px;
  467. background-color: #f8f8f8;
  468. color: #999;
  469. border-radius: 2px;
  470. transition: all 0.3s;
  471. -webkit-transition: all 0.3s;
  472. }
  473. .x-admin-backlog-body h3 {
  474. padding-bottom: 10px;
  475. font-size: 12px;
  476. }
  477. .x-admin-backlog-body p cite {
  478. font-style: normal;
  479. font-size: 30px;
  480. font-weight: 300;
  481. color: #1890ff;
  482. }
  483. .x-admin-backlog-body:hover {
  484. background-color: #cfcfcf;
  485. color: #888;
  486. }
  487. .welcome-footer {
  488. padding: 30px 0;
  489. line-height: 30px;
  490. text-align: center;
  491. background-color: #eee;
  492. color: #666;
  493. font-weight: 300;
  494. }
  495. body .layui-layout-admin .footer-demo {
  496. height: auto;
  497. padding: 15px 0;
  498. line-height: 26px;
  499. }
  500. .welcome-footer a {
  501. padding: 0 5px;
  502. }
  503. table th,
  504. table td {
  505. word-break: break-all;
  506. }
  507. .footer {
  508. position: fixed;
  509. bottom: 0px;
  510. width: 100%;
  511. background-color: #222;
  512. border-top: 1px solid rgba(255, 255, 255, 0.2);
  513. line-height: 41px;
  514. color: #fff;
  515. /*padding-left: 10px;*/
  516. }
  517. .footer .copyright {
  518. margin-left: 10px;
  519. }
  520. .layui-btn {
  521. border-radius: 3px;
  522. background: #1890ff;
  523. }
  524. .layui-tab-brief>.layui-tab-title .layui-this {
  525. color: #fff;
  526. /* background-color: #1E90FF; */
  527. background: url("../images/icon4.png");
  528. background-repeat: repeat-x;
  529. background-size:100% 100%;
  530. }
  531. .layui-btn.layui-btn-danger {
  532. background-color: #ff0000;
  533. }
  534. .layui-tab-brief>.layui-tab-more li.layui-this:after,
  535. .layui-tab-brief>.layui-tab-title .layui-this:after {
  536. border-bottom-color: #1890ff;
  537. }
  538. .Columnar p {
  539. float: left;
  540. }
  541. .Columnar p a {
  542. line-height: 38px;
  543. margin: 0 6px;
  544. cursor: pointer;
  545. }
  546. .Columnar p a.cur {
  547. color: #1890ff;
  548. }
  549. .Columnar .layui-form {
  550. float: left;
  551. }
  552. .DataRanking {
  553. float: left;
  554. width: 30%;
  555. }
  556. .DataRanking h3 {
  557. text-align: left;
  558. font-size: 20px;
  559. font-weight: 600;
  560. line-height: 50px;
  561. }
  562. .DataRanking ul li {
  563. width: 100%;
  564. height: 24px;
  565. line-height: 24px;
  566. margin: 10px auto;
  567. }
  568. .DataRanking ul li span {
  569. display: block;
  570. float: left;
  571. margin-right: 20px;
  572. width: 24px;
  573. height: 24px;
  574. border-radius: 50%;
  575. text-align: center;
  576. line-height: 24px;
  577. }
  578. .DataRanking ul li span {
  579. background: rgb(49, 70, 89);
  580. color: #fff;
  581. }
  582. .DataRanking ul li p {
  583. float: left;
  584. }
  585. .DataRanking ul li i {
  586. font-style: normal;
  587. float: right;
  588. margin-right: 30px;
  589. }
  590. .site-doc-icon {
  591. /* width: 100%; */
  592. margin-bottom: 30px;
  593. }
  594. .site-doc-icon li {
  595. display: inline-block;
  596. vertical-align: middle;
  597. width: 30%;
  598. height: 220px;
  599. line-height: 25px;
  600. padding: 20px;
  601. margin-right: 1%;
  602. margin-bottom: -1px;
  603. border: 1px solid #e2e2e2;
  604. font-size: 14px;
  605. color: #666;
  606. box-sizing: border-box;
  607. }
  608. .site-doc-icon li .layui-anim {
  609. height: 120px;
  610. }
  611. .site-doc-icon li .layui-anim h3 {
  612. line-height: 50px;
  613. font-size: 30px;
  614. font-weight: 600;
  615. }
  616. .period {
  617. float: left;
  618. margin-top: 15px;
  619. margin-right: 25px;
  620. }
  621. .period i {
  622. display: inline-block;
  623. font-style: normal;
  624. color: #f5222d;
  625. margin-left: 5px;
  626. }
  627. .period span {
  628. margin-left: 10px;
  629. }
  630. .period .active {
  631. color: #8fd96b;
  632. -webkit-transform: rotate(180deg);
  633. -moz-transform: rotate(180deg);
  634. -ms-transform: rotate(180deg);
  635. -o-transform: rotate(180deg);
  636. transform: rotate(180deg);
  637. }
  638. .successRates {
  639. border-top: 1px solid #ddd;
  640. }
  641. .successRates .period {
  642. margin-top: 8px;
  643. }
  644. .site-doc-icon li h4 span {
  645. float: right;
  646. }
  647. .site-doc-icon li p {
  648. border-top: 1px solid #e2e2e2;
  649. line-height: 34px;
  650. }
  651. .bar {
  652. width: 100%;
  653. float: left;
  654. margin-top: 45px;
  655. }
  656. .bar h3 {
  657. position: relative;
  658. top: 30px;
  659. left: 38px;
  660. font-size: 20px;
  661. margin-top: 50px;
  662. }
  663. .sear {
  664. display: inline-block;
  665. width: 80%;
  666. }
  667. @media screen and (max-width: 768px) {
  668. .Columnar {
  669. position: relative;
  670. }
  671. .DataRanking {
  672. width: 100%;
  673. }
  674. .fast-add {
  675. display: none;
  676. }
  677. .layui-nav .to-index {
  678. display: none;
  679. }
  680. .container .logo a {
  681. width: 140px;
  682. }
  683. .container .left_open {
  684. /*float: right;*/
  685. }
  686. .left-nav {
  687. left: -221px;
  688. }
  689. .page-content {
  690. left: 0px;
  691. }
  692. .page-content .layui-tab-content .layui-tab-item {
  693. -webkit-overflow-scrolling: touch;
  694. overflow-y: scroll;
  695. }
  696. .x-so input.layui-input {
  697. width: 100%;
  698. background-color: #222;
  699. border-top: 1px solid rgba(255, 255, 255, 0.2);
  700. line-height: 41px;
  701. color: #fff;
  702. /*padding-left: 10px;*/
  703. }
  704. .footer .copyright {
  705. margin-left: 10px;
  706. }
  707. .layui-btn {
  708. border-radius: 6px;
  709. background: #1890ff;
  710. }
  711. .layui-btn.layui-btn-danger {
  712. background-color: #ff0000;
  713. }
  714. @media screen and (max-width: 768px) {
  715. .fast-add {
  716. display: none;
  717. }
  718. .layui-nav .to-index {
  719. display: none;
  720. }
  721. .container .logo a {
  722. width: 140px;
  723. }
  724. .container .left_open {
  725. /*float: right;*/
  726. }
  727. .left-nav {
  728. left: -220px;
  729. }
  730. .page-content {
  731. left: 0px;
  732. }
  733. .page-content .layui-tab-content .layui-tab-item {
  734. -webkit-overflow-scrolling: touch;
  735. overflow-y: scroll;
  736. }
  737. .x-so input.layui-input {
  738. width: 100%;
  739. margin: 10px;
  740. }
  741. }
  742. }
  743. .left-nav #side-nav .layui-nav {
  744. /* background-color: #1E90FF !important; */
  745. background: url("../images/icon4.png");
  746. background-repeat: repeat-x;
  747. background-size:100% 100%;
  748. /* box-shadow: 13, 13, 10, 10; */
  749. }
  750. .layui-nav-tree .layui-nav-item a:hover {
  751. background-color: #1E90F!important;
  752. }