Advertisement
Guest User

My Anime List Dio pa Luisma

a guest
Dec 16th, 2017
124
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.88 KB | None | 0 0
  1. #advanced-options {
  2. position: absolute;
  3. top: 24px;
  4. left: 0;
  5. right: 0;
  6. background-color: #F6F6F6;
  7. display: none;
  8. width: 860px;
  9. margin: 0 auto;
  10. padding: 25px 0px 30px;
  11. border: #EBEBEB 1px solid;
  12. -moz-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  13. -webkit-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  14. -o-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  15. -ms-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  16. box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  17. color: #323232;
  18. text-align: left;
  19. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  20. z-index: 1101;
  21. }
  22. #advanced-options .advanced-options-header {
  23. width: 750px;
  24. margin: 0px auto;
  25. padding-bottom: 4px;
  26. border-bottom: 1px solid #BEBEBE;
  27. font-size: 16px;
  28. }
  29.  
  30. #advanced-options .advanced-options-header .description {
  31. font-size: 12px;
  32. font-weight: normal;
  33. margin-left: 8px;
  34. }
  35.  
  36. #advanced-options select {
  37. -ms-appearance: none;
  38. -webkit-appearance: none;
  39. -moz-appearance: none;
  40. appearance: none;
  41. background-image: url(/img/pc/ownlist/icon_pulldown_triangle.png);
  42. background-repeat: no-repeat;
  43. background-position: center right;
  44. background-size: 18px 8px;
  45. background-color: #FFFFFF;
  46. display: inline-block;
  47. height: 25px;
  48. padding: 4px 20px 4px 4px;
  49. padding-right: 4px\0;
  50. border: #BEBEBE 1px solid;
  51. border-radius: 0px;
  52. font-size: 12px;
  53. }
  54. #advanced-options select::-ms-expand {
  55. display: none;
  56. }
  57.  
  58. #advanced-options select:disabled {
  59. background-image: url(/img/pc/ownlist/icon_pulldown_triangle_disable.png);
  60. color: #9B9B9B;
  61. }
  62.  
  63. #advanced-options input[type=text] {
  64. padding: 4px;
  65. border: #BEBEBE 1px solid;
  66. }
  67.  
  68. #advanced-options input:focus {
  69. outline: none;
  70. }
  71.  
  72. /* sort */
  73. #advanced-options .sort-widget {
  74. margin: 0px auto;
  75. padding: 12px 0px 0px;
  76. width: 750px;
  77. }
  78. #advanced-options .sort-widget:last-of-type {
  79. padding-bottom: 45px;
  80. }
  81.  
  82. #advanced-options .sort-widget select {
  83. width: 172px;
  84. margin-right: 8px;
  85. }
  86.  
  87. #advanced-options .sort-widget input[type=radio] {
  88. display: none;
  89. }
  90. #advanced-options .sort-widget input[type=radio] + label {
  91. background-color: #FFFFFF;
  92. display: inline-block;
  93. width: 56px;
  94. padding: 5px 0px;
  95. border: #BEBEBE 1px solid;
  96. border-radius: 4px;
  97. color: #323232;
  98. font-size: 12px;
  99. text-align: center;
  100. cursor: pointer;
  101. }
  102. #advanced-options .sort-widget input[type=radio]:checked + label {
  103. background-color: #4065BA;
  104. border: #4065BA 1px solid;
  105. color: #FFFFFF;
  106. }
  107. #advanced-options .sort-widget input[type=radio]:disabled + label {
  108. border: #BEBEBE 1px solid;
  109. color: #9B9B9B;
  110. }
  111. #advanced-options .sort-widget input[type=radio]:checked:disabled + label {
  112. background-color: #FFFFFF;
  113. border: #BEBEBE 1px solid;
  114. color: #9B9B9B;
  115. }
  116.  
  117. /* filter */
  118. #advanced-options .filter-widget {
  119. margin: 0px auto;
  120. padding: 12px 0px 0;
  121. width: 750px;
  122. }
  123.  
  124. #advanced-options .filter-widget select {
  125. margin-right: 8px;
  126. font-size: 12px;
  127. }
  128.  
  129. #advanced-options .filter-widget.title input[type=text] {
  130. width: 360px;
  131. }
  132.  
  133. #advanced-options .filter-widget.airing-status select,
  134. #advanced-options .filter-widget.publishing-status select {
  135. width: 152px;
  136. }
  137.  
  138. #advanced-options .filter-widget.producer select,
  139. #advanced-options .filter-widget.magazine select {
  140. width: 360px;
  141. }
  142.  
  143. #advanced-options .filter-widget.aired-date select.year,
  144. #advanced-options .filter-widget.published-date select.year {
  145. width: 80px;
  146. }
  147.  
  148. #advanced-options .filter-widget.aired-date select.month,
  149. #advanced-options .filter-widget.published-date select.month,
  150. #advanced-options .filter-widget.aired-date select.day,
  151. #advanced-options .filter-widget.published-date select.day {
  152. width: 60px;
  153. }
  154.  
  155. #advanced-options .filter-widget.aired-date .text,
  156. #advanced-options .filter-widget.published-date .text {
  157. display: inline-block;
  158. margin-right: 4px;
  159. font-size: 12px;
  160. }
  161.  
  162. #advanced-options .filter-widget.aired-season select.year {
  163. width: 80px;
  164. }
  165.  
  166. #advanced-options .filter-widget.aired-season select.season {
  167. width: 110px;
  168. }
  169.  
  170. #advanced-options .sort-widget .widget-header,
  171. #advanced-options .filter-widget .widget-header {
  172. display: inline-block;
  173. width: 110px;
  174. font-size: 12px;
  175. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  176. }
  177.  
  178. #advanced-options .sort-widget:last-of-type,
  179. #advanced-options .filter-widget:last-of-type {
  180. padding-bottom: 40px;
  181. }
  182.  
  183. #advanced-options .advanced-options-button {
  184. width: 750px;
  185. margin: 0px auto;
  186. padding: 12px 0px 0px;
  187. border-top: 1px solid #BEBEBE;
  188. text-align: center;
  189. }
  190.  
  191. #advanced-options .btn-apply,
  192. #advanced-options .btn-clear {
  193. background-color: rgba(64, 101, 186, 1);
  194. display: inline-block;
  195. width: 135px;
  196. margin: 0 4px;
  197. padding: 6px 0px;
  198. border-radius: 4px;
  199. font-size: 12px;
  200. color: #FFFFFF;
  201. text-align: center;
  202. -moz-transition-property: all;
  203. -o-transition-property: all;
  204. -webkit-transition-property: all;
  205. transition-property: all;
  206. -moz-transition-duration: 0.3s;
  207. -o-transition-duration: 0.3s;
  208. -webkit-transition-duration: 0.3s;
  209. transition-duration: 0.3s;
  210. -moz-transition-timing-function: ease-in-out;
  211. -o-transition-timing-function: ease-in-out;
  212. -webkit-transition-timing-function: ease-in-out;
  213. transition-timing-function: ease-in-out
  214. }
  215.  
  216. #advanced-options .btn-apply:hover,
  217. #advanced-options .btn-clear:hover {
  218. background-color: rgba(64, 101, 186, 0.8);
  219. }
  220.  
  221.  
  222. /**
  223. * General Styles
  224. */
  225.  
  226. body {
  227. margin: 0 0 0 0;
  228. text-align: center;
  229. font-family: Verdana, Arial;
  230. font-size: 11px;
  231. }
  232.  
  233. td {
  234. line-height: 1.5em;
  235. }
  236.  
  237. a {
  238. color: #000000;
  239. text-decoration: none;
  240. }
  241.  
  242. #footer-block {
  243. padding: 15px 0;
  244. background-color: #5e9c57;
  245. color: #000000;
  246. font-family: Avenir, "lucida grande", tahoma, verdana, arial, sans-serif;
  247. }
  248.  
  249. #copyright {
  250. font-size: 12px;
  251. color: #ffffff;
  252. padding-top: 3px;
  253. text-align: center;
  254. }
  255.  
  256.  
  257. /*
  258. * Header
  259. */
  260. .header a {
  261. font-weight: bold;
  262. color: #fff;
  263. }
  264. .header a:hover {
  265. text-decoration: underline;
  266. }
  267.  
  268. .header {
  269. position: relative;
  270. color: #fff;
  271. display: block;
  272. width: 1060px;
  273. height: 70px;
  274. margin: 0 auto
  275. }
  276.  
  277. .header .header-title {
  278. position: absolute;
  279. top: 21px;
  280. background-image: url(https://68.media.tumblr.com/8321f0b2aa662cff868e92d9513712a6/tumblr_p0yi47hpkW1rn3erso1_1280.png);
  281. background-position: left top;
  282. background-repeat: no-repeat;
  283. background-size: auto 36px;
  284. display: block;
  285. width: 240px;
  286. height: 36px;
  287. text-indent: -9999px;
  288. overflow: hidden
  289. }
  290.  
  291. .header .header-menu {
  292. position: absolute;
  293. top: 25px;
  294. right: 4px;
  295. color: #5e9c57;
  296. }
  297. .header .header-menu.other {
  298. top: 18px;
  299. }
  300.  
  301. .header .header-menu .btn-menu {
  302. display: block;
  303. color: #5e9c57;
  304. text-align: right;
  305. font-size: 16px;
  306. }
  307.  
  308. .header .header-menu .btn-menu > a {
  309. color: #5e9c57;
  310. }
  311. .header .username {
  312. font-weight: bold;
  313. }
  314.  
  315. .header .header-menu .list-menu {
  316. position: absolute;
  317. top: 25px;
  318. right: -4px;
  319. background-color: #ffffff;
  320. display: none;
  321. border: #5e9c57 1px solid;
  322. -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  323. -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  324. box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  325. z-index: 1;
  326. }
  327.  
  328. .header .header-menu .list-menu .icon-menu {
  329. display: block;
  330. width: 150px;
  331. height: 30px;
  332. color: #5e9c57;
  333. font-size: 14px;
  334. font-weight: bold;
  335. text-decoration: none;
  336. -moz-transition-property: all;
  337. -o-transition-property: all;
  338. -webkit-transition-property: all;
  339. transition-property: all;
  340. -moz-transition-duration: 0.3s;
  341. -o-transition-duration: 0.3s;
  342. -webkit-transition-duration: 0.3s;
  343. transition-duration: 0.3s;
  344. -moz-transition-timing-function: ease-in-out;
  345. -o-transition-timing-function: ease-in-out;
  346. -webkit-transition-timing-function: ease-in-out;
  347. transition-timing-function: ease-in-out
  348. }
  349.  
  350. .header .header-info {
  351. margin-top: 6px;
  352. margin-right: 15px;
  353. font-size: 1.0em;
  354. text-align: right;
  355. color: #5e9c57;
  356. }
  357.  
  358. .header .header-info > a {
  359. color: #5e9c57;
  360. }
  361.  
  362. .header .header-menu .list-menu .icon-menu:hover {
  363. background-color: #e1e7f5
  364. }
  365.  
  366. .header .header-menu .list-menu .icon-menu svg.icon {
  367. position: absolute;
  368. fill: #5e9c57;
  369. left: 12px;
  370. top: 4px;
  371. }
  372.  
  373. .header .header-menu .list-menu .icon-menu .text {
  374. position: absolute;
  375. left: 52px;
  376. top: 6px;
  377. }
  378.  
  379.  
  380. /**
  381. * Floating Menu
  382. */
  383. .list-menu-float {
  384. position: fixed;
  385. display: block;
  386. top: 15%;
  387. width: 50px;
  388. border: #609c54 2px solid;
  389. z-index: 2
  390. }
  391.  
  392. .list-menu-float .icon-menu {
  393. position: relative;
  394. background-color: #ffc48a;
  395. display: block;
  396. width: 50px;
  397. height: 50px;
  398. opacity: 1;
  399. -moz-transition-property: all;
  400. -o-transition-property: all;
  401. -webkit-transition-property: all;
  402. transition-property: all;
  403. -moz-transition-duration: 0.3s;
  404. -o-transition-duration: 0.3s;
  405. -webkit-transition-duration: 0.3s;
  406. transition-duration: 0.3s;
  407. -moz-transition-timing-function: ease-in-out;
  408. -o-transition-timing-function: ease-in-out;
  409. -webkit-transition-timing-function: ease-in-out;
  410. transition-timing-function: ease-in-out
  411. }
  412.  
  413. /* SVG */
  414. .list-menu-float .icon-menu svg.icon {
  415. position: absolute;
  416. fill: #609c54;
  417. }
  418. .list-menu-float .icon-menu:hover svg.icon {
  419. position: absolute;
  420. fill: #ffffff;
  421. }
  422.  
  423. .list-menu-float .icon-menu.profile {
  424. background-size: cover;
  425. }
  426.  
  427. .list-menu-float .icon-menu.quick-add {}
  428. .list-menu-float .icon-menu.quick-add svg.icon-quick-add {
  429. left: 13px;
  430. top: 12px;
  431. }
  432.  
  433. .list-menu-float .icon-menu.anime-list {}
  434. .list-menu-float .icon-menu.anime-list svg.icon-anime-list {
  435. left: 13px;
  436. top: 12px;
  437. }
  438.  
  439. .list-menu-float .icon-menu.manga-list {}
  440. .list-menu-float .icon-menu.manga-list svg.icon-manga-list {
  441. left: 13px;
  442. top: 12px;
  443. }
  444.  
  445. .list-menu-float .icon-menu.history {}
  446. .list-menu-float .icon-menu.history svg.icon-history {
  447. left: 13px;
  448. top: 12px;
  449. }
  450.  
  451. .list-menu-float .icon-menu.export {}
  452. .list-menu-float .icon-menu.export svg.icon-export {
  453. left: 13px;
  454. top: 12px;
  455. }
  456.  
  457. .list-menu-float .icon-menu.login {}
  458. .list-menu-float .icon-menu.login svg.icon-login {
  459. left: 13px;
  460. top: 12px;
  461. }
  462.  
  463. .list-menu-float .icon-menu.logout {}
  464. .list-menu-float .icon-menu.logout svg.icon-logout {
  465. left: 13px;
  466. top: 14px;
  467. }
  468.  
  469. .list-menu-float .icon-menu.setting {}
  470. .list-menu-float .icon-menu.setting svg.icon-setting {
  471. left: 13px;
  472. top: 13px;
  473. }
  474.  
  475. .list-menu-float .icon-menu .text {
  476. position: absolute;
  477. top: 14px;
  478. left: 50px;
  479. width: 0;
  480. display: inline-block;
  481. color: #ffffff;
  482. font-size: 1.4em;
  483. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  484. text-align: center;
  485. vertical-align: middle;
  486. overflow: hidden;
  487. white-space: nowrap;
  488. opacity: 0;
  489. -moz-transition-property: all;
  490. -o-transition-property: all;
  491. -webkit-transition-property: all;
  492. transition-property: all;
  493. -moz-transition-duration: 0.3s;
  494. -o-transition-duration: 0.3s;
  495. -webkit-transition-duration: 0.3s;
  496. transition-duration: 0.3s;
  497. -moz-transition-timing-function: ease-in-out;
  498. -o-transition-timing-function: ease-in-out;
  499. -webkit-transition-timing-function: ease-in-out;
  500. transition-timing-function: ease-in-out
  501. }
  502.  
  503. .list-menu-float .icon-menu:not(.profile):hover {
  504. background-color: #f39a40;
  505. width: 145px;
  506. }
  507.  
  508. .list-menu-float .icon-menu:hover .text {
  509. width: 94px;
  510. opacity: 1
  511. }
  512.  
  513. /* setting */
  514. .list-menu-float .icon-menu.setting .text {
  515. top: 0px;
  516. width: 0px;
  517. height: 100px;
  518. opacity: 0;
  519. -moz-transition-property: all;
  520. -o-transition-property: all;
  521. -webkit-transition-property: all;
  522. transition-property: all;
  523. -moz-transition-duration: 0.3s;
  524. -o-transition-duration: 0.3s;
  525. -webkit-transition-duration: 0.3s;
  526. transition-duration: 0.3s;
  527. -moz-transition-timing-function: ease-in-out;
  528. -o-transition-timing-function: ease-in-out;
  529. -webkit-transition-timing-function: ease-in-out;
  530. transition-timing-function: ease-in-out
  531. }
  532. .list-menu-float .icon-menu.setting:hover .text {
  533. top: 0px;
  534. width: 114px;
  535. height: 100px;
  536. opacity: 1
  537. }
  538.  
  539. .list-menu-float .icon-menu.setting .text .link-list-setting,
  540. .list-menu-float .icon-menu.setting .text .link-style-setting {
  541. display: block;
  542. opacity: 0;
  543. }
  544.  
  545. .list-menu-float .icon-menu.setting:hover .text .link-list-setting,
  546. .list-menu-float .icon-menu.setting:hover .text .link-style-setting {
  547. position: absolute;
  548. background-color: #f39a40;
  549. display: block;
  550. width: 110px;
  551. height: 50px;
  552. line-height: 50px;
  553. text-decoration: none;
  554. color: #ffffff;
  555. opacity: 1;
  556. }
  557. .list-menu-float .icon-menu.setting:hover .text .link-list-setting {
  558. top: 0px;
  559. }
  560.  
  561. .list-menu-float .icon-menu.setting:hover .text .link-style-setting {
  562. border-top: #EBEBEB 1px solid;
  563. top: 50px;
  564. }
  565.  
  566.  
  567. /**
  568. * List Container
  569. */
  570.  
  571. .list-container {
  572. position: relative;
  573. background-color: rgba(250, 189,139, 0.7);
  574. border: #5e9c57 2px solid;
  575. width: 1058px;
  576. margin-bottom: 0;
  577. margin-right: auto;
  578. margin-left: auto;
  579. text-align: left;
  580. }
  581.  
  582. /**
  583. * List Container - Cover Block
  584. */
  585. .cover-block {
  586. display: block;
  587. width: 1024px;
  588. margin: 0 auto;
  589. text-align: center;
  590. vertical-align: middle;
  591. }
  592.  
  593. .cover-block .image-container {
  594. display: table-cell;
  595. padding-top: 16px;
  596. width: 1024px;
  597. }
  598.  
  599. .cover-block .image-container.hide {
  600. display: none;
  601. }
  602.  
  603. .cover-block .image-container img {
  604. max-width: 1024px;
  605. }
  606.  
  607. /* setting icon */
  608. .cover-block .image-container .btn-list-setting {
  609. display: none;
  610. }
  611.  
  612. .cover-block .image-container:hover .btn-list-setting {
  613. display: block;
  614. position: absolute;
  615. top: 20px;
  616. right: 28px;
  617. padding: 8px;
  618. border: rgba(255,255,255,0) 1px solid;
  619. font-size: 14px;
  620. color: #ffffff;
  621. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  622. }
  623.  
  624. .cover-block .image-container .btn-list-setting:hover {
  625. position: absolute;
  626. top: 20px;
  627. right: 28px;
  628. background-color: rgba(0,0,0,0.6);
  629. padding: 8px;
  630. border: #ffffff 1px solid;
  631. -moz-box-shadow: 0 0 4px #000000;
  632. -webkit-box-shadow: 0 0 4px #000000;
  633. -o-box-shadow: 0 0 4px #000000;
  634. -ms-box-shadow: 0 0 4px #000000;
  635. box-shadow: 0 0 4px #000000;
  636. font-size: 14px;
  637. color: #ffffff;
  638. text-shadow: #323232 1px 1px 1px;
  639. }
  640.  
  641. .cover-block .image-container .btn-list-setting .fa-camera {
  642. font-size: 16px;
  643. -moz-text-shadow: #000000 1px 1px 3px;
  644. -webkit-text-shadow: #000000 1px 1px 3px;
  645. -o-text-shadow: #000000 1px 1px 3px;
  646. -ms-text-shadow: #000000 1px 1px 3px;
  647. text-shadow: #000000 1px 1px 3px;
  648. -ms-filter:"progid:DXImageTransform.Microsoft.DropShadow(color=#000000,offx=1,offy=1)";
  649. }
  650.  
  651. .cover-block .image-container .btn-list-setting .icon-plus-circle {
  652. position: absolute;
  653. top: 4px;
  654. left: 18px;
  655. background-color: rgba(0,0,0,0.6);
  656. border-radius: 50%;
  657. -moz-box-shadow: -1px 1px 0px 0px #323232;
  658. -webkit-box-shadow: -1px 1px 0px 0px #323232;
  659. -o-box-shadow: -1px 1px 0px 0px #323232;
  660. -ms-box-shadow: -1px 1px 0px 0px #323232;
  661. box-shadow: -1px 1px 0px 0px #323232;
  662. font-size: 10px;
  663. }
  664.  
  665. .cover-block .image-container .btn-list-setting .text {
  666. display: none;
  667. }
  668.  
  669. .cover-block .image-container .btn-list-setting:hover .text {
  670. display: inline-block;;
  671. margin-left: 4px;
  672. }
  673.  
  674.  
  675. /**
  676. * List Container - Status Menu
  677. */
  678. .status-menu-container {
  679. width: 1058px;
  680. height: 46px;
  681. background-color: #5e9c57;
  682. border-bottom: #EBEBEB 0px solid;
  683. z-index: 1
  684. }
  685.  
  686. .status-menu-container.fixed {
  687. position: fixed;
  688. display: block;
  689. top: 0;
  690. }
  691.  
  692. .status-menu-container.fixed + div.list-block {
  693. margin-top: 62px;
  694. }
  695.  
  696. .status-menu-container .status-menu {
  697. display: table;
  698. margin: 0 auto;
  699. border-collapse: separate;
  700. border-spacing: 40px 0;
  701. }
  702.  
  703. .status-menu-container .status-menu .status-button {
  704. position: relative;
  705. display: table-cell;
  706. padding: 12px 0;
  707. margin: 0;
  708. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  709. text-align: center;
  710. vertical-align: middle;
  711. font-size: 1.6em;
  712. color: #ffffff;
  713. }
  714.  
  715. .status-menu-container .status-menu .status-button.on {
  716. color: #f39a40;
  717. font-weight: bold;
  718. }
  719.  
  720. .status-menu-container .status-menu .status-button:after {
  721. position: absolute;
  722. bottom: 0px;
  723. left: 0px;
  724. background-color: #f39a40;
  725. display: block;
  726. width: 100%;
  727. height: 4px;
  728. content: '';
  729. opacity: 0;
  730. -moz-transition-property: all;
  731. -o-transition-property: all;
  732. -webkit-transition-property: all;
  733. transition-property: all;
  734. -moz-transition-duration: 0.3s;
  735. -o-transition-duration: 0.3s;
  736. -webkit-transition-duration: 0.3s;
  737. transition-duration: 0.3s;
  738. -moz-transition-timing-function: ease-in-out;
  739. -o-transition-timing-function: ease-in-out;
  740. -webkit-transition-timing-function: ease-in-out;
  741. transition-timing-function: ease-in-out;
  742. }
  743.  
  744. .status-menu-container .status-menu .status-button.on:after, .status-menu .status-button:hover:after {
  745. opacity: 1
  746. }
  747.  
  748.  
  749. /**
  750. * List Container - Status Menu - Search
  751. */
  752. .status-menu-container .search-container {
  753. position: absolute;
  754. right: 18px;
  755. }
  756. .status-menu-container .search-container #search-button {
  757. display: inline-block;
  758. height: 22px;
  759. margin-top: 15px;
  760. color: #f39a40;
  761. font-size: 1.6em;
  762. vertical-align: middle;
  763. }
  764.  
  765. .status-menu-container .search-container #search-box {
  766. display: inline-block;
  767. width: 0;
  768. height: 22px;
  769. overflow: hidden;
  770. margin-top: 13px;
  771. -webkit-transition: width 0.3s;
  772. -moz-transition: width 0.3s;
  773. transition: width 0.3s;
  774. -webkit-backface-visibility: hidden;
  775. vertical-align: middle;
  776. }
  777.  
  778. .status-menu-container .search-container #search-box.open {
  779. display: inline-block;
  780. width: 100px;
  781. }
  782.  
  783. .status-menu-container .search-container #search-box input {
  784. width: 100%;
  785. height: 100%;
  786. box-sizing: border-box;
  787. }
  788.  
  789.  
  790. /**
  791. * List Container - List Block
  792. */
  793. .list-block {
  794. margin-top: 16px;
  795. min-height: 600px;
  796. padding: 0
  797. }
  798.  
  799. .list-unit {
  800. display: block;
  801. margin: 0 auto;
  802. width: 1024px
  803. }
  804.  
  805. /**
  806. * List Container - List Status Title (with Stats)
  807. */
  808. .list-unit .list-status-title {
  809. position: relative;
  810. display: table;
  811. background-color: #f39a40;
  812. width: 1024px;
  813. height: 38px
  814. }
  815.  
  816. .list-unit .list-status-title .text {
  817. display: table-cell;
  818. width: 1024px;
  819. height: 38px;
  820. font-size: 2.0em;
  821. color: #FFF;
  822. font-weight: bold;
  823. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  824. text-align: center;
  825. vertical-align: middle
  826. }
  827.  
  828. .list-unit .list-status-title .stats {
  829. position: absolute;
  830. height: 38px;
  831. line-height: 38px;
  832. right: 4px;
  833. }
  834.  
  835. .list-unit .list-status-title .stats a {
  836. margin-right: 8px;
  837. color: #FFF;
  838. }
  839.  
  840. .list-unit .list-status-title .stats a.filterd {
  841. text-shadow: 0px 0px 2px #FFF;
  842. }
  843.  
  844. .list-unit .list-stats {
  845. display: none;
  846. background-color: #5e9c57;
  847. width: 1024px;
  848. height: 30px;
  849. line-height: 30px;
  850. color: #000000;
  851. text-align: center;
  852. }
  853.  
  854.  
  855. /**
  856. * List Container - List Table
  857. */
  858.  
  859. .list-table {
  860. width: 100%;
  861. margin: 0 auto;
  862. border-collapse: collapse;
  863. border: #f39a40 1px solid;
  864. }
  865.  
  866. .list-table > tbody:nth-of-type(2n+1) {
  867. background-color: rgba(250, 198, 139, 0.7);
  868. }
  869.  
  870.  
  871. /**
  872. * List Container - List Table - Header
  873. */
  874.  
  875. .list-table .list-table-header .header-title {
  876. background: rgba(250, 198, 139, 0.4); url("/img/pc/ownlist/bar-table-header.png") no-repeat right 7px / 1px 22px;
  877. display: table-cell;
  878. border-bottom: #f39a40 1px solid;
  879. height: 36px;
  880. text-align: center;
  881. vertical-align: middle;
  882. }
  883.  
  884. .list-table .list-table-header .header-title:last-child {
  885. background-image: none;
  886. }
  887.  
  888. .list-table .list-table-header .header-title.status {
  889. background-image: none;
  890. width: 4px
  891. }
  892.  
  893. .list-table .list-table-header .header-title.number {
  894. width: 30px
  895. }
  896.  
  897. .list-table .list-table-header .header-title.image {
  898. width: 66px
  899. }
  900.  
  901. .list-table .list-table-header .header-title.title {
  902. padding-left: 8px;
  903. text-align: left
  904. }
  905.  
  906. .list-table .list-table-header .header-title.score {
  907. width: 65px
  908. }
  909.  
  910. .list-table .list-table-header .header-title.type {
  911. width: 60px
  912. }
  913.  
  914. .list-table .list-table-header .header-title.progress {
  915. width: 90px
  916. }
  917.  
  918. .list-table .list-table-header .header-title.chapters {
  919. width: 90px
  920. }
  921.  
  922. .list-table .list-table-header .header-title.volumes {
  923. width: 90px
  924. }
  925.  
  926. .list-table .list-table-header .header-title.tags {
  927. width: 120px
  928. }
  929.  
  930. .list-table .list-table-header .header-title.rated {
  931. width: 70px
  932. }
  933.  
  934. .list-table .list-table-header .header-title.started {
  935. width: 110px
  936. }
  937.  
  938. .list-table .list-table-header .header-title.finished {
  939. width: 110px
  940. }
  941.  
  942. .list-table .list-table-header .header-title.days {
  943. width: 45px
  944. }
  945.  
  946. .list-table .list-table-header .header-title.storage {
  947. width: 75px
  948. }
  949.  
  950. .list-table .list-table-header .header-title.retail {
  951. width: 65px
  952. }
  953.  
  954. .list-table .list-table-header .header-title.priority {
  955. width: 70px
  956. }
  957.  
  958. .list-table .list-table-header .header-title .link {
  959. font-size: 11px;
  960. color: #323232;
  961. text-decoration: none
  962. }
  963.  
  964. .list-table .list-table-header .header-title .link.sort {
  965. position: relative;
  966. display: inline-block;
  967. color: #323232;
  968. white-space: nowrap;
  969. -moz-transition-property: all;
  970. -o-transition-property: all;
  971. -webkit-transition-property: all;
  972. transition-property: all;
  973. -moz-transition-duration: 0.3s;
  974. -o-transition-duration: 0.3s;
  975. -webkit-transition-duration: 0.3s;
  976. transition-duration: 0.3s;
  977. -moz-transition-timing-function: ease-in-out;
  978. -o-transition-timing-function: ease-in-out;
  979. -webkit-transition-timing-function: ease-in-out;
  980. transition-timing-function: ease-in-out
  981. }
  982.  
  983. .list-table .list-table-header .header-title .link.sort:hover {
  984. color: #000000
  985. }
  986.  
  987. .list-table .list-table-header .header-title .sort-icon {
  988. color: #1d439b;
  989. }
  990.  
  991.  
  992. /**
  993. * List Container - List Table - Items
  994. */
  995.  
  996. .list-table .list-table-data .data {
  997. display: table-cell;
  998. padding: 4px 0;
  999. text-align: center;
  1000. vertical-align: middle;
  1001. border-bottom: rgba(255, 255, 255, 0.3); 1px solid
  1002. }
  1003.  
  1004. .list-table .list-table-data a:not(.edit-disabled):hover {
  1005. text-decoration: underline;
  1006. }
  1007.  
  1008. .list-table .list-table-data a.edit-disabled {
  1009. cursor: text;
  1010. color: black;
  1011. }
  1012.  
  1013. .list-table .list-table-data .tags .edit {
  1014. display: block;
  1015. width: 100%;
  1016. text-align: center;
  1017. color: #2db039;
  1018. font-size: 10px;
  1019. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  1020. }
  1021.  
  1022. .list-table .list-table-data .tags .edit:hover {
  1023. color: green !important;
  1024. }
  1025.  
  1026. .list-table .list-table-data .tags textarea {
  1027. box-sizing: border-box;
  1028. width: 100%;
  1029. height: 60px;
  1030. }
  1031.  
  1032. .list-table .list-table-data .data.image a {
  1033. display: inline-block;
  1034. }
  1035. .list-table .list-table-data .data.image .image {
  1036. width: 48px;
  1037. height: 68px;
  1038. border: #EBEBEB 1px solid
  1039. }
  1040.  
  1041. .list-table .list-table-data .data.title {
  1042. padding-left: 8px;
  1043. text-align: left;
  1044. word-wrap: break-word
  1045. }
  1046.  
  1047. .list-table .list-table-data .data.title .link {
  1048. font-size: 1.1em;
  1049. font-weight: bold
  1050. }
  1051.  
  1052. .list-table .list-table-data .data.title .rewatching, .list-table .list-table-data .data.title .rereading, .list-table .list-table-data .data.title .content-status {
  1053. color: #5e9c57;
  1054. font-size: 0.9em
  1055. }
  1056.  
  1057. .list-table .list-table-data .data.score .link {
  1058. color: #5e9c57;
  1059. font-size: 1.1em;
  1060. font-weight: bold
  1061. }
  1062.  
  1063. .list-table .list-table-data .data.title .add-edit-more {
  1064. float: right;
  1065. margin-right: 10px;
  1066. font-size: 0.9em;
  1067. }
  1068.  
  1069. .list-table .list-table-data .data.title .more {
  1070. position: relative;
  1071. }
  1072.  
  1073. .list-table .more-info {
  1074. display: none;
  1075. border-bottom: #EBEBEB 1px solid;
  1076. }
  1077.  
  1078. .list-table .more-info .more-content {
  1079. padding: 10px;
  1080. }
  1081.  
  1082. .list-table .list-table-data .data.tags {
  1083. word-wrap: break-word
  1084. }
  1085.  
  1086. .list-table .list-table-data .data.status {
  1087. width: 4px
  1088. }
  1089.  
  1090. .list-table .list-table-data .data.status .text {
  1091. display: none
  1092. }
  1093.  
  1094. .list-table .list-table-data .data.status.reading, .list-table .list-table-data .data.status.watching {
  1095. background-color: #2db039
  1096. }
  1097.  
  1098. .list-table .list-table-data .data.status.plantoread, .list-table .list-table-data .data.status.plantowatch {
  1099. background-color: #c3c3c3
  1100. }
  1101.  
  1102. .list-table .list-table-data .data.status.completed {
  1103. background-color: #26448f
  1104. }
  1105.  
  1106. .list-table .list-table-data .data.status.onhold {
  1107. background-color: #f1c83e
  1108. }
  1109.  
  1110. .list-table .list-table-data .data.status.dropped {
  1111. background-color: #a12f31
  1112. }
  1113.  
  1114. .list-table .list-table-data .data.title {
  1115. padding-left: 8px;
  1116. text-align: left
  1117. }
  1118.  
  1119. .list-unit .loading-space {
  1120. margin: 8px;
  1121. height: 20px;
  1122. font-size: 20px;
  1123. text-align: center;
  1124. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement