New
This topic has been locked and is no longer available for discussion.
Jan 29, 2021 10:11 PM
#351
lil_glizzy22 said: Shishio-kun said: lil_glizzy22 said: Shishio-kun said: lil_glizzy22 said: hiiii, so in my layout there should be 6 images of the animes on each row butttttt theres only 5. i also tried other layouts similar to this but it kept happening. idk what to do and thank you if you can help!! I don't see any problem? Do you have a screenshot or can you link the page? Oh wait, what is your screensize? Are you on a laptop? That may be why Make sure your browser isn't zoomed out too, use CTRL key and the + and - keys to set it back to 100% ahh yeah im on a laptop sorry!! could i still fit in 6 or no? Can you tell us your screen size and/or can we see a screenshot of your page? Yeah sure here!! https://imgur.com/7uBzo4N OK try adding these codes to the bottom to spread the table, but you might need to change the numbers .list-unit { width: 1400px; } .list-unit .list-status-title { width: 1400px;} |
Jan 29, 2021 10:14 PM
#352
Might need something like this too .list-container { left: -200px;} |
Feb 4, 2021 10:04 AM
#353
hello, as wondering if someone could help me.So basically my problem is whenever i'm in the css page, my custom anime list looks fine but when i go to my profile then my anime list the privacy logo in the bottom right corner is bigger than normal wich is annoying. Please help. code lines: /* Endless Summer Layout by Cateinya Thanks to Doomcat55 (covers generator), BurntJelly (genres, synopsis generator), and Shishio-kun (edits). */ /* GENERATED STUFF */ /* generated cover */ @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore"; /* generated informations (copy your generated CSS below) */ /* COVER AREA The area taken up by covers. */ .list-block { /* variables used in calc (explicit names) */ --height-img: 250px !important; --width-img: 178px !important; } /* HD COVER SIZE The size of covers seen. */ .data.image a:before{ background-size: cover !important; height: 250px !important; width: 178px !important; background-position: center center !important; } /* LOW RES COVER SIZE You only see this if the import for high res covers goes down. */ a img{ background-size: cover !important; height: 250px !important; width: 178px !important;; } /* CHARACTER */ body:after{ background-color: transparent !important; background-image: url(https://i.imgur.com/CDRzNlr.png) !important; background-position: center top; background-repeat: no-repeat; background-size: contain; content: ""; height: 100%; left: -38%; position: fixed; top: 0; width: 90%; z-index: -1; } /* CHARACTER 2 */ .header .header-title:after{ background-color: transparent !important; background-image: url(https://i.imgur.com/YDFVUd1.png) !important; background-position: center top; background-repeat: no-repeat; background-size: contain; content: ""; height: 100%; right: -38%; position: fixed; top: 0; width: 100%; z-index: -1; } /* BACKGROUND */ body:before { background-color: #9492C8; background-image: url(https://imgur.com/TxsUvEd.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; content: ""; filter: blur(1px); height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: -2; } /* LINKS */ a { color: black; text-decoration: none !important; } /* HEADER */ .header { margin-bottom: 200px; } .header .header-title { background-image: url("/img/pc/ownlist/logo_mal.png"); } .header .header-menu .btn-menu, .header .header-menu .btn-menu a, .header .header-menu .header-info, .header .header-menu .header-info a { color: white !important; } .header .header-menu .list-menu { /* link to other list */ background-color: rgba(0,0,0,0.5); border: none; border-radius: 25px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } .header .header-menu .list-menu:hover { background-color: rgba(0,0,0,0.7); } .header .header-menu .list-menu .icon-menu { background: transparent !important; color: white !important; } /* LIST MENU */ @media screen and (max-width: 1060px) { /* absolute position for small screen */ .list-menu-float { left: 530px !important; } } .list-menu-float { background: rgba(0,0,0,0.5); border: none; border-radius: 25px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); height:50px; left: 50%; margin-left: -25px; margin-top: 30px; opacity: 0.5; position: absolute; top: 0; transition: all 0.2s ease 0s; width: 50px; } body[data-owner="1"] .list-menu-float:hover { /* larger when viewer is owner (setting buttons) */ margin-left: -225px; width: 450px; } .list-menu-float:hover { margin-left: -175px; opacity: 1; width: 350px; } .list-menu-float:before { /* used for wave effect on hover */ border-radius: 50%; box-shadow: 0px 0px 50px 10px rgba(0, 0, 0, 0.75); content: ""; height: 50px; margin-left: -25px; opacity: 0; position: absolute; top: 0; transition: all 0.2s; width: 50px; } .list-menu-float::after { /* fix for hover effect when picture becomes smaller */ border-radius: 50%; content: ""; height: 75px; margin-left: -37.5px; position: absolute; width: 75px; margin-top: -12.5px; } .list-menu-float:hover:before { animation-name: buttonAnimation; animation-duration: 0.2s; animation-timing-function: linear; animation-iteration-count: 1; } @keyframes buttonAnimation { /* wave animation */ 0% { opacity:1; transform:scale(1)} 100% { opacity:0; transform:scale(2); } } .list-menu-float .icon-menu.profile { transform: scale(1.5) translate3d(0px,0px,0px); -moz-backface-visibility: hidden; /* with translate3d above, fix for firefox shaking behaviour */ z-index: 2; } .list-menu-float:hover .icon-menu.profile { transform:scale(1) translate3d(0px,0px,0px); -moz-backface-visibility: hidden; } .list-menu-float .icon-menu, .list-menu-float form { /* All list menu buttons */ border-radius: 25px; display: inline-block; left: 50%; margin-left: -25px; position: absolute; top: 0; transition: all 0.2s ease 0s; width: 50px !important; z-index: 1; } .list-menu-float .icon-menu:not(.profile), .list-menu-float form { background: transparent !important; } .list-menu-float .icon-menu:not(.profile):hover, .list-menu-float form:hover { background: rgba(0,0,0,0.5) !important; } /* buttons positions */ .list-menu-float:hover .icon-menu:nth-child(2) { margin-left: -175px; } .list-menu-float:hover .icon-menu:nth-child(3) { margin-left: -125px; } .list-menu-float:hover .icon-menu:nth-child(4) { margin-left: -75px; } .list-menu-float:hover .icon-menu:nth-child(5) { margin-left: 25px; } .list-menu-float:hover .icon-menu:nth-child(6), .list-menu-float:hover form:nth-child(6) { margin-left: 75px; } .list-menu-float:hover form:nth-child(7) { margin-left: 125px; } .list-menu-float:hover .icon-menu:nth-child(8) { margin-left: 175px; } .list-menu-float .icon-menu .text { /* text display on button hover */ color: black; left: 50%; margin-left: -50px; margin-top: 55px; pointer-events: none; position: absolute; top: 0; transition: none; width: 100px !important; } .icon{ /* All list menu icons */ fill: white !important; } .icon-logout { left: 15px !important; top: 16px !important; } .list-menu-float .icon-menu.setting .text { /* setting button (owner only) */ height: 110px !important; margin-top: 45px; overflow: visible; padding-top: 10px; visibility: hidden; width: 115px !important; } .list-menu-float .icon-menu.setting:hover .text { pointer-events: all; visibility: visible; } .list-menu-float .icon-menu.setting .text a { background: rgba(0,0,0,0.5) !important; border: none !important; border-radius: 25px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } .list-menu-float .icon-menu.setting .text a:first-child { top: 10px !important; } .list-menu-float .icon-menu.setting .text a:last-child { top: 65px !important; } .list-menu-float .icon-menu.setting .text a:hover { background: rgba(0,0,0,0.7) !important; } /* LIST CONTAINER */ #list-container { background-color: transparent !important; border: none; } /* IMAGE BLOCK */ .cover-block { display: none; } /* STATUS MENU */ #status-menu { /* box with overflow:hidden for semicircle */ background: transparent; border-bottom: none; height: 16em; left: 50%; margin-left: -16em; margin-top: -16em; overflow: hidden; pointer-events: none; position: absolute; width: 32em; } #status-menu:after { /* button used to display menu on hover */ background: rgba(0,0,0,0.5); border-radius: 60px 60px 0 0; bottom: 0; color: white; content:"\f0c9"; font-family: FontAwesome; font-size: 1.5em; height: 30px; left: 50%; line-height: 35px; margin-left: -30px; pointer-events: all; position:absolute; text-align: center; transition-delay: 0.35s; width: 60px; } #status-menu:hover:after { background: rgba(0,0,0,0.9); transition-delay: 0s; } .status-menu { /* category menu */ background: rgba(0,0,0,0.5) !important; border-radius: 50%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); height: 26em; left: 50%; margin-left: -13em !important; margin-top: -13em !important; pointer-events: all; position: absolute; top: 100%; transform: scale(0.1); transition: all .3s ease; visibility: hidden; width: 26em; } #status-menu:hover .status-menu { transform: scale(1); visibility: visible; } .status-menu .status-button { /* category button */ color: rgba(0, 0, 0, 0) !important; position: absolute !important; font-size: 1.5em !important; width: 10em; height: 10em; transform-origin: 100% 100%; overflow: hidden; left: 0; margin-top: -1.3em !important; margin-left: -1.31em !important; padding: 0 !important; pointer-events: none; } .status-menu .status-button:before { /* category text on hover */ bottom: -8.25em !important; color: black; height: 15.5em !important; left: 1.19em !important; margin-bottom: 1.2em; position: absolute !important; transform: skew(-60deg) rotate(-75deg) scale(1); visibility: hidden; width: 15.5em !important; } .status-menu .status-button:hover:before { visibility: visible; } .status-menu .status-button:after { /* category icon */ background: transparent !important; border-radius: 50%; bottom: -7.25em !important; color: white; font-family: FontAwesome; font-size: 1.18em; height: 14.5em !important; left: 1.19em !important; line-height: 5em; opacity: 1 !important; pointer-events: all; transform: skew(-60deg) rotate(-75deg) scale(1); transition: none !important; width: 14.5em !important; } .status-menu .status-button.on:after, .status-menu .status-button:hover:after { background: rgba(0,0,0,0.5) !important; } .status-menu .status-button:first-child {transform: rotate(0deg) skew(60deg);} .status-menu .status-button:nth-child(2) {transform: rotate(30deg) skew(60deg);} .status-menu .status-button:nth-child(3) {transform: rotate(60deg) skew(60deg)} .status-menu .status-button:nth-child(4) {transform: rotate(90deg) skew(60deg);} .status-menu .status-button:nth-child(5) {transform: rotate(120deg) skew(60deg);} .status-menu .status-button:nth-child(6) {transform: rotate(150deg) skew(60deg);} .status-menu .status-button:first-child:before { content: "All entries"; } .status-menu .status-button:first-child:after { content: "\f03a"; } .status-menu .status-button:nth-child(2):before { content: "Ongoing"; } .status-menu .status-button:nth-child(2):after { content: "\f06e"; } .status-menu .status-button:nth-child(3):before { content: "Completed"; } .status-menu .status-button:nth-child(3):after { content: "\f00c"; } .status-menu .status-button:nth-child(4):before { content: "On hold"; } .status-menu .status-button:nth-child(4):after { content: "\f253"; } .status-menu .status-button:nth-child(5):before { content: "Dropped"; } .status-menu .status-button:nth-child(5):after { content: "\f00d"; } .status-menu .status-button:nth-child(6):before { content: "Planned"; } .status-menu .status-button:nth-child(6):after { content: "\f073"; } /* SEARCH */ .status-menu-container .search-container { display: none; } /* STATUS TITLE */ .list-unit .list-status-title { background: rgba(0,0,0,0.5); border-radius: 70px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); font-size: 2em; padding: 40px 0 40px 0; z-index: 1; } .list-unit .list-status-title .text, .list-unit .list-status-title .stats a { color: white !important; } /* STATS */ .stats { line-height: 2em !important; } .list-unit .list-stats { /* Stat bar */ background-color: transparent; color: white !important; height: 30px !important; margin-top: -35px !important; position: absolute; z-index: 1; } /* FILTER */ #advanced-options { /* fix for window out of screen*/ position: fixed; } /* LIST TABLE */ .status-menu-container.fixed + div.list-block { margin-top: 0px !important; } .list-block { /* variables used in calc (explicit names) */ --height-img: 250px; --height-info: 130px; --margin-left-bg-std: calc( var(--padding-h-img) + var(--width-img) + 10px ); --margin-left-bg-last-in-row: calc(-1 * ( var(--width-info) + var(--padding-h-img) ) + 10px ); --padding-h-img: 13px; --padding-v-img: 7px; --width-img: 178px; --width-info: 400px; padding-bottom: 200px; margin: 0 auto; } .list-table { border: none; } /* Sort row */ .list-table > tbody:first-child { background-color: transparent; display: block; margin-bottom: 50px; margin-top: 50px; } .list-table .list-table-header { display: table; text-align: center; width: 100%; } .list-table .list-table-header .header-title:not(.title):not(.score):not(.type):not(.progress):not(.chapters):not(.volumes):not(.rated) { /* hide not sortable headers */ display: none; } .list-table .list-table-header .header-title { background: transparent; border-bottom: none; display: inline-block; margin: 0 20px 0 20px; } .list-table .list-table-header .header-title .link { background: rgba(0,0,0,0.5); border-radius: 20px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: white !important; padding: 10px !important; text-align: center; transition: all 0.2s ease 0s !important; } .list-table .list-table-header .header-title .link:hover { background: rgba(0,0,0,0.7); } .list-table .list-table-header .header-title .link .sort-icon { color: white; } /* Data rows */ .list-table tbody.list-item { background: transparent; border: none; float: left; margin: var(--padding-v-img) var(--padding-h-img) var(--padding-v-img) var(--padding-h-img); width: var(--width-img); } .list-table .list-table-data .data a, .list-table .list-table-data a:hover:not(.edit-disabled) { /* remove color conflicts with default themes */ color: unset !important; } .data, .more-info { --margin-left-data-std: calc( var(--padding-h-img) + var(--margin-left-data-adjusted) ); --margin-left-data-last-in-row: calc(-1 * ( var(--width-img) + var(--width-info) + var(--padding-h-img) ) + var(--margin-left-data-adjusted) ); --margin-left-data-adjusted: 0px; border: none !important; color: black; } .data:not(.image), .more-info { /* All data cells hidden*/ position: absolute; visibility: hidden; } .list-item:hover .data.title, .list-item:hover .data.title:after, .list-item:hover .data.score, .list-item:hover .data.progress, .list-item:hover .data.chapter, .list-item:hover .data.volume, .list-item:hover .more-info { /* visible when cover hovered */ visibility: visible; } .data.status { display: none !important; } /* categories colors */ .data.status.watching ~ .data:nth-of-type(n+4):first-letter, .data.status.watching ~ .data.score .link, .data.status.watching ~ .data.progress .link, .data.status.reading ~ .data:nth-of-type(n+4):first-letter, .data.status.reading ~ .data.score .link, .data.status.reading ~ .data.chapter .link, .data.status.reading ~ .data.volume .link { color: #00FF3C !important; font-weight: bold; } .data.status.watching ~ .data.title .link, .data.status.reading ~ .data.title .link { background: #00FF3C; border-bottom: 15px solid #00FF3C; } .data.status.watching ~ .data.title .link:before, .data.status.reading ~ .data.title .link:before { border-bottom-color: #697700; border-right-color: #697700; } .data.status.watching ~ .data.title .link:after, .data.status.reading ~ .data.title .link:after { border-right-color: #00FF3C; border-top-color: #00FF3C; } .data.status.completed ~ .data:nth-of-type(n+5):first-letter, .data.status.completed ~ .data.score .link, .data.status.completed ~ .data.progress .link, .data.status.completed ~ .data.progress span:first-child, .data.status.completed ~ .data.chapter .link, .data.status.completed ~ .data.chapter span:first-child, .data.status.completed ~ .data.volume .link, .data.status.completed ~ .data.volume span:first-child { color: #1BBCDB !important; font-weight: bold; } .data.status.completed ~ .data.title .link { background: #1BBCDB; border-bottom: 15px solid #1BBCDB; } .data.status.completed ~ .data.title .link:before { border-bottom-color: #027B91; border-right-color: #027B91; } .data.status.completed ~ .data.title .link:after { border-right-color: #027B91; border-top-color: #027B91; } .data.status.onhold ~ .data:nth-of-type(n+5):first-letter, .data.status.onhold ~ .data.score .link, .data.status.onhold ~ .data.progress .link, .data.status.onhold ~ .data.chapter .link, .data.status.onhold ~ .data.volume .link { color: #FA882D !important; font-weight: bold; } .data.status.onhold ~ .data.title .link { background: #FA882D; border-bottom: 15px solid #FA882D; } .data.status.onhold ~ .data.title .link:before { border-bottom-color: #AB4C00; border-right-color: #AB4C00; } .data.status.onhold ~ .data.title .link:after { border-right-color: #AB4C00; border-top-color: #AB4C00; } .data.status.dropped ~ .data:nth-of-type(n+5):first-letter, .data.status.dropped ~ .data.score .link, .data.status.dropped ~ .data.progress .link, .data.status.dropped ~ .data.chapter .link, .data.status.dropped ~ .data.volume .link { color: #800000 !important; font-weight: bold; } .data.status.dropped ~ .data.title .link { background: #800000; border-bottom: 15px solid #800000; } .data.status.dropped ~ .data.title .link:before { border-bottom-color: #654203; border-right-color: #654203; } .data.status.dropped ~ .data.title .link:after { border-right-color: #654203; border-top-color: #654203; } .data.status.plantowatch ~ .data:nth-of-type(n+5):first-letter, .data.status.plantowatch ~ .data.score .link, .data.status.plantowatch ~ .data.progress .link, .data.status.plantoread ~ .data:nth-of-type(n+5):first-letter, .data.status.plantoread ~ .data.score .link, .data.status.plantoread ~ .data.chapter .link, .data.status.plantoread ~ .data.volume .link { color: #707375 !important; font-weight: bold; } .data.status.plantowatch ~ .data.title .link, .data.status.plantoread ~ .data.title .link { background: #707375; border-bottom: 15px solid #707375; } .data.status.plantowatch ~ .data.title .link:before, .data.status.plantoread ~ .data.title .link:before { border-bottom-color: #BE9511; border-right-color: #BE9511; } .data.status.plantowatch ~ .data.title .link:after, .data.status.plantoread ~ .data.title .link:after { border-right-color: #BE9511; border-top-color: #BE9511; } /* not displayed data */ .data.number, .data.image .image, .data.title .icon-watch, .data.progress .icon-add-episode, .data.chapter .icon-add-chapter, .data.volume .icon-add-volume, .list-table .list-table-data .tags .edit, .data.started, .data.finished, .data.days, .data.airing-started, .data.airing-finished, .data.storage, .data.retail, .data.priority { display: none !important; } /* default position */ .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume) { margin-left: var(--margin-left-data-std); z-index: 1; } /* information on the left (end of line) */ .list-item:nth-of-type(5n) .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume), .list-item:nth-of-type(5n + 1) .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume) { margin-left: var(--margin-left-data-last-in-row); } .data.image { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); height: var(--height-img); overflow: hidden; padding: 0 !important; pointer-events: none; width: var(--width-img); } .data.image a { height: 100%; left: 0px; position: relative; top: 0px; width: 100%; } .data.image a:before { /* anime cover (generated) */ background-position: center center; background-size: cover; content:""; display: block; height: 100%; transition: all 0.2s; width: 100%; } .list-item:hover .data.image a:before { transform: scale(1.2); } .data.title { height: 90px; margin-left: calc(var(--width-img) * -1 - 10px); margin-top: calc(var(--height-img) - 90px); padding: 0 !important; width: calc(var(--width-img) + 10px); } .data.title .link { /* Anime title */ background: #FD3E48; border-bottom: 15px solid #FD3E48; bottom: 0; box-sizing: border-box; color: black; font-size: 1.2em; font-weight: normal !important; margin-bottom: 0; max-height: 85px; padding: 2px 3px 2px 3px !important; position: absolute; text-align: center !important; transition: margin-bottom 0.2s ease 0s; width: 100%; } .data.title .link:before { border: 5px solid; border-top-color: transparent; border-right-color: #B71C1C; border-bottom-color: #B71C1C; border-left-color: transparent; content: ""; height: 0; left: 0; width: 0; margin-top: -10px; position: absolute; top: 0; } .data.title .link:after { border: 5px solid; bottom: 0; border-top-color: #B71C1C; border-right-color: #B71C1C; border-bottom-color: transparent; border-left-color: transparent; content: ""; height: 0; left: 0; margin-bottom: -25px; width: 0; position: absolute; visibility: hidden; } .data.title:hover .link, .data.title:hover .rewatching, .data.title:hover .content-status { margin-bottom: 20px; } .data.title:hover .link:before { visibility: hidden; } .data.title:hover .link:after { visibility: visible; transition-delay: 0.1s; } .data.title:after { bottom: 0; content: "\f0c9"; color: white; font-family: FontAwesome; height: 20px; line-height: 20px; pointer-events: none; position: absolute; right: 0; text-align: center; transition: margin-bottom 0.2s ease 0s, transform 0.2s ease 0s; width: 20px; } .data.title:hover:after { margin-bottom: 20px; transform: rotateZ(180deg) scale(1.5); } .data.title:hover ~ .data { visibility: visible !important; } .data.title .rewatching, .data.title .content-status { bottom: 0; color: black !important; font-size: 1em !important; position: absolute; text-align: center !important; transition: margin-bottom 0.2s ease 0s; width: 100%; } .add-edit-more { background-color: rgba(0,0,0,0.7); bottom: 0; color: white; display: block; height: 0px; margin-right: 0 !important; overflow: hidden; position: absolute; right: 0; text-align: center; transition: all 0.2s ease 0s; width: var(--width-img); } .data.title:hover .add-edit-more { height: 20px; } .add-edit-more a { color: white; } .data.score { background: #333333; border-radius: 50%; font-size: 1.5em; height: 35px; line-height: 35px; margin-left: -40px; margin-top: 5px; padding: 0 !important; text-align: center !important; width: 35px; } .data.score .edit-transition { background: rgba(0,0,0,0.7); color: white; float: left; margin-top:7px; width: 35px; } .data.type:before { content:"Type:"; } .data.type { --margin-left-data-adjusted: 200px; margin-top: 60px; z-index: 2 !important; } /* different place for manga version */ body.manga .data.type { --margin-left-data-adjusted: 10px; margin-top: 65px; } .data.progress, .data.chapter, .data.volume { font-size: 1.5em; margin-left: calc( -1 * var(--width-img) + 5px ); margin-top: 5px; padding: 0 !important; text-align: center !important; } .data.volume { margin-top: 45px; } .data.progress span:first-child, .data.chapter span:first-child, .data.volume span:first-child { background: #333333; border-radius: 50%; float: left; height: 35px; line-height: 35px; overflow: hidden; position: relative; width: 35px; } .data.status:not(.completed) ~ .data.progress span:first-child, .data.status:not(.completed) ~ .data.chapter span:first-child, .data.status:not(.completed) ~ .data.volume span:first-child { font-size: 0px; } .data.progress span:first-child a, .data.chapter span:first-child a, .data.volume span:first-child a { display: table; font-size: 16.5px; width: 100%; } .data.progress span:first-child input, .data.chapter span:first-child input, .data.volume span:first-child input { background: transparent; border: none; color: white; float: left; margin-top:7px; text-align: center; width: 35px; } .data.progress span:nth-of-type(2), .data.chapter span:nth-of-type(2), .data.volume span:nth-of-type(2) { background: #BBBBBB; border-radius: 0 18px 18px 0; float: left; line-height: 35px; margin-left: -17px; min-width: 15px; padding-left: 19px; padding-right: 5px; } .data.tags { /* white background behind informations */ background-color: rgba(255,255,255,0.9); border-radius: 5px 5px 0px 0px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); height: auto; min-height: 128px; padding: 0px !important; position: absolute; visibility: hidden; width: var(--width-info); } .data.tags > div { margin-bottom: 28px; margin-top: 100px; padding: 0px 5px 0px 5px; } .data.tags > div > span:first-child:before { border-bottom: 1px solid black; content: "Tags:"; display: block; left: 0; margin-bottom: 5px; padding: 5px; text-align: left; width: calc(var(--width-info) - 20px); z-index: 1; } .data.tags:before { /* anime title (generated) */ content: "Anime information"; font-size: 1.5em; height: 30px; left: 0; overflow: hidden; position: absolute; padding: 5px; width: calc(var(--width-info) - 10px); } .data.tags:after { /* anime genres (generated) */ border-bottom: 1px solid black; content:""; left: 0; margin-top: 35px; overflow: hidden; padding: 5px 5px 3px 5px; position: absolute; text-overflow: ellipsis; top: 0; white-space: nowrap; width: calc(var(--width-info) - 10px); } .data.tags > div:before { border-bottom: 1px solid black; content: "Synopsis:"; left: 0; position: absolute; margin-left: 5px; margin-top: -28px; padding: 5px; text-align: left; top: 100%; width: calc(var(--width-info) - 20px); z-index: 1; } .data.tags > div:after { /* anime synopsis (generated) */ background-color: rgba(255,255,255,0.9); border-radius: 0px 0px 5px 5px; box-shadow: 0 5px 4px 0 rgba(0, 0, 0, 0.2), 0 20px 5px 0 rgba(0, 0, 0, 0.19); content: "Not updated... View it directly on anime page."; left: 0; line-height: 1.2em; padding: 5px 5px 10px 5px; position: absolute; text-align: justify; top: 100%; width: calc(var(--width-info) - 10px); } .data.rated:before { content:"Rated:"; } .data.rated { --margin-left-data-adjusted: 300px; margin-top: 60px; } .data.season:before { content: "Premiered:"; } .data.season { --margin-left-data-adjusted: 10px; margin-top: 60px; } .data.studio::before { content: "Studios:"; } .data.studio { --margin-left-data-adjusted: 10px; margin-top: 80px; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .data.licensor::before { content: "Licensors:"; } .data.licensor { --margin-left-data-adjusted: 200px; margin-top: 80px; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .data.magazine::before { content: "Serialized:"; } .data.magazine { --margin-left-data-adjusted: 120px; margin-top: 65px; max-width: 270px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .more-info { background-color: rgba(0,0,0,0.7); color: white !important; height: 150px; margin-left: 5px; margin-top: calc(-1 * var(--height-img) + 5px); overflow: auto; width: calc(var(--width-img) - 10px ); } .more-info a { color: white !important; } /* FOOTER */ #footer-block { background: transparent; } #copyright { color: white; } #copyright:after { /* Custom copyright text */ content: "Endless Summer Layout by Cateinya."; } /* OTHER */ /* fix for browsers that do not support variables (IE I'm looking at you) */ /* Note : those browsers seems to have dificulties with transform too (used in category menu). Fix not found yet */ @supports not (margin-left:var(--checkvar)) { .list-table tbody.list-item { margin: 7px 13px 7px 13px; width: 178px; } .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume) { margin-left: 13px; } .list-item:nth-of-type(5n) .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume), .list-item:nth-of-type(5n + 1) .data:not(.title):not(.status):not(.score):not(.progress):not(.chapter):not(.volume) { margin-left: -591px; } .data.image { height: 250px; width: 178px; } .data.title { margin-left: -188px; margin-top: 160px; width: 188px; } .add-edit-more { width: 178px; } .data.type { margin-left: 213px !important; } .list-item:nth-of-type(5n) .data.type, .list-item:nth-of-type(5n + 1) .data.type { margin-left: -391px !important; } body.manga .data.type { margin-left: 23px !important; } body.manga .list-item:nth-of-type(5n) .data.type, body.manga .list-item:nth-of-type(5n + 1) .data.type { margin-left: -581px !important; } .data.progress, .data.chapter, .data.volume { margin-left: -173px; } .data.tags { margin-left: 201px; width: 400px; } .list-item:nth-of-type(5n) .data.tags, .list-item:nth-of-type(5n + 1) .data.tags { margin-left: -403px; } .data.tags:before { width: 390px; } .data.tags > div > span:first-child:before { width: 380px; } .data.tags:after { width: 390px; } .data.tags > div:before { width: 380px; } .data.tags > div:after { width: 390px; } .data.rated { margin-left: 313px !important; } .list-item:nth-of-type(5n) .data.rated, .list-item:nth-of-type(5n + 1) .data.rated { margin-left: -291px !important; } .data.season { margin-left: 23px !important; } .list-item:nth-of-type(5n) .data.season, .list-item:nth-of-type(5n + 1) .data.season { margin-left: -581px !important; } .data.studio { margin-left: 23px !important; } .list-item:nth-of-type(5n) .data.studio, .list-item:nth-of-type(5n + 1) .data.studio { margin-left: -581px !important; } .data.licensor { margin-left: 213px !important; } .list-item:nth-of-type(5n) .data.licensor, .list-item:nth-of-type(5n + 1) .data.licensor { margin-left: -391px !important; } .data.magazine { margin-left: 133px !important; } .list-item:nth-of-type(5n) .data.magazine, .list-item:nth-of-type(5n + 1) .data.magazine { margin-left: -471px !important; } .more-info { margin-top: -245px; width: 168px; } .list-table:before { background: rgba(0,0,0,0.5); border-radius: 30px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: white; content: "It seems like your browser does not support some of the features of my layout. This may result in a bad experience while browsing my list ! Try viewing this page with another browser (Chrome or Firefox are fine)."; display: block; font-size: 1.5em; margin-top: 100px; padding: 10px; text-align: center; } } /* Shishio's changes*/ .data.image .image{ display: inherit !important; background-repeat: no-repeat !important; } a img{ display: block !important; border: none !important; background-repeat: no-repeat !important; } .data.image a:before{ display: block; content: ""; position: absolute; background-repeat: no-repeat !important; } |
Feb 11, 2021 4:43 PM
#354
is there anyway to get the whole picture onto the background of my list? how it looks https://imgur.com/wbWK7wl the full picture i want https://imgur.com/ll8drBL |
Feb 11, 2021 6:04 PM
#355
MatsterMati said: is there anyway to get the whole picture onto the background of my list? how it looks https://imgur.com/wbWK7wl the full picture i want https://imgur.com/ll8drBL /* WALLPAPER */ body, body.ownlist { background-image: url(https://image.myanimelist.net/ui/5LYzTBVoS196gvYvw3zjwFAekEuJyN6UVjt9OpoeVbs); background-size: contain !important; } should work |
Feb 12, 2021 2:58 AM
#356
thanks! |
Feb 12, 2021 4:21 AM
#357
Hello! Not sure if this is the right thread, but I have an issue concerning my list.... I didn't realize this before saving it, but the premade layout I chose for my anime list makes the "Tags" section grey and the text inside it a slightly different tint of grey, which makes it very difficult for others to read the text normally. I don't want to remove this current layout for specific reasons, so I wonder if there is any way to fix this problem, i.e. give the "Tags" section and the text different colors so that it can easily be readable. |
Feb 12, 2021 5:20 PM
#358
IrrelevantGuy said: Hello! Not sure if this is the right thread, but I have an issue concerning my list.... I didn't realize this before saving it, but the premade layout I chose for my anime list makes the "Tags" section grey and the text inside it a slightly different tint of grey, which makes it very difficult for others to read the text normally. I don't want to remove this current layout for specific reasons, so I wonder if there is any way to fix this problem, i.e. give the "Tags" section and the text different colors so that it can easily be readable. does the part here on color changing tags help? https://myanimelist.net/forum/?topicid=1862308 |
Feb 12, 2021 8:10 PM
#359
Shishio-kun said: IrrelevantGuy said: Hello! Not sure if this is the right thread, but I have an issue concerning my list.... I didn't realize this before saving it, but the premade layout I chose for my anime list makes the "Tags" section grey and the text inside it a slightly different tint of grey, which makes it very difficult for others to read the text normally. I don't want to remove this current layout for specific reasons, so I wonder if there is any way to fix this problem, i.e. give the "Tags" section and the text different colors so that it can easily be readable. does the part here on color changing tags help? https://myanimelist.net/forum/?topicid=1862308 It did help! Thank you! |
Feb 14, 2021 11:35 AM
#360
Hello! I noticed that my anime list looks different when logged off or in an incognito tab than when i'm logged in. More specifically, the colors aren't all the way they should and the buttons on the left aren't showing at all. I am not quite sure what causes this. Here are comparison pics: https://imgur.com/a/4LyqbwG And here is my CSS: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkafter"; @\import "https://fonts.googleapis.com/css2?family=Lobster+Two&display=swap'; @\import "https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@1,600&display=swap"; @\import "https://fonts.googleapis.com/css2?family=Goldman&display=swap"; @\import "https://fonts.googleapis.com/css2?family=Carter+One&display=swap"; body { margin: 0 0 0 0; text-align: center; font-family: Verdana, Arial; font-size: 11px; background-image: url(https://imgur.com/M9LsFA7.png); background-attachment: fixed; background-size: cover; } .status-menu-container { width: 1058px; height: 46px; background-color: rgba(0, 0, 102, 0.6); border: chocolate 1px solid; z-index: 1; position: fixed; top: 0; border-radius: 10px; width: 900px; box-shadow: 1px 1px 10px chocolate; } .list-container { position: relative; background-color: rgba(0, 0, 102, 0.6); border: background-color: rgba(0, 0, 102, 0.6); border: chocolate 1px solid; width: 1058px; margin-bottom: 0; margin-right: auto; margin-left: auto; text-align: left; opacity: ; left: -400px; width: 900px; border-radius: 10px; color: floralwhite !important; font-family: Carter One; box-shadow: 1px 1px 10px chocolate; } .list-unit .list-status-title { position: relative; display: table; background-color: transparent; width: 900px; height: 38px; } .list-unit { display: block; margin: 0 auto; width: 900px; } .list-menu-float .icon-menu .text { top: 22px; } .list-menu-float .icon-menu.profile { background-size: cover; position: fixed; top: 70px; left: 20px; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.quick-add { position: fixed; top: 160px; left: 20px; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.quick-add svg.icon-quick-add { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.anime-list { top: 250px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.anime-list svg.icon-anime-list { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.manga-list { top: 340px; left: 20px; position: fixed; width: 60px; height: 60px; border-radius: 35px; } .list-menu-float .icon-menu.manga-list svg.icon-manga-list { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.history { top: 430px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.history svg.icon-history { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.export { top: 520px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.export svg.icon-export { left: 20px; top: 18px; display: none; } .list-menu-float .icon-menu.logout { top: 610px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.logout svg.icon-logout { left: 22px; top: 22px; display: none; } .list-menu-float .icon-menu.setting { top: 700px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; display:none; } .list-menu-float .icon-menu.setting svg.icon-setting { left: 19px; top: 19px; display: none; } .list-menu-float .icon-menu.setting:hover .text .link-style-setting { border-top: 0; top: 50px; } .list-menu-float { position: fixed; display: block; top: 20%; width: 50px; border: 0; z-index: 2; } .list-table .list-table-header .header-title { background: transparent url("/img/pc/ownlist/bar-table-header.png") no-repeat right 7px / 1px 22px; display: table-cell; border-bottom: #EBEBEB 1px solid; height: 36px; text-align: center; vertical-align: middle; } .list-table > tbody:nth-of-type(2n+1) { background-color: transparent; } .list-table { width: 100%; margin: 0 auto; border-collapse: collapse; border: 0; } .list-table .list-table-header .header-title { background: transparent; display: table-cell; border-bottom: 0; height: 36px; text-align: center; vertical-align: middle; } .list-table .list-table-data .data { display: table-cell; padding: 4px 0; text-align: center; vertical-align: middle; border-bottom: 0; } .header .header-title { position: absolute; top: 21px; background-image: url("/img/pc/ownlist/logo_mal.png"); background-position: left top; background-repeat: no-repeat; background-size: auto 36px; display: block; width: 240px; height: 36px; text-indent: -9999px; overflow: hidden; display: none; } .header .header-menu .btn-menu { display: block; text-align: right; font-size: 0px; display: fixed; background-color: transparent; background-image: url(https://imgur.com/3Tvs3D3.gif); height: 300px; width: 300px; position: fixed; background-size: contain; background-repeat: no-repeat; background-position: right bottom; bottom: 0; right: 0; } .list-table .list-table-header .header-title .link { font-size: 11px; color: #323232; text-decoration: none; color: floralwhite !important; } a { color: #1d439b; text-decoration: none; color: chocolate; } .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 { color: #BABABA; font-size: 0.9em; color: blanchedalmond; } .list-table .list-table-data .tags .edit { display: block; width: 100%; text-align: center; color: #2db039; font-size: 10px; font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif; color: floralwhite; } .status-menu-container .status-menu .status-button { position: relative; display: table-cell; padding: 12px 0; margin: 0; font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif; text-align: center; vertical-align: middle; font-size: 16px; color: #9B9B9B; color: floralwhite !important; } .status-menu-container a{ font-family: Carter One !important; } .list-unit .list-status-title .text { font-family: Carter One; font-size: 25px; } .header .header-menu .btn-menu:hover { background-image:url(https://imgur.com/61m5Vk9.gif); } /****************************/ /* Dark-red Highlight on Hover */ /****************************/ .list-table-data:hover td { background-image:url(https://dl.dropbox.com/s/mh1xxfqpkpebxm8/hl2.png); background-repeat: no-repeat; background-size:100% 100%; font-size: 12px !Important; -moz-transition: .4s ease; -webkit-transition: .4.5s ease; -o-transition: .4s ease; } /* Highlight Image for First Column */ .list-table-data:hover td:first-of-type {background-image:url(https://dl.dropbox.com/s/1brcvy03yoln0eu/hl3.png);} /* Highlight Image for Last Column */ .list-table-data:hover td:last-of-type {background-image:url(https://dl.dropbox.com/s/p58vjxqufjitetw/hl4.png);} /*PREVIEW PICS */ /* COVER SIZE */ .data.image a:after{ width: 200px; height: 300px; } /* COVER POSITION */ .data.image a:after{ position: fixed; top: 7.5%; left: calc(50% + 60px); } /* OTHER CODES */ .data.image a:after {content: ""; display: block !important; background-color: rgba(0,0,0,.3); background-position: center !important; background-repeat: no-repeat !important; background-size: cover; border: 1px solid #ffffff; box-shadow: 0 2px 5px rgba(0,0,0, 0.7); visibility: hidden; opacity: 0; transition: opacity .8s linear, margin-left .5s ease, transform 1s ease-in-out; z-index: 5;} .list-table .list-table-data:hover .data.image a:after { visibility: visible; opacity: 1; transition: .3s ease-out;} /*==============================*\ | Category-Coloured Header Bars | \* --- - --- - ---- - --- - --- */ .status-menu-container .status-menu .status-button:nth-of-type(1)::after { /* All Anime */ background: YOURCOLOUR ; } .status-menu-container .status-menu .status-button:nth-of-type(2)::after { /* Watching */ background: #2db039 ; } .status-menu-container .status-menu .status-button:nth-of-type(3)::after { /* Completed */ background: #26448f ; } .status-menu-container .status-menu .status-button:nth-of-type(4)::after { /* On Hold */ background: #f1c83e ; } .status-menu-container .status-menu .status-button:nth-of-type(5)::after { /* Droppped */ background: #a12f31 ; } .status-menu-container .status-menu .status-button:nth-of-type(6)::after { /* Planned */ background: #c3c3c3 ; } /* BUTTON IMAGES */ .list-menu-float .icon-menu.quick-add { background-image: url(https://imgur.com/ExLJPnD.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.anime-list { background-image: url(https://imgur.com/ysz63o2.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.manga-list { background-image: url(https://imgur.com/U6MxCyN.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.history { background-image: url(https://imgur.com/PwvAQAO.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.export { background-image: url(https://imgur.com/zQZgWbR.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.logout { background-image: url(https://imgur.com/vRslg6O.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu:hover .text { width: 94px; opacity: 1; font-family: Carter One; color: red; } .list-menu-float .icon-menu.profile:hover{ box-shadow: 1px 1px 20px darkred; } .list-menu-float .icon-menu.quick-add:hover { box-shadow: 1px 1px 20px orangered; } .list-menu-float .icon-menu.anime-list:hover { box-shadow: 1px 1px 20px violet; } .list-menu-float .icon-menu.manga-list:hover { box-shadow: 1px 1px 20px burlywood; } .list-menu-float .icon-menu.history:hover { box-shadow: 1px 1px 20px gold; } .list-menu-float .icon-menu.export:hover { box-shadow: 1px 1px 20px green; } .list-menu-float .icon-menu.logout:hover { box-shadow: 1px 1px 20px coral; } |
Feb 14, 2021 8:14 PM
#361
Feb 14, 2021 10:04 PM
#362
master22431 said: Hello! I noticed that my anime list looks different when logged off or in an incognito tab than when i'm logged in. More specifically, the colors aren't all the way they should and the buttons on the left aren't showing at all. I am not quite sure what causes this. Here are comparison pics: https://imgur.com/a/4LyqbwG And here is my CSS: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkafter"; @\import "https://fonts.googleapis.com/css2?family=Lobster+Two&display=swap'; @\import "https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@1,600&display=swap"; @\import "https://fonts.googleapis.com/css2?family=Goldman&display=swap"; @\import "https://fonts.googleapis.com/css2?family=Carter+One&display=swap"; body { margin: 0 0 0 0; text-align: center; font-family: Verdana, Arial; font-size: 11px; background-image: url(https://imgur.com/M9LsFA7.png); background-attachment: fixed; background-size: cover; } .status-menu-container { width: 1058px; height: 46px; background-color: rgba(0, 0, 102, 0.6); border: chocolate 1px solid; z-index: 1; position: fixed; top: 0; border-radius: 10px; width: 900px; box-shadow: 1px 1px 10px chocolate; } .list-container { position: relative; background-color: rgba(0, 0, 102, 0.6); border: background-color: rgba(0, 0, 102, 0.6); border: chocolate 1px solid; width: 1058px; margin-bottom: 0; margin-right: auto; margin-left: auto; text-align: left; opacity: ; left: -400px; width: 900px; border-radius: 10px; color: floralwhite !important; font-family: Carter One; box-shadow: 1px 1px 10px chocolate; } .list-unit .list-status-title { position: relative; display: table; background-color: transparent; width: 900px; height: 38px; } .list-unit { display: block; margin: 0 auto; width: 900px; } .list-menu-float .icon-menu .text { top: 22px; } .list-menu-float .icon-menu.profile { background-size: cover; position: fixed; top: 70px; left: 20px; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.quick-add { position: fixed; top: 160px; left: 20px; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.quick-add svg.icon-quick-add { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.anime-list { top: 250px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.anime-list svg.icon-anime-list { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.manga-list { top: 340px; left: 20px; position: fixed; width: 60px; height: 60px; border-radius: 35px; } .list-menu-float .icon-menu.manga-list svg.icon-manga-list { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.history { top: 430px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.history svg.icon-history { left: 20px; top: 20px; display: none; } .list-menu-float .icon-menu.export { top: 520px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.export svg.icon-export { left: 20px; top: 18px; display: none; } .list-menu-float .icon-menu.logout { top: 610px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; } .list-menu-float .icon-menu.logout svg.icon-logout { left: 22px; top: 22px; display: none; } .list-menu-float .icon-menu.setting { top: 700px; left: 20px; position: fixed; border-radius: 35px; height: 60px; width: 60px; display:none; } .list-menu-float .icon-menu.setting svg.icon-setting { left: 19px; top: 19px; display: none; } .list-menu-float .icon-menu.setting:hover .text .link-style-setting { border-top: 0; top: 50px; } .list-menu-float { position: fixed; display: block; top: 20%; width: 50px; border: 0; z-index: 2; } .list-table .list-table-header .header-title { background: transparent url("/img/pc/ownlist/bar-table-header.png") no-repeat right 7px / 1px 22px; display: table-cell; border-bottom: #EBEBEB 1px solid; height: 36px; text-align: center; vertical-align: middle; } .list-table > tbody:nth-of-type(2n+1) { background-color: transparent; } .list-table { width: 100%; margin: 0 auto; border-collapse: collapse; border: 0; } .list-table .list-table-header .header-title { background: transparent; display: table-cell; border-bottom: 0; height: 36px; text-align: center; vertical-align: middle; } .list-table .list-table-data .data { display: table-cell; padding: 4px 0; text-align: center; vertical-align: middle; border-bottom: 0; } .header .header-title { position: absolute; top: 21px; background-image: url("/img/pc/ownlist/logo_mal.png"); background-position: left top; background-repeat: no-repeat; background-size: auto 36px; display: block; width: 240px; height: 36px; text-indent: -9999px; overflow: hidden; display: none; } .header .header-menu .btn-menu { display: block; text-align: right; font-size: 0px; display: fixed; background-color: transparent; background-image: url(https://imgur.com/3Tvs3D3.gif); height: 300px; width: 300px; position: fixed; background-size: contain; background-repeat: no-repeat; background-position: right bottom; bottom: 0; right: 0; } .list-table .list-table-header .header-title .link { font-size: 11px; color: #323232; text-decoration: none; color: floralwhite !important; } a { color: #1d439b; text-decoration: none; color: chocolate; } .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 { color: #BABABA; font-size: 0.9em; color: blanchedalmond; } .list-table .list-table-data .tags .edit { display: block; width: 100%; text-align: center; color: #2db039; font-size: 10px; font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif; color: floralwhite; } .status-menu-container .status-menu .status-button { position: relative; display: table-cell; padding: 12px 0; margin: 0; font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif; text-align: center; vertical-align: middle; font-size: 16px; color: #9B9B9B; color: floralwhite !important; } .status-menu-container a{ font-family: Carter One !important; } .list-unit .list-status-title .text { font-family: Carter One; font-size: 25px; } .header .header-menu .btn-menu:hover { background-image:url(https://imgur.com/61m5Vk9.gif); } /****************************/ /* Dark-red Highlight on Hover */ /****************************/ .list-table-data:hover td { background-image:url(https://dl.dropbox.com/s/mh1xxfqpkpebxm8/hl2.png); background-repeat: no-repeat; background-size:100% 100%; font-size: 12px !Important; -moz-transition: .4s ease; -webkit-transition: .4.5s ease; -o-transition: .4s ease; } /* Highlight Image for First Column */ .list-table-data:hover td:first-of-type {background-image:url(https://dl.dropbox.com/s/1brcvy03yoln0eu/hl3.png);} /* Highlight Image for Last Column */ .list-table-data:hover td:last-of-type {background-image:url(https://dl.dropbox.com/s/p58vjxqufjitetw/hl4.png);} /*PREVIEW PICS */ /* COVER SIZE */ .data.image a:after{ width: 200px; height: 300px; } /* COVER POSITION */ .data.image a:after{ position: fixed; top: 7.5%; left: calc(50% + 60px); } /* OTHER CODES */ .data.image a:after {content: ""; display: block !important; background-color: rgba(0,0,0,.3); background-position: center !important; background-repeat: no-repeat !important; background-size: cover; border: 1px solid #ffffff; box-shadow: 0 2px 5px rgba(0,0,0, 0.7); visibility: hidden; opacity: 0; transition: opacity .8s linear, margin-left .5s ease, transform 1s ease-in-out; z-index: 5;} .list-table .list-table-data:hover .data.image a:after { visibility: visible; opacity: 1; transition: .3s ease-out;} /*==============================*\ | Category-Coloured Header Bars | \* --- - --- - ---- - --- - --- */ .status-menu-container .status-menu .status-button:nth-of-type(1)::after { /* All Anime */ background: YOURCOLOUR ; } .status-menu-container .status-menu .status-button:nth-of-type(2)::after { /* Watching */ background: #2db039 ; } .status-menu-container .status-menu .status-button:nth-of-type(3)::after { /* Completed */ background: #26448f ; } .status-menu-container .status-menu .status-button:nth-of-type(4)::after { /* On Hold */ background: #f1c83e ; } .status-menu-container .status-menu .status-button:nth-of-type(5)::after { /* Droppped */ background: #a12f31 ; } .status-menu-container .status-menu .status-button:nth-of-type(6)::after { /* Planned */ background: #c3c3c3 ; } /* BUTTON IMAGES */ .list-menu-float .icon-menu.quick-add { background-image: url(https://imgur.com/ExLJPnD.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.anime-list { background-image: url(https://imgur.com/ysz63o2.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.manga-list { background-image: url(https://imgur.com/U6MxCyN.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.history { background-image: url(https://imgur.com/PwvAQAO.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.export { background-image: url(https://imgur.com/zQZgWbR.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu.logout { background-image: url(https://imgur.com/vRslg6O.png); background-size: cover; background-repeat: no-repeat; background-position: center; } .list-menu-float .icon-menu:hover .text { width: 94px; opacity: 1; font-family: Carter One; color: red; } .list-menu-float .icon-menu.profile:hover{ box-shadow: 1px 1px 20px darkred; } .list-menu-float .icon-menu.quick-add:hover { box-shadow: 1px 1px 20px orangered; } .list-menu-float .icon-menu.anime-list:hover { box-shadow: 1px 1px 20px violet; } .list-menu-float .icon-menu.manga-list:hover { box-shadow: 1px 1px 20px burlywood; } .list-menu-float .icon-menu.history:hover { box-shadow: 1px 1px 20px gold; } .list-menu-float .icon-menu.export:hover { box-shadow: 1px 1px 20px green; } .list-menu-float .icon-menu.logout:hover { box-shadow: 1px 1px 20px coral; } Very nice layout!! :D You mean those buttons on the left, correct? I don't think those button exist in the list for people not logged in. So they wouldn't see them customized or un-customized. There are different buttons for them, like log in and such. To confirm, turn off the CSS and see the list logged in and out. |
Shishio-kunFeb 14, 2021 10:12 PM
Feb 14, 2021 10:11 PM
#363
Sevrep said: I've tried different .gifs but they all don't fit into the window for the banner avatar/there's always empty white space in the bottom portion of the window. Is there any way to make it auto-fit into the window or do I need specific dimensions for the .gif? Also, I tried changing the 'All Anime' banner into a different .gif but now it's broken with the old background pic for it's window showing for some reason. How can I fix this? And is there a way to change the height of the main banner to sit just above the first row/above the start of the list? Fix the avatar with this .cover-block::after { background-size: cover !important; background-position: center center; } Try this for fixing the banner .list-unit.watching .list-status-title:after, .list-unit.reading .list-status-title:after, .list-unit.completed .list-status-title:after, .list-unit.onhold .list-status-title:after, .list-unit.dropped .list-status-title:after, .list-unit.plantowatch .list-status-title:after, .list-unit.plantoread .list-status-title:after, .list-unit.all_anime .list-status-title:after { width: 100% !important; height: 500px !important; background-size: cover !important; } |
Feb 14, 2021 11:09 PM
#364
Shishio-kun said: Sevrep said: I've tried different .gifs but they all don't fit into the window for the banner avatar/there's always empty white space in the bottom portion of the window. Is there any way to make it auto-fit into the window or do I need specific dimensions for the .gif? Also, I tried changing the 'All Anime' banner into a different .gif but now it's broken with the old background pic for it's window showing for some reason. Where in the CSS am I supposed to put that? How can I fix this? And is there a way to change the height of the main banner to sit just above the first row/above the start of the list? Fix the avatar with this .cover-block::after { background-size: cover !important; background-position: center center; } Try this for fixing the banner .list-unit.watching .list-status-title:after, .list-unit.reading .list-status-title:after, .list-unit.completed .list-status-title:after, .list-unit.onhold .list-status-title:after, .list-unit.dropped .list-status-title:after, .list-unit.plantowatch .list-status-title:after, .list-unit.plantoread .list-status-title:after, .list-unit.all_anime .list-status-title:after { width: 100% !important; height: 500px !important; background-size: cover !important; } Where in the CSS am I supposed to put that? |
Feb 14, 2021 11:51 PM
#365
Sevrep said: Shishio-kun said: Sevrep said: I've tried different .gifs but they all don't fit into the window for the banner avatar/there's always empty white space in the bottom portion of the window. Is there any way to make it auto-fit into the window or do I need specific dimensions for the .gif? Also, I tried changing the 'All Anime' banner into a different .gif but now it's broken with the old background pic for it's window showing for some reason. Where in the CSS am I supposed to put that? How can I fix this? And is there a way to change the height of the main banner to sit just above the first row/above the start of the list? Fix the avatar with this .cover-block::after { background-size: cover !important; background-position: center center; } Try this for fixing the banner .list-unit.watching .list-status-title:after, .list-unit.reading .list-status-title:after, .list-unit.completed .list-status-title:after, .list-unit.onhold .list-status-title:after, .list-unit.dropped .list-status-title:after, .list-unit.plantowatch .list-status-title:after, .list-unit.plantoread .list-status-title:after, .list-unit.all_anime .list-status-title:after { width: 100% !important; height: 500px !important; background-size: cover !important; } Where in the CSS am I supposed to put that? Add it to the bottom and for your version of the layout it should be this actually .list-table .list-table-header:after, .cover-block::after { background-size: cover !important; background-position: center center; } .list-unit.watching .list-status-title:after, .list-unit.reading .list-status-title:after, .list-unit.completed .list-status-title:after, .list-unit.onhold .list-status-title:after, .list-unit.dropped .list-status-title:after, .list-unit.plantowatch .list-status-title:after, .list-unit.plantoread .list-status-title:after, .list-unit.all_anime .list-status-title:after { width: 100% !important; height: 500px !important; background-size: cover !important; } |
Feb 16, 2021 3:22 PM
#366
Hi! I was wondering if you could maybe help me; I am currently using a Classic layout on my anime list and when I compare my lists, one where I'm logged in & one where I am logged out, I see that the fonts are different. I would like both of the lists to show the same font (the one I see when I am logged into my account). I've already tried the CSS under "Allow other users and logged out users to see your custom CSS layout" and nothing worked. Here are screenshots of what I see on either view: Is there any way I can fix it so both show the font for when I am viewing my list logged into my account? I can also send the CSS for it if you need it. (I should also probably add that the code I used was from the "broken anime list layouts" section; this is the one I used: |
-ViviChan-Feb 16, 2021 3:32 PM
✦ 𝚍𝚎𝚕𝚒𝚟𝚎𝚛𝚒𝚎𝚜 --------------------- ✧ 𝚌𝚘𝚕𝚕𝚎𝚌𝚝𝚒𝚘𝚗 --------------------- ✦ 𝚜𝚎𝚝 𝚋𝚢 𝚜𝚑𝚒𝚗𝚓𝚞𝚔𝚞_ |
Feb 17, 2021 2:46 AM
#367
-ViviChan- said: Hi! I was wondering if you could maybe help me; I am currently using a Classic layout on my anime list and when I compare my lists, one where I'm logged in & one where I am logged out, I see that the fonts are different. I would like both of the lists to show the same font (the one I see when I am logged into my account). I've already tried the CSS under "Allow other users and logged out users to see your custom CSS layout" and nothing worked. Here are screenshots of what I see on either view: Is there any way I can fix it so both show the font for when I am viewing my list logged into my account? I can also send the CSS for it if you need it. (I should also probably add that the code I used was from the "broken anime list layouts" section; this is the one I used: Add this to the top. Is the font fixed? Post code if not, and leave the import line at the top. @\import "https://fonts.googleapis.com/css?family=Patrick+Hand+SC"; |
Feb 17, 2021 3:57 PM
#368
Shishio-kun said: -ViviChan- said: Hi! I was wondering if you could maybe help me; I am currently using a Classic layout on my anime list and when I compare my lists, one where I'm logged in & one where I am logged out, I see that the fonts are different. I would like both of the lists to show the same font (the one I see when I am logged into my account). I've already tried the CSS under "Allow other users and logged out users to see your custom CSS layout" and nothing worked. Here are screenshots of what I see on either view: Is there any way I can fix it so both show the font for when I am viewing my list logged into my account? I can also send the CSS for it if you need it. (I should also probably add that the code I used was from the "broken anime list layouts" section; this is the one I used: Add this to the top. Is the font fixed? Post code if not, and leave the import line at the top. @\import "https://fonts.googleapis.com/css?family=Patrick+Hand+SC"; Yep, it worked! Thank you so much!! :) |
✦ 𝚍𝚎𝚕𝚒𝚟𝚎𝚛𝚒𝚎𝚜 --------------------- ✧ 𝚌𝚘𝚕𝚕𝚎𝚌𝚝𝚒𝚘𝚗 --------------------- ✦ 𝚜𝚎𝚝 𝚋𝚢 𝚜𝚑𝚒𝚗𝚓𝚞𝚔𝚞_ |
Feb 17, 2021 5:56 PM
#369
-ViviChan- said: Shishio-kun said: -ViviChan- said: Hi! I was wondering if you could maybe help me; I am currently using a Classic layout on my anime list and when I compare my lists, one where I'm logged in & one where I am logged out, I see that the fonts are different. I would like both of the lists to show the same font (the one I see when I am logged into my account). I've already tried the CSS under "Allow other users and logged out users to see your custom CSS layout" and nothing worked. Here are screenshots of what I see on either view: Is there any way I can fix it so both show the font for when I am viewing my list logged into my account? I can also send the CSS for it if you need it. (I should also probably add that the code I used was from the "broken anime list layouts" section; this is the one I used: Add this to the top. Is the font fixed? Post code if not, and leave the import line at the top. @\import "https://fonts.googleapis.com/css?family=Patrick+Hand+SC"; Yep, it worked! Thank you so much!! :) OK, great :D The solution was the same as under "Allow other users and logged out users to see your custom CSS layout", you can do this for all imports, but there are two parts for it and the imports have to be edited carefully |
Feb 19, 2021 8:40 PM
#370
Hi, I have two things I need some help with. One is something that broke and the other is just a quality of life thing I want to change. 1. When I hover over the image for an anime on my list, that image is supposed to pop up on the side. Instead, it is just showing an outline of where the image would be. The outline is the right size but just has nothing in it. I don't know how I broke this but it happened when I was changing my list to make it Nico Robin themed. 2. This one is probably easy to do but I've been struggling with trying to do it on my own. When you scroll down on my list, the avatar shrinks to fit on the header. I just want it to be clickable when it is small. That way I don't have to scroll all the way up just to go back to my profile. Thanks in advance. @\import "https://fonts.googleapis.com/css?family=Oswald"; @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore"; /* BANNER BACKGROUND To change background images: Delete what's in the parenthesis. Upload the new background to Imgur or a similar site, then copy the direct link (or Original GIF link if it's animated) and paste it into the parenthesis. Save. */ :root { --banner: url(https://imgur.com/v7xokzI.jpg)!important;} /* BANNER TEXT*/ :root { --name: url(https://imgur.com/hsfQZdO.png) !Important; --namestart:70px; --nameend:125px; --namescale:.75; } /* BANNER AVATAR (Profile Spot) */ :root { --avatar: url(https://imgur.com/6Ma5r6g.png) !important; } /* BANNER CHARACTER (Character On BANNER)*/ :root { --character: url() !important; } /* WALLPAPER stuff. Based on Layers*/ :root { --wallpaper: var(--wallpaper1) ,var(--wallpaper2),var(--wallpaper3),var(--wallpaper4),var(--wallpaper5),var(--wallpaper-color) !important; /*Wallpaper Layers. 1 is first layer, 2 is second layer etc.*/ --wallpaper1:url(https://imgur.com/Vd23sGI.gif)fixed left / 110%; --wallpaper2:url(https://imgur.com/sJRbr5q.png)no-repeat fixed bottom /100%; --wallpaper3:url()no-repeat fixed; --wallpaper4:url()no-repeat fixed 50% 60%/300px; --wallpaper5:url()fixed right / 100%; --wallpaper-color:rgb(0,35,140,1); } /*rgb(0,35,100,1)*/ /* LEFT CHARACTER BY LIST */ footer:before { background-image: url(https://imgur.com/tsRNHDz.png) !important; } /* RIGHT CHARACTER BY LIST */ footer:after { background-image: url() !important; } /*Third Character(fixed to footer) and adjustments*/ :root { --thirdcharacter: url(https://imgur.com/ty3HIrb.png) !Important; --footer-gap: -190px; --thirdcharacter-spacing:340px; --thirdcharacter-position:500px; --thirdcharacter-zindex:-1; --thirdcharacter-scalesize:.25; } /*Fourth Character(Top of List) and adjustments*/ :root { --fourthcharacter: url() !Important; --header-gap: 97px; --button-fix:59px;/*Roughly 38 LOWER than header gap*/ --fourthcharacter-spacing:-45px; --fourthcharacter-position:155px; /*z-index won't work for this*/ --fourthcharacter-scalesize:.15; --stats-padding-height:2px; --stats-padding-width:15px; --stats-spacing:15px; --stats-opacity:.6; } /* TABLE COLORS and EDITS*/ :root { --bg: rgba(255,255,255,1); --list-items-radius: 5px; --number-text-color:rgb(0,0,0,1); } /* OTHER CODES*/ body:before { width: 100%; height: 100%; display: block; position: fixed; left: 0; top:0; content: ""; } #search-box:after,.open~#search-button{pointer-events:none}:root{--name:none;--avatar:none;--banner:url(https://i.imgur.com/VoPJz2S.jpg);--character:url(https://i.imgur.com/6IPyngH.png);--pbg:var(--wallpaper);var(--bg);--text:#1C1C1C ;--text-h:#787878;--text-dim:#737373;--text-dim-h:#646464;--text-dark:#111;--icon:#1C1C1C ;--accent:#4065ba;--btn-bg:#DDDDDD;--btn-bg-h:#1C1C1C ;--btn-head-bg-h:#1d439b;--btn-text-h:#fff;--bg-dark:#ddd;--text-head:#737373;--text-head-h:#2F4F4F;--watching:#2db039;--completed:#26448f;--onhold:#f9d457;--dropped:#a12f31;--plantowatch:#c3c3c3;--cover-bg:#323232;--edit-btn:#d9d9d9;--checkmark:rgb(52, 127, 0 ,1)}#advanced-options .advanced-options-button a,#fancybox-close,#search-box,#search-box input,#search-box:after,.data.chapter,.data.image .link:after,.data.licensor a,.data.priority,.data.progress,.data.score a,.data.studio a,.data.tags a,.data.tags a.edit:after,.data.volume,.fixed .status-menu:after,.header .header-title:after,.icon-menu svg,.icon-menu.setting,.icon-menu.setting .text,.icon-menu.setting .text a,.icon-menu:after,.icon-menu:before,.list-table .list-table-header .header-title .link.sort,.list-table-header .header-title,.status-button:after,.status-menu-container.fixed .status-menu,.status-menu-container:not(.fixed) .status-menu,.status-menu:after{transition:all .3s ease!important}#advanced-options .advanced-options-header .description,#advanced-options .advanced-options-header .description:before,#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] label,#advanced-options [class*="-widget"] select,#search-button i,.header-info a,.list-table-data a,.more-info .td1>div>a{transition:all .15s ease!important}.header .header-title,.header-info,.icon-menu,.icon-menu.quick-add:before,.list-menu-float .icon-menu,.list-table>tbody:first-of-type:after,.stats a{display:inline-block;height:26px!important;width:26px!important;background:var(--bg)!important;border-radius:8px;color:var(--text)!important;font:400 0/26px Arial,Verdana,sans-serif;text-indent:0;text-align:left;white-space:nowrap;vertical-align:top;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:all .3s ease!important}.header .header-title:hover,.icon-menu:hover,.list-menu-float .icon-menu:hover,.stats a:hover{width:100px!important;background:var(--btn-head-bg-h)!important;color:var(--btn-text-h)!important}html{position:relative;min-height:100%}body{padding-bottom:64px;background:var(--pbg) no-repeat center / cover fixed!important}.list-container{position:static;width:100%;background:0 0!important;border:none}.list-block{width:1060px;min-height:initial;margin:64px auto 0}.status-menu-container.fixed+.list-block{margin-top:128px!important}.list-unit{width:100%!important;margin:0}.cover-block,.cover-block:before{left:0;width:100%;position:absolute}.list-table{border:none!important}a,a:hover{color:var(--accent)}.initialize-tutorial{display:none!important}.cover-block{top:0;z-index:-5;min-width:1060px;height:318px;background:center center/cover no-repeat var(--cover-bg);background-image:var(--banner)}.cover-block:before{content:var(--fourthcharacter);transform:scale(var(--fourthcharacter-scalesize),var(--fourthcharacter-scalesize));bottom:var(--fourthcharacter-spacing);left:var(--fourthcharacter-position);display:block;height:50px;background:linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0))}#cover-image,.btn-list-setting{display:none!important}.cover-block .image-container{display:block!important;width:1060px;height:100%;padding:0;background:right center/contain no-repeat var(--character);margin:10px -725px auto;}#cover-image-container:after{content:var(--name);transform:scale(var(--namescale),var(--namescale));position:absolute;bottom:5px;left:50%;margin-left:var(--nameend);color:#fff;font:700 60px/60px Oswald;text-align:left;letter-spacing:15px;text-shadow:1px 4px 7px rgba(0,0,0,.45);text-transform:uppercase;white-space:pre;transform:scale(.6) perspective(350px) rotateY() rotateZ();animation:name-slide 2s 1 .5s backwards}@keyframes name-slide{0%{bottom:25px;margin-left:var(--namestart);opacity:0;letter-spacing:0;animation-timing-function:ease-out}90%{bottom:5px;margin-left:var(--nameend)}100%{letter-spacing:15px;opacity:1;animation-timing-function:cubic-bezier(0,0,.75,1)}}.header{display:flex;height:36px;margin-top:282px}.header .header-menu{position:static;display:flex;width:auto;height:26px;margin-left:6px;order:2}.btn-menu{height:0;font-size:0!important}.btn-menu #header-menu-button{display:none}.header .header-title{position:static;margin-left:155px;order:1;z-index:1}.header .header-title:before{content:"\f015";display:inline-block;width:26px;background:0 0!important;font-size:14px;font-family:FontAwesome;text-align:center!important}.header .header-title:hover:before{color:var(--btn-text-h)!important}.header .header-title:after{content:"Home";display:inline-block;height:26px!important;width:26px!important;font:14px/26px Arial,Verdana,sans-serif;color:var(--text)}#search-box:after,.status-menu:after{content:""}.header .header-title:hover:after{color:var(--btn-text-h)}.header .header-menu .list-menu{position:static;order:1;display:inline-block;height:26px;border:none;background:0 0;box-shadow:none}.header .icon-menu.anime-list,.header .icon-menu.manga-list{position:static;padding:0;margin-right:6px;font-size:0!important;font-weight:400!important}.header .icon-menu.anime-list .text,.header .icon-menu.manga-list .text{position:static!important;font:14px/26px Arial,Verdana,sans-serif;vertical-align:top}.header .header-menu .list-menu .icon-menu svg.icon{position:static;max-width:14px;max-height:14px;padding:6px;fill:var(--text)}.header .header-menu .list-menu .icon-menu:hover svg.icon{fill:var(--btn-text-h)}.header-info{position:static;width:auto!important;padding:0 8px;margin:0!important;font-size:12px;order:2}.header-info a{color:var(--text)!important;text-decoration:none!important}.header-info a:hover{color:var(--text-h)!important}.btn-menu a.username{position:absolute;left:1px;top:-7px;display:block;width:150px;height:150px;background:0 0;border-radius:50%;font-size:0;z-index:36}.btn-menu span.username{display:none!important}.status-menu-container{position:relative;z-index:35!important;width:100%;min-width:1060px;height:64px;background:0 0;border:none!important}.status-menu-container.fixed{z-index:4500!important}.status-menu-container:after,.status-menu-container:before{content:"";position:absolute;left:0;z-index:-1;display:block;width:100%}.status-menu-container:before{top:0;height:64px;background:var(--bg)}.status-menu-container:after{top:64px;height:2px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0))}.status-menu{position:relative;display:block!important;width:1060px;padding:0 0 0 173px;margin:0 auto;box-sizing:border-box}.fixed .status-menu{padding:0 0 0 71px}.status-menu:after{position:absolute;top:-51px;left:-8px;width:150px;height:150px;background:center top/cover no-repeat var(--bg-dark);background-image:var(--avatar);border:8px solid var(--bg);border-radius:50%;opacity:1;box-shadow:0 1px 2px rgba(0,0,0,.2)}.fixed .status-menu:after{border-width:2px;top:6px;width:48px;height:48px;box-shadow:none}.status-menu .status-button{display:inline-block!important;height:32px;padding:16px 0!important;margin:0 15px!important;color:var(--text-head)!important;font-size:17.6px!important;line-height:30px;white-space:nowrap;font-family:Oswald!important;text-transform:uppercase;letter-spacing:1px}.status-menu .status-button.on{color:var(--text-head-h)!important}.status-button.all_anime:after{background:var(--accent)!important}.status-button.reading:after,.status-button.watching:after{background:var(--watching)!important}.status-button.completed:after{background:var(--completed)!important}.status-button.onhold:after{background:var(--onhold)!important}.status-button.dropped:after{background:var(--dropped)!important}.status-button.plantoread:after,.status-button.plantowatch:after{background:var(--plantowatch)!important}.status-menu-container .search-container{top:19px;right:0}#search-box{padding-right:22px;border:2px solid transparent;border-radius:13px;margin-top:0!important}#search-box.open{width:150px!important;background:var(--btn-bg);border:2px solid var(--bg-dark)}#search-box input{background:0 0;border:none;border-radius:13px;outline:0}#search-box.open input{text-indent:7.5px;line-height:20px}.status-menu-container .search-container #search-button{position:absolute;right:0;top:0;width:26px;height:26px;border-radius:13px;margin-top:0;text-align:center}#search-button i{color:var(--text-head)!important;font-size:18px;line-height:26px}.open~#search-button i{font-size:14px;line-height:24px}#search-box:after{position:absolute;right:0;top:0;width:0;height:22px;padding-right:22px;background:linear-gradient(to right,var(--btn-bg) 2px,transparent 9.5px,transparent 142.5px,var(--btn-bg) 150px) content-box;border:2px solid transparent;border-radius:13px;opacity:0}#search-box.open:after{width:150px;opacity:1}.list-menu-float{position:relative;top:auto;display:block;width:904px;height:0;padding-left:155px;margin:0 auto;border:none;background:0 0;text-align:left;font-size:0;z-index:38}.icon-menu,.list-menu-float form{display:inline-block!important}.list-menu-float .icon-menu{top:74px;margin:0 6px 0 0}.list-menu-float .icon-menu .text{top:0!important;left:26px!important;display:inline-block;width:auto!important;height:26px;color:var(--text)!important;font-size:14px!important;opacity:1!important}.list-menu-float .icon-menu:hover .text{color:var(--btn-text-h)!important}.list-menu-float .icon-menu svg.icon{top:6px!important;left:6px!important;max-width:14px;max-height:14px;fill:var(--text)}.list-menu-float .icon-menu:hover svg.icon{fill:var(--btn-text-h)}[data-owner="1"] .list-menu-float .icon-menu.profile{position:absolute;left:1px;top:-43px;display:block!important;width:150px!important;height:150px!important;background:0 0!important;border-radius:50%;font-size:0;box-shadow:none}[data-owner=""] .icon-menu.profile{background-image:none!important}[data-owner=""] .icon-menu.profile:before{content:"\f007";position:absolute;top:0;left:0;display:block;width:26px;height:26px;font-size:14px;line-height:26px;text-align:center;color:var(--text);font-family:FontAwesome}[data-owner=""] .icon-menu.profile:hover:before{color:var(--btn-text-h)}[data-owner=""] .icon-menu.profile:after{content:"Profile";position:absolute;top:0;left:26px;display:inline-block;height:26px;font-size:14px;color:var(--text)}[data-owner=""] .icon-menu.profile:hover:after{color:var(--btn-text-h)}.icon-menu.quick-add:hover:before,.icon-menu.setting .text a{color:var(--btn-text-h)!important}.icon-menu.quick-add svg{display:none}.icon-menu.quick-add:before{content:"\f067";background:0 0!important;font-size:14px;text-align:center;font-family:FontAwesome;box-shadow:none}.icon-menu.setting{overflow:visible}.icon-menu.setting:hover{width:26px!important}.icon-menu.setting .text{top:-2px!important;left:0!important;width:240px!important;height:26px!important;padding:2px 0;overflow:visible;font-size:0!important;opacity:1!important;pointer-events:none;z-index:-1}.icon-menu.setting:hover .text{pointer-events:auto}.icon-menu.setting .text a{position:absolute!important;top:2px!important;left:13px!important;width:0!important;height:26px!important;background:var(--btn-bg-h)!important;border:none!important;border-radius:0 13px 13px 0;overflow:hidden;font:14px/26px Arial,Verdana,sans-serif!important;text-indent:7.5px;text-align:center;white-space:nowrap;opacity:0!important}.icon-menu.setting:hover .text a{width:120px!important;border-radius:0 13px 13px 0;opacity:1!important}.icon-menu.setting:hover .text .link-list-setting{left:120px!important}.icon-menu.setting .text a:hover{background:var(--btn-head-bg-h)!important}.list-status-title{width:1060px!important;height:var(--header-gap)!important;margin-top:-64px;background:0 0!important}.list-status-title .text{display:none!important}.list-status-title .stats{position:absolute;top:10px;right:32px!important;z-index:1000;display:block;width:auto;height:26px!important;border-radius:0 0 26px;font-size:0;line-height:13px!important}.stats a{margin:0 0 0 6px!important;font:14px/26px Arial,Verdana,sans-serif}.stats a i{width:26px;text-align:center}.list-stats{position:absolute;top:30px;margin-top:var(--stats-spacing);padding:var(--stats-padding-height);padding-left:var(--stats-padding-width);padding-right:var(--stats-padding-width);width:auto!important;z-index:1000;background:rgba(0,0,0,var(--stats-opacity))!important;color:#FFFFFF;border-radius:15px;!important;font-weight:700}.list-table>tbody:first-of-type{position:relative;top:calc(-1*var(--button-fix));margin-top:-30px;left:1032px;display:block;width:30px;height:30px;background:0 0!important;z-index:1000}.list-table>tbody:first-of-type:after{content:"\f0dc";position:absolute;top:0px;right:0;margin:2px;font-size:14px;font-family:FontAwesome;text-align:center}.list-table>tbody:first-of-type:hover:after{background:var(--btn-head-bg-h)!important;color:var(--btn-text-h)!important}.list-table-header{position:absolute;top:0;right:15px;display:block;width:auto;height:26px;padding:2px 0;font-size:0;white-space:nowrap;pointer-events:none;z-index:-1}.list-table>tbody:first-of-type:hover .list-table-header{pointer-events:auto}.list-table-header .header-title{position:relative;display:inline-block!important;width:auto!important;height:auto!important;padding:0!important;border:none!important;background:0 0!important;font-weight:400!important}.list-table>tbody:first-of-type:hover .header-title{opacity:1}.list-table-header .header-title a{display:block!important;width:13px!important;height:26px!important;background:var(--btn-bg-h)!important;border-radius:13px 0 0 13px;margin-left:-13px;overflow:hidden;box-sizing:border-box;color:var(--btn-text-h)!important;font:12px/26px Verdana,Arial,sans-serif!important;text-align:center!important;text-indent:-7.5px;white-space:normal!important;opacity:0}.list-table-header .header-title a.hover_info,.list-table-header .header-title.tags{display:none!important}tbody:first-of-type:hover .list-table-header .header-title.finished a,tbody:first-of-type:hover .list-table-header .header-title.started a{padding:0 13px}.data,.data.status{padding:0!important}.list-table-header .header-title a:hover{background:var(--btn-head-bg-h)!important}tbody:first-of-type:hover .list-table-header .header-title a{width:80px!important;opacity:1}.list-table-header .header-title a .sort-icon{position:absolute;left:50%;width:10px;height:10px;margin-left:-5px;color:inherit!important;font-size:10px;line-height:10px}.sort-icon.fa-sort-asc{top:2px}.sort-icon.fa-sort-desc{bottom:2px}.header-title.title a{font-size:0!important}.header-title.title a:after{content:"Title";font-size:12px!important}.list-item{position:relative;display:block;width:100%;border-radius:var(--list-items-radius);background:var(--bg)!important;border:none;margin-bottom:8px}.list-table-data{position:relative;display:flex;max-width:1060px;min-height:64px;align-items:center;font-size:0}.data{display:block!important;border:none!important;flex:0 0 auto;color:var(--text);font-size:12.5px}.list-table .list-table-data .data a{color:var(--text)!important;text-decoration:none!important}.list-table .list-table-data a:not(.edit-disabled):hover{color:var(--text-h)!important}.list-unit .loading-space{margin:14px 0 22px}.list-unit .loading-space #loading-spinner{width:20px;height:20px;margin:0 auto;color:var(--text)}.list-table[data-items="[]"]:after{content:"No entries found. Perhaps your search terms are too restrictive?";display:block;width:900px;background:var(--bg);border-radius:16px;margin:32px auto;color:var(--text);font:16px/32px Arial,Verdana,sans-serif;text-align:center}.data.status{position:absolute;top:3.5px;left:4px;width:72px!important;height:87px}.data.image{width:64px;height:64px;border-radius:50%;margin:4px 0 4px 8px;overflow:hidden;order:1}.data.image a{position:relative;top:-.5px;display:block!important}.data.image img{width:63.5px!important;height:79px!important;border:none!important;object-fit:cover}.data.image a:after{content:"\f14c";position:absolute;top:0px;left:.25px;display:block;width:99.1%;height:100%;background:rgba(0,0,0,.5);font-family:FontAwesome;color:#fff;font-size:30px;line-height:64px;opacity:0}.data.image a:hover:after{opacity:1}.data.number{position:relative;top:33px;left:13px;width:35px;height:20px;border:solid!important;border-width: 1px !important;background:var(--bg);border-radius:10px 10px 10px 10px;color:var(--number-text-color);margin:0 -45.2px 0 8px;order:1;line-height:20px;font-weight:700;z-index:1;pointer-events:none}.data.title,.data.type{height:16px;line-height:16px}.list-item:nth-child(n+101) .data.number{text-indent:auto}.list-item:nth-child(n+10001) .data.number{width:27px;margin-right:-35px}.list-item:nth-child(n+10001) .data.number{width:34px;margin-right:-42px}.data.title{position:relative;width:142px;padding:32px 0 0 8px!important;order:12;flex:1 0 auto}.data.title .link.sort{position:absolute;top:16px;left:8px;display:inline-block;max-width:100%;padding-right:16px;overflow:hidden;box-sizing:border-box;line-height:16px;white-space:nowrap;text-overflow:ellipsis}.list-table .list-table-data .title .link:hover{color:var(--accent)!important}.content-status{color:var(--text-dim)!important;font-size:12px!important}.content-status:before{content:"[ "url(https://imgur.com/X436Yqr.png)}.content-status:after{content:"] - "}.add-edit-more{display:inline;float:none!important;color:var(--text-dim)}.list-table .list-table-data .title .add-edit-more a{color:var(--text-dim)!important}.list-table .list-table-data .title .add-edit-more a:hover{color:var(--text-dim-h)!important}.icon-watch{display:none!important}.data.type{position:relative;top:-16px;width:92px;padding-left:8px!important;margin-right:-100px;order:11;text-align:left!important;color:var(--text-dim);font-size:10px}.data.score a,.data.score select{display:block;height:40px;border-radius:23px;line-height:40px}.data.score{position:relative;width:50px;height:35px;order:13;font-size:15px}.data.score a{width:40px;background:var(--btn-bg);border:solid;border-width:2px;border-color:rgba(100,100,100,1);margin:0 0 0 auto}.list-table .list-table-data .score a:not(.edit-disabled):hover{background:var(--btn-bg-h);color:var(--btn-text-h)!important}.data.score select{position:absolute;top:.75px;right:.75px;width:42px;height:43px;background:var(--btn-bg-h);color:var(--btn-text-h);box-shadow:none!important}.data.score select:focus{outline:0!important;box-shadow:0 2px 2px rgba(0,0,0,.3);font-size:15px}.data.chapter input,.data.progress input,.data.tags textarea,.data.volume input{border:1px solid var(--bg-dark);outline-color:var(--accent)!important;box-sizing:border-box}.data.chapter,.data.progress,.data.volume{width:95px;order:15;font-size:13px}.data.chapter{margin-top:-45px}.data.volume{margin:20px 0 0 -92px}.data.chapter span,.data.progress span,.data.volume span{color:var(--text)}.data.progress:before{content:"Progress:";color:var(--text-dim)}.data.chapter:before{content:"Chapters:";color:var(--text-dim)}.data.volume:before{content:"Volumes:";color:var(--text-dim)}.data.chapter span:only-of-type:after,.data.progress span:only-of-type:after,.data.volume span:only-of-type:after{content:" \f058";position:relative;top:0px;left:3px;color:var(--checkmark);font-family:FontAwesome;font-size:13px}.data.chapter input,.data.progress input,.data.volume input{height:15px;padding:0 1px;background:var(--btn-bg);color:var(--text-dark);font:11px Verdana,Arial,sans-serif}.data.priority{position:relative;width:92px;height:74px;background:var(--bg);margin-right:-92px;order:14;color:var(--text);line-height:74px;opacity:1;pointer-events:none;z-index:1}.status:not(.plantowatch):not(.plantoread)~.data.priority{display:none!important}.list-item:hover .data.priority{opacity:0}.data.priority:before{content:"\f0a2";font-family:FontAwesome}.data.magazine,.data.rated,.data.retail,.data.season,.data.storage{margin-right:4px;order:19;flex-shrink:1}.data.rated{width:40px}.data.magazine{width:90px}.data.retail,.data.storage{width:72px}.data.season{width:95px;order:20;font-size:13px}.data.magazine:before,.data.rated:before,.data.retail:before,.data.season:before,.data.storage:before{display:block;color:var(--text-dim)}.data.rated:before{content:"Rated:"}.data.magazine:before{content:"Magazine:"}.data.retail:before,.data.storage:before{content:"Storage:"}.data.season:before{content:"Premiered:"}.data.season:empty:after{content:"Unknown";display:block;color:var(--text-dim)}.data.licensor,.data.studio,.data.tags{width:120px;padding:3px 0!important;margin-right:8px;order:21;flex-shrink:1}.data.licensor span,.data.studio span,.data.tags span{display:block;padding:1px 0;font-size:0!important;line-height:0}.data.licensor a,.data.studio a,.data.tags a:not(.edit){display:block;padding:1px;background:var(--btn-bg);border-radius:8.5px;color:var(--text)!important;font-size:11px!important;line-height:15px}.list-table .list-table-data .licensor span a:hover,.list-table .list-table-data .studio span a:hover,.list-table .list-table-data .tags span a:hover{background:var(--btn-bg-h);color:var(--btn-text-h)!important}.data.licensor:empty:before,.data.studio:empty:before{display:block;padding:1px;color:var(--text-dim);font-size:10px;line-height:15px;white-space:pre}.data.studio:empty:before{content:"Unknown\aStudio"}.data.licensor:empty:before{content:"Unknown\aLicensor"}.data.tags textarea{position:absolute;top:50%;right:4px;z-index:5;width:530px!important;height:64px!important;background:var(--btn-bg);margin-top:-32px;resize:none;color:var(--text)}.data.tags a.edit{display: none,position:absolute;top:0;right:0;width:5px!important;height:100%!important;background:var(--edit-btn);text-align:left!important;font-size:0!important;opacity:0;z-index:1}.list-item:hover .data.tags a.edit{opacity:.7}.list-item:hover .data.tags a.edit:hover{width:25px!important;opacity:1}.data.tags a.edit:after{content:"\f040";position:absolute;top:50%;right:0;width:100%;height:20px;margin-top:-10px;color:var(--text);font:0/20px FontAwesome;text-align:center;opacity:0}.data.tags a.edit:hover:after{font-size:14px;opacity:1}.data.airing-finished,.data.airing-started,.data.days,.data.finished,.data.started{position:relative;width:100px;height:14px;overflow:hidden;order:25;color:var(--text);font-size:9px;line-height:14px;text-align:left!important;text-overflow:ellipsis}.data.started{top:-20px}.data.finished{top:0;margin-left:-100px}.data.days{top:20px;margin-left:-100px}.data.airing-started{top:-10px}.data.airing-finished{top:10px;margin-left:-100px}.data.airing-finished:before,.data.airing-started:before,.data.days:before,.data.finished:before,.data.started:before{display:inline-block;width:29px;padding-right:4px;border-right:1px solid var(--text-dim);text-align:right;color:var(--text-dim)}.data.started:before{content:"Start"}.data.finished:before{content:"End"}.data.days:before{content:"Days"}.anime .data.airing-started:before{content:"Aired"}.manga .data.airing-started:before{content:"Issued"}.data.airing-finished:before{content:"to"}.more-info{border:none!important}.more-info .td1{position:relative;padding-top:23px;color:var(--text-dark)}#footer-block:before,.more-info .td1>div>a,footer{position:absolute;left:0}.more-info .td1>div{margin:0}.more-info .td1>div>a{top:0;border-bottom:2px solid var(--accent)}.list-table .more-info .more-content a{color:var(--text-dark)!important}.list-table .more-info .more-content a:hover{color:var(--accent)!important}footer{bottom:var(--footer-gap);width:100%}#footer-block{min-width:1060px;height:32px;padding:16px 0;background:var(--bg)}#footer-block:before{content:var(--thirdcharacter);transform:scale(var(--thirdcharacter-scalesize),var(--thirdcharacter-scalesize));bottom:var(--thirdcharacter-spacing);left:var(--thirdcharacter-position);width:1060px;z-index:var(--thirdcharacter-zindex);min-width:1060px;height:0px;background:linear-gradient(to top,rgba(0,0,0,.1),rgba(0,0,0,0))}#copyright{padding:0px;color:var(--text-head);line-height:16px}#copyright:after{content:"\aList design by Valerio Lyndon. Customized by Paper2017.";white-space:pre}#fancybox-overlay{background:#000!important;opacity:.2!important}#fancybox-outer [class^=fancy-]{display:none}#fancybox-outer{background:var(--bg)!important;box-shadow:0 0 32px rgba(0,0,0,.5)}#fancybox-outer #fancybox-close{top:-13px;right:-13px;width:16px;height:16px;padding:2px;background:var(--btn-bg);border:3px solid var(--btn-text-h);border-radius:13px;color:var(--text);text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.2)}#fancybox-outer #fancybox-close:after{content:"\f00d";display:block;margin-top:-1px;font:16px/1 FontAwesome}#fancybox-outer #fancybox-close:hover{background:var(--text);color:var(--btn-text-h)}#advanced-options{top:64px;width:910px;padding:32px 0;background:var(--bg);border:none;box-shadow:0 0 32px rgba(0,0,0,.5);color:var(--text-dark)}#advanced-options .advanced-options-button,#advanced-options .advanced-options-header,#advanced-options [class*="-widget"]{width:100%;padding:0;border:none}#advanced-options .filter-widget:last-of-type,#advanced-options .sort-widget:last-of-type{padding-bottom:0}#advanced-options .filter,#advanced-options .sort{padding-bottom:32px}#advanced-options .advanced-options-header{font-size:0;line-height:26px;box-sizing:border-box}#advanced-options .advanced-options-header:before{display:inline-block;width:249px;height:100%;padding-bottom:7.5px;font-size:16px;line-height:26px;text-align:right}#advanced-options .filter .advanced-options-header:before{content:"Filter"}#advanced-options .sort .advanced-options-header:before{content:"Sort"}#advanced-options .advanced-options-header .description{display:inline-block;width:20px;margin:0;color:transparent;white-space:nowrap;vertical-align:top;transition:all .15s ease;pointer-events:none}#advanced-options .advanced-options-header .description:hover{color:inherit;pointer-events:auto}#advanced-options .advanced-options-header .description:before{content:"\f059";display:inline-block;width:20.5px;color:var(--icon);font:14px/1 FontAwesome;text-align:center;pointer-events:auto}#advanced-options .advanced-options-header .description:hover:before{color:var(--text-dim)}#advanced-options [class*="-widget"]{font-size:0;line-height:1;white-space:nowrap}#advanced-options [class*="-widget"]>*{font-size:12px;vertical-align:top}#advanced-options [class*="-widget"] .widget-header{width:250.5px;height:26px;padding:11px 7.5px 11px 0;border-right:2px solid var(--text-dim);margin-right:7.5px;line-height:26px;text-align:right}#advanced-options [class*="-widget"] span{line-height:26px}#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] label,#advanced-options [class*="-widget"] select,#advanced-options [class*="-widget"] span:not(.widget-header){height:26px;margin:11px 0;border-color:var(--text-dim)!important;border-radius:13px;box-sizing:border-box;color:var(--text-dark);font-size:12px}#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] select{padding:0 7.5px;background:0 0;outline:0}#advanced-options [class*="-widget"] select{padding-right:16px;background:url(https://i.imgur.com/hFijppc.png) center right/16px auto no-repeat}#advanced-options [class*="-widget"] input:focus,#advanced-options [class*="-widget"] option,#advanced-options [class*="-widget"] select:focus{background-color:var(--btn-bg)!important}#advanced-options :disabled,#advanced-options input:disabled+label{opacity:.5;color:var(--text)!important}#advanced-options .title input{width:387.5px!important}#advanced-options .filter-widget[class*="-status"] select{width:197.5px!important}#advanced-options .magazine select,#advanced-options .producer select{width:387.5px!important}#advanced-options .filter-widget[class*="-date"] span:nth-of-type(n+2){display:inline-block;width:40px;padding:0 3px 0 7.5px;border:1px solid var(--text-dim);border-right:none;border-radius:13px 0 0 13px;margin-right:0!important;line-height:24px;font-style:italic}#advanced-options .filter-widget[class*="-date"] span:nth-of-type(3){margin-left:7.5px!important}#advanced-options .filter-widget[class*="-date"] .day,#advanced-options .filter-widget[class*="-date"] .month,#advanced-options .filter-widget[class*="-date"] .year{border-radius:0;padding:0 16px 0 7.5px;border-left-width:0}#advanced-options .filter-widget[class*="-date"] .month,#advanced-options .filter-widget[class*="-date"] .year{border-right:none}#advanced-options .filter-widget[class*="-date"] .day{border-radius:0 13px 13px 0}#advanced-options .filter-widget[class*="-date"] .year{width:60px!important}#advanced-options .filter-widget[class*="-date"] .day,#advanced-options .filter-widget[class*="-date"] .month{width:45px!important}#advanced-options .aired-season .year{width:60px!important}#advanced-options .aired-season .season{width:130px!important;margin-left:7.5px}#advanced-options .first select,#advanced-options .second select{width:190px!important}#advanced-options .sort-widget input[type=radio]+label{width:92.25px!important;border-radius:13px;margin-left:7.5px;background:0 0!important;color:var(--text-dark);line-height:14px;transition:all .15s ease}#advanced-options .sort-widget input[type=radio]:not(:disabled)+label:hover{background:var(--btn-bg)!important}#advanced-options .sort-widget input[type=radio]:not(:disabled):checked+label{background:var(--text-dim)!important;border:1px solid var(--text-dim);color:var(--bg)!important}#advanced-options .sort-widget input[type=radio]:not(:checked)+label i{color:var(--icon)}#advanced-options #fancybox-close,#advanced-options .advanced-options-button a{width:90px;height:26px;padding:0;background:var(--btn-bg);border-radius:13px;box-shadow:0 1px 2px rgba(0,0,0,.2);color:var(--text-dark);line-height:26px;text-align:center}#advanced-options #fancybox-close:hover,#advanced-options .advanced-options-button a:hover{background:var(--btn-bg-h);color:var(--btn-text-h)}#advanced-options .advanced-options-button .btn-apply{margin:0 0 0 -106px}#advanced-options .advanced-options-button .btn-clear{margin:0 0 0 8px}#advanced-options #fancybox-close{left:50%;top:auto;bottom:32px;border:none;margin-left:53px}#advanced-options .btn-apply:before{content:"\f00c ";font-family:FontAwesome}#advanced-options .btn-clear:before{content:"\f12d ";font-family:FontAwesome}#advanced-options #fancybox-close:after{content:"\f00d Close";font:12px/26px Arial,FontAwesome,sans-serif} /* "Clarity" Modification by Valerio Lyndon / Hover Image / Revision 0.2 */ .data.image{overflow:visible}.data.image a:before{content:"";position:absolute;top:50%;left:-166px;width:150px;height:0;margin-top:0;background-repeat:no-repeat;background-position:center;background-size:cover;border-radius:8px;box-shadow:0 0 2px #000;opacity:0;pointer-events:none;-webkit-transition:all .3s ease;transition:all .3s ease;z-index:50}.data.image a:after,.data.image img{border-radius:50%}.data.image a:hover:before{height:200px;margin-top:-100px;opacity:1}.data.image a:after,.data.image img{border-radius:50%} /*Fix image TY to shishio-kun*/ footer:before { pointer-events: none !important; } /*horizontal tags*/ .list-table-data { padding-bottom: 17px; padding-top:4px; } .data.tags { position: absolute; left: -55px; top: 12px; display: -webkit-flex !important; display: -moz-flex !important; display: flex !important; width: 0; height: 100%; padding: 0 !important; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .data.tags div { max-width: 980px; margin: 0 0 20px 136px; font-size: 0; white-space: nowrap; } .data.tags span { display: inline-block; padding: 0; } .data.tags span a { padding: 1px 8px !important; margin-right: 4px; white-space: nowrap; } .data.tags span a[href*="\=Fav"] { padding: 0 !important; } .data.tags a.edit { right: -1060px; } .data.tags textarea { right: -1060px; } /*Custom Tag Colors*/ .data.tags a[href$="Horror"], .data.tags a[href*="Sports"], .data.tags a[href*="Demons"], .data.tags a[href*="Supernatural"], .data.tags a[href*="Action"], .data.tags a[href*="Samurai"] { color:#000000 !important; --btn-bg: #FF0101 !important; } .data.tags a[href$="Police"], .data.tags a[href*="Music"], .data.tags a[href*="Shounen"], .data.tags a[href*="Shounen&20Ai"], .data.tags a[href*="Adventure"] { color:#000000 !important; --btn-bg: #4682B4 !important; } .data.tags a[href*="Romance"], .data.tags a[href*="Harem"], .data.tags a[href*="Shoujo"], .data.tags a[href$="Ecchi"], .data.tags a[href*="Shoujo&20Ai"] { color:#000000 !important; --btn-bg: #F453FF !important; } .data.tags a[href*="Hentai"], .data.tags a[href*="Yuri"], .data.tags a[href*="Yaoi"] { color:#000000 !important; --btn-bg: #F453FF !important; cursor: url(https://imgur.com/lZFGZ1D.png) 25 25, auto; } .data.tags a[href$="Dementia"], .data.tags a[href*="Military"], .data.tags a[href*="Mystery"], .data.tags a[href*="Thriller"] { color:#000000 !important; --btn-bg: #646464 !important; } .data.tags a[href$="Psychological"], .data.tags a[href*="Vampire"], .data.tags a[href*="Sci-Fi"], .data.tags a[href$="Space"] { color:#000000 !important; --btn-bg: #909090 !important; } .data.tags a[href$="Slice%20of%20Life"], .data.tags a[href*="Parody"], .data.tags a[href*="School"], .data.tags a[href*="Kids"], .data.tags a[href$="Comedy"] { color:#000000 !important; --btn-bg: #D5D500 !important; } .data.tags a[href$="Josei"], .data.tags a[href*="Drama"], .data.tags a[href*="Doujinshi"] { color:#000000 !important; --btn-bg: #B301FF !important; } .data.tags a[href$="Magic"], .data.tags a[href*="Fantasy"], .data.tags a[href*="Mecha"] { color:#000000 !important; --btn-bg: #6BE103 !important; } .data.tags a[href$="Game"], .data.tags a[href*="Cars"], .data.tags a[href*="Super%20Power"], .data.tags a[href*="Gender&20Bender"] { color:#000000 !important; --btn-bg: #FF8001 !important; } .data.tags a[href$="Historical"], .data.tags a[href*="Martial%20Arts"], .data.tags a[href*="Seinen"] { color:#000000 !important; --btn-bg: #D2691E !important; } .cover-block { z-index: 25; } .header { z-index: 30; } /*data number stuff / picture radius*/ .data.image a, .data.image img, .data.image, .data.status, .data.image a:hover:after { border-radius: 8px; } .data.number { background: rgba(255,255,255,1)!important; border-color: rgba(100,100,100,1)!important; } .data.score { background:rgba(255,255,255,1); } /*Avatar Stuff*/ .status-menu:after,.icon-menu.profile, status-menu-container:after{ border-color:rgb(255,255,255,1); background-color:rgb(255,255,255,1); border-width:8px; top:-51px; transform:scale(1); } .status-menu-container { position: relative; z-index: 25 !important;} /*Note on header Header*/ .status-menu-container:after { content:"Free Will - One Piece"; transform:scale(1,1); left:0px; top:-27px; font-family:Oswald; font-size:20px; font-weight: 450; } /*List Position stuff/button fixes*/ .list-item,.list-status-title{ left:80px } .list-table>tbody:first-of-type{ left:1112px;/*1032px more*/ } .list-stats{ left:25%; } .status-menu-container .search-container{ top:19px; right:-80px/*negative of .list-item*/ } /*Character Stuff*/ footer:before { content: ""; position: fixed; top: 2.28%; z-index: -1; width: calc(50% - 538px); min-width: 262px; height: 100%; transform:scale(.95); background: transparent no-repeat center bottom / contain scroll; } footer:after { content: ""; position: fixed; top: 2.8%; z-index: -1; width: calc(50% - 538px); min-width: 262px; height: 100%; transform:scale(.78); background: transparent no-repeat center bottom / contain scroll; } /* Left Render */ footer:before { right: calc(100% - (50% - 475px)); background-position: left bottom -12px; } /* Right Render */ footer:after { left: calc(100% - (50% - 510px)); background-position: right bottom -12px; } /*Change Banner Height here*/ :root { --banner-height: 160px; } .cover-block { height: var(--banner-height); } .header { margin-top: calc(var(--banner-height) - 36px); } .list-stats { top: calc(var(--banner-height) + 98px); } |
Feb 19, 2021 9:04 PM
#371
Paper2017 said: Hi, I have two things I need some help with. One is something that broke and the other is just a quality of life thing I want to change. 1. When I hover over the image for an anime on my list, that image is supposed to pop up on the side. Instead, it is just showing an outline of where the image would be. The outline is the right size but just has nothing in it. I don't know how I broke this but it happened when I was changing my list to make it Nico Robin themed. 2. This one is probably easy to do but I've been struggling with trying to do it on my own. When you scroll down on my list, the avatar shrinks to fit on the header. I just want it to be clickable when it is small. That way I don't have to scroll all the way up just to go back to my profile. Thanks in advance. @\import "https://fonts.googleapis.com/css?family=Oswald"; @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore"; /* BANNER BACKGROUND To change background images: Delete what's in the parenthesis. Upload the new background to Imgur or a similar site, then copy the direct link (or Original GIF link if it's animated) and paste it into the parenthesis. Save. */ :root { --banner: url(https://imgur.com/v7xokzI.jpg)!important;} /* BANNER TEXT*/ :root { --name: url(https://imgur.com/hsfQZdO.png) !Important; --namestart:70px; --nameend:125px; --namescale:.75; } /* BANNER AVATAR (Profile Spot) */ :root { --avatar: url(https://imgur.com/6Ma5r6g.png) !important; } /* BANNER CHARACTER (Character On BANNER)*/ :root { --character: url() !important; } /* WALLPAPER stuff. Based on Layers*/ :root { --wallpaper: var(--wallpaper1) ,var(--wallpaper2),var(--wallpaper3),var(--wallpaper4),var(--wallpaper5),var(--wallpaper-color) !important; /*Wallpaper Layers. 1 is first layer, 2 is second layer etc.*/ --wallpaper1:url(https://imgur.com/Vd23sGI.gif)fixed left / 110%; --wallpaper2:url(https://imgur.com/sJRbr5q.png)no-repeat fixed bottom /100%; --wallpaper3:url()no-repeat fixed; --wallpaper4:url()no-repeat fixed 50% 60%/300px; --wallpaper5:url()fixed right / 100%; --wallpaper-color:rgb(0,35,140,1); } /*rgb(0,35,100,1)*/ /* LEFT CHARACTER BY LIST */ footer:before { background-image: url(https://imgur.com/tsRNHDz.png) !important; } /* RIGHT CHARACTER BY LIST */ footer:after { background-image: url() !important; } /*Third Character(fixed to footer) and adjustments*/ :root { --thirdcharacter: url(https://imgur.com/ty3HIrb.png) !Important; --footer-gap: -190px; --thirdcharacter-spacing:340px; --thirdcharacter-position:500px; --thirdcharacter-zindex:-1; --thirdcharacter-scalesize:.25; } /*Fourth Character(Top of List) and adjustments*/ :root { --fourthcharacter: url() !Important; --header-gap: 97px; --button-fix:59px;/*Roughly 38 LOWER than header gap*/ --fourthcharacter-spacing:-45px; --fourthcharacter-position:155px; /*z-index won't work for this*/ --fourthcharacter-scalesize:.15; --stats-padding-height:2px; --stats-padding-width:15px; --stats-spacing:15px; --stats-opacity:.6; } /* TABLE COLORS and EDITS*/ :root { --bg: rgba(255,255,255,1); --list-items-radius: 5px; --number-text-color:rgb(0,0,0,1); } /* OTHER CODES*/ body:before { width: 100%; height: 100%; display: block; position: fixed; left: 0; top:0; content: ""; } #search-box:after,.open~#search-button{pointer-events:none}:root{--name:none;--avatar:none;--banner:url(https://i.imgur.com/VoPJz2S.jpg);--character:url(https://i.imgur.com/6IPyngH.png);--pbg:var(--wallpaper);var(--bg);--text:#1C1C1C ;--text-h:#787878;--text-dim:#737373;--text-dim-h:#646464;--text-dark:#111;--icon:#1C1C1C ;--accent:#4065ba;--btn-bg:#DDDDDD;--btn-bg-h:#1C1C1C ;--btn-head-bg-h:#1d439b;--btn-text-h:#fff;--bg-dark:#ddd;--text-head:#737373;--text-head-h:#2F4F4F;--watching:#2db039;--completed:#26448f;--onhold:#f9d457;--dropped:#a12f31;--plantowatch:#c3c3c3;--cover-bg:#323232;--edit-btn:#d9d9d9;--checkmark:rgb(52, 127, 0 ,1)}#advanced-options .advanced-options-button a,#fancybox-close,#search-box,#search-box input,#search-box:after,.data.chapter,.data.image .link:after,.data.licensor a,.data.priority,.data.progress,.data.score a,.data.studio a,.data.tags a,.data.tags a.edit:after,.data.volume,.fixed .status-menu:after,.header .header-title:after,.icon-menu svg,.icon-menu.setting,.icon-menu.setting .text,.icon-menu.setting .text a,.icon-menu:after,.icon-menu:before,.list-table .list-table-header .header-title .link.sort,.list-table-header .header-title,.status-button:after,.status-menu-container.fixed .status-menu,.status-menu-container:not(.fixed) .status-menu,.status-menu:after{transition:all .3s ease!important}#advanced-options .advanced-options-header .description,#advanced-options .advanced-options-header .description:before,#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] label,#advanced-options [class*="-widget"] select,#search-button i,.header-info a,.list-table-data a,.more-info .td1>div>a{transition:all .15s ease!important}.header .header-title,.header-info,.icon-menu,.icon-menu.quick-add:before,.list-menu-float .icon-menu,.list-table>tbody:first-of-type:after,.stats a{display:inline-block;height:26px!important;width:26px!important;background:var(--bg)!important;border-radius:8px;color:var(--text)!important;font:400 0/26px Arial,Verdana,sans-serif;text-indent:0;text-align:left;white-space:nowrap;vertical-align:top;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:all .3s ease!important}.header .header-title:hover,.icon-menu:hover,.list-menu-float .icon-menu:hover,.stats a:hover{width:100px!important;background:var(--btn-head-bg-h)!important;color:var(--btn-text-h)!important}html{position:relative;min-height:100%}body{padding-bottom:64px;background:var(--pbg) no-repeat center / cover fixed!important}.list-container{position:static;width:100%;background:0 0!important;border:none}.list-block{width:1060px;min-height:initial;margin:64px auto 0}.status-menu-container.fixed+.list-block{margin-top:128px!important}.list-unit{width:100%!important;margin:0}.cover-block,.cover-block:before{left:0;width:100%;position:absolute}.list-table{border:none!important}a,a:hover{color:var(--accent)}.initialize-tutorial{display:none!important}.cover-block{top:0;z-index:-5;min-width:1060px;height:318px;background:center center/cover no-repeat var(--cover-bg);background-image:var(--banner)}.cover-block:before{content:var(--fourthcharacter);transform:scale(var(--fourthcharacter-scalesize),var(--fourthcharacter-scalesize));bottom:var(--fourthcharacter-spacing);left:var(--fourthcharacter-position);display:block;height:50px;background:linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0))}#cover-image,.btn-list-setting{display:none!important}.cover-block .image-container{display:block!important;width:1060px;height:100%;padding:0;background:right center/contain no-repeat var(--character);margin:10px -725px auto;}#cover-image-container:after{content:var(--name);transform:scale(var(--namescale),var(--namescale));position:absolute;bottom:5px;left:50%;margin-left:var(--nameend);color:#fff;font:700 60px/60px Oswald;text-align:left;letter-spacing:15px;text-shadow:1px 4px 7px rgba(0,0,0,.45);text-transform:uppercase;white-space:pre;transform:scale(.6) perspective(350px) rotateY() rotateZ();animation:name-slide 2s 1 .5s backwards}@keyframes name-slide{0%{bottom:25px;margin-left:var(--namestart);opacity:0;letter-spacing:0;animation-timing-function:ease-out}90%{bottom:5px;margin-left:var(--nameend)}100%{letter-spacing:15px;opacity:1;animation-timing-function:cubic-bezier(0,0,.75,1)}}.header{display:flex;height:36px;margin-top:282px}.header .header-menu{position:static;display:flex;width:auto;height:26px;margin-left:6px;order:2}.btn-menu{height:0;font-size:0!important}.btn-menu #header-menu-button{display:none}.header .header-title{position:static;margin-left:155px;order:1;z-index:1}.header .header-title:before{content:"\f015";display:inline-block;width:26px;background:0 0!important;font-size:14px;font-family:FontAwesome;text-align:center!important}.header .header-title:hover:before{color:var(--btn-text-h)!important}.header .header-title:after{content:"Home";display:inline-block;height:26px!important;width:26px!important;font:14px/26px Arial,Verdana,sans-serif;color:var(--text)}#search-box:after,.status-menu:after{content:""}.header .header-title:hover:after{color:var(--btn-text-h)}.header .header-menu .list-menu{position:static;order:1;display:inline-block;height:26px;border:none;background:0 0;box-shadow:none}.header .icon-menu.anime-list,.header .icon-menu.manga-list{position:static;padding:0;margin-right:6px;font-size:0!important;font-weight:400!important}.header .icon-menu.anime-list .text,.header .icon-menu.manga-list .text{position:static!important;font:14px/26px Arial,Verdana,sans-serif;vertical-align:top}.header .header-menu .list-menu .icon-menu svg.icon{position:static;max-width:14px;max-height:14px;padding:6px;fill:var(--text)}.header .header-menu .list-menu .icon-menu:hover svg.icon{fill:var(--btn-text-h)}.header-info{position:static;width:auto!important;padding:0 8px;margin:0!important;font-size:12px;order:2}.header-info a{color:var(--text)!important;text-decoration:none!important}.header-info a:hover{color:var(--text-h)!important}.btn-menu a.username{position:absolute;left:1px;top:-7px;display:block;width:150px;height:150px;background:0 0;border-radius:50%;font-size:0;z-index:36}.btn-menu span.username{display:none!important}.status-menu-container{position:relative;z-index:35!important;width:100%;min-width:1060px;height:64px;background:0 0;border:none!important}.status-menu-container.fixed{z-index:4500!important}.status-menu-container:after,.status-menu-container:before{content:"";position:absolute;left:0;z-index:-1;display:block;width:100%}.status-menu-container:before{top:0;height:64px;background:var(--bg)}.status-menu-container:after{top:64px;height:2px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0))}.status-menu{position:relative;display:block!important;width:1060px;padding:0 0 0 173px;margin:0 auto;box-sizing:border-box}.fixed .status-menu{padding:0 0 0 71px}.status-menu:after{position:absolute;top:-51px;left:-8px;width:150px;height:150px;background:center top/cover no-repeat var(--bg-dark);background-image:var(--avatar);border:8px solid var(--bg);border-radius:50%;opacity:1;box-shadow:0 1px 2px rgba(0,0,0,.2)}.fixed .status-menu:after{border-width:2px;top:6px;width:48px;height:48px;box-shadow:none}.status-menu .status-button{display:inline-block!important;height:32px;padding:16px 0!important;margin:0 15px!important;color:var(--text-head)!important;font-size:17.6px!important;line-height:30px;white-space:nowrap;font-family:Oswald!important;text-transform:uppercase;letter-spacing:1px}.status-menu .status-button.on{color:var(--text-head-h)!important}.status-button.all_anime:after{background:var(--accent)!important}.status-button.reading:after,.status-button.watching:after{background:var(--watching)!important}.status-button.completed:after{background:var(--completed)!important}.status-button.onhold:after{background:var(--onhold)!important}.status-button.dropped:after{background:var(--dropped)!important}.status-button.plantoread:after,.status-button.plantowatch:after{background:var(--plantowatch)!important}.status-menu-container .search-container{top:19px;right:0}#search-box{padding-right:22px;border:2px solid transparent;border-radius:13px;margin-top:0!important}#search-box.open{width:150px!important;background:var(--btn-bg);border:2px solid var(--bg-dark)}#search-box input{background:0 0;border:none;border-radius:13px;outline:0}#search-box.open input{text-indent:7.5px;line-height:20px}.status-menu-container .search-container #search-button{position:absolute;right:0;top:0;width:26px;height:26px;border-radius:13px;margin-top:0;text-align:center}#search-button i{color:var(--text-head)!important;font-size:18px;line-height:26px}.open~#search-button i{font-size:14px;line-height:24px}#search-box:after{position:absolute;right:0;top:0;width:0;height:22px;padding-right:22px;background:linear-gradient(to right,var(--btn-bg) 2px,transparent 9.5px,transparent 142.5px,var(--btn-bg) 150px) content-box;border:2px solid transparent;border-radius:13px;opacity:0}#search-box.open:after{width:150px;opacity:1}.list-menu-float{position:relative;top:auto;display:block;width:904px;height:0;padding-left:155px;margin:0 auto;border:none;background:0 0;text-align:left;font-size:0;z-index:38}.icon-menu,.list-menu-float form{display:inline-block!important}.list-menu-float .icon-menu{top:74px;margin:0 6px 0 0}.list-menu-float .icon-menu .text{top:0!important;left:26px!important;display:inline-block;width:auto!important;height:26px;color:var(--text)!important;font-size:14px!important;opacity:1!important}.list-menu-float .icon-menu:hover .text{color:var(--btn-text-h)!important}.list-menu-float .icon-menu svg.icon{top:6px!important;left:6px!important;max-width:14px;max-height:14px;fill:var(--text)}.list-menu-float .icon-menu:hover svg.icon{fill:var(--btn-text-h)}[data-owner="1"] .list-menu-float .icon-menu.profile{position:absolute;left:1px;top:-43px;display:block!important;width:150px!important;height:150px!important;background:0 0!important;border-radius:50%;font-size:0;box-shadow:none}[data-owner=""] .icon-menu.profile{background-image:none!important}[data-owner=""] .icon-menu.profile:before{content:"\f007";position:absolute;top:0;left:0;display:block;width:26px;height:26px;font-size:14px;line-height:26px;text-align:center;color:var(--text);font-family:FontAwesome}[data-owner=""] .icon-menu.profile:hover:before{color:var(--btn-text-h)}[data-owner=""] .icon-menu.profile:after{content:"Profile";position:absolute;top:0;left:26px;display:inline-block;height:26px;font-size:14px;color:var(--text)}[data-owner=""] .icon-menu.profile:hover:after{color:var(--btn-text-h)}.icon-menu.quick-add:hover:before,.icon-menu.setting .text a{color:var(--btn-text-h)!important}.icon-menu.quick-add svg{display:none}.icon-menu.quick-add:before{content:"\f067";background:0 0!important;font-size:14px;text-align:center;font-family:FontAwesome;box-shadow:none}.icon-menu.setting{overflow:visible}.icon-menu.setting:hover{width:26px!important}.icon-menu.setting .text{top:-2px!important;left:0!important;width:240px!important;height:26px!important;padding:2px 0;overflow:visible;font-size:0!important;opacity:1!important;pointer-events:none;z-index:-1}.icon-menu.setting:hover .text{pointer-events:auto}.icon-menu.setting .text a{position:absolute!important;top:2px!important;left:13px!important;width:0!important;height:26px!important;background:var(--btn-bg-h)!important;border:none!important;border-radius:0 13px 13px 0;overflow:hidden;font:14px/26px Arial,Verdana,sans-serif!important;text-indent:7.5px;text-align:center;white-space:nowrap;opacity:0!important}.icon-menu.setting:hover .text a{width:120px!important;border-radius:0 13px 13px 0;opacity:1!important}.icon-menu.setting:hover .text .link-list-setting{left:120px!important}.icon-menu.setting .text a:hover{background:var(--btn-head-bg-h)!important}.list-status-title{width:1060px!important;height:var(--header-gap)!important;margin-top:-64px;background:0 0!important}.list-status-title .text{display:none!important}.list-status-title .stats{position:absolute;top:10px;right:32px!important;z-index:1000;display:block;width:auto;height:26px!important;border-radius:0 0 26px;font-size:0;line-height:13px!important}.stats a{margin:0 0 0 6px!important;font:14px/26px Arial,Verdana,sans-serif}.stats a i{width:26px;text-align:center}.list-stats{position:absolute;top:30px;margin-top:var(--stats-spacing);padding:var(--stats-padding-height);padding-left:var(--stats-padding-width);padding-right:var(--stats-padding-width);width:auto!important;z-index:1000;background:rgba(0,0,0,var(--stats-opacity))!important;color:#FFFFFF;border-radius:15px;!important;font-weight:700}.list-table>tbody:first-of-type{position:relative;top:calc(-1*var(--button-fix));margin-top:-30px;left:1032px;display:block;width:30px;height:30px;background:0 0!important;z-index:1000}.list-table>tbody:first-of-type:after{content:"\f0dc";position:absolute;top:0px;right:0;margin:2px;font-size:14px;font-family:FontAwesome;text-align:center}.list-table>tbody:first-of-type:hover:after{background:var(--btn-head-bg-h)!important;color:var(--btn-text-h)!important}.list-table-header{position:absolute;top:0;right:15px;display:block;width:auto;height:26px;padding:2px 0;font-size:0;white-space:nowrap;pointer-events:none;z-index:-1}.list-table>tbody:first-of-type:hover .list-table-header{pointer-events:auto}.list-table-header .header-title{position:relative;display:inline-block!important;width:auto!important;height:auto!important;padding:0!important;border:none!important;background:0 0!important;font-weight:400!important}.list-table>tbody:first-of-type:hover .header-title{opacity:1}.list-table-header .header-title a{display:block!important;width:13px!important;height:26px!important;background:var(--btn-bg-h)!important;border-radius:13px 0 0 13px;margin-left:-13px;overflow:hidden;box-sizing:border-box;color:var(--btn-text-h)!important;font:12px/26px Verdana,Arial,sans-serif!important;text-align:center!important;text-indent:-7.5px;white-space:normal!important;opacity:0}.list-table-header .header-title a.hover_info,.list-table-header .header-title.tags{display:none!important}tbody:first-of-type:hover .list-table-header .header-title.finished a,tbody:first-of-type:hover .list-table-header .header-title.started a{padding:0 13px}.data,.data.status{padding:0!important}.list-table-header .header-title a:hover{background:var(--btn-head-bg-h)!important}tbody:first-of-type:hover .list-table-header .header-title a{width:80px!important;opacity:1}.list-table-header .header-title a .sort-icon{position:absolute;left:50%;width:10px;height:10px;margin-left:-5px;color:inherit!important;font-size:10px;line-height:10px}.sort-icon.fa-sort-asc{top:2px}.sort-icon.fa-sort-desc{bottom:2px}.header-title.title a{font-size:0!important}.header-title.title a:after{content:"Title";font-size:12px!important}.list-item{position:relative;display:block;width:100%;border-radius:var(--list-items-radius);background:var(--bg)!important;border:none;margin-bottom:8px}.list-table-data{position:relative;display:flex;max-width:1060px;min-height:64px;align-items:center;font-size:0}.data{display:block!important;border:none!important;flex:0 0 auto;color:var(--text);font-size:12.5px}.list-table .list-table-data .data a{color:var(--text)!important;text-decoration:none!important}.list-table .list-table-data a:not(.edit-disabled):hover{color:var(--text-h)!important}.list-unit .loading-space{margin:14px 0 22px}.list-unit .loading-space #loading-spinner{width:20px;height:20px;margin:0 auto;color:var(--text)}.list-table[data-items="[]"]:after{content:"No entries found. Perhaps your search terms are too restrictive?";display:block;width:900px;background:var(--bg);border-radius:16px;margin:32px auto;color:var(--text);font:16px/32px Arial,Verdana,sans-serif;text-align:center}.data.status{position:absolute;top:3.5px;left:4px;width:72px!important;height:87px}.data.image{width:64px;height:64px;border-radius:50%;margin:4px 0 4px 8px;overflow:hidden;order:1}.data.image a{position:relative;top:-.5px;display:block!important}.data.image img{width:63.5px!important;height:79px!important;border:none!important;object-fit:cover}.data.image a:after{content:"\f14c";position:absolute;top:0px;left:.25px;display:block;width:99.1%;height:100%;background:rgba(0,0,0,.5);font-family:FontAwesome;color:#fff;font-size:30px;line-height:64px;opacity:0}.data.image a:hover:after{opacity:1}.data.number{position:relative;top:33px;left:13px;width:35px;height:20px;border:solid!important;border-width: 1px !important;background:var(--bg);border-radius:10px 10px 10px 10px;color:var(--number-text-color);margin:0 -45.2px 0 8px;order:1;line-height:20px;font-weight:700;z-index:1;pointer-events:none}.data.title,.data.type{height:16px;line-height:16px}.list-item:nth-child(n+101) .data.number{text-indent:auto}.list-item:nth-child(n+10001) .data.number{width:27px;margin-right:-35px}.list-item:nth-child(n+10001) .data.number{width:34px;margin-right:-42px}.data.title{position:relative;width:142px;padding:32px 0 0 8px!important;order:12;flex:1 0 auto}.data.title .link.sort{position:absolute;top:16px;left:8px;display:inline-block;max-width:100%;padding-right:16px;overflow:hidden;box-sizing:border-box;line-height:16px;white-space:nowrap;text-overflow:ellipsis}.list-table .list-table-data .title .link:hover{color:var(--accent)!important}.content-status{color:var(--text-dim)!important;font-size:12px!important}.content-status:before{content:"[ "url(https://imgur.com/X436Yqr.png)}.content-status:after{content:"] - "}.add-edit-more{display:inline;float:none!important;color:var(--text-dim)}.list-table .list-table-data .title .add-edit-more a{color:var(--text-dim)!important}.list-table .list-table-data .title .add-edit-more a:hover{color:var(--text-dim-h)!important}.icon-watch{display:none!important}.data.type{position:relative;top:-16px;width:92px;padding-left:8px!important;margin-right:-100px;order:11;text-align:left!important;color:var(--text-dim);font-size:10px}.data.score a,.data.score select{display:block;height:40px;border-radius:23px;line-height:40px}.data.score{position:relative;width:50px;height:35px;order:13;font-size:15px}.data.score a{width:40px;background:var(--btn-bg);border:solid;border-width:2px;border-color:rgba(100,100,100,1);margin:0 0 0 auto}.list-table .list-table-data .score a:not(.edit-disabled):hover{background:var(--btn-bg-h);color:var(--btn-text-h)!important}.data.score select{position:absolute;top:.75px;right:.75px;width:42px;height:43px;background:var(--btn-bg-h);color:var(--btn-text-h);box-shadow:none!important}.data.score select:focus{outline:0!important;box-shadow:0 2px 2px rgba(0,0,0,.3);font-size:15px}.data.chapter input,.data.progress input,.data.tags textarea,.data.volume input{border:1px solid var(--bg-dark);outline-color:var(--accent)!important;box-sizing:border-box}.data.chapter,.data.progress,.data.volume{width:95px;order:15;font-size:13px}.data.chapter{margin-top:-45px}.data.volume{margin:20px 0 0 -92px}.data.chapter span,.data.progress span,.data.volume span{color:var(--text)}.data.progress:before{content:"Progress:";color:var(--text-dim)}.data.chapter:before{content:"Chapters:";color:var(--text-dim)}.data.volume:before{content:"Volumes:";color:var(--text-dim)}.data.chapter span:only-of-type:after,.data.progress span:only-of-type:after,.data.volume span:only-of-type:after{content:" \f058";position:relative;top:0px;left:3px;color:var(--checkmark);font-family:FontAwesome;font-size:13px}.data.chapter input,.data.progress input,.data.volume input{height:15px;padding:0 1px;background:var(--btn-bg);color:var(--text-dark);font:11px Verdana,Arial,sans-serif}.data.priority{position:relative;width:92px;height:74px;background:var(--bg);margin-right:-92px;order:14;color:var(--text);line-height:74px;opacity:1;pointer-events:none;z-index:1}.status:not(.plantowatch):not(.plantoread)~.data.priority{display:none!important}.list-item:hover .data.priority{opacity:0}.data.priority:before{content:"\f0a2";font-family:FontAwesome}.data.magazine,.data.rated,.data.retail,.data.season,.data.storage{margin-right:4px;order:19;flex-shrink:1}.data.rated{width:40px}.data.magazine{width:90px}.data.retail,.data.storage{width:72px}.data.season{width:95px;order:20;font-size:13px}.data.magazine:before,.data.rated:before,.data.retail:before,.data.season:before,.data.storage:before{display:block;color:var(--text-dim)}.data.rated:before{content:"Rated:"}.data.magazine:before{content:"Magazine:"}.data.retail:before,.data.storage:before{content:"Storage:"}.data.season:before{content:"Premiered:"}.data.season:empty:after{content:"Unknown";display:block;color:var(--text-dim)}.data.licensor,.data.studio,.data.tags{width:120px;padding:3px 0!important;margin-right:8px;order:21;flex-shrink:1}.data.licensor span,.data.studio span,.data.tags span{display:block;padding:1px 0;font-size:0!important;line-height:0}.data.licensor a,.data.studio a,.data.tags a:not(.edit){display:block;padding:1px;background:var(--btn-bg);border-radius:8.5px;color:var(--text)!important;font-size:11px!important;line-height:15px}.list-table .list-table-data .licensor span a:hover,.list-table .list-table-data .studio span a:hover,.list-table .list-table-data .tags span a:hover{background:var(--btn-bg-h);color:var(--btn-text-h)!important}.data.licensor:empty:before,.data.studio:empty:before{display:block;padding:1px;color:var(--text-dim);font-size:10px;line-height:15px;white-space:pre}.data.studio:empty:before{content:"Unknown\aStudio"}.data.licensor:empty:before{content:"Unknown\aLicensor"}.data.tags textarea{position:absolute;top:50%;right:4px;z-index:5;width:530px!important;height:64px!important;background:var(--btn-bg);margin-top:-32px;resize:none;color:var(--text)}.data.tags a.edit{display: none,position:absolute;top:0;right:0;width:5px!important;height:100%!important;background:var(--edit-btn);text-align:left!important;font-size:0!important;opacity:0;z-index:1}.list-item:hover .data.tags a.edit{opacity:.7}.list-item:hover .data.tags a.edit:hover{width:25px!important;opacity:1}.data.tags a.edit:after{content:"\f040";position:absolute;top:50%;right:0;width:100%;height:20px;margin-top:-10px;color:var(--text);font:0/20px FontAwesome;text-align:center;opacity:0}.data.tags a.edit:hover:after{font-size:14px;opacity:1}.data.airing-finished,.data.airing-started,.data.days,.data.finished,.data.started{position:relative;width:100px;height:14px;overflow:hidden;order:25;color:var(--text);font-size:9px;line-height:14px;text-align:left!important;text-overflow:ellipsis}.data.started{top:-20px}.data.finished{top:0;margin-left:-100px}.data.days{top:20px;margin-left:-100px}.data.airing-started{top:-10px}.data.airing-finished{top:10px;margin-left:-100px}.data.airing-finished:before,.data.airing-started:before,.data.days:before,.data.finished:before,.data.started:before{display:inline-block;width:29px;padding-right:4px;border-right:1px solid var(--text-dim);text-align:right;color:var(--text-dim)}.data.started:before{content:"Start"}.data.finished:before{content:"End"}.data.days:before{content:"Days"}.anime .data.airing-started:before{content:"Aired"}.manga .data.airing-started:before{content:"Issued"}.data.airing-finished:before{content:"to"}.more-info{border:none!important}.more-info .td1{position:relative;padding-top:23px;color:var(--text-dark)}#footer-block:before,.more-info .td1>div>a,footer{position:absolute;left:0}.more-info .td1>div{margin:0}.more-info .td1>div>a{top:0;border-bottom:2px solid var(--accent)}.list-table .more-info .more-content a{color:var(--text-dark)!important}.list-table .more-info .more-content a:hover{color:var(--accent)!important}footer{bottom:var(--footer-gap);width:100%}#footer-block{min-width:1060px;height:32px;padding:16px 0;background:var(--bg)}#footer-block:before{content:var(--thirdcharacter);transform:scale(var(--thirdcharacter-scalesize),var(--thirdcharacter-scalesize));bottom:var(--thirdcharacter-spacing);left:var(--thirdcharacter-position);width:1060px;z-index:var(--thirdcharacter-zindex);min-width:1060px;height:0px;background:linear-gradient(to top,rgba(0,0,0,.1),rgba(0,0,0,0))}#copyright{padding:0px;color:var(--text-head);line-height:16px}#copyright:after{content:"\aList design by Valerio Lyndon. Customized by Paper2017.";white-space:pre}#fancybox-overlay{background:#000!important;opacity:.2!important}#fancybox-outer [class^=fancy-]{display:none}#fancybox-outer{background:var(--bg)!important;box-shadow:0 0 32px rgba(0,0,0,.5)}#fancybox-outer #fancybox-close{top:-13px;right:-13px;width:16px;height:16px;padding:2px;background:var(--btn-bg);border:3px solid var(--btn-text-h);border-radius:13px;color:var(--text);text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.2)}#fancybox-outer #fancybox-close:after{content:"\f00d";display:block;margin-top:-1px;font:16px/1 FontAwesome}#fancybox-outer #fancybox-close:hover{background:var(--text);color:var(--btn-text-h)}#advanced-options{top:64px;width:910px;padding:32px 0;background:var(--bg);border:none;box-shadow:0 0 32px rgba(0,0,0,.5);color:var(--text-dark)}#advanced-options .advanced-options-button,#advanced-options .advanced-options-header,#advanced-options [class*="-widget"]{width:100%;padding:0;border:none}#advanced-options .filter-widget:last-of-type,#advanced-options .sort-widget:last-of-type{padding-bottom:0}#advanced-options .filter,#advanced-options .sort{padding-bottom:32px}#advanced-options .advanced-options-header{font-size:0;line-height:26px;box-sizing:border-box}#advanced-options .advanced-options-header:before{display:inline-block;width:249px;height:100%;padding-bottom:7.5px;font-size:16px;line-height:26px;text-align:right}#advanced-options .filter .advanced-options-header:before{content:"Filter"}#advanced-options .sort .advanced-options-header:before{content:"Sort"}#advanced-options .advanced-options-header .description{display:inline-block;width:20px;margin:0;color:transparent;white-space:nowrap;vertical-align:top;transition:all .15s ease;pointer-events:none}#advanced-options .advanced-options-header .description:hover{color:inherit;pointer-events:auto}#advanced-options .advanced-options-header .description:before{content:"\f059";display:inline-block;width:20.5px;color:var(--icon);font:14px/1 FontAwesome;text-align:center;pointer-events:auto}#advanced-options .advanced-options-header .description:hover:before{color:var(--text-dim)}#advanced-options [class*="-widget"]{font-size:0;line-height:1;white-space:nowrap}#advanced-options [class*="-widget"]>*{font-size:12px;vertical-align:top}#advanced-options [class*="-widget"] .widget-header{width:250.5px;height:26px;padding:11px 7.5px 11px 0;border-right:2px solid var(--text-dim);margin-right:7.5px;line-height:26px;text-align:right}#advanced-options [class*="-widget"] span{line-height:26px}#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] label,#advanced-options [class*="-widget"] select,#advanced-options [class*="-widget"] span:not(.widget-header){height:26px;margin:11px 0;border-color:var(--text-dim)!important;border-radius:13px;box-sizing:border-box;color:var(--text-dark);font-size:12px}#advanced-options [class*="-widget"] input,#advanced-options [class*="-widget"] select{padding:0 7.5px;background:0 0;outline:0}#advanced-options [class*="-widget"] select{padding-right:16px;background:url(https://i.imgur.com/hFijppc.png) center right/16px auto no-repeat}#advanced-options [class*="-widget"] input:focus,#advanced-options [class*="-widget"] option,#advanced-options [class*="-widget"] select:focus{background-color:var(--btn-bg)!important}#advanced-options :disabled,#advanced-options input:disabled+label{opacity:.5;color:var(--text)!important}#advanced-options .title input{width:387.5px!important}#advanced-options .filter-widget[class*="-status"] select{width:197.5px!important}#advanced-options .magazine select,#advanced-options .producer select{width:387.5px!important}#advanced-options .filter-widget[class*="-date"] span:nth-of-type(n+2){display:inline-block;width:40px;padding:0 3px 0 7.5px;border:1px solid var(--text-dim);border-right:none;border-radius:13px 0 0 13px;margin-right:0!important;line-height:24px;font-style:italic}#advanced-options .filter-widget[class*="-date"] span:nth-of-type(3){margin-left:7.5px!important}#advanced-options .filter-widget[class*="-date"] .day,#advanced-options .filter-widget[class*="-date"] .month,#advanced-options .filter-widget[class*="-date"] .year{border-radius:0;padding:0 16px 0 7.5px;border-left-width:0}#advanced-options .filter-widget[class*="-date"] .month,#advanced-options .filter-widget[class*="-date"] .year{border-right:none}#advanced-options .filter-widget[class*="-date"] .day{border-radius:0 13px 13px 0}#advanced-options .filter-widget[class*="-date"] .year{width:60px!important}#advanced-options .filter-widget[class*="-date"] .day,#advanced-options .filter-widget[class*="-date"] .month{width:45px!important}#advanced-options .aired-season .year{width:60px!important}#advanced-options .aired-season .season{width:130px!important;margin-left:7.5px}#advanced-options .first select,#advanced-options .second select{width:190px!important}#advanced-options .sort-widget input[type=radio]+label{width:92.25px!important;border-radius:13px;margin-left:7.5px;background:0 0!important;color:var(--text-dark);line-height:14px;transition:all .15s ease}#advanced-options .sort-widget input[type=radio]:not(:disabled)+label:hover{background:var(--btn-bg)!important}#advanced-options .sort-widget input[type=radio]:not(:disabled):checked+label{background:var(--text-dim)!important;border:1px solid var(--text-dim);color:var(--bg)!important}#advanced-options .sort-widget input[type=radio]:not(:checked)+label i{color:var(--icon)}#advanced-options #fancybox-close,#advanced-options .advanced-options-button a{width:90px;height:26px;padding:0;background:var(--btn-bg);border-radius:13px;box-shadow:0 1px 2px rgba(0,0,0,.2);color:var(--text-dark);line-height:26px;text-align:center}#advanced-options #fancybox-close:hover,#advanced-options .advanced-options-button a:hover{background:var(--btn-bg-h);color:var(--btn-text-h)}#advanced-options .advanced-options-button .btn-apply{margin:0 0 0 -106px}#advanced-options .advanced-options-button .btn-clear{margin:0 0 0 8px}#advanced-options #fancybox-close{left:50%;top:auto;bottom:32px;border:none;margin-left:53px}#advanced-options .btn-apply:before{content:"\f00c ";font-family:FontAwesome}#advanced-options .btn-clear:before{content:"\f12d ";font-family:FontAwesome}#advanced-options #fancybox-close:after{content:"\f00d Close";font:12px/26px Arial,FontAwesome,sans-serif} /* "Clarity" Modification by Valerio Lyndon / Hover Image / Revision 0.2 */ .data.image{overflow:visible}.data.image a:before{content:"";position:absolute;top:50%;left:-166px;width:150px;height:0;margin-top:0;background-repeat:no-repeat;background-position:center;background-size:cover;border-radius:8px;box-shadow:0 0 2px #000;opacity:0;pointer-events:none;-webkit-transition:all .3s ease;transition:all .3s ease;z-index:50}.data.image a:after,.data.image img{border-radius:50%}.data.image a:hover:before{height:200px;margin-top:-100px;opacity:1}.data.image a:after,.data.image img{border-radius:50%} /*Fix image TY to shishio-kun*/ footer:before { pointer-events: none !important; } /*horizontal tags*/ .list-table-data { padding-bottom: 17px; padding-top:4px; } .data.tags { position: absolute; left: -55px; top: 12px; display: -webkit-flex !important; display: -moz-flex !important; display: flex !important; width: 0; height: 100%; padding: 0 !important; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .data.tags div { max-width: 980px; margin: 0 0 20px 136px; font-size: 0; white-space: nowrap; } .data.tags span { display: inline-block; padding: 0; } .data.tags span a { padding: 1px 8px !important; margin-right: 4px; white-space: nowrap; } .data.tags span a[href*="\=Fav"] { padding: 0 !important; } .data.tags a.edit { right: -1060px; } .data.tags textarea { right: -1060px; } /*Custom Tag Colors*/ .data.tags a[href$="Horror"], .data.tags a[href*="Sports"], .data.tags a[href*="Demons"], .data.tags a[href*="Supernatural"], .data.tags a[href*="Action"], .data.tags a[href*="Samurai"] { color:#000000 !important; --btn-bg: #FF0101 !important; } .data.tags a[href$="Police"], .data.tags a[href*="Music"], .data.tags a[href*="Shounen"], .data.tags a[href*="Shounen&20Ai"], .data.tags a[href*="Adventure"] { color:#000000 !important; --btn-bg: #4682B4 !important; } .data.tags a[href*="Romance"], .data.tags a[href*="Harem"], .data.tags a[href*="Shoujo"], .data.tags a[href$="Ecchi"], .data.tags a[href*="Shoujo&20Ai"] { color:#000000 !important; --btn-bg: #F453FF !important; } .data.tags a[href*="Hentai"], .data.tags a[href*="Yuri"], .data.tags a[href*="Yaoi"] { color:#000000 !important; --btn-bg: #F453FF !important; cursor: url(https://imgur.com/lZFGZ1D.png) 25 25, auto; } .data.tags a[href$="Dementia"], .data.tags a[href*="Military"], .data.tags a[href*="Mystery"], .data.tags a[href*="Thriller"] { color:#000000 !important; --btn-bg: #646464 !important; } .data.tags a[href$="Psychological"], .data.tags a[href*="Vampire"], .data.tags a[href*="Sci-Fi"], .data.tags a[href$="Space"] { color:#000000 !important; --btn-bg: #909090 !important; } .data.tags a[href$="Slice%20of%20Life"], .data.tags a[href*="Parody"], .data.tags a[href*="School"], .data.tags a[href*="Kids"], .data.tags a[href$="Comedy"] { color:#000000 !important; --btn-bg: #D5D500 !important; } .data.tags a[href$="Josei"], .data.tags a[href*="Drama"], .data.tags a[href*="Doujinshi"] { color:#000000 !important; --btn-bg: #B301FF !important; } .data.tags a[href$="Magic"], .data.tags a[href*="Fantasy"], .data.tags a[href*="Mecha"] { color:#000000 !important; --btn-bg: #6BE103 !important; } .data.tags a[href$="Game"], .data.tags a[href*="Cars"], .data.tags a[href*="Super%20Power"], .data.tags a[href*="Gender&20Bender"] { color:#000000 !important; --btn-bg: #FF8001 !important; } .data.tags a[href$="Historical"], .data.tags a[href*="Martial%20Arts"], .data.tags a[href*="Seinen"] { color:#000000 !important; --btn-bg: #D2691E !important; } .cover-block { z-index: 25; } .header { z-index: 30; } /*data number stuff / picture radius*/ .data.image a, .data.image img, .data.image, .data.status, .data.image a:hover:after { border-radius: 8px; } .data.number { background: rgba(255,255,255,1)!important; border-color: rgba(100,100,100,1)!important; } .data.score { background:rgba(255,255,255,1); } /*Avatar Stuff*/ .status-menu:after,.icon-menu.profile, status-menu-container:after{ border-color:rgb(255,255,255,1); background-color:rgb(255,255,255,1); border-width:8px; top:-51px; transform:scale(1); } .status-menu-container { position: relative; z-index: 25 !important;} /*Note on header Header*/ .status-menu-container:after { content:"Free Will - One Piece"; transform:scale(1,1); left:0px; top:-27px; font-family:Oswald; font-size:20px; font-weight: 450; } /*List Position stuff/button fixes*/ .list-item,.list-status-title{ left:80px } .list-table>tbody:first-of-type{ left:1112px;/*1032px more*/ } .list-stats{ left:25%; } .status-menu-container .search-container{ top:19px; right:-80px/*negative of .list-item*/ } /*Character Stuff*/ footer:before { content: ""; position: fixed; top: 2.28%; z-index: -1; width: calc(50% - 538px); min-width: 262px; height: 100%; transform:scale(.95); background: transparent no-repeat center bottom / contain scroll; } footer:after { content: ""; position: fixed; top: 2.8%; z-index: -1; width: calc(50% - 538px); min-width: 262px; height: 100%; transform:scale(.78); background: transparent no-repeat center bottom / contain scroll; } /* Left Render */ footer:before { right: calc(100% - (50% - 475px)); background-position: left bottom -12px; } /* Right Render */ footer:after { left: calc(100% - (50% - 510px)); background-position: right bottom -12px; } /*Change Banner Height here*/ :root { --banner-height: 160px; } .cover-block { height: var(--banner-height); } .header { margin-top: calc(var(--banner-height) - 36px); } .list-stats { top: calc(var(--banner-height) + 98px); } 1. The cover import is temporarily broken, add this to the top in the meantime @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; 2. For the second thing, this might take a while for me to figure out since I'm not familiar with the layout, so ask here so the layout creator can see and hopefully help. https://myanimelist.net/forum/?topicid=1723114 |
Feb 20, 2021 2:07 AM
#372
Hi! Quick question, I was trying all the fixes for blurry pictures and none of them worked, and I also went around to check some other people's profiles, am I doing something wrong with the fix or does it look like pictures are just blurry for everyone right now/something broke on MAL's side? |
Feb 20, 2021 8:11 AM
#373
Hello, I tried all the sollutions about burry image but none of them are working, is something about MAL site? Or am i doing something wrong? |
Feb 20, 2021 9:02 AM
#374
Shishio-kun said: 1. The cover import is temporarily broken, add this to the top in the meantime @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; Thanks. A couple of the images didn't get fixed from it (Ex. The Seven Deadly Sins) but if its just a temporary problem, I can wait it out. It was probably just bad timing that it broke when I was working on my list, making me think I broke it. |
Feb 20, 2021 10:50 AM
#375
Nayaya said: Hello, I tried all the sollutions about burry image but none of them are working, is something about MAL site? Or am i doing something wrong? yeh im having the same problem bro |
Feb 20, 2021 7:08 PM
#376
Add these imports I gave you to the top of the CSS. These were all under Alternative solutions in the opening post, so check there next time. They will fix most if not all preview pics. The default import that provided high resolution pics before is down for now- this happens a couple times every year and it usually comes back after a few days. @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; Nayaya said: Hello, I tried all the sollutions about burry image but none of them are working, is something about MAL site? Or am i doing something wrong? @\import "https://dl.dropboxusercontent.com/s/dvwo76okltko1zk/data%20image%20link.css"; CallMeDraken said: Hi! Quick question, I was trying all the fixes for blurry pictures and none of them worked, and I also went around to check some other people's profiles, am I doing something wrong with the fix or does it look like pictures are just blurry for everyone right now/something broke on MAL's side? @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; |
Feb 20, 2021 8:32 PM
#377
Shishio-kun said: Add these imports I gave you to the top of the CSS. These were all under Alternative solutions in the opening post, so check there next time. They will fix most if not all preview pics. The default import that provided high resolution pics before is down for now- this happens a couple times every year and it usually comes back after a few days. Bro Thank you so much.... You are honestly a God-send... Appreciate it @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; Nayaya said: Hello, I tried all the sollutions about burry image but none of them are working, is something about MAL site? Or am i doing something wrong? @\import "https://dl.dropboxusercontent.com/s/dvwo76okltko1zk/data%20image%20link.css"; CallMeDraken said: Hi! Quick question, I was trying all the fixes for blurry pictures and none of them worked, and I also went around to check some other people's profiles, am I doing something wrong with the fix or does it look like pictures are just blurry for everyone right now/something broke on MAL's side? @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; |
Feb 21, 2021 7:42 AM
#378
this really isnt a huge issue kind of something small that bothers me but on my list all the preview pics show up except for like 3 specific titles im not sure why but i was hoping if that could be resolved in case this helps originally this list didnt work with preview pics at all and then i got it to work with another piece of code but yesterday it went blank again so i tried "@\import "https://dl.dropboxusercontent.com/s/r89y41zqmt8waaz/animelist_more.css";" and that helped except for those 3 titles |
Feb 21, 2021 12:36 PM
#379
Shishio-kun said: Add these imports I gave you to the top of the CSS. These were all under Alternative solutions in the opening post, so check there next time. They will fix most if not all preview pics. The default import that provided high resolution pics before is down for now- this happens a couple times every year and it usually comes back after a few days. Man.. Thank you so much!! @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; Nayaya said: Hello, I tried all the sollutions about burry image but none of them are working, is something about MAL site? Or am i doing something wrong? @\import "https://dl.dropboxusercontent.com/s/dvwo76okltko1zk/data%20image%20link.css"; CallMeDraken said: Hi! Quick question, I was trying all the fixes for blurry pictures and none of them worked, and I also went around to check some other people's profiles, am I doing something wrong with the fix or does it look like pictures are just blurry for everyone right now/something broke on MAL's side? @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; |
Feb 21, 2021 4:30 PM
#380
So if the pictures in my list are gone, I should just wait and they will come back because the import is acting weird sometimes, right? |
Fortune favours the bold! |
Feb 21, 2021 4:48 PM
#381
DeathTheKid4 said: So if the pictures in my list are gone, I should just wait and they will come back because the import is acting weird sometimes, right? Yes it goes down for a few days now and then. Did you try these? |
Feb 21, 2021 5:15 PM
#382
Shishio-kun said: DeathTheKid4 said: So if the pictures in my list are gone, I should just wait and they will come back because the import is acting weird sometimes, right? Yes it goes down for a few days now and then. Did you try these? Yeah only the first one works but not for everything, there are some that are still missing like last season of Nanatsu no Taizai, Back Arrow, Appare-Ranman etc. And some of them I remember they changed covers and this import has the old ones, so I think I'll just wait until they come back with the original import. Thanks! |
Fortune favours the bold! |
Feb 21, 2021 9:42 PM
#383
Hello! I need a bit help with my list again~ I chose a premade layout for my anime list a while ago and it's honestly great, but the problem is—whenever I use a comma while writing in "Tags," the text separates into two parts instead of remaining in one. I tried using the "Convert Tags to Notes" tweak on this thread to avoid this issue, but it didn't work unfortunately. |
IrrelevantGuyFeb 21, 2021 11:16 PM
Feb 22, 2021 12:34 AM
#384
IrrelevantGuy said: Hello! I need a bit help with my list again~ I chose a premade layout for my anime list a while ago and it's honestly great, but the problem is—whenever I use a comma while writing in "Tags," the text separates into two parts instead of remaining in one. I tried using the "Convert Tags to Notes" tweak on this thread to avoid this issue, but it didn't work unfortunately. I have made a fix for this previously, add it to the bottom of your CSS: /*-S-T-A-R-T--------------------*\ | Review Tags R0.1 | \*------------------------------*/ /* Raise or lower this number to change how wide the box is. Make sure not to remove the "px" at the end. */ .data.tags { width: 240px; } .data.tags div:not(:empty){padding:2px 8px;background:var(--btn-bg);border-radius:8.5px}.data.tags span{display:inline;font-size:11px!important;cursor:text}.data.tags a:not(.edit){display:inline;padding:0;background:0 0;pointer-events:none} /*------------------------E-N-D-*/ You can find more modifications on the original [forum thread], but be aware they may not all work with your older version of Clarity. |
Feb 22, 2021 1:09 AM
#385
Valerio_Lyndon said: IrrelevantGuy said: Hello! I need a bit help with my list again~ I chose a premade layout for my anime list a while ago and it's honestly great, but the problem is—whenever I use a comma while writing in "Tags," the text separates into two parts instead of remaining in one. I tried using the "Convert Tags to Notes" tweak on this thread to avoid this issue, but it didn't work unfortunately. I have made a fix for this previously, add it to the bottom of your CSS: /*-S-T-A-R-T--------------------*\ | Review Tags R0.1 | \*------------------------------*/ /* Raise or lower this number to change how wide the box is. Make sure not to remove the "px" at the end. */ .data.tags { width: 240px; } .data.tags div:not(:empty){padding:2px 8px;background:var(--btn-bg);border-radius:8.5px}.data.tags span{display:inline;font-size:11px!important;cursor:text}.data.tags a:not(.edit){display:inline;padding:0;background:0 0;pointer-events:none} /*------------------------E-N-D-*/ You can find more modifications on the original [forum thread], but be aware they may not all work with your older version of Clarity. Thank you! It worked. |
Feb 22, 2021 1:54 AM
#386
hi, i have reinstalled, tried to fix the code in my modified grid 2 layout but it doesnt work... i cleared my browser cache and MAL pictures became dark and "not focused", it also became blury... please help me fix this problem.... link to before and after: (ignore the circled in red, pay attention to the pictures of the anime) before: https://imgur.com/eSaRegx after: https://imgur.com/EgIQEoT |
Shishio-kunFeb 22, 2021 2:32 AM
Feb 22, 2021 2:35 AM
#387
Yurito97 said: hi, i have reinstalled, tried to fix the code in my modified grid 2 layout but it doesnt work... i cleared my browser cache and MAL pictures became dark and "not focused", it also became blury... please help me fix this problem.... link to before and after: (ignore the circled in red, pay attention to the pictures of the anime) before: https://imgur.com/eSaRegx after: https://imgur.com/EgIQEoT Don't paste the whole CSS code without a spoiler, makes the page really long Also the CSS code was too long for the post, and got cut off so I couldn't even see the complete code. You need it on your list for me to repair it, and now you have a new layout on your page. Use the alternative cover imports in the opening post to fix this problem. Your new anime list needs one of the alternate "data image link" imports at the top @\import "https://dl.dropboxusercontent.com/s/ywsr2ctgmxgxt3v/animelist_dataimagelink.css"; |
Shishio-kunFeb 22, 2021 2:45 AM
Feb 22, 2021 4:01 AM
#388
Shishio-kun said: Yurito97 said: hi, i have reinstalled, tried to fix the code in my modified grid 2 layout but it doesnt work... i cleared my browser cache and MAL pictures became dark and "not focused", it also became blury... please help me fix this problem.... link to before and after: (ignore the circled in red, pay attention to the pictures of the anime) before: https://imgur.com/eSaRegx after: https://imgur.com/EgIQEoT Don't paste the whole CSS code without a spoiler, makes the page really long Also the CSS code was too long for the post, and got cut off so I couldn't even see the complete code. You need it on your list for me to repair it, and now you have a new layout on your page. Use the alternative cover imports in the opening post to fix this problem. Your new anime list needs one of the alternate "data image link" imports at the top @\import "https://dl.dropboxusercontent.com/s/ywsr2ctgmxgxt3v/animelist_dataimagelink.css"; sorry i dont know how to make a spoiler... how do i do it? i will change back the old code now, can you please take a look on it? the main problems are the pictures of the animes are blury, became darker (like a added filter). im changing it back now! thanks for your answer! |
Feb 22, 2021 4:14 AM
#389
IrrelevantGuy said: Hello! I need a bit help with my list again~ I chose a premade layout for my anime list a while ago and it's honestly great, but the problem is—whenever I use a comma while writing in "Tags," the text separates into two parts instead of remaining in one. I tried using the "Convert Tags to Notes" tweak on this thread to avoid this issue, but it didn't work unfortunately. whats that gif u have attached? cant find it :P from what anime is that or whats the characters name? |
Feb 22, 2021 4:17 AM
#390
Yurito97 said: Shishio-kun said: Yurito97 said: hi, i have reinstalled, tried to fix the code in my modified grid 2 layout but it doesnt work... i cleared my browser cache and MAL pictures became dark and "not focused", it also became blury... please help me fix this problem.... link to before and after: (ignore the circled in red, pay attention to the pictures of the anime) before: https://imgur.com/eSaRegx after: https://imgur.com/EgIQEoT Don't paste the whole CSS code without a spoiler, makes the page really long Also the CSS code was too long for the post, and got cut off so I couldn't even see the complete code. You need it on your list for me to repair it, and now you have a new layout on your page. Use the alternative cover imports in the opening post to fix this problem. Your new anime list needs one of the alternate "data image link" imports at the top @\import "https://dl.dropboxusercontent.com/s/ywsr2ctgmxgxt3v/animelist_dataimagelink.css"; sorry i dont know how to make a spoiler... how do i do it? i will change back the old code now, can you please take a look on it? the main problems are the pictures of the animes are blury, became darker (like a added filter). im changing it back now! thanks for your answer! How to spoiler is on this page, or quote my post and look at the BBcode to see how I did a spoiler at the bottom https://myanimelist.net/forum/?topicid=496203 In the future please check the opening post first to save me some time, the fixes for blurry preview pics were there. Other than that the layout seems normal. You need this at the top of your anime list CSS @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; for the manga list @\import "https://dl.dropboxusercontent.com/s/dpqglnr3slmgp7t/mangalist%20dataimagelinkbefore.css"; |
Shishio-kunFeb 22, 2021 4:23 AM
Feb 22, 2021 4:19 AM
#391
Yurito97 said: IrrelevantGuy said: Hello! I need a bit help with my list again~ I chose a premade layout for my anime list a while ago and it's honestly great, but the problem is—whenever I use a comma while writing in "Tags," the text separates into two parts instead of remaining in one. I tried using the "Convert Tags to Notes" tweak on this thread to avoid this issue, but it didn't work unfortunately. whats that gif u have attached? cant find it :P from what anime is that or whats the characters name? She's Rikka Takanashi from Chuunibyou demo Koi ga Shitai! |
Feb 22, 2021 4:53 AM
#392
Shishio-kun said: Yurito97 said: Shishio-kun said: Yurito97 said: hi, i have reinstalled, tried to fix the code in my modified grid 2 layout but it doesnt work... i cleared my browser cache and MAL pictures became dark and "not focused", it also became blury... please help me fix this problem.... link to before and after: (ignore the circled in red, pay attention to the pictures of the anime) before: https://imgur.com/eSaRegx after: https://imgur.com/EgIQEoT Don't paste the whole CSS code without a spoiler, makes the page really long Also the CSS code was too long for the post, and got cut off so I couldn't even see the complete code. You need it on your list for me to repair it, and now you have a new layout on your page. Use the alternative cover imports in the opening post to fix this problem. Your new anime list needs one of the alternate "data image link" imports at the top @\import "https://dl.dropboxusercontent.com/s/ywsr2ctgmxgxt3v/animelist_dataimagelink.css"; sorry i dont know how to make a spoiler... how do i do it? i will change back the old code now, can you please take a look on it? the main problems are the pictures of the animes are blury, became darker (like a added filter). im changing it back now! thanks for your answer! How to spoiler is on this page, or quote my post and look at the BBcode to see how I did a spoiler at the bottom https://myanimelist.net/forum/?topicid=496203 In the future please check the opening post first to save me some time, the fixes for blurry preview pics were there. Other than that the layout seems normal. You need this at the top of your anime list CSS @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist%20dataimagelinkbefore.css"; for the manga list @\import "https://dl.dropboxusercontent.com/s/dpqglnr3slmgp7t/mangalist%20dataimagelinkbefore.css"; i tried searching for it and the steps but must have did some misstake before... sorry, im a bit dyslexic on the reading part, but im trying to learn the coding :P thanks a lot, it worked with the fix! |
Mar 6, 2021 3:21 PM
#393
I followed the instructions to fix the images previews, but they still don't appear. and also, for public mi username looks blue @\import "https://fonts.googleapis.com/css?family=Open+Sans:400,700,800"; @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkafter"; body { background: #e0e0d1 repeat-x center/contain fixed url(https://i.imgur.com/fMCFAI6.jpg)!important; font: 11px Open Sans; color: #ccc; letter-spacing: 1px; text-transform: uppercase;} .header:before { content: url(https://i.imgur.com/sEDk3Ld.gif); display: block; text-align: right;} .list-item, .list-table > tbody:nth-of-type(2n+1) { background: rgba(0,0,0,.2);} .data.image ~ .data.title .link:before { content: ''; position: absolute; display: block; left: -80px; margin-top: -80px; width: 120px; height: 180px; background-size: cover; background-position: center; border-radius: 7px; box-shadow: 0px 4px 10px rgba(0,0,0,.4); opacity: 0; z-index: -1; transition: all .5s ease-in-out;} .header .header-title, .header .header-menu, .header .header-info, #header-menu-button, i.fa, [data-owner=""] .list-menu-float, .icon-menu:not(.profile), .cover-block, #cover-image-container, .status-menu-container .status-menu .status-button::after, .status-menu-container .search-container, .list-unit .list-status-title .stats, .list-table .list-table-header .header-title.image, .list-table .list-table-data .data.image, .icon-watch.ml4, .more, .list-table .list-table-data .tags .edit { display: none;} .header { position: fixed; width: 300px; height: 480px; left: calc(50% + 250px); top: 100px; z-index: 1;} .header .header-menu.other { display: block; top: unset; bottom: 98px; left: -10px;} .header .header-menu .btn-menu { font-size: 0; text-align: center;} .header a.username { background: center/150px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px 0;} .list-menu-float { top: 450px; left: calc(50% + 250px); width: 300px; border: 0; z-index: 1;} .icon-menu.profile { background: url(none)!important; display: inline-block; width: auto; height: auto;} .icon-menu.profile:after {content: attr(href); background: center/120px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px; display: inline-block; white-space: nowrap; text-indent: -443px; overflow: hidden;} .icon-menu.profile:hover:after, .header a:hover, .list-table .list-table-data a:not(.edit-disabled):hover, .status-menu-container .status-menu .status-button:not(.on):hover { color: white; text-decoration: none;} .list-container { width: 1000px; top: 100px; background: none!important; border: 0;} #status-menu { position: fixed; width: auto; height: 0; top: 495px; left: calc(50% + 300px); border: 0} #status-menu .status-menu { display: flex; flex-flow: column; align-items: center;} .status-menu-container .status-menu .status-button { order: 2; width: 170px; background: rgba(255,255,255,.2); padding: 2px 0; font: bold 11px Open Sans; color: rgba(67,72,104,.7); transition: all .2s ease-in-out;} .status-menu-container .status-menu .status-button.on {order: 1; background: rgba(92,99,145,.2); color: #e8e8e8!important; padding: 10px; border-radius: 20px; border: 1px solid #e8e8e8;} .status-menu-container .status-menu .status-button:not(.on) { margin-top: -16px; opacity: 0;} .status-menu-container .status-menu:hover .status-button:not(.on), .list-block, .status-menu-container.fixed + div.list-block { margin: 0; opacity: 1;} .list-unit { width: 600px; margin-left: 60px;} .list-unit .list-status-title { background: none; width: 600px; position: absolute; top: -12px;} .list-unit .list-status-title .text { font: 800 25px Open Sans; color: rgba(255,255,255,.6); letter-spacing: 3px; text-align: left;} .list-table { border: 0; border-collapse: separate; border-spacing: 0 2px;} .list-table > tbody:nth-of-type(2n+1):first-child, .list-table .list-table-header .header-title { background: none; border: 0; height: 18px;} .list-table .list-table-header .header-title.title { visibility: hidden;} .list-table .list-table-header .header-title .link.sort, .list-table .list-table-data .data a, .list-table .list-table-data a.edit-disabled { color: #ccc!important;} .list-table .list-table-data .data { height: 30px; border: 0;} .list-table .list-table-data:hover { background: rgba(0,0,0,.1);} .list-table .list-table-data .data.status { background: none!important; font: 13px FontAwesome; padding: 0 5px;} .data.status.watching:before { content: '\f005';} .data.status.completed:before { content: '\f058';} .data.status.onhold:before { content: '\f06a'} .data.status.dropped:before { content: '\f05e'} .data.status.plantowatch:before { content: '\f017';} .list-table-data:hover .data.title .link:before { opacity: .8;} .list-table .list-table-header .header-title.number { position: absolute; visibility: hidden;} .list-table .list-table-data .data.number { position: absolute; left: 12px; margin-top: 3px; font: 800 19px Open Sans; letter-spacing: 0; color: rgba(0,0,0,.3); text-align: right; width: 40px; z-index: -2;} .data.number ~ .data.title .link:before { left: -100px;} .list-table .list-table-data .data.title { padding-left: 0;} .list-table .list-table-data .data.title .link { font-size: 1em; line-height: 1em; color: white!important; display: inline-block; max-width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .content-status { background: rgba(0,0,0,.2); padding: 1px 0 2px 4px; border-radius: 10px; position: relative; top: -1px;} .list-table .list-table-data .data.title .add-edit-more { float: none; display: inline; font-size: 0; line-height: 0; opacity: 0; position: relative; top: -2px; left: 3px;} .list-table-data:hover .data.title .add-edit-more { opacity: 1;} .add, .edit, .data.tags { font-size: 8px; line-height: 1em;} #footer-block { background: none; position: relative; top: 90px;} #copyright { font: 8px Open Sans; color: rgba(0,0,0,.6)} |
tuputamadre2Mar 6, 2021 3:33 PM
Mar 6, 2021 8:56 PM
#394
tuputamadre2 said: I followed the instructions to fix the images previews, but they still don't appear. and also, for public mi username looks blue @\import "https://fonts.googleapis.com/css?family=Open+Sans:400,700,800"; @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkafter"; body { background: #e0e0d1 repeat-x center/contain fixed url(https://i.imgur.com/fMCFAI6.jpg)!important; font: 11px Open Sans; color: #ccc; letter-spacing: 1px; text-transform: uppercase;} .header:before { content: url(https://i.imgur.com/sEDk3Ld.gif); display: block; text-align: right;} .list-item, .list-table > tbody:nth-of-type(2n+1) { background: rgba(0,0,0,.2);} .data.image ~ .data.title .link:before { content: ''; position: absolute; display: block; left: -80px; margin-top: -80px; width: 120px; height: 180px; background-size: cover; background-position: center; border-radius: 7px; box-shadow: 0px 4px 10px rgba(0,0,0,.4); opacity: 0; z-index: -1; transition: all .5s ease-in-out;} .header .header-title, .header .header-menu, .header .header-info, #header-menu-button, i.fa, [data-owner=""] .list-menu-float, .icon-menu:not(.profile), .cover-block, #cover-image-container, .status-menu-container .status-menu .status-button::after, .status-menu-container .search-container, .list-unit .list-status-title .stats, .list-table .list-table-header .header-title.image, .list-table .list-table-data .data.image, .icon-watch.ml4, .more, .list-table .list-table-data .tags .edit { display: none;} .header { position: fixed; width: 300px; height: 480px; left: calc(50% + 250px); top: 100px; z-index: 1;} .header .header-menu.other { display: block; top: unset; bottom: 98px; left: -10px;} .header .header-menu .btn-menu { font-size: 0; text-align: center;} .header a.username { background: center/150px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px 0;} .list-menu-float { top: 450px; left: calc(50% + 250px); width: 300px; border: 0; z-index: 1;} .icon-menu.profile { background: url(none)!important; display: inline-block; width: auto; height: auto;} .icon-menu.profile:after {content: attr(href); background: center/120px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px; display: inline-block; white-space: nowrap; text-indent: -443px; overflow: hidden;} .icon-menu.profile:hover:after, .header a:hover, .list-table .list-table-data a:not(.edit-disabled):hover, .status-menu-container .status-menu .status-button:not(.on):hover { color: white; text-decoration: none;} .list-container { width: 1000px; top: 100px; background: none!important; border: 0;} #status-menu { position: fixed; width: auto; height: 0; top: 495px; left: calc(50% + 300px); border: 0} #status-menu .status-menu { display: flex; flex-flow: column; align-items: center;} .status-menu-container .status-menu .status-button { order: 2; width: 170px; background: rgba(255,255,255,.2); padding: 2px 0; font: bold 11px Open Sans; color: rgba(67,72,104,.7); transition: all .2s ease-in-out;} .status-menu-container .status-menu .status-button.on {order: 1; background: rgba(92,99,145,.2); color: #e8e8e8!important; padding: 10px; border-radius: 20px; border: 1px solid #e8e8e8;} .status-menu-container .status-menu .status-button:not(.on) { margin-top: -16px; opacity: 0;} .status-menu-container .status-menu:hover .status-button:not(.on), .list-block, .status-menu-container.fixed + div.list-block { margin: 0; opacity: 1;} .list-unit { width: 600px; margin-left: 60px;} .list-unit .list-status-title { background: none; width: 600px; position: absolute; top: -12px;} .list-unit .list-status-title .text { font: 800 25px Open Sans; color: rgba(255,255,255,.6); letter-spacing: 3px; text-align: left;} .list-table { border: 0; border-collapse: separate; border-spacing: 0 2px;} .list-table > tbody:nth-of-type(2n+1):first-child, .list-table .list-table-header .header-title { background: none; border: 0; height: 18px;} .list-table .list-table-header .header-title.title { visibility: hidden;} .list-table .list-table-header .header-title .link.sort, .list-table .list-table-data .data a, .list-table .list-table-data a.edit-disabled { color: #ccc!important;} .list-table .list-table-data .data { height: 30px; border: 0;} .list-table .list-table-data:hover { background: rgba(0,0,0,.1);} .list-table .list-table-data .data.status { background: none!important; font: 13px FontAwesome; padding: 0 5px;} .data.status.watching:before { content: '\f005';} .data.status.completed:before { content: '\f058';} .data.status.onhold:before { content: '\f06a'} .data.status.dropped:before { content: '\f05e'} .data.status.plantowatch:before { content: '\f017';} .list-table-data:hover .data.title .link:before { opacity: .8;} .list-table .list-table-header .header-title.number { position: absolute; visibility: hidden;} .list-table .list-table-data .data.number { position: absolute; left: 12px; margin-top: 3px; font: 800 19px Open Sans; letter-spacing: 0; color: rgba(0,0,0,.3); text-align: right; width: 40px; z-index: -2;} .data.number ~ .data.title .link:before { left: -100px;} .list-table .list-table-data .data.title { padding-left: 0;} .list-table .list-table-data .data.title .link { font-size: 1em; line-height: 1em; color: white!important; display: inline-block; max-width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .content-status { background: rgba(0,0,0,.2); padding: 1px 0 2px 4px; border-radius: 10px; position: relative; top: -1px;} .list-table .list-table-data .data.title .add-edit-more { float: none; display: inline; font-size: 0; line-height: 0; opacity: 0; position: relative; top: -2px; left: 3px;} .list-table-data:hover .data.title .add-edit-more { opacity: 1;} .add, .edit, .data.tags { font-size: 8px; line-height: 1em;} #footer-block { background: none; position: relative; top: 90px;} #copyright { font: 8px Open Sans; color: rgba(0,0,0,.6)} OK, you need this at the top. @\import "https://malscraper.azurewebsites.net/covers/auto/presets/datatitlebefore"; And if you put this at the bottom, it should make the username white .header .header-menu .btn-menu > a { color: white; } |
Mar 7, 2021 12:34 PM
#395
Shishio-kun said: thanks bro tuputamadre2 said: I followed the instructions to fix the images previews, but they still don't appear. and also, for public mi username looks blue @\import "https://fonts.googleapis.com/css?family=Open+Sans:400,700,800"; @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkafter"; body { background: #e0e0d1 repeat-x center/contain fixed url(https://i.imgur.com/fMCFAI6.jpg)!important; font: 11px Open Sans; color: #ccc; letter-spacing: 1px; text-transform: uppercase;} .header:before { content: url(https://i.imgur.com/sEDk3Ld.gif); display: block; text-align: right;} .list-item, .list-table > tbody:nth-of-type(2n+1) { background: rgba(0,0,0,.2);} .data.image ~ .data.title .link:before { content: ''; position: absolute; display: block; left: -80px; margin-top: -80px; width: 120px; height: 180px; background-size: cover; background-position: center; border-radius: 7px; box-shadow: 0px 4px 10px rgba(0,0,0,.4); opacity: 0; z-index: -1; transition: all .5s ease-in-out;} .header .header-title, .header .header-menu, .header .header-info, #header-menu-button, i.fa, [data-owner=""] .list-menu-float, .icon-menu:not(.profile), .cover-block, #cover-image-container, .status-menu-container .status-menu .status-button::after, .status-menu-container .search-container, .list-unit .list-status-title .stats, .list-table .list-table-header .header-title.image, .list-table .list-table-data .data.image, .icon-watch.ml4, .more, .list-table .list-table-data .tags .edit { display: none;} .header { position: fixed; width: 300px; height: 480px; left: calc(50% + 250px); top: 100px; z-index: 1;} .header .header-menu.other { display: block; top: unset; bottom: 98px; left: -10px;} .header .header-menu .btn-menu { font-size: 0; text-align: center;} .header a.username { background: center/150px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px 0;} .list-menu-float { top: 450px; left: calc(50% + 250px); width: 300px; border: 0; z-index: 1;} .icon-menu.profile { background: url(none)!important; display: inline-block; width: auto; height: auto;} .icon-menu.profile:after {content: attr(href); background: center/120px url(https://image.myanimelist.net/ui/uDqA5Hj63XC4_7-Zz2-uStdYe5Qg1UiBTLljp3L1u-Q); font: 800 20px Open Sans; color: rgba(255,255,255,.7); letter-spacing: 2px; padding: 5px; display: inline-block; white-space: nowrap; text-indent: -443px; overflow: hidden;} .icon-menu.profile:hover:after, .header a:hover, .list-table .list-table-data a:not(.edit-disabled):hover, .status-menu-container .status-menu .status-button:not(.on):hover { color: white; text-decoration: none;} .list-container { width: 1000px; top: 100px; background: none!important; border: 0;} #status-menu { position: fixed; width: auto; height: 0; top: 495px; left: calc(50% + 300px); border: 0} #status-menu .status-menu { display: flex; flex-flow: column; align-items: center;} .status-menu-container .status-menu .status-button { order: 2; width: 170px; background: rgba(255,255,255,.2); padding: 2px 0; font: bold 11px Open Sans; color: rgba(67,72,104,.7); transition: all .2s ease-in-out;} .status-menu-container .status-menu .status-button.on {order: 1; background: rgba(92,99,145,.2); color: #e8e8e8!important; padding: 10px; border-radius: 20px; border: 1px solid #e8e8e8;} .status-menu-container .status-menu .status-button:not(.on) { margin-top: -16px; opacity: 0;} .status-menu-container .status-menu:hover .status-button:not(.on), .list-block, .status-menu-container.fixed + div.list-block { margin: 0; opacity: 1;} .list-unit { width: 600px; margin-left: 60px;} .list-unit .list-status-title { background: none; width: 600px; position: absolute; top: -12px;} .list-unit .list-status-title .text { font: 800 25px Open Sans; color: rgba(255,255,255,.6); letter-spacing: 3px; text-align: left;} .list-table { border: 0; border-collapse: separate; border-spacing: 0 2px;} .list-table > tbody:nth-of-type(2n+1):first-child, .list-table .list-table-header .header-title { background: none; border: 0; height: 18px;} .list-table .list-table-header .header-title.title { visibility: hidden;} .list-table .list-table-header .header-title .link.sort, .list-table .list-table-data .data a, .list-table .list-table-data a.edit-disabled { color: #ccc!important;} .list-table .list-table-data .data { height: 30px; border: 0;} .list-table .list-table-data:hover { background: rgba(0,0,0,.1);} .list-table .list-table-data .data.status { background: none!important; font: 13px FontAwesome; padding: 0 5px;} .data.status.watching:before { content: '\f005';} .data.status.completed:before { content: '\f058';} .data.status.onhold:before { content: '\f06a'} .data.status.dropped:before { content: '\f05e'} .data.status.plantowatch:before { content: '\f017';} .list-table-data:hover .data.title .link:before { opacity: .8;} .list-table .list-table-header .header-title.number { position: absolute; visibility: hidden;} .list-table .list-table-data .data.number { position: absolute; left: 12px; margin-top: 3px; font: 800 19px Open Sans; letter-spacing: 0; color: rgba(0,0,0,.3); text-align: right; width: 40px; z-index: -2;} .data.number ~ .data.title .link:before { left: -100px;} .list-table .list-table-data .data.title { padding-left: 0;} .list-table .list-table-data .data.title .link { font-size: 1em; line-height: 1em; color: white!important; display: inline-block; max-width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .content-status { background: rgba(0,0,0,.2); padding: 1px 0 2px 4px; border-radius: 10px; position: relative; top: -1px;} .list-table .list-table-data .data.title .add-edit-more { float: none; display: inline; font-size: 0; line-height: 0; opacity: 0; position: relative; top: -2px; left: 3px;} .list-table-data:hover .data.title .add-edit-more { opacity: 1;} .add, .edit, .data.tags { font-size: 8px; line-height: 1em;} #footer-block { background: none; position: relative; top: 90px;} #copyright { font: 8px Open Sans; color: rgba(0,0,0,.6)} OK, you need this at the top. @\import "https://malscraper.azurewebsites.net/covers/auto/presets/datatitlebefore"; And if you put this at the bottom, it should make the username white .header .header-menu .btn-menu > a { color: white; } |
Mar 23, 2021 2:27 PM
#396
https://imgur.com/oZpR9ro - how do i get rid of this giant settings icon + privacy |
Mar 23, 2021 2:41 PM
#397
RyuugaHideki said: https://imgur.com/oZpR9ro - how do i get rid of this giant settings icon + privacy add devidas's code to the bottom of your CSS https://myanimelist.net/forum/?topicid=1892546#msg61831251 |
Mar 25, 2021 12:10 PM
#398
for some reason i have this ( in the blue circle) it seems to be only on the current watching section |
Mar 25, 2021 7:25 PM
#399
Mattinator95 said: for some reason i have this ( in the blue circle) it seems to be only on the current watching section https://i.imgur.com/NDGvdNK.jpg This was a bug with the initial implementation of the banners, and has since been fixed in later versions of that theme. To patch this fix into your older version, add this to the bottom of the CSS: /*------------------------------*\ |* Bug Fix for old Brink ver. *| \* - - - - - - - - - - - - - - -*/ body .score-9::before, body .score-10::before, body .score-9::after, body .score-10::after { display: none; } .data .score-9::before, .data .score-10::before, .data .score-9::after, .data .score-10::after { display: block; } |
This topic has been locked and is no longer available for discussion.
More topics from this board
» [CSS - MODERN] ⚡️ Fully-Customizable Layouts (2024 updates!) ( 1 2 3 4 5 ... Last Page )Shishio-kun - Jul 21, 2017 |
381 |
by KabukiChouNights
»»
Sep 13, 10:56 AM |
|
» theme helpthreat - Jul 5 |
5 |
by Zaryf
»»
Aug 21, 5:46 AM |
|
» [CSS - Modern] 🍰 Clarity by V.L ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Apr 19, 2018 |
1261 |
by KiranaStarr
»»
Aug 16, 5:48 PM |
|
» [CSS] ⭐️ Customize your List Cursor + Cursor FixesShishio-kun - Mar 8, 2021 |
30 |
by Shishio-kun
»»
Jul 28, 3:17 AM |
|
» How To Have Different Banner/Cover image & Background Image For Manga & Anime ListsYasminaRegina - Jul 25 |
2 |
by YasminaRegina
»»
Jul 26, 1:02 AM |