| This request might be easy but I've spent several weeks trying to figure it out and haven't been able to. Is it possible to make it so that the avatar is still clickable when it is small (by small I just mean when you scroll down and the banner is gone, the avatar shrinks to fit the header). This way, even if I'm at the bottom of my list, I can still click on it to jump straight back to my profile. Last time I asked for some help, I never got an answer. I waited about a week and then tried doing it on my own. I eventually got what I wanted added (even though it wasn't very elegant formatting). This time, I haven't been able to do it on my own, so it doesn't hurt to try asking again. |
Paper2017 said: This request might be easy but I've spent several weeks trying to figure it out and haven't been able to. Is it possible to make it so that the avatar is still clickable when it is small (by small I just mean when you scroll down and the banner is gone, the avatar shrinks to fit the header). This way, even if I'm at the bottom of my list, I can still click on it to jump straight back to my profile. Last time I asked for some help, I never got an answer. I waited about a week and then tried doing it on my own. I eventually got what I wanted added (even though it wasn't very elegant formatting). This time, I haven't been able to do it on my own, so it doesn't hurt to try asking again. I wanted this same thing for a veeeeery long time too but i couldn't do it. Please answer this question. I really want this funtion. |
   StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
Before I begin this request, I wanted to thank you for all the work you do for us and our lists. It's really helpful and I can only imagine how much time it takes. Thank you! Okay, so you can probably guess from the post I quoted, but I would like something similar to Yoshe's list with the individual ratings. In fact, exactly how he has it on his list currently is how I'd like it as well (colors and all. I'll likely change the labels though). Is there a way you could do it for my list as shown in the awful drawing below (colors used are completely irrelevant)?  The positioning of the pins it is in line with is ' top:calc(50% + 10px); '. Also, it is very very likely that I won't be ranking all entries, so ones without tags should have a dash in all unranked categories. If there is anything that directly conflicts with making this tagging possible, please let me know. I hope this isn't too large of a request. Thank you so much again for all of your work! |
Please sign up for MangAlert! It's a little project I made that I'd really like to see the light of day and some users. MangAlert! (please sign up!) GitHub Repo (please star!) |
Acruxx said: Hello, since a couple of days large covers no longer load in my list, they appear as a white blank page. I didn't change anything in my css since you helped me with my problem with large covers not loading while switching from manga to anime list. MAL probably has changed something related to this? From what I hear the cover generator is having some issues again. These usually get fixed after a short while, but to fix it now you can add one or both of these to the top of your CSS (whichever you need). These will increase page times significantly, but they're the only other option. Animelist covers: @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist_dataimagelinkbefore.css"; Mangalist covers: @\import "https://dl.dropboxusercontent.com/s/dpqglnr3slmgp7t/mangalist_dataimagelinkbefore.css"; |
Paper2017 said: This request might be easy but I've spent several weeks trying to figure it out and haven't been able to. Is it possible to make it so that the avatar is still clickable when it is small (by small I just mean when you scroll down and the banner is gone, the avatar shrinks to fit the header). This way, even if I'm at the bottom of my list, I can still click on it to jump straight back to my profile. Last time I asked for some help, I never got an answer. I waited about a week and then tried doing it on my own. I eventually got what I wanted added (even though it wasn't very elegant formatting). This time, I haven't been able to do it on my own, so it doesn't hurt to try asking again. LEGENDS_OF_ANIME said: I wanted this same thing for a veeeeery long time too but i couldn't do it. Please answer this question. I really want this funtion. I agree it'd be a nice improvement, but as far as I know it is not possible. I attempted creating this functionality when I first made the theme to no luck. For a technical explanation, |
Uji_Gintoki_Bowl said: Before I begin this request, I wanted to thank you for all the work you do for us and our lists. It's really helpful and I can only imagine how much time it takes. Thank you! Okay, so you can probably guess from the post I quoted, but I would like something similar to Yoshe's list with the individual ratings. In fact, exactly how he has it on his list currently is how I'd like it as well (colors and all. I'll likely change the labels though). Is there a way you could do it for my list as shown in the awful drawing below (colors used are completely irrelevant)? The positioning of the pins it is in line with is ' top:calc(50% + 10px); '. Also, it is very very likely that I won't be ranking all entries, so ones without tags should have a dash in all unranked categories. If there is anything that directly conflicts with making this tagging possible, please let me know. I hope this isn't too large of a request. Thank you so much again for all of your work! Try this out. I hope I didn't miss anything, but let me know if I did. There are two variables near the top labelled x-offset and y-offset to assist in changing the position easier if need be. The same notes apply to the usage of this version: Valerio_Lyndon said: This code relies on a few things. Firstly, you must place all the scores at the end of your tag section, even after decimal scores, so your tags should be ordered: review/other tags -> decimal rating -> advanced scoring. Secondly, you must have all 5 numbers for them to position correctly. If you do not have a score for one of the sections, just use a "-". Here's an example of tags that should work when placed at the end of one of your tag sections: "6,10,7,-,9". Yet another note, these tags are not searchable nor sortable. As we are just using numbers, there is no distinguishing factor to find them by. Even if we did use a prefix on the numbers, you'd still only be able to find others of the same score. So if you scored something ST:2, then you'd only be able to find other entries that were scored 2 of your ST category. Since this would be such a minor function and use up more of the tag character limit, I didn't bother with prefixes. To change box colours, you'll need to change the #212121 colour twice for each box. You can find the relevant section near the top of the provided code, under "add decorative score background". Pictured here:  To change the text colour, find the sections further down in the code labelled "box # colour". Change "var(--text)" to any colour.  |
Valerio_LyndonFeb 22, 2021 12:22 AM
| I have been using this style for quite a while now but recently the hover preview image stopped working. here's my code Please tell me how I can fix it. I really like this function and I don't want to lose it |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
LEGENDS_OF_ANIME said: I have been using this style for quite a while now but recently the hover preview image stopped working. here's my code Please tell me how I can fix it. I really like this function and I don't want to lose it From what I hear the cover generator is having some issues again. These usually get fixed after a short while, but to fix it now you can add one or both of these to the top of your CSS (whichever you need). These will increase page times significantly, but they're the only other option. Animelist covers: @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist_dataimagelinkbefore.css"; Mangalist covers: @\import "https://dl.dropboxusercontent.com/s/dpqglnr3slmgp7t/mangalist_dataimagelinkbefore.css"; |
MonsieurAlarm said: Is there a reason why a lot of my css is getting deleted from my list? I added a lot of new code in today to update my list, but I noticed a large chunk of it got deleted from the bottom. Is there a limit to how many lines you can have on the custom css? Unfortunately, yes, there is a limit. It's approximately 65,535 characters. There is a way to cirumvent the limit by using an @\import with an externally hosted CSS file, which isn't too hard to do once you know it. I'd recommend leaving most of your CSS as it is, but moving all the list row image codes to an external import. The other option would be to move everything into the external import. |
Valerio_Lyndon said: From what I hear the cover generator is having some issues again. These usually get fixed after a short while, but to fix it now you can add one or both of these to the top of your CSS (whichever you need). These will increase page times significantly, but they're the only other option. Thanks a lot. It worked. But can you tell me what it did. Cuz I was just wondering that WHAT THE FUCK IS THIS INSANE CSS!!!!!!!!!😂😂😂  Anyway, thanks for your help man. Love your list style |
Legends_of_animeFeb 23, 2021 1:26 AM
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
| Hey there, you've made a real nice theme. Just having a small problem with adding more favorite tags and it is clashing with the hover tag descriptions. it works when I remove the hover tag description. my CSS looks like this: |
 |
