main.css 16 KB

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