OK well with this part[size=200]Wiki:[/size] [url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji][/url] [center][url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji][size=200]Click Here:[/size][/url][/center] [url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji] The second and fourth line have nothing to change to a URL. There should be text between the first two URL tags in the second part, and in the fourth part, text after the URL opennig tag and you need to add a URL closing tag. Also and most importantly that character name isn't working on MAL for BBcode, because I notice this does: [center][size=200]Wiki:[/size][/center] [url=https://fategrandorder.fandom.com/wiki/Archer]Text here[/url] [center][url=https://fategrandorder.fandom.com/wiki/Archer][size=200]Click Here:[/size][/url][/center] [url=https://fategrandorder.fandom.com/wiki/Archer]Text here[/url] I think the ō character in Ibuki Doji is breaking the BBcode on MAL. The above example works but this below one wont work. You can see how in the next post the archer one works and the original doesnt. [size=200]Wiki:[/size] [url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji]Text here[/url] [center][url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji][size=200]Click Here:[/size][/url][/center] [url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji]Text here[/url] |
Shishio-kunDec 22, 2022 10:48 AM
testing[center][url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji][size=200]Click Here:[/size][/url][/center] [url=https://fategrandorder.fandom.com/wiki/Ibuki_Dōji]Click Here:[/url] [center][url=https://fategrandorder.fandom.com/wiki/Archer][size=200]Click Here:[/size][/url][/center] |
| @Nillwas answered your last post a couple posts above, forgot to @ and I'm not quoting cuz everything is broken on MAL today You can put the Ibuki's character page URL into this https://tinyurl.com/app/ and it should give you a URL that could work with the BBcode and not break it :D I havent used tinyurl in forever but it worked for this kinda thing back in the day all the time |
Shishio-kunDec 22, 2022 10:50 AM
Shishio-kun said: @Nillwas answered your last post a couple posts above, forgot to @ and I'm not quoting cuz everything is broken on MAL today You can put the Ibuki's character page URL into this https://tinyurl.com/app/ and it should give you a URL that could work with the BBcode and not break it :D I havent used tinyurl in forever but it worked for this kinda thing back in the day all the time Thank you so much, this works. Have a great x/mas bud! |
 |
| Hello @shishio-kun, I started customizing my anime list today for the first time and it was going pretty rapidly. Now the only problem i've encountered is whenever i hover over one of the rows, the big preview picture isn't fully showing up. Only the top-right part of the picture is, while i ofcourse want the full cover to show up without enlarging the size of the pop-up. You can check the problem out on my profile: https://myanimelist.net/animelist/Dupplo?status=2&order=4&order2=0 The code i used to achieve this was: @\import "https://malscraper.azurewebsites.net/covers/anime/Dupplo/presets/dataimagelinkbefore";
@\import "https://malscraper.azurewebsites.net/covers/manga/Dupplo/presets/dataimagelinkbefore";
/*-S-T-A-R-T--------------------*\
| Hover Image R0.3 |
\*------------------------------*/
.data.image a{overflow:visible}.data.image a:before{content:"";position:absolute;top:50%;left:-166px;z-index:50;width:150px;height:0;background:var(--bg-dark) no-repeat center/cover;border-radius:8px;box-shadow:0 0 2px #000;opacity:0;pointer-events:none;transition:all .3s ease}.list-item:hover .data.image a:before{top:calc(50% - 100px);height:200px;opacity:1}.data.image a:after,.data.image img{border-radius:50%}
/*------------------------E-N-D-*/It should have been a straight up copy pasta, but i still found this little problem with it. Hope you can help me out. (: |
 |
| I'm trying to create an original Chrome extension to place CSS on MAL- if someone can just give me a simple example of the JSON "manifest" file that injects a CSS file (CSS file found in the same folder with the JSON file) into a webpage that'd be perfect. I have the CSS file already. I could not figure it out from the tutorials on the Chrome extension site and I can't find a simple example. Also I don't want to reverse engineer and edit another already-made extension, but that does work and I have been able to add the custom CSS to MAL with those if I can't make an original one. Also, edits I make to another user's Chrome extension files rarely save, this is on my own desktop, any reason why? They keep reverting back. Even the "tutorial extensions" do this. This is making it extremely difficult and frustrating to learn lol edit: I figured this out and managed to create the working dark mode extension, but there are some errors in the extension according to Chrome (even tho it works) I will post the code later and hopefully someone can help clean it up if I can't figure that part out edit 2: managed to get it all working and error free :D |
Shishio-kunJan 4, 2023 2:24 PM
| I want to change the name of the columns, I know it's possible cause the theme I'm using changes some of the names, and I'd like to override this, is it possible without too much work, or is it complicated? (I want to do it because I'm using Dropped to hold my currently releasing anime, cause I'm watching so many that they clog my current tab) |
 |
Moon-dew said: right, so all you have to do is search your brink code for "paused" to findI want to change the name of the columns, I know it's possible cause the theme I'm using changes some of the names, and I'd like to override this, is it possible without too much work, or is it complicated? (I want to do it because I'm using Dropped to hold my currently releasing anime, cause I'm watching so many that they clog my current tab) #status-menu .status-button.onhold::before{content:"PAUSED"}#status-menu .status-button.dropped::before{content:"DROPPED"} |
   My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Tama47_ said: disabling the background and giving body.ownlist a color is what is causing it, with them being !important you have to chang their code or place new code below them, try Hey, I tried to update my list but now my background has been covered by a black background for some reason and I couldn't figure out why. I've tried adding the "Disable Background" but it doesn't seem to do anything. I've also tried changing the opacity and the z-index but that just breaks things more than it fixes. Any idea how to fix this? Thanks! This is my list https://myanimelist.net/animelist/Tama47_   body.ownlist { background-color: transparent !important; background-image: initial !important; }
body { background-image: url(https://i.imgur.com/s84cXOW.jpeg) !important; } |
ShaggyZEJan 12, 2023 3:18 PM
| My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
| @Yurito-san You need to post the code on Pastebin, or else that long code stretches out the page too much even when its in a spoiler. Please post the link to pastebin with your CSS in a new post https://pastebin.com/ @jonathanmaximus I only speak English |
| @Shishio-kun I want tips on how I can customize my club from the computer, it's also what is the best app for commanding photos. Edit my club for desktop users, my club and most active on mobile. |
Jonathanmaximus  |
use BBcode to customize the group's front page, and make some graphics for it or find graphic designers to do it https://myanimelist.net/forum/?topicid=496203 https://myanimelist.net/forum/?topicid=419631 it's also what is the best app for commanding photos. Edit my club for desktop users, my club and most active on mobile. ??? |
| Thanks @Shishio-kun for the tip. I had said how to add images. |
Jonathanmaximus |
| I already learned @Shishio-kun thank you for helping me, thanks to you I learned how good it feels to work with technology, I think you must have already felt that feeling. ☺ |
Jonathanmaximus |
| Hi. The image of my Mal graph is not displaying anymore. How can I fix this? Anyone else with this bug? sorry if this has been already answered |
| @Haruni I have this too, but it's a picture on my profile is not loading, look at my profile @Shishio-kun I have this problem my pictures are just showing a paper without the picture. @Shishio-kun Look "My honors to the Global Club🌐" |
Jonathanmaximus |
Haruni said: Hi. The image of my Mal graph is not displaying anymore. How can I fix this? Anyone else with this bug? sorry if this has been already answered I see your MALgraph, is it still gone for you? I think there's a club just for reporting the issues with it https://myanimelist.net/clubs.php?cid=67199 |
jonathanmaximus said: I already learned @Shishio-kun thank you for helping me, thanks to you I learned how good it feels to work with technology, I think you must have already felt that feeling. ☺ OK good, thank you! jonathanmaximus said: @Haruni I have this too, but it's a picture on my profile is not loading, look at my profile @Shishio-kun I have this problem my pictures are just showing a paper without the picture. @Shishio-kun Look "My honors to the Global Club🌐" I think that image was deleted at one point, you should paste the BBcode here for it from your About Me edit box and maybe it can be salvaged. Otherwise you'd need to reupload them, you should always use Imgur for image hosting https://imgur.com/upload |
| Sorry for replying late. @Shishio-kun I think it's not that, because I made the image, I downloaded it on imgur, then I copied the link and I did it, but it wasn't |
Jonathanmaximus |
| @Shishio-kun this was the code i used: [url= https://myanimelist.net/clubs.php?cid=87004] it's all glued together I separated it because it would give the image |
jonathanmaximusJan 20, 2023 6:18 AM
Jonathanmaximus |
OK I see, that isn't the right imgur link. You should go through the BBcode tutorial I linked it will explain how to do all this correctly: https://myanimelist.net/forum/?topicid=496203 You're using this: https://imgur.com/gallery/FUdAx8R Needs to be like this: [img]https://imgur.com/zYTOeyE.jpg[/img]  |
| Muito obrigado @Shishio-kun Eu sempre vou usar seus tutoriais, eu vou marcá-lo no meu clube porque você me ajudou, obrigado ☺👍 Juntar em Global🌐 |
jonathanmaximusJan 20, 2023 7:30 AM
Jonathanmaximus |
Cenker said: Helloo I want to add a tag to the anime I watch, but there is no place to add it. It was visible in the default interface which I used before, but unfortunately it doesn't appear in this interface. I did some research, but so far I haven't found any css code that can solve this problem. I'd be very happy if you could help me. You should be able to find it when you click the edit button under the anime name, might have to click Show Advanced |
| hi o/ im not asking for help today but i wanted to share this video with the regulars here |
 |
 |
| @ItsAvu Where exactly did you get the score synopsis thing? I don't know about it all atm. Link me to the post or thread, and also your post is full of gibberish- use the source mode when copying/pasting stuff or else it creates those errors. The link you have won't load a page for me. Clarity is already imported so I don't think you will run out of space unlike the previous Takana grids, if that's what you mean. |
Shishio-kunMar 24, 2023 8:43 AM
| This is the Thread I started to follow. Please tell me if the link still doesn't work. I hosted my own css to future proof the code so I wouldn't have to worry about running out of space in the future as I plan to keep this layout for quite awhile. What I want is exactly how in Uji Gintoki Bowl's post (of course I want decorate it in my own way) but for right now I'm just trying to get everything to show properly and in the correct space. I asked him about the code and this thread is where he directed me, so far the instructions are very helpful however I'm confused why some buttons (mal score and synopsis) aren't working by (1) not showing and (2) the synopsis button does not work on hover (description won't show). |
|
ItsAvu said: This is the Thread I started to follow. Please tell me if the link still doesn't work. I hosted my own css to future proof the code so I wouldn't have to worry about running out of space in the future as I plan to keep this layout for quite awhile. What I want is exactly how in Uji Gintoki Bowl's post (of course I want decorate it in my own way) but for right now I'm just trying to get everything to show properly and in the correct space. I asked him about the code and this thread is where he directed me, so far the instructions are very helpful however I'm confused why some buttons (mal score and synopsis) aren't working by (1) not showing and (2) the synopsis button does not work on hover (description won't show). The links work now; I think this is the tool you're supposed to use: https://myanimelist.net/forum/?topicid=1905478 I have zero knowledge of it atm or what you're doing, even though I worked with it in the past since there's a video of mine in the thread. You should look through that post and ask there and also tag Valerio_Lyndon since he should be more familiar with this. If you don't get an answer soon just bump the post and I'll try to figure out the tool and adding those features to Clarity. |
Shishio-kunMar 24, 2023 11:15 AM
Shishio-kun said: ItsAvu said: This is the Thread I started to follow. Please tell me if the link still doesn't work. I hosted my own css to future proof the code so I wouldn't have to worry about running out of space in the future as I plan to keep this layout for quite awhile. What I want is exactly how in Uji Gintoki Bowl's post (of course I want decorate it in my own way) but for right now I'm just trying to get everything to show properly and in the correct space. I asked him about the code and this thread is where he directed me, so far the instructions are very helpful however I'm confused why some buttons (mal score and synopsis) aren't working by (1) not showing and (2) the synopsis button does not work on hover (description won't show). The links work now; I think this is the tool you're supposed to use: https://myanimelist.net/forum/?topicid=1905478 I have zero knowledge of it atm or what you're doing, even though I worked with it in the past since there's a video of mine in the thread. You should look through that post and ask there and also tag Valerio_Lyndon since he should be more familiar with this. If you don't get an answer soon just bump the post and I'll try to figure out the tool and adding those features to Clarity. I saw the post this morning, just working my day job atm. Will take a look later today. |
Valerio_Lyndon said: Shishio-kun said: The links work now; I think this is the tool you're supposed to use: https://myanimelist.net/forum/?topicid=1905478 I have zero knowledge of it atm or what you're doing, even though I worked with it in the past since there's a video of mine in the thread. You should look through that post and ask there and also tag Valerio_Lyndon since he should be more familiar with this. If you don't get an answer soon just bump the post and I'll try to figure out the tool and adding those features to Clarity. I saw the post this morning, just working my day job atm. Will take a look later today. Thank you! 🙏😁 |
ItsAvu said: I've been trying to follow along the instructions on how to make a mal score and synopsis "button" on my list earlier in this thread at: [font="\"gg sans\", \"Noto Sans\", \"Helvetica Neue\", Helvetica, Arial, sans-serif"]https://myanimelist.net/forum/?topicid=200323&show=6400#:~:text=I%20think%20the%20tool%20I%20linked%20previously%20is%20your%20best%20bet%20at%20the%20moment.%20It%20will%20require%20you%20to%20manually%20re%2Dgenerated%20the%20CSS%20every%20time%20you%20want%20it%20updated%2C%20but%20I%20don%27t%20have%20the%20time%20to%20create%20a%20userscript%20to%20do%20it%20automatically%20for%20you%20at%20the%20moment. [/font] and the code does not seem to work for me. I can't figure out how to make the mal score button and the synopsis button is showing however the synopsis description doesn't show when it's hovered. I'm followed the instructions on how to host my own css import so my css code for my list wouldn't hit the limit or become to cluttered but I don't think the import is the problem. To add just in case it matters I am using a premade clarity list layout made by Valerio Lyndon. Here's my full code: There are a couple of issues that popped up here.
The URL problem is easy. Following the instructions from step 3 of Shishio's guide, we just need to change your current import: @\import "https://www.dropbox.com/s/nro64pdrvp7xhca/MALSYNOPSIS.css?dl=0"; to this instead: @\import "https://dl.dropboxusercontent.com/s/nro64pdrvp7xhca/MALSYNOPSIS.css"; The next two problems are easier to solve at the same time, since both of these issues require a new preset. And since your styling code is already using the Storage column, I figure we'll stick with it for the preset. You should first update to the newest version of the generator tool to make a bunch of things easier. You can get that from here and replace your current bookmark with the code: [Code]. For info on any new features, see the [Thread]. To switch your preset, navigate to "Import Template" at the bottom left and import this string. {"template":"/* [TITLE] *[DEL]/ .progress-[ID]:after {content: \"MAL - [SCORE]\"} #tags-[ID] ~ .data.storage:after {content: \"SYNOPSIS\\a \\a [DESC]\"}","matchtemplate":"#tags-[ID]","css":""} This will give you the new preset and the tool will remember it for the next time you run it. Run the tool and generate the CSS from scratch by clicking "Start". You will also need to enable the "Storage" column in your list settings. This is because of your styling code and the new preset we used. After this the only remaining bug should be that the synopses layer underneath list items, which I assume is a bug from using Gintoki's code on the default list. This can be fixed by change the "z-index: auto" on line ~152 to "z-index: 6". There is also the fact that the MAL scores are not styled, but that is simply due to you not having any styling code for it in your CSS. That can be done quite easily. |
Valerio_LyndonMar 24, 2023 7:48 PM
| Thank you so much everything has started to work perfectly! I didn't know so much could change between 2020 and 2023 with code, I thought 2020 was pretty updated so I thought I got lucky with finding an updated version. Once again thanks for your help! |
|
| I'm doing the finishing touches on my notes section and I'm having trouble finding out where is the code to change where the text starts in the notes section as I feel the reason the text is so scrunched up is because it's not utilizing all the space it can have (it will also look nicer). Here is a attached photo of what it looks like with some annotations that hopefully clarify what I'm looking for --> Note Trouble Here is the code that Valerio changed from tags to notes and I changed some numbers around to change where I wanted it on my list. I have already changing the text-align: center in the .notes section. I'm wondering did I change a number I wasn't supposed to change while trying to move the bubble and notes section to the right of my list. |
|
ItsAvu said: I'm doing the finishing touches on my notes section and I'm having trouble finding out where is the code to change where the text starts in the notes section as I feel the reason the text is so scrunched up is because it's not utilizing all the space it can have (it will also look nicer). Here is a attached photo of what it looks like with some annotations that hopefully clarify what I'm looking for --> Note Trouble Here is the code that Valerio changed from tags to notes and I changed some numbers around to change where I wanted it on my list. I have already changing the text-align: center in the .notes section. I'm wondering did I change a number I wasn't supposed to change while trying to move the bubble and notes section to the right of my list. You'll need to change the "padding" property inside of the ".notes" section. It currently has 120px of padding on each side, as defined by the second number in the value: padding: 120px 120px 98px; The "padding" property is a shorthand for all 4 padding-top/right/bottom/left properties that defines all 4 values in that order. If you find the syntax confusing you can always use the regular properties as well: padding-left: 40px; padding-right: 40px; Also, padding actually counts towards the width, so your current width is your 40px of regular width + 240px (120px * 2) of padding. Thus if you want the bubble to remain the same size you will need to increase the width by however much you decrease the padding. As a starting value, you might want to try out changing the width to 160px and the side paddings to 40px, but any width or padding value is fine if it looks right to you. Here's a visual example of those changed properties (you'll have to change your properties under the ".notes" selector inside your code to match). width: 160px !important; padding: 120px 40px 98px; |
Valerio_LyndonMar 28, 2023 10:30 PM
| I have a couple random questions related to a badge icon idea I have. Mainly curious about whether or not these things are possible with Modern CSS. 1. Are we able to add a completely new custom column to our list table? Or is the best we can do to rename an existing column using something like "--tag-column-title: 'Badges"? 2. Is it possible to display specific tag values as small png icons within the column/row instead of text? Here's a mock-up of what I'm trying to describe.  |
 |
ArbiterofWhim said: Hello. This a very cool idea for an addon to lists. Don't know if there is something like this already, but would be very nice to see a tutorial about it. I will try to answer your questions.I have a couple random questions related to a badge icon idea I have. Mainly curious about whether or not these things are possible with Modern CSS. 1. Are we able to add a completely new custom column to our list table? Or is the best we can do to rename an existing column using something like "--tag-column-title: 'Badges"? 2. Is it possible to display specific tag values as small png icons within the column/row instead of text? Here's a mock-up of what I'm trying to describe. As far as i know, you can't add this new 'badges' colum directly, but you can simulate one using pseudo-elements after each row. Try adding this to your CSS: td.table_header:last-child:after, td.td1:last-child:after, td.td2:last-child:after {
content:'';
width:100%;
height:100%;
position:absolute;
background-color:rgba(0,0,0,0.6);
border:1px solid rgba(255,255,255,0.25);
top:-1px;
right: calc(-100% + -1px);
}
td.table_header:last-child:after {
content:'Badges';
font-weight:bold;
}As you may've seen, we would need to adjust the width of the page as well, so it doesn't overflow horizontally. But what you suggested is also a valid way and probably a better solution. Now, for the tags, you can sure do it. For both of the cases, wheter editing an existing column or adding it through pseudo-elements, you would need to move them to the specific position of the badges column though. Since you use the tags as comments over your animes, more editing of CSS would be necessary, mainly where they would be positioned. The best way do edit it would be if you could move the whole 'tags' field to the new column. This way, would be easier to get them centered. But, since your question was only if you can change the tags to an image, here's the code. td[class^='td']:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
}This one, for example, would change any tag that contains the text 'LOL GOKU' for this image:  . I don't know if you are familiarized with CSS, but you should just change what's after the tag= for the tag that you want. If it has any blanks spaces, you should change them to a plus sign (+) as i've done. As for the background you can change just the url inside the parenthesis and edit the width and the height to match the image ones as well. |
getNorted said: Does this need to be placed in a specific part of the CSS, or can it be placed anywhere? I tried adding it in near the top below the import (on the Modern style list of a testing account I made) and it doesn't seem to have any effect. The tag value is still text.td[class^='td']:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
}This one, for example, would change any tag that contains the text 'LOL GOKU' for this image: . I don't know if you are familiarized with CSS, but you should just change what's after the tag= for the tag that you want. If it has any blanks spaces, you should change them to a plus sign (+) as i've done. As for the background you can change just the url inside the parenthesis and edit the width and the height to match the image ones as well. |
|
ArbiterofWhim said: Edit: Just found the problem. Use this code instead. Now it should work.getNorted said: Does this need to be placed in a specific part of the CSS, or can it be placed anywhere? I tried adding it in near the top below the import (on the Modern style list of a testing account I made) and it doesn't seem to have any effect. The tag value is still text.td[class^='td']:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
}This one, for example, would change any tag that contains the text 'LOL GOKU' for this image: . I don't know if you are familiarized with CSS, but you should just change what's after the tag= for the tag that you want. If it has any blanks spaces, you should change them to a plus sign (+) as i've done. As for the background you can change just the url inside the parenthesis and edit the width and the height to match the image ones as well. td[class^="td"]:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Probably the best place to add it on your CSS is at the bottom. This way, it will overrule any general style added to the tags. |
getNortedJul 17, 2023 10:01 PM
getNorted said: I put the code at the very bottom, still no luck. Only thing I changed was "LOL+GOKU" to just "GOKU". Set it as the only tag value for Dungeon Meshi's entry in the test list, which you can see here: https://myanimelist.net/animelist/aowhim_testerEdit: Just found the problem. Use this code instead. Now it should work. td[class^="td"]:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Probably the best place to add it on your CSS is at the bottom. This way, it will overrule any general style added to the tags. |
|
ArbiterofWhim said: Oh, so you were adding to a test list. I see now. xDgetNorted said: I put the code at the very bottom, still no luck. Only thing I changed was "LOL+GOKU" to just "GOKU". Set it as the only tag value for Dungeon Meshi's entry in the test list, which you can see here: https://myanimelist.net/animelist/aowhim_testerEdit: Just found the problem. Use this code instead. Now it should work. td[class^="td"]:nth-of-type(6) a[href*="tag=LOL+GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Probably the best place to add it on your CSS is at the bottom. This way, it will overrule any general style added to the tags. So, there is a difference between the selectors for classic and modern lists. I didn't mention it before because i thought you were going to try this on the classic layout of your own list. For modern layouts, you can select the tags directly and, instead of using a plus sign for blank spaces, you use the percentage symbol (%). For the tag LOL GOKU, you can add this code. td.data.tags a[href*="tag=LOL%GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Now, if you are going to use only GOKU, you may use the code below: td.data.tags a[href*="tag=GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
} Also, if you are going to try adding those extra columns using the method i suggested before, the code should have some minor changes as well. |
getNorted said: Ah yeah I should have done a better job of clarifying lol. I'm currently in the middle of two efforts.Oh, so you were adding to a test list. I see now. x So, there is a difference between the selectors for classic and modern lists. I didn't mention it before because i thought you were going to try this on the classic layout of your own list. For modern layouts, you can select the tags directly and, instead of using a plus sign for blank spaces, you use the percentage symbol (%). For the tag LOL GOKU, you can add this code. td.data.tags a[href*="tag=LOL%GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Now, if you are going to use only GOKU, you may use the code below: td.data.tags a[href*="tag=GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
} Also, if you are going to try adding those extra columns using the method i suggested before, the code should have some minor changes as well. 1. Figuring out how to use the Notes field instead of the Tags field for mini-review on my Classic list style (https://myanimelist.net/forum/?topicid=563993&show=200&msgid=69561184#msg69561184) 2. Figuring out how to recreate my current Classic list style in Modern (in case the previous effort isn't fully possible) So I made a separate account to test stuff on Modern while still being able to use my list as normal. This badge idea was just a completely separate thing I was wondering about, but I figured I'd ask in the context of Modern. The latest code you posted works perfectly with Modern CSS, thanks! |
|
ArbiterofWhim said: No problem. I'm glad that i could help you. Also, you've actually mentioned on your first post something about modern, but since your list was with the classic style, i thought of using its selectors to answer.getNorted said: Ah yeah I should have done a better job of clarifying lol. I'm currently in the middle of two efforts.Oh, so you were adding to a test list. I see now. x So, there is a difference between the selectors for classic and modern lists. I didn't mention it before because i thought you were going to try this on the classic layout of your own list. For modern layouts, you can select the tags directly and, instead of using a plus sign for blank spaces, you use the percentage symbol (%). For the tag LOL GOKU, you can add this code. td.data.tags a[href*="tag=LOL%GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
}
Now, if you are going to use only GOKU, you may use the code below: td.data.tags a[href*="tag=GOKU"] {
font-size:0;
background-image:url(https://2img.net/i/fa/i/smiles/lol.gif);
width:51px;
height:49px;
display:block;
} Also, if you are going to try adding those extra columns using the method i suggested before, the code should have some minor changes as well. 1. Figuring out how to use the Notes field instead of the Tags field for mini-review on my Classic list style (https://myanimelist.net/forum/?topicid=563993&show=200&msgid=69561184#msg69561184) 2. Figuring out how to recreate my current Classic list style in Modern (in case the previous effort isn't fully possible) So I made a separate account to test stuff on Modern while still being able to use my list as normal. This badge idea was just a completely separate thing I was wondering about, but I figured I'd ask in the context of Modern. The latest code you posted works perfectly with Modern CSS, thanks! I will try to help you with your other question, as Shishio-kun mentioned that he's a little short on time right now. |
In a Modern list style, what's the optimal way to adjust which columns are shown based on the selected status? For example, if I wanted to have the following columns visible for each status:All Anime: index, title, score, type, progress, start date, finish date, tags Watching: index, title, score, type, progress, start date, tags Completed: index, title, score, type, progress, start date, finish date, tags On Hold: index, title, score, type, progress, start date, priority, tags Dropped: index, title, score, type, progress, start date, studio, tags Planned: index, title, score, type, progress, studio, priority |
|
ArbiterofWhim said: In a Modern list style, what's the optimal way to adjust which columns are shown based on the selected status? For example, if I wanted to have the following columns visible for each status: All Anime: index, title, score, type, progress, start date, finish date, tags Watching: index, title, score, type, progress, start date, tags Completed: index, title, score, type, progress, start date, finish date, tags On Hold: index, title, score, type, progress, start date, priority, tags Dropped: index, title, score, type, progress, start date, studio, tags Planned: index, title, score, type, progress, studio, priority Are you going to switch to modern? If so, please close the questions on classic in the other thread so volunteers dont spend time on questions for a list that won't be used. I'm not trying to be mean or bossy but that kinda thing lost me a lot of volunteers in the past and caused drama so I have to keep that kinda thing from happening again For this question, you'd probably use data query https://myanimelist.net/forum/?topicid=1911634 so like [data-query*='"status":2'] for completed page, and combine that with a selector from the column you want to change from this page https://myanimelist.net/forum/?topicid=1929120 see under column header codes for those selectors. [data-query*='"status":2'] th.header-title.number{ display: none !important; } so for example that should effect number header on completed only and in this case, remove it with display none |
Shishio-kun said: The simple answer is "ideally". I'm currently very happy with my list, aside from the frustrating tag character limitation that's been kneecapping my mini-reviews for years. The major barrier of Modern for me has always been that I'll need to build (from scratch) two completely different list styles that are also improvements over my existing anime/manga list styles. Since afaik I can't use Modern for anime and Classic for manga, and I am actively using both lists. I would expect it to take me months to do so in what free time I have.Are you going to switch to modern? If so, please close the questions on classic in the other thread so volunteers dont spend time on questions for a list that won't be used. I'm not trying to be mean or bossy but that kinda thing lost me a lot of volunteers in the past and caused drama so I have to keep that kinda thing from happening again My thought process was that I could get assistance (that hopefully wouldn't require much volunteer time) in just swapping Tags mini-reviews for Notes mini-reviews in Classic, thus significantly improving the functionality and hopefully also providing a solution to the community that other Classic users might utilize too. After all, even if I do eventually switch to Modern, I'd still be using Classic for quite a while. If you would prefer that I only ask questions for Modern, then I'll respect that. |
ArbiterofWhimJul 19, 2023 9:11 PM
|
| @ArbiterofWhim Ok thats no problem since you know. I understand just please try to get that classic how you want first before asking a lot about modern, so that no one believes their time was wasted (including me heh) if they help you with either extensively. The volunteers are a high priority and want to make sure they feel treated well 🙏 |
ArbiterofWhim said: In a Modern list style, what's the optimal way to adjust which columns are shown based on the selected status? For example, if I wanted to have the following columns visible for each status: All Anime: index, title, score, type, progress, start date, finish date, tags Watching: index, title, score, type, progress, start date, tags Completed: index, title, score, type, progress, start date, finish date, tags On Hold: index, title, score, type, progress, start date, priority, tags Dropped: index, title, score, type, progress, start date, studio, tags Planned: index, title, score, type, progress, studio, priority btw it's possible to do this on classic CSS as well (target table headers by list page). You can target the list page's header with a code like table.header_cw that targets the currently watching header, and then + in our selector codes can target more parts starting from the CW header, eventually down to the column headers for finished date and the table cells for finished date. Coloring them as an example table.header_cw + table td.table_header:nth-of-type(8){
background: orange;
}
table.header_cw ~ table td[class^='td']:nth-of-type(8){
background: violet;
}
removes them table.header_cw + table td.table_header:nth-of-type(8){
display: none !important;;
}
table.header_cw ~ table td[class^='td']:nth-of-type(8){
display: none !important;
}
So with this kinda thing, we could eventually delete the columns and headers by category until you get to the set up you wanted. All Anime might have to be coded differently or require some tweaking, but this is a start and solution for the main categories. |
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
»»
Yesterday, 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 |