LEGENDS_OF_ANIME said: Valerio_Lyndon said: From what I hear the cover generator is having some issues again. These usually get fixed after a short while, but to fix it now you can add one or both of these to the top of your CSS (whichever you need). These will increase page times significantly, but they're the only other option. Thanks a lot. It worked. But can you tell me what it did. Cuz I was just wondering that WHAT THE FUCK IS THIS INSANE CSS!!!!!!!!!😂😂😂 Anyway, thanks for your help man. Love your list style It's a list of cover images for MAL's entire database, with useless letters removed to save a bit of space (including line breaks). This is in comparison to what the theme usually uses and I would usually recommend which is the cover generator, which generates a list of cover images specific to your list that is a lot smaller in size. But, without access to another cover generator, this is the next best option. Plus it's a tad more realiable at the cost of long page load times. |
JAYSONLEM said: Hey there, you've made a real nice theme. Just having a small problem with adding more favorite tags and it is clashing with the hover tag descriptions. it works when I remove the hover tag description. my CSS looks like this: Ah yes, these mods have some conflicts. I baked fixes into the mods, but having a custom tag icon will definitely trigger it again. There's a couple of ways to fix this, one being very messy but probably easier and the other being perhaps a little more confusing however a lot cleaner. The clean solution requires modifying the Tag Desc Basis mod to include references to your new "Best" tag. Here's the code if you just want to copy paste it to replace your current Tag Desc Basis (pick one): What I did was find each instance of ":not([href*="=Favo"])" and replace it with ":not([href*="=Favo"]):not([href*="=Best"])". For each new tag I have to add a new 'not <tag>' section. Here's the format: ":not([href*="=TAG"])". This can be done by hand or with any program that can find and replace text. This prevents the two mods from conflicting. The conflict occurs with icons that are added with ::before or ::after selectors, so if you aren't using an icon (like your Summary that is just regular text) then you may not need to add the exclusion. |
Valerio_LyndonFeb 25, 2021 9:57 PM
| i always thoguht about it but is there a way to put the tabs all anime, currently watching, etc and then score, title, progress with drop down menu on the left or right side of our list? its similar to the layout on anilist. |
 "Hard work is worthless for those that don’t believe in themselves" - Naruto Uzumaki |
| So is there a way to prevent the banner dimensions from changing when on a bigger screen? My banner looks way better when looking at my list from the small screen of my laptop because the dimensions change depending on screen size. Is this just something I'll have to take into account when choosing and cropping an image? Here is a screenshot: left side is how it looks on a bigger monitor, and right is a small laptop. |
   "~and he loved to play the piano!"  |
NikoruWasOnly15 said: So is there a way to prevent the banner dimensions from changing when on a bigger screen? My banner looks way better when looking at my list from the small screen of my laptop because the dimensions change depending on screen size. Is this just something I'll have to take into account when choosing and cropping an image? Here is a screenshot: left side is how it looks on a bigger monitor, and right is a small laptop. You can set a fixed size by modifying the background-size property with a "px" value, like here (add to the bottom of your CSS) /* Banner sizing */
.cover-block {
background-size: 1280px auto;
}The "1280px" and be changed out for a different value. The "auto" can also be changed for a "px" value if so desired. The problem with static sizing is large screens will have empty/black space around the banner, but if that is the look you want then this is how you can achieve it. |
JayDaAnimeLord said: i always thoguht about it but is there a way to put the tabs all anime, currently watching, etc and then score, title, progress with drop down menu on the left or right side of our list? its similar to the layout on anilist. It should be possible, to a point at least, I've done something similar on one of my other layouts. Modifying this theme to do that would take some time, but I could probably do it. Is your intention to just have a blank bar where the categories are currently? And would the category and sort menus be the only ones you were moving? I believe that's possible but won't know until I try, which I don't have time for until Friday night or Saturday my time zone. |
| Hello again! I put all of my list row image code to an external import as you mentioned. Seems to work perfectly, but have a few questions regarding this and the list row image code. 1. Let's say I want to add more to the code, is there a way for me to edit in dropbox? Or do I have to edit in the text document and upload it to dropbox every time I make an update? 2. I've noticed while customizing my list and when opening up my list on my weaker laptop that sometimes my list takes a while to render in. Is there a way to make my list render in faster and more smoothly? Would moving all of my code into one external import make the list function better? 3. Is there a reason why sometimes when I open up my list and I hover over my list entries with the custom images, it sort of flickers. Like if I hover over it, for a brief fraction of a second all of the entries (that I hover over) will flash black and then go back to normal after I hovered over it. Want to know what causes it and how I can get rid of it. 4. I have been using the code you posted for another user for the list row image. It has been working great, but I have encountered some problems with it. Whenever I try entering the ID for an anime with a small ID number like Naruto with an ID of 20 and One piece with an ID of 21, it affects other anime entries that have a longer ID number but start with the same number (20 or 21). Like let's say I finish the code for Naruto and put in the ID of 20 (I left it as "ID" for now due to this problem), other animes like Haikyuu Season 1, Jojo Part 3, Samurai Champloo, etc., all have this problem as their entry ID starts with 20. The same happens with One Piece where it shows the OP background for Clannad, When Marie was there, and other lists entries even if I put in a different URL for these entries. This same issue used to happen with FMA (ID of 121) and Hyouka (starts with 121), but I'm not sure how I made it work. I want to know if there is a way to stop this from happening and work around it or if there is another way to implement the image backgrounds without it interfering with other entries. 5. A few days ago, I've noticed that for some reason, my list hover covers haven't been working and I thought that the feature just broke again like a few weeks before and it'll fix itself again. But when I went on a different computer and on my laptop, the hover covers have been working fine. Even when I go on other user's profiles, the hover cover feature seems to be blank for me on this computer, but fine on others and I am unsure why or how I can fix this. Also just curious is there a way to make it so your entire list sizes down when you are on a smaller screen or something. My monitor screen size is significantly larger than my laptop's and noticed that things like the hover covers get cut off a little. Was wondering if there was a way for it to automatically size down when on a device with a smaller resolution/screen size. Please let me know if I sound confusing and if what I'm saying doesn't make sense. Thanks in advance! |
WakeUpAmadeus_Mar 5, 2021 4:44 PM
MonsieurAlarm said: 5. A few days ago, I've noticed that for some reason, my list hover covers haven't been working and I thought that the feature just broke again like a few weeks before and it'll fix itself again. But when I went on a different computer and on my laptop, the hover covers have been working fine. Even when I go on other user's profiles, the hover cover feature seems to be blank for me on this computer, but fine on others and I am unsure why or how I can fix this. The same thing happened to me, not only with the hover covers but also with Doomcat's header tool. I asked a friend for a screenshot to check if we see the same thing, but it turns out that we don't. I don't really know what is causing this, hover covers and Doomcat's header tool works when other people see my list but not for me. |
Black_D-44Mar 9, 2021 1:42 PM
 |
