New
Jul 17, 2021 9:21 PM
#7051
hacker09 said: $('tr:contains("DROP")').css('background-color', 'rgba(144, 144, 144, 0.3')[0] This JQuery helps, but I would like much more to do that using a single JavaScript line, not a single JQquery line, I also do prefer to use "a single" css line instead of js or jquery... I think the only chance of a one-liner is jQuery. Vanilla JavaScript is naturally more verbose, it just comes with the territory. But that said, anything you can do with jQuery you can do with JS as it's the same language. So you could do something similar like this, which I imagine might be able to be shortened to 2 or 3 lines if you know any easier ways to write a loop. rows = document.querySelectorAll('.ranking-list'); for(i = 0; i < rows.length; i++) { if(rows[i].textContent.includes('Completed')) { rows[i].style.cssText = 'background: blue !important;'; } } Although in this specific case, as I said before, the background is not on the <tr> but each individual <td>. So the code would need a couple more lines: rows = document.querySelectorAll('.ranking-list'); for(i = 0; i < rows.length; i++) { if(rows[i].textContent.includes('Completed')) { td = rows[i].getElementsByTagName('td'); for(j = 0; j < td.length; j++) { td[j].style.cssText = 'background: blue !important;'; } } } I would still personally use the code I wrote in the earlier reply though as there it doesn't have to loop through every single row. Instead, it only loops through the ones that are completed or dropped. hacker09 said: Yeah, I knew it was possible to mix both, but my main point is actually to avoid the 50-100 lines of JS and do it in CSS. … But from what I searched CSS sucks and is impossible to do it using only css. It's not so much that CSS sucks but that it was never and probably will never be built to do this. CSS is a styling language and reads the DOM top to bottom for optimization reasons. It wasn't meant to have any logic functions. Assuming someone builds their own website, they have no need for CSS to be able to look-back as you can add any info that might be needed into the DOM yourself via PHP, React, or whatever else you're running the website on. Unless you're doing some extremely complex 'contains' logic, I would bet that any JavaScript you have to write will still be: easier to maintain, more compatible, and probably fewer lines than the CSS equivalent. Especially if the JS is repeatable enough that you can turn it into a function. To show you, here is a working example of the the minimum CSS. Even with selectors optimizations (to remove repeating properties) it's around 10 statements/42 lines with my formatting. Not including comments, for obvious reasons. I only included the comments to justify why each line was there. tr { /* add relative positioning and z-index so the new background will be placed correctly */ position: relative; z-index: 1; /* change from table display so that relative positioning will work */ display: flex; align-items: stretch; /* add background to <tr> since we're going to remove it from <td> */ background: #fff; } tr:nth-of-type(2n+1) { background: #f6f6f6; } .ranking-list td { /* recenter table values since the display is no longer table */ display: flex; justify-content: center; align-items: center; /* remove default background since it would hide the new one */ background: none !important; } /* maintain widths as they were before the display change */ td:not(.title) { flex: 0 0 auto; } td.rank { width: 75px; } td.title { width: 100%; flex-shrink: 1; } td.score { width: 97px; } td.your-score { width: 97px; } td.status { width: 115px; } /* add new element for background */ .btn-addEdit-large:is(.dropped,.completed)::before { content: ""; position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; background: blue; } This is not very pretty, but it is the only way to do it with CSS. A big downside here in comparison to JS is if the user has any custom CSS for MyAnimeList this will likely break their custom theme on this page. Not to mention, any change MAL makes to their ranking list will probably mean rewriting this code. Admittedly, that would probably be true of the Javascript too, but it's easier to change which element you're applying a class to as compared with relearning how the entire page style works. |
Valerio_LyndonJul 17, 2021 9:26 PM
Jul 17, 2021 9:56 PM
#7052
I was wondering how to cahnge the text color from your code in gridstyle 5 since body{ color:black;} does not work. this is the link for your code https://pastebin.com/raw/v6eZPMdM |
Jul 18, 2021 7:10 AM
#7053
It's not so much that CSS sucks but that it was never and probably will never be built to do this. CSS is a styling language and reads the DOM top to bottom for optimization reasons. It wasn't meant to have any logic functions. Assuming someone builds their own website, they have no need for CSS to be able to look-back as you can add any info that might be needed into the DOM yourself via PHP, React, or whatever else you're running the website on. Yeah, that makes sense, webmasters wouldn't need to "loop" or something complex like that since they are already the webmaster and can change the html and classes by hand. That 42 lines of code are huge, seems to be needless and don't really seem to do what I want like this line does $('tr:contains("DROP")').css('background-color', 'rgba(144, 144, 144, 0.3')[0] I might be wrong and the 42 lines of code you wrote actually may do the same thing as that line, but since it's 42 lines it's better to stick with the jquery one line option, seems to much work to test the 42 lines of code, testing the 1 line code of jquery was much easier too, but thank you. I just dislike jquery because it has (and/or) causes a lot of compatibility issues. it's easier to change which element you're applying a class to as compared with relearning how the entire page style works. True. |
Click here to see My Tampermonkey Scripts For MAL If you like my work, please consider supporting it! Cryptos https://hacker09.glitch.me/ https://www.patreon.com/hacker09 |
Jul 21, 2021 3:54 PM
#7054
is there a way to automatically highlight my top rated anime/manga? for example all my 9-10 rated entries are automatically highlighted in some manner |
Jul 24, 2021 2:57 PM
#7055
o/ yo long time no see ive been out of the game for a while i want to make a Key or Legend of sorts, with some hyperlinks and text https://i.imgur.com/f33IsRV.png so take some element, :before or :after it, make a box of some dimensions and content=something or somesuch what i dont know is - how do i make it "stick" to the screen, and not scroll with the page "beneath" it? |
Jul 24, 2021 7:01 PM
#7056
EhmelgyXD said: I was wondering how to cahnge the text color from your code in gridstyle 5 since body{ color:black;} does not work. this is the link for your code https://pastebin.com/raw/v6eZPMdM Search the extensions at the end of the post for font color codes https://myanimelist.net/forum/?topicid=1640096 Or try the color codes in the font color tutorial https://myanimelist.net/forum/?topicid=1499059#msg63378290 |
Jul 25, 2021 1:46 PM
#7057
mutsurhea said: o/ yo long time no see ive been out of the game for a while i want to make a Key or Legend of sorts, with some hyperlinks and text https://i.imgur.com/f33IsRV.png so take some element, :before or :after it, make a box of some dimensions and content=something or somesuch what i dont know is - how do i make it "stick" to the screen, and not scroll with the page "beneath" it? to make it stick you make the position relative or absolute and then give it a left: right: top: or bottom: in pixels ie left: 400px; or percentages then do your styling like border or border-color. { display: block !important; content: "text"; position: absolute !important; height: 400px !important; width: 215px !important; right: calc(100% - 245px) !important; top: 560px !important;; opacity: 1 !important; z-index: 1 !important; pointer-events: visible !important; } https://www.w3schools.com/css/css_positioning.asp |
ShaggyZEJul 25, 2021 2:31 PM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Jul 25, 2021 7:53 PM
#7058
hrxshi said: is there a way to automatically highlight my top rated anime/manga? for example all my 9-10 rated entries are automatically highlighted in some manner Responded in the Clarity forum thread since the answer to this question will depend greatly depending on the theme you're using. https://myanimelist.net/forum/?topicid=1723114&show=850#msg63940834 |
Jul 27, 2021 2:33 AM
#7059
Hello, everyone! I'm having an issue here with my mordern list, my profile picture is missing it's just white where it should be! here's a screenshot: https://imgur.com/dQs1MAS Thanks for the attention! |
Jul 28, 2021 12:06 AM
#7060
RiqueALopes said: Hello, everyone! I'm having an issue here with my mordern list, my profile picture is missing it's just white where it should be! here's a screenshot: https://imgur.com/dQs1MAS Thanks for the attention! Some of your code is broken which is affecting the avatar code. In addition, you need to add an image URL to the avatar code. To fix this, replace the code that is missing a parenthesis and a curly bracket around line ~38-40 with this replacement code. Broken code: Replace it with this: body[data-query*='"status":7'] { background-image: url("http://i.imgur.com/9UKrxRw.jpg"); } And then you can add the image URL to the avatar section: If you want your current MAL avatar you should use this URL. I got this URL by going to your profile, right clicking your avatar, and selecting "copy image link" (or similar). https://cdn.myanimelist.net/images/userimages/4948758.jpg?t=1627426200 If you want to adjust the sizing you can also add a "background-size" property, that I would recommend setting to "cover". You could even add a "background-position" property if you want to move it around a bit. Just make sure the new properties are inside the curly brackets {}. Here's a GIF of how to add them if you desire: |
Jul 28, 2021 5:21 AM
#7061
https://myanimelist.net/forum/?topicid=1470713 So about this: Centering the spoiler not the text inside It seems @Shishio-kun solution didn't work, or maybe I just didn't understand, can anyone explain? |
Jul 28, 2021 9:45 AM
#7062
WIIXAnd said: https://myanimelist.net/forum/?topicid=1470713 So about this: Centering the spoiler not the text inside It seems @Shishio-kun solution didn't work, or maybe I just didn't understand, can anyone explain? Already answered here, please don't notify other people twice for the same thing. https://myanimelist.net/forum/?topicid=1470713#msg63965879 |
Jul 28, 2021 10:30 AM
#7063
Shishio-kun said: WIIXAnd said: https://myanimelist.net/forum/?topicid=1470713 So about this: Centering the spoiler not the text inside It seems @Shishio-kun solution didn't work, or maybe I just didn't understand, can anyone explain? Already answered here, please don't notify other people twice for the same thing. https://myanimelist.net/forum/?topicid=1470713#msg63965879 Sorry, but I read that your notifications are off... |
Jul 28, 2021 10:57 AM
#7064
WIIXAnd said: Shishio-kun said: WIIXAnd said: https://myanimelist.net/forum/?topicid=1470713 So about this: Centering the spoiler not the text inside It seems @Shishio-kun solution didn't work, or maybe I just didn't understand, can anyone explain? Already answered here, please don't notify other people twice for the same thing. https://myanimelist.net/forum/?topicid=1470713#msg63965879 Sorry, but I read that your notifications are off... That's why I said don't do it to other people.... It's annoying and I seen stuff like that drive away designers and volunteers from the site. And then people like me turn off the notifications because of stuff like this and now fewer people can contact us. You only need to notify people once lol it's a small but easy courtesy. |
Jul 28, 2021 8:35 PM
#7065
Valerio_Lyndon said: RiqueALopes said: Hello, everyone! I'm having an issue here with my mordern list, my profile picture is missing it's just white where it should be! here's a screenshot: https://imgur.com/dQs1MAS Thanks for the attention! Some of your code is broken which is affecting the avatar code. In addition, you need to add an image URL to the avatar code. To fix this, replace the code that is missing a parenthesis and a curly bracket around line ~38-40 with this replacement code. Broken code: Replace it with this: body[data-query*='"status":7'] { background-image: url("http://i.imgur.com/9UKrxRw.jpg"); } And then you can add the image URL to the avatar section: If you want your current MAL avatar you should use this URL. I got this URL by going to your profile, right clicking your avatar, and selecting "copy image link" (or similar). https://cdn.myanimelist.net/images/userimages/4948758.jpg?t=1627426200 If you want to adjust the sizing you can also add a "background-size" property, that I would recommend setting to "cover". You could even add a "background-position" property if you want to move it around a bit. Just make sure the new properties are inside the curly brackets {}. Here's a GIF of how to add them if you desire: Thank you so much! it Worked! |
Jul 30, 2021 3:37 AM
#7066
Hello, So I wanted to add tags to my clarity theme. But even after adding codes on the top and the end won't make it work. I have read the forum post for it as well, but something keeps getting wrong. Here is my current css code: https://pastebin.com/5Tzw0gdR sorry for my English, |
Pingu_the_weebJul 31, 2021 12:09 AM
Jul 31, 2021 10:18 PM
#7067
Pingu_the_weeb said: Hello, So I wanted to add tags to my clarity theme. But even after adding codes on the top and the end won't make it work. I have read the forum post for it as well, but something keeps getting wrong. Here is my current css code: https://pastebin.com/5Tzw0gdR sorry for my English, You don't have any tags on your items except for one tag on "Monster": To add tags to an item you need to either open the "Edit" menu and add tags there, or cllick on the pencil icon to the right of any item and edit them there. |
Aug 1, 2021 2:20 AM
#7068
oh right. But actually, I was talking about those things rated, premiered,start-end dates |
Aug 1, 2021 10:05 AM
#7069
Pingu_the_weeb said: oh right. But actually, I was talking about those things rated, premiered,start-end dates You add those things here by checking the boxes for them and saving https://myanimelist.net/editprofile.php?go=listpreferences Some are automatically done on your list based on MAL's database, and others you have to edit after adding them with the link above. You click the edit button on your anime to edit what features can be edited. |
Aug 1, 2021 9:55 PM
#7070
thanks |
Aug 9, 2021 12:34 PM
#7071
This might be a strange question, but is there a maximum length allowed for the custom CSS you can use for the list style? I combined a few standard themes to make one I'm fully happy with and have 1938 lines with almost 70k characters in total. When I try to copy it into the preview box it works well, but once I click "save" it cuts off about 100 lines of code! I couldn't find anything on it, so I thought I'd try asking here. |
My Candies: x6 |
Aug 10, 2021 6:26 AM
#7072
Can anyone share me the link to the header outline tweak? I can't seem to find it. |
Aug 11, 2021 12:27 AM
#7073
Crystaldragon36 said: yes there is a limit and it's mentioned often but I forget how many characters it is, but that's why most host their CSS on dropbox, you can also download its windows app and simply editing the file on your pc will update your anime/manga lists.This might be a strange question, but is there a maximum length allowed for the custom CSS you can use for the list style? I combined a few standard themes to make one I'm fully happy with and have 1938 lines with almost 70k characters in total. When I try to copy it into the preview box it works well, but once I click "save" it cuts off about 100 lines of code! I couldn't find anything on it, so I thought I'd try asking here. https://myanimelist.net/forum/?topicid=1499059#msg63378306 |
ShaggyZEAug 11, 2021 12:32 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 11, 2021 1:52 AM
#7074
ShaggyZE said: Crystaldragon36 said: yes there is a limit and it's mentioned often but I forget how many characters it is, but that's why most host their CSS on dropbox, you can also download its windows app and simply editing the file on your pc will update your anime/manga lists.This might be a strange question, but is there a maximum length allowed for the custom CSS you can use for the list style? I combined a few standard themes to make one I'm fully happy with and have 1938 lines with almost 70k characters in total. When I try to copy it into the preview box it works well, but once I click "save" it cuts off about 100 lines of code! I couldn't find anything on it, so I thought I'd try asking here. https://myanimelist.net/forum/?topicid=1499059#msg63378306 Thanks a lot for the reply! I did some experimenting too and the max seems to be 65,204 characters fyi. I somehow must have missed that there was a limkt... hehe. I will definitely try the method you mentioned, so thanks again for the link. ^-^ |
My Candies: x6 |
Aug 11, 2021 4:55 AM
#7075
How do I change the css code of one of one anime only. For exapmle I want One Piece to look different from all the other anime but all the animes have the same class .list-item. |
Aug 11, 2021 5:01 AM
#7076
ShaggyZE said: Thx mate.mutsurhea said: o/ yo long time no see ive been out of the game for a while i want to make a Key or Legend of sorts, with some hyperlinks and text https://i.imgur.com/f33IsRV.png so take some element, :before or :after it, make a box of some dimensions and content=something or somesuch what i dont know is - how do i make it "stick" to the screen, and not scroll with the page "beneath" it? to make it stick you make the position relative or absolute and then give it a left: right: top: or bottom: in pixels ie left: 400px; or percentages then do your styling like border or border-color. { display: block !important; content: "text"; position: absolute !important; height: 400px !important; width: 215px !important; right: calc(100% - 245px) !important; top: 560px !important;; opacity: 1 !important; z-index: 1 !important; pointer-events: visible !important; } https://www.w3schools.com/css/css_positioning.asp Also, am I still using the best import for the job re: posters? @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist_dataimagelinkbefore.css"; |
Aug 11, 2021 5:15 AM
#7077
mutsurhea said: ShaggyZE said: Thx mate.mutsurhea said: o/ yo long time no see ive been out of the game for a while i want to make a Key or Legend of sorts, with some hyperlinks and text https://i.imgur.com/f33IsRV.png so take some element, :before or :after it, make a box of some dimensions and content=something or somesuch what i dont know is - how do i make it "stick" to the screen, and not scroll with the page "beneath" it? to make it stick you make the position relative or absolute and then give it a left: right: top: or bottom: in pixels ie left: 400px; or percentages then do your styling like border or border-color. { display: block !important; content: "text"; position: absolute !important; height: 400px !important; width: 215px !important; right: calc(100% - 245px) !important; top: 560px !important;; opacity: 1 !important; z-index: 1 !important; pointer-events: visible !important; } https://www.w3schools.com/css/css_positioning.asp Also, am I still using the best import for the job re: posters? @\import "https://dl.dropboxusercontent.com/s/71mrsl1iz0z11p2/animelist_dataimagelinkbefore.css"; If I was you I would use this for your anime list @\import "https://malscraper.azurewebsites.net/covers/anime/mutsurhea/presets/dataimagelinkbefore"; @\import "https://malscraper.azurewebsites.net/covers/manga/mutsurhea/presets/dataimagelinkbefore"; https://malscraper.azurewebsites.net/covers |
ShaggyZEAug 11, 2021 5:23 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 11, 2021 5:21 AM
#7078
ShaggyZE said: > it takes a bit of time to generate the first time. Does it take a bit of time the first time for each individual trying to access my mal for their first time, as its generated for each accessing user?
or it takes a bit of time the first time Me, I, Myself accessing it, as its generated then becomes static?
|
mtsRheaAug 11, 2021 5:25 AM
Aug 11, 2021 5:29 AM
#7079
mutsurhea said: Does it take a bit of time the first time for each individual trying to access my mal for their first time, as its generated for each accessing user?
or it takes a bit of time the first time Me, I, Myself accessing it, as its generated then becomes static?
looking at it, it looks like it returns a list of all covers the first time until it builds your list, then it probably rebuilds your list every 24 hours whoever loads it, you or someone else viewing it first, and it won't appear to be slow ever since it uses a complete list or you're prior generated one, but I'm just speculating as it could generate faster than 24 hour and using some cronjob for all I know. |
ShaggyZEAug 11, 2021 5:34 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 11, 2021 8:38 AM
#7080
ShaggyZE said: Doesn't this mean its only worth it if I view my list multiple times per day?looking at it, it looks like it returns a list of all covers the first time until it builds your list, then it probably rebuilds your list every 24 hours whoever loads it, you or someone else viewing it first, and it won't appear to be slow ever since it uses a complete list or you're prior generated one, but I'm just speculating as it could generate faster than 24 hour and using some cronjob for all I know. If I only view it once a week or so [which is the case], won't it be slower? |
mtsRheaAug 11, 2021 8:43 AM
Aug 11, 2021 8:50 AM
#7081
mutsurhea said: no, as I said it will use your previously generated css it made and it will only build a new one once every 24 hours so that it's not generating lists for thousands of users putting too much load on their servers who are refreshing their lists constantly, and it's never slow when i said "a bit of time to generate newly added" that had nothing to do with speed.ShaggyZE said: Doesn't this mean its only worth it if I view my list multiple times per day?looking at it, it looks like it returns a list of all covers the first time until it builds your list, then it probably rebuilds your list every 24 hours whoever loads it, you or someone else viewing it first, and it won't appear to be slow ever since it uses a complete list or you're prior generated one, but I'm just speculating as it could generate faster than 24 hour and using some cronjob for all I know. If I only view it once a week or so, won't it be slower? when you or someone else visits your list next then it will queue a new css to be built or update the new anime covers of your recently added anime/manga if any so you will only see a few blank covers that will appear in usually a few hours to a day depending on if it's built one already for that day from what I've noticed. I wouldn't put so much thought into as it isn't that complicated, it's simply going to keep generating it as you add more to your list and your list gets visited, that's it. |
ShaggyZEAug 11, 2021 9:08 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 11, 2021 3:36 PM
#7082
SAOLover69k said: it depends on what your trying to select/change and whether you want to edit it, before it or after it, but some examples are How do I change the css code of one of one anime only. For exapmle I want One Piece to look different from all the other anime but all the animes have the same class .list-item. .list-item .list-table-data .data.studio a[href="/anime/producer/21"]::before .list-table #more-21.more-info .link[href^="/anime/21/"] #tags-21:after td.data.title.clearfix a.link.sort[href*="One_Piece"]:after .data.image a[href^="/anime/21/"]:before |
ShaggyZEAug 11, 2021 3:45 PM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 12, 2021 8:25 AM
#7083
[quote=ShaggyZE message=64095625] mutsurhea said: Thx mate. it's much appreciated.no, as I said it will use your previously generated css it made and it will only build a new one once every 24 hours so that it's not generating lists for thousands of users putting too much load on their servers who are refreshing their lists constantly, and it's never slow when i said "a bit of time to generate newly added" that had nothing to do with speed. when you or someone else visits your list next then it will queue a new css to be built or update the new anime covers of your recently added anime/manga if any so you will only see a few blank covers that will appear in usually a few hours to a day depending on if it's built one already for that day from what I've noticed. I wouldn't put so much thought into as it isn't that complicated, it's simply going to keep generating it as you add more to your list and your list gets visited, that's it. |
Aug 13, 2021 5:42 AM
#7084
Hey I want to know how can I resize these from my manga list. |
Aug 13, 2021 12:24 PM
#7085
IrrelevantGuy said: Can anyone share me the link to the header outline tweak? I can't seem to find it. Bump |
Aug 13, 2021 1:46 PM
#7086
IrrelevantGuy said: IrrelevantGuy said: Can anyone share me the link to the header outline tweak? I can't seem to find it. Bump https://myanimelist.net/forum/?topicid=1723114 It's under Further Modification |
Aug 13, 2021 7:05 PM
#7087
you will probably want to watch the inspect tutorial https://www.youtube.com/watch?v=cTGbVutdqfc since you can target each element seperately all at once to be more precise although i'm not going to list them all, but here is a majority of them taken from your css .list-table .list-table-data .data.chapter, .list-table .list-table-data .data.chapter a, .list-table .list-table-data .data.licensor a, .list-table .list-table-data .data.magazine a, .list-table .list-table-data .data.progress, .list-table .list-table-data .data.progress a, .list-table .list-table-data .data.score:before, .list-table .list-table-data .data.score a, .list-table .list-table-data .data.season a, .list-table .list-table-data .data.volume, .list-table .list-table-data .data.volume a { font-size: 9px !important; } body { font-size: 9px !important; } |
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 13, 2021 10:13 PM
#7088
Shishio-kun said: IrrelevantGuy said: IrrelevantGuy said: Can anyone share me the link to the header outline tweak? I can't seem to find it. Bump https://myanimelist.net/forum/?topicid=1723114 It's under Further Modification Thanks a lot! |
Aug 14, 2021 7:40 AM
#7089
Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) |
Aug 14, 2021 8:04 AM
#7090
zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 12pt !important; text-align: center !important; } |
ShaggyZEAug 14, 2021 8:08 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 14, 2021 8:12 AM
#7091
ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. |
Aug 14, 2021 8:19 AM
#7092
zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } |
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 14, 2021 8:30 AM
#7093
ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? |
Aug 14, 2021 9:09 AM
#7094
zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. |
Aug 14, 2021 9:17 AM
#7095
zau said: zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. okay, you can try something like .td1:nth-of-type(6), .td2:nth-of-type(6) { width: 230px; line-height: 14pt !important; text-align: center !important; padding-block: 5px; } |
ShaggyZEAug 14, 2021 9:23 AM
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 14, 2021 9:19 AM
#7096
ShaggyZE said: zau said: zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. okay, you can try something like padding-block: 5px; Holy shit that worked. You're a champ dude. Thanks so much!!! |
Aug 14, 2021 10:02 AM
#7097
ShaggyZE said: zau said: zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. okay, you can try something like .td1:nth-of-type(6), .td2:nth-of-type(6) { width: 230px; line-height: 14pt !important; text-align: center !important; padding-block: 5px; } Lmao sorry for asking again, but is there a way to move the "Score Type Prograss Tab" bar more to the left so it fits with what is displayed. It's kind of scrabbled right now. |
Aug 14, 2021 10:31 AM
#7098
zau said: ShaggyZE said: zau said: zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. okay, you can try something like .td1:nth-of-type(6), .td2:nth-of-type(6) { width: 230px; line-height: 14pt !important; text-align: center !important; padding-block: 5px; } Lmao sorry for asking again, but is there a way to move the "Score Type Prograss Tab" bar more to the left so it fits with what is displayed. It's kind of scrabbled right now. you might need to change the width of each table_header individually or you can get it close with just changing the width of the header anime title .table_header:nth-of-type(2) { width: 125px; } |
My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
Aug 14, 2021 10:32 AM
#7099
ShaggyZE said: zau said: ShaggyZE said: zau said: zau said: ShaggyZE said: zau said: ShaggyZE said: zau said: Hey, was wondering if you can help me with my classic list. So I figured how to widen the "tags" section but as you can see, the text from the tags become really close to each other and I wanted to know if there is a possibility to enlarge the section between the titles so the text doesn't seem so close to the other. I'm also curious to know if it's possible for the (tags) text to be centered, or to be more exact, to start from the center and not from the left. ( I hope that makes sense ) not sure I know what you mean about the text being so close together unless you mean the line height, but centering the text should be easy enough try td[class^="td"] { line-height: 15pt !important; text-align: center !important; } Centering worked! Thanks. ~about the first problem, what I mean is that the tags texts are too close to each other. If you look in my list for example, "Another" and "Boku no hero Academia" both have something written in tags but it's hard to distinguish where the text both starts and ends. I just want some space in between both shows so you can clearly see what's written for both. okay you can probably just use tr { height: 30px !important; } Works really well, thanks. One more thing, as you can see, the "centering" code also centered the title's and I don't want that. Is there a way you can center just the tags? Nvm I figured it out. Though, the height code doesn't seem to work. It makes space between the titles but it hardly makes any differences between the tags text. You can look at my list for instance. okay, you can try something like .td1:nth-of-type(6), .td2:nth-of-type(6) { width: 230px; line-height: 14pt !important; text-align: center !important; padding-block: 5px; } Lmao sorry for asking again, but is there a way to move the "Score Type Prograss Tab" bar more to the left so it fits with what is displayed. It's kind of scrabbled right now. you might need to change the width of each table_header individually or you can get it close with just changing the width of the header anime title .table_header:nth-of-type(2) { width: 125px; } Alright, thanks a lot man. |
Aug 17, 2021 6:25 AM
#7100
ShaggyZE said: you will probably want to watch the inspect tutorial https://www.youtube.com/watch?v=cTGbVutdqfc since you can target each element seperately all at once to be more precise although i'm not going to list them all, but here is a majority of them taken from your css .list-table .list-table-data .data.chapter, .list-table .list-table-data .data.chapter a, .list-table .list-table-data .data.licensor a, .list-table .list-table-data .data.magazine a, .list-table .list-table-data .data.progress, .list-table .list-table-data .data.progress a, .list-table .list-table-data .data.score:before, .list-table .list-table-data .data.score a, .list-table .list-table-data .data.season a, .list-table .list-table-data .data.volume, .list-table .list-table-data .data.volume a { font-size: 9px !important; } body { font-size: 9px !important; } The thing is ive tried those 2 and it affects the anime list too and I want it to affect only the manga list. |
More topics from this board
Sticky: » 💚 [REPAIR STICKY] Repair/speed up a design + Request a layout fixShishio-kun - Nov 17, 2023 |
17 |
by Shishio-kun
»»
Sep 25, 9:28 AM |
|
Sticky: » [ USERSTYLES & DARK THEMES ] All MyAnimeList themesShishio-kun - Jan 28, 2023 |
19 |
by is_peque
»»
Sep 23, 12:11 AM |
|
» [CSS - Modern] 🍰 Clarity by V.L ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Apr 19, 2018 |
1222 |
by laBelphe
»»
Sep 20, 3:16 PM |
|
» [CLASSIC CSS] ⭐️Space Layout by nblur/U531355 ✨RESTORED AND UPSCALED✨Shishio-kun - Nov 17, 2023 |
7 |
by Recon911
»»
Sep 20, 4:43 AM |
|
Sticky: » 💎 Show off your latest design!Shishio-kun - Sep 16 |
2 |
by Shishio-kun
»»
Sep 18, 7:40 PM |