Black_D-44 said: The same thing happened to me, not only with the hover covers but also with Doomcat's header tool. I asked a friend for a screenshot to check if we see the same thing, but it turns out that we don't. I don't really know what is causing this, hover covers and Doomcat's header tool works when other people see my list but not for me. Yeah, honestly it's so strange. I don't know what's causing this or how I can fix it so as always have to ask for help 😅. Hopefully can get this fixed. |
MonsieurAlarm said: 1. Let's say I want to add more to the code, is there a way for me to edit in dropbox? Or do I have to edit in the text document and upload it to dropbox every time I make an update? I don't currently know of a way to edit in Dropbox. Editing in the text doc on my PC and then uploading is how I manage uploads. You might be able to setup an auto-upload/auto-sync function with Dropbox's desktop app but I have not used that so can't be sure. MonsieurAlarm said: 2. I've noticed while customizing my list and when opening up my list on my weaker laptop that sometimes my list takes a while to render in. Is there a way to make my list render in faster and more smoothly? Would moving all of my code into one external import make the list function better? Imports will generally load about the same speed as non-import code. The main factor in speed for code is how good the external host is (in this case Dropbox). The more code added, import or not, the slower the page will load. That said, the main thing increasing page speed is most likely the added background images. Optimizing these images will likely provide much more speed benefit than minimizing the code. Ways you could optimize the images might be: • Resizing so that they aren't bigger than the space they take up. This can be done with Ezgif, Photopea, or any other image resizing/cropping program/website. Your images probably aren't going to be bigger than 1060x83 pixels (the size of one of the list rows). • Saving them as .jpg files with as low a quality as you are okay with looking at. If they are already a jpg file this may not make a huge difference, but saving a .png as a .jpg will shave off a lot of file size. The problem with this solution is it is quite time consuming, but it is likely the best way to hasten page load. MonsieurAlarm said: 3. Is there a reason why sometimes when I open up my list and I hover over my list entries with the custom images, it sort of flickers. Like if I hover over it, for a brief fraction of a second all of the entries (that I hover over) will flash black and then go back to normal after I hovered over it. Want to know what causes it and how I can get rid of it. I am not seeing this on my end, but it sounds like a performance/network issue so that makes sense that we'd be experiencing different things. If it's only occuring soon after page load, then it's probably due to the page still loading in the images. If it always occurs then it's a performance or code bug but since I'm not seeing the issue I assume it is due to less powerful hardware or the browser you are using. I'd have to know your browser to begin attempting to debug this. MonsieurAlarm said: 4. I have been using the code you posted for another user for the list row image. It has been working great, but I have encountered some problems with it. Whenever I try entering the ID for an anime with a small ID number like Naruto with an ID of 20 and One piece with an ID of 21, it affects other anime entries that have a longer ID number but start with the same number (20 or 21). Hm, there should be a "/" after the ID. This will prevent the bug from occuring. Not sure if I had it in the post you got that code from, but I definitely should have. Here's the difference in code. Before: .title a[href^="/animeORmanga/ID"]::before {
background: linear-gradient(var(--row-tint),var(--row-tint)), url(IMAGE) no-repeat center / cover scroll;
}After: .title a[href^="/animeORmanga/ID/"]::before {
background: linear-gradient(var(--row-tint),var(--row-tint)), url(IMAGE) no-repeat center / cover scroll;
}MonsieurAlarm said: 5. A few days ago, I've noticed that for some reason, my list hover covers haven't been working and I thought that the feature just broke again like a few weeks before and it'll fix itself again. But when I went on a different computer and on my laptop, the hover covers have been working fine. Even when I go on other user's profiles, the hover cover feature seems to be blank for me on this computer, but fine on others and I am unsure why or how I can fix this. I have noticed the generator is a bit slower to load as of late. Sometimes it doesn't always load immediately and slowly loads in. It could also be your browser (especially if it's Safari or Brave) or a browser extension, but if it wasn't a problem before then I doubt this. Assuming it isn't a problem with your setup, my only solutions are the ones listed in the main post FAQ. MonsieurAlarm said: Also just curious is there a way to make it so your entire list sizes down when you are on a smaller screen or something. My monitor screen size is significantly larger than my laptop's and noticed that things like the hover covers get cut off a little. Was wondering if there was a way for it to automatically size down when on a device with a smaller resolution/screen size. This is possible with "media queries". These are basically just some extra code you can wrap around other code to deliniate at what screen sizes it applies. It can get quite complex depending on how many changes you wanted to do, but for a resizing of the list it might not be too complex. You may find some things don't play nicely when resized down, especially with how many modifications have already been added onto the list, but it really depends on what is being changed. Here's an example of resizing the list on smaller screens. |
Cover images aren't loading?
Valerio_LyndonMar 7, 2021 6:08 PM
Black_D-44 said: MonsieurAlarm said: 5. A few days ago, I've noticed that for some reason, my list hover covers haven't been working and I thought that the feature just broke again like a few weeks before and it'll fix itself again. But when I went on a different computer and on my laptop, the hover covers have been working fine. Even when I go on other user's profiles, the hover cover feature seems to be blank for me on this computer, but fine on others and I am unsure why or how I can fix this. The same thing happened to me, not only with the hover covers but also with Doomcat's header tool. Since both of these are failing at once, it's probably due to your browser (especially if it's Safari or Brave) or a browser extension (such as uBlock).
See if these fix your issue. If it does, then Brave or adblockers usually allow you to disable blocking only for MAL without affecting other websites. If none of those work, you may have to try using one of the alternate solutions from the FAQ, but these will only fix the covers. Unfortunately I don't have a similar solution for the MalCat headers. Here's the relevant solutions for covers from the main post FAQ. |
SheyCroix said: Hello again Vale. Just came by to say thanks again. Can't see myself not using these theme anymore lol (the simple design horizontal tag are just that convenient!) ;D Thank you for the kind words, it's appreciated. :) |
This worked for me, I still can't see Doomcat's header tool but it doesn't bother me too much. (Also, I use Google Chrome and Adblock) Thanks for the help Val! |
|
Black_D-44 said: This worked for me, I still can't see Doomcat's header tool but it doesn't bother me too much. (Also, I use Google Chrome and Adblock) Thanks for the help Val! Glad the covers are working! Just wish I knew what was going on with the headers as you're not the only person to report issues with it in the last week. I'll have to see if it's an issue I can reproduce and pin down the cause of. |
Valerio_Lyndon said: I don't currently know of a way to edit in Dropbox. Editing in the text doc on my PC and then uploading is how I manage uploads. You might be able to setup an auto-upload/auto-sync function with Dropbox's desktop app but I have not used that so can't be sure. Don't think this would be too much of a problem because find dropbox to be very straightforward! Was just hoping there was a faster way is all. Valerio_Lyndon said: That said, the main thing increasing page speed is most likely the added background images. Optimizing these images will likely provide much more speed benefit than minimizing the code. Ways you could optimize the images might be: • Resizing so that they aren't bigger than the space they take up. This can be done with Ezgif, Photopea, or any other image resizing/cropping program/website. Your images probably aren't going to be bigger than 1060x83 pixels (the size of one of the list rows). • Saving them as .jpg files with as low a quality as you are okay with looking at. If they are already a jpg file this may not make a huge difference, but saving a .png as a .jpg will shave off a lot of file size. Going to try this out thanks! Valerio_Lyndon said: I am not seeing this on my end, but it sounds like a performance/network issue so that makes sense that we'd be experiencing different things. If it's only occuring soon after page load, then it's probably due to the page still loading in the images. If it always occurs then it's a performance or code bug but since I'm not seeing the issue I assume it is due to less powerful hardware or the browser you are using. I'd have to know your browser to begin attempting to debug this. I honestly don't find this happening too often. It just happens a lot when let's say I have many tabs open since I'm working on something or have a game running at the same time. I'm guessing this just has something to do with everything not loading in properly so probably a performance issue. I also only ever use Google Chrome. Valerio_Lyndon said: Hm, there should be a "/" after the ID. This will prevent the bug from occuring. Not sure if I had it in the post you got that code from, but I definitely should have. Here's the difference in code. Before: .title a[href^="/animeORmanga/ID"]::before {
background: linear-gradient(var(--row-tint),var(--row-tint)), url(IMAGE) no-repeat center / cover scroll;
}After: .title a[href^="/animeORmanga/ID/"]::before {
background: linear-gradient(var(--row-tint),var(--row-tint)), url(IMAGE) no-repeat center / cover scroll;
}Thank you so much for this! That fixes that problem. Valerio_Lyndon said: I have noticed the generator is a bit slower to load as of late. Sometimes it doesn't always load immediately and slowly loads in. It could also be your browser (especially if it's Safari or Brave) or a browser extension, but if it wasn't a problem before then I doubt this. Assuming it isn't a problem with your setup, my only solutions are the ones listed in the main post FAQ. I currently ever use Google Chrome and haven't really changed anything in my code so I don't think it broke unless I'm funny and messed up somewhere. I have also run adblockers such as ABP and uBlock since I started using mal and haven't really had a problem with using them until now. I disabled both adblockers and deleted them just in case that makes a difference and see that the issue still remains. I tried the solution for the privacy-blockers and deleted the line: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore"; After I've done this, I added: @\import "https://malscraper.azurewebsites.net/covers/anime/<MonsieurAlarm>/presets/dataimagelinkbefore"; After I have done this step and clicked save, I noticed that my list wasn't fixed and was wondering why, but after checking the code, I noticed that every time I hit save, the code would go from that, to this: @\import "https://malscraper.azurewebsites.net/covers/anime//presets/dataimagelinkbefore"; I'm wondering why this happens, but decided for now, just to go with the code posted in "Solution for any other problem" instead. Only thing that bothers me is that some entries like Noblesse and the new season of Seven Deadly don't show a list cover :( Other than that seems to work fine! |
| @MonsieurAlarm @I saw your list and I really love it. I use it too but I haven't customized it as much as you did (I don't know much about CSS but tell me if you know a good way to learn it). I LOOOOOOOOOOOOOOOVED you list and specially the function which let the previews load on the rows like this  So, basically the thing is, can you please gimme you list CSS and tell how you learned CSS or just tell me a good way to learn it |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
MonsieurAlarm said: I currently ever use Google Chrome and haven't really changed anything in my code so I don't think it broke unless I'm funny and messed up somewhere. I have also run adblockers such as ABP and uBlock since I started using mal and haven't really had a problem with using them until now. I disabled both adblockers and deleted them just in case that makes a difference and see that the issue still remains. I tried the solution for the privacy-blockers and deleted the line: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore"; After I've done this, I added: @\import "https://malscraper.azurewebsites.net/covers/anime/<MonsieurAlarm>/presets/dataimagelinkbefore"; After I have done this step and clicked save, I noticed that my list wasn't fixed and was wondering why, but after checking the code, I noticed that every time I hit save, the code would go from that, to this: @\import "https://malscraper.azurewebsites.net/covers/anime//presets/dataimagelinkbefore"; I'm wondering why this happens, but decided for now, just to go with the code posted in "Solution for any other problem" instead. Only thing that bothers me is that some entries like Noblesse and the new season of Seven Deadly don't show a list cover :( Other than that seems to work fine! After looking into it, it seems Google Chrome has begun rolling out tightened restrictions on referral policy. What this means is tools like the covers and headers tools can no longer auto-detect certain info. A bit of a nuisance, but it's bypassable. Anyhow, glad the 'fix for anything' worked. As for the privacy blocker fix (which should work for this), it just needs the username without any <> marks. Animelist link: @\import "https://malscraper.azurewebsites.net/covers/anime/MonsieurAlarm/presets/dataimagelinkbefore"; @\import "https://malscraper.azurewebsites.net/covers/manga/MonsieurAlarm/presets/dataimagelinkbefore"; These will prove lighter weight/faster loading than the 'fix for anything', so you may wish to use them instead. :) The reason the username got deleted is due to a long-standing bug with MAL's editor and <> marks that I reported a year ago. I wouldn't worry about it lol. |
Black_D-44 said: I still can't see Doomcat's header tool but it doesn't bother me too much. (Also, I use Google Chrome and Adblock) Sorry for the double quote. After some research, I believe the recent breakage is due to Google Chrome rolling out tightened restrictions on referral policy. What this means is tools like the covers and headers tools can no longer auto-detect certain info. So what we need to do is provide that info to the tools where possible, which I have got working with the headers in my testing. All that needs to be done is replacing the @import near the top of your code. Here's the line that needs replacing: @\import "https://malcat-gen.appspot.com/headers?template=[data-query*='\"status\":7'] .list-item:nth-child($index){margin-top:48px;}[data-query*='\"status\":7'] .list-item:nth-child($index):before{content:'$content'}";And here's what to replace it with: @\import "https://malcat-gen.appspot.com/headers?template=[data-query*='\"status\":7'] .list-item:nth-child($index){margin-top:48px;}[data-query*='\"status\":7'] .list-item:nth-child($index):before{content:'$content'}&user=Black_D-44&list=anime";You can see there is new text at the end saying "&user=Black_D-44&list=anime". This should prevent the tool from needing to auto detect this information and get things working again. If it does, great! This does, however, mean that the import will only work on the animelist now. So, if you use the mangalist too, you will have to use a second MAL style with the only difference being to change the ending text of the import from "anime" to "manga". |
| Is there a was to copy someone's list style CSS without having to ask to them for it? |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
LEGENDS_OF_ANIME said: Is there a was to copy someone's list style CSS without having to ask to them for it? Yes: https://myanimelist.net/forum/?topicid=399507 or use Inspect Element in Firefox as shown in the video at the bottom of the post |
| Thank you Val, everything is working now! |
|
Shishio-kun said: Yes: https://myanimelist.net/forum/?topicid=399507 or use Inspect Element in Firefox as shown in the video at the bottom of the post Thanks, I had watched you videos in the past but i forgot how to do it. Thanks for reminding me of it. By the way, Most of the time I literally forget that you are the admin of this club cuz I only check this forum's replies (It's the only one I need). So most of the time in my mind Valerio_Lyndon is the admin and I find it very silly 😂😂😂 |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
I have been doing a lot of testing with how I can change my list but I am stuck with a problem How can I make the black background of tags and season transparent? If I try to do it, the text become transparent too. Please help me out a bit |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
Curiossity said: I'm not sure if you're still doing mods for this but I had a neat idea. Is there any way that the tags could be modified so that they don't show people's tags (because some people like me don't use tags), instead they show the description of the anime? I know there may be a problem with overflow but maybe it could be solved with a small box that allows scrolling while the mouse is inside the box. I don't think it's possible cuz a lot of other people asked these functions too (Including me) but Valerio_Lyndon said that it's not possible (For now at least) I was also curious about how to change the color of the words i.e. progress, rated, premiered It took quite a time to get all these ready so hope you like it |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
Curiossity said: I'm not sure if you're still doing mods for this but I had a neat idea. Is there any way that the tags could be modified so that they don't show people's tags (because some people like me don't use tags), instead they show the description of the anime? I know there may be a problem with overflow but maybe it could be solved with a small box that allows scrolling while the mouse is inside the box. I don't think it's possible cuz a lot of other people asked these functions too (Including me) but Valerio_Lyndon said that it's not possible (For now at least) Curiossity said: I was also curious about how to change the color of the words i.e. progress, rated, premiered It took quite a time to get all these ready so hope you like it |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
| I need help with my headers. So I used to have headers on my list but they randomly disappeared today. When I mean headers I'm referring to the titles in the "All Anime" section that differentiate the anime on your list. Unfortunately I couldn't find pictures of what they looked like before they were deleted. So I just took a screenshot of someone else's headers as an example: I have the categories as tabs but I also want them as headers throughout my list. I also have the status bars but those aren't always very clear. Can someone help me? I'm using Google Chrome and here's my code for reference: |
mistersunday said: I need help with my headers. So I used to have headers on my list but they randomly disappeared today. When I mean headers I'm referring to the titles in the "All Anime" section that differentiate the anime on your list. Unfortunately I couldn't find pictures of what they looked like before they were deleted. So I just took a screenshot of someone else's headers as an example: I have the categories as tabs but I also want them as headers throughout my list. I also have the status bars but those aren't always very clear. Can someone help me? I'm using Google Chrome and here's my code for reference: This is a recent issue due to an update Google Chrome is rolling out. I've added info to the main post about this which I will also go over here. The way to fix this is to add your username and list type to the header import. In your case, you should replace this line: @import url(https://malcat-gen.appspot.com/headers); With this new one: @\import "https://malcat-gen.appspot.com/headers?user=mistersunday&list=anime"; Not that this will break headers on your mangalist. If you need headers for your mangalist, you will have to split your anime/mangalist over two themes; You can use identical code except for the separate header import (and cover image import if using that too). Once you have a second style setup for your mangalist, simply change the "list=anime" text we added to "list=manga". Note to other users: this exact fix will not work for you. This is a specific reply to mistersunday. For a more generalized guide on fixing the headers, please see the main forum post or simply reinstall the mod following any new instructions. |
Valerio_LyndonMar 13, 2021 7:02 PM
splashhui said: Hi! I'm having trouble adding a character render in. When I input the link, nothing shows up on the page :( here's the code This is a problem with the image host. Zerochan appears to have disabled external linking through CSS or otherwise. Here's a replacement URL that should work: https://i.imgur.com/zaPDeHZ.png This is why I always recommend rehosting images onto your account on a website such as Imgur, where you know it will work in CSS and will not break later on. |
LEGENDS_OF_ANIME said: I have been doing a lot of testing with how I can change my list but I am stuck with a problem How can I make the black background of tags and season transparent? If I try to do it, the text become transparent too. Please help me out a bit You need to use a background property with a colour value that specifies transparency, such as rgba(). Using "opacity" or similar will indeed affect the transparency of the entire element, not just its background. Here's an example: .data.studio a,
.list-table-data .data.season a {
background: rgba(30,34,38,0.5)
} |
Valerio_Lyndon said: You need to use a background property with a colour value that specifies transparency, such as rgba(). Using "opacity" or similar will indeed affect the transparency of the entire element, not just its background. Here's an example: .data.studio a,
.list-table-data .data.season a {
background: rgba(30,34,38,0.5)
}I am asking this cuz I wanna know more about CSS and how to use and configure it. So, does it mean that if I use opacity on a element it will effect the whole thing but if I use rgba it can be used to be more specific? Also, is there a way I can see what the color code is of a picture? For example, how will I know what the exact color code of this picture is?:  |
StoryGraph x Spotify x Instagram “Whether we die or not isn't really that big a deal." — Suzuya Juuzou |
LEGENDS_OF_ANIME said: Valerio_Lyndon said: You need to use a background property with a colour value that specifies transparency, such as rgba(). Using "opacity" or similar will indeed affect the transparency of the entire element, not just its background. Here's an example: .data.studio a,
.list-table-data .data.season a {
background: rgba(30,34,38,0.5)
}I am asking this cuz I wanna know more about CSS and how to use and configure it. So, does it mean that if I use opacity on a element it will effect the whole thing but if I use rgba it can be used to be more specific? Also, is there a way I can see what the color code is of a picture? For example, how will I know what the exact color code of this picture is?: Yes, that's correct. Opacity changes the opacity of the entire element, which includes any text or child elements inside it. Using an RGBA value on a specific property will only affect the transparency of said property. So an RGBA on the "background-color" will only affect the background. Same with an RGBa on the "color" for text colour. You can either use an online colour picker such as https://imagecolorpicker.com/ or https://www.photopea.com/ or a downloaded tool such as ShareX or PowerToys. |
Curiossity said: I'm not sure if you're still doing mods for this but I had a neat idea. Is there any way that the tags could be modified so that they don't show people's tags (because some people like me don't use tags), instead they show the description of the anime? I know there may be a problem with overflow but maybe it could be solved with a small box that allows scrolling while the mouse is inside the box. It's possible with some Javascript tools that I recently took over maintaining. Check out this thread for installation: [Link]. Pardon any messiness of that thread, as it's still a bit WIP. But it's the best thing to link right now as I will be updating that with all the info I have in case you need to use this script more in the future. Anyhow, using that tool you can grab the synopses for all the anime and generate CSS for them. To do that, use this template with the tool: /* [TITLE] *[DEL]/ .tags-[ID]:after{content:"[DESC]"}Additionally, you should add this CSS to the bottom of your other list CSS. This will provide styling to all the synopses. /*-S-T-A-R-T--------------------*\
| Synopsis After Tags |
\*------------------------------*/
.data.tags {
width: 180px; /* Increase this width if needing more space */
}
.tags div:after {
display: block;
padding: 2px 4px;
max-height: 200px;
background: var(--btn-bg);
border-radius: 8.5px;
overflow-y: auto;
color: var(--text);
font-size: 11px;
line-height: 14px;
}
/*------------------------E-N-D-*/Make sure you keep the tag column enabled on your list as we will be hooking onto that with some of the CSS. Curiossity said: I was also curious about how to change the color of the words i.e. progress, rated, premiered This text is generally controlled by the "--text" or "--text-dim" variables. You can find a full list of variables and code to modify them in the main forum post and which I have also pasted here. For further modification of specific parts of your list, I can help out but will need to know which exactly. Legends of Anime has also given you a few already I see. If anything didn't make sense in this post, which is quite possible, let me know. I can explain better and improve the info for other people later (especially the tool I linked). |
LEGENDS_OF_ANIME said: Curiossity said: I'm not sure if you're still doing mods for this but I had a neat idea. Is there any way that the tags could be modified so that they don't show people's tags (because some people like me don't use tags), instead they show the description of the anime? I know there may be a problem with overflow but maybe it could be solved with a small box that allows scrolling while the mouse is inside the box. I don't think it's possible cuz a lot of other people asked these functions too (Including me) but Valerio_Lyndon said that it's not possible (For now at least) Curiossity said: I was also curious about how to change the color of the words i.e. progress, rated, premiered It took quite a time to get all these ready so hope you like it oh my goodness thank you so much, you're great, I'm gonna go and implement this onto my list right now. |
CuriossityMar 14, 2021 8:08 AM
More topics from this board
» theme helpthreat - Jul 5 |
5 |
by Zaryf
»»
Aug 21, 5:46 AM |
|
» [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 |
|
Sticky: » 💚 [REPAIR STICKY] Repair/speed up layouts + Request layout fixes ( 1 2 )Shishio-kun - Nov 17, 2023 |
52 |
by LucaBalsa
»»
Jul 6, 2:02 PM |
|
» [CSS/BBCODE] ⭐️ How to view anyone's CSS or BBcodes (for lists, profiles, or clubs)!Shishio-kun - Feb 6, 2012 |
37 |
by sunnysummerday
»»
Jun 11, 7:44 PM |