| sorry for all the trouble. THANK YOU SO MUCH |
All those memories will be lost in time, like tears in rain..  |
| Hi, I just notied this issue I've been having just recently, I can't open the Filter tab and the other button beside it. I forgot what it's called but I circled it in the picture (https://imgur.com/a/CuIiN23). I am not sure if it's because of some custom code added prior bec I remember I was able to use it before. |
 |
vousvoyez said: Hi, I just notied this issue I've been having just recently, I can't open the Filter tab and the other button beside it. I forgot what it's called but I circled it in the picture (https://imgur.com/a/CuIiN23). I am not sure if it's because of some custom code added prior bec I remember I was able to use it before. Looks like you either copy-pasted the code incorrectly when I gave you the previous modification, or something went screwy when you ran it through whatever third-party tool you put it through. Either way, you can add this to the bottom of your code to fix it. .list-unit .list-status-title .stats {
pointer-events: auto;
} |
plkjr said: Quick question about the "Tag Descriptions on Hover" feature: is there a way to make it work with special characters? Special characters usually get formatted in URLs to prevent them breaking things. Try running your tag through this "URL encoder" website (or a similar tool): [Link]. Once encoded, the output should look something like this: ©// <-- before %C2%A9%2F%2F <-- after 👀👀 <-- before %F0%9F%91%80%F0%9F%91%80 <-- after If you're somewhat familiar with your browser's Inspect Element tool, you can also check the URL by opening Inspect Element to the tag you want and checking the "tag=" section.  plkjr said: links typed in the comments section (More → Advanced) only turn blue when I hover over them. Is there a way to make the links stay blue? Either of these should do the trick: |
| So I tried to add renders to the theme, but they kept appearing under all the anime. Is there a way to fix this? Here's the code: https://pastebin.com/dqmWsLXk |
manaphy909 said: This is a purposeful decision, but you can change it by adding this to the bottom of your CSS:So I tried to add renders to the theme, but they kept appearing under all the anime. Is there a way to fix this? Here's the code: https://pastebin.com/dqmWsLXk /* Character Render Layering Patch */
footer:before, footer:after { z-index: 1; pointer-events: none; }Also, if you want to change the positioning to allow for more overlap, you can find the "left: calc(100% - (51% - 538px))" in the character render mod and change the "538px" to something lower for more overlap. |
I used the category headers option, and it has been working great for me, all the way up until I logged one show as dropped. It pushed all of the following entries off by one, while maintaining the headers as they were. In addition, hovering over it gave me a white blank (but large covers work for everything else). Any ideas? Thanks!  |
Uji_Gintoki_BowlAug 26, 2020 3:24 PM
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!) |
Uji_Gintoki_Bowl said: I used the category headers option, and it has been working great for me, all the way up until I logged one show as dropped. It pushed all of the following entries off by one, while maintaining the headers as they were. In addition, hovering over it gave me a white blank (but large covers work for everything else). Any ideas? Thanks! https://i.imgur.com/1pMxeOs.png https://i.imgur.com/xSStord.png I believe this is just a caching issue, which is covered in the limitations during installation. Valerio_Lyndon said: The headers will appear out of order for a few hours after you add new titles to your list. Give it a bit of time and it should sort itself out. The cover image is probably also a caching issue, but of the cover generator tool as opposed to the header tool. If it continues to be an issue though, it may be indicative of a different issue. |
Cover images for recently added anime aren't loading?| Ah, I should have read every bit instead of skimming, sorry to waste your time like that. I appreciate everything you've done! |
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!) |
| Hi, I just wanted to say thank you for making this premade layouts! I'm currently using it now and I really like the way it looks. It looks nice as it is but turns out there's still so much things I could customize, and all your replies to the other users really helped me in doing it. Customizing my list has been a fun experience. Thank you so much, VL! :D |
 |
attachment said: Remove in what way? I see you've already removed the image and shortened it to a large extent. If your goal is to entirely remove it, then the top row of buttons would have to be repositioned and the avatar would need to be shrunk or repositioned to fit into the new smaller space. Is that your intent?Hi, I was wondering if you were able to help me remove the banner completely and just have the avatar showing, thanks!  |
Valerio_Lyndon said: yes,that is exactly what I want.attachment said: Remove in what way? I see you've already removed the image and shortened it to a large extent. If your goal is to entirely remove it, then the top row of buttons would have to be repositioned and the avatar would need to be shrunk or repositioned to fit into the new smaller space. Is that your intent?Hi, I was wondering if you were able to help me remove the banner completely and just have the avatar showing, thanks! |
attachment said: yes,that is exactly what I want. If this looks good, then add the code to the bottom of your CSS. |
Hello again! I'm having trouble trying to decrease the length of separation between rounded category headers. I looked through the code, but can't find any bit that specifies the length of the gap. Is there a way to decrease it? Thank you! |
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!) |
Uji_Gintoki_Bowl said: Hello again! I'm having trouble trying to decrease the length of separation between rounded category headers. I looked through the code, but can't find any bit that specifies the length of the gap. Is there a way to decrease it? Thank you! https://i.imgur.com/IfSWmZh.jpg It's specified in the header @import statement (the "malcat-gen" one). Specifically, this part: .list-item:nth-child($index){margin-top:162px;} Lowering the "162px" will do what you want. |
Thank you so much! I just wanted to say, Just editing this template has been super fun and I appreciate the work you've put into this. Have a good day! |
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!) |
| Hi! I've been using the list for a couple of weeks and I really liked it and it was just working well for me but then for quite sometime navigating through my list became super laggy. I believe that there's nothing wrong with my code, but I attached it below just in case. Is there something I can do about this? Thanks! |
 |
FlyYOUNG said: Hi, I'm currently experiencing an issue with the display of the profile pic (the one in the circle). It loads fine on Chrome but recently stopped displaying on Safari. Wondering if there's a way around it? Safari Version 14.0 (15610.1.28.1.9, 15610) MacOS Catalina Version 10.15.7 (19H2) Unfortunately I do not have access to the most recent version of Safari, and cannot reproduce this issue. For the sake of narrowing down the cause, are you able to see my avatar on my mangalist? As a total shot in the dark, you could try either of these to the bottom of your CSS. You may also try inputting a different image URL than what you are currently using (one is already provided below, but feel free to change it). This first one is just to test some basic formatting changes: .status-menu::after {
display: block;
background: no-repeat center top/cover transparent;
background-image: url(https://cdn.myanimelist.net/images/userimages/5889451.jpg); /* avatar URL */
}This next one will break the search button (it removes it — revertable by deleting this code after testing), but I am curious to see if it makes the avatar visible. Use it if/when the first one fails. .status-menu::after {
content: none;
}
.status-menu-container .search-container {
position: absolute;
top: -51px;
left: -8px;
width: 150px;
height: 150px;
background: no-repeat center top/cover transparent;
background-image: url(https://cdn.myanimelist.net/images/userimages/5889451.jpg); /* avatar URL */
border: 8px solid var(--bg);
border-radius: 50%;
opacity: 1;
box-shadow: 0 1px 2px var(--shadow);
transition: all 0.3s ease;
}
.status-menu-container.fixed .search-container {
top: 0;
width: 48px;
height: 48px;
box-shadow: none;
}
.status-menu-container .search-container > * {
display: none !important;
} |
Valerio_LyndonSep 29, 2020 7:21 PM
julesliana said: Hi! I've been using the list for a couple of weeks and I really liked it and it was just working well for me but then for quite sometime navigating through my list became super laggy. I believe that there's nothing wrong with my code, but I attached it below just in case. Is there something I can do about this? Thanks! Code looks fine, shouldn't be anything wrong. Seems to work fine when I use it on Chrome, Firefox, and an older version of Safari. May I ask which part specifically was lagging — i.e the scrolling, the header affixing/unfixing from the top of the page, something else — and what browser this happened in? |
Valerio_Lyndon said: julesliana said: Hi! I've been using the list for a couple of weeks and I really liked it and it was just working well for me but then for quite sometime navigating through my list became super laggy. I believe that there's nothing wrong with my code, but I attached it below just in case. Is there something I can do about this? Thanks! Code looks fine, shouldn't be anything wrong. Seems to work fine when I use it on Chrome, Firefox, and an older version of Safari. May I ask which part specifically was lagging — i.e the scrolling, the header affixing/unfixing from the top of the page, something else — and what browser this happened in? The header affixing on top of the page seems okay, but my main problem is the scrolling is lagging all the time, and that clicking on things like updating a certain entry takes a few seconds to load. The browser I'm currently using is Chrome Version 85.0.4183.121 (64-bit). |
|
| Hello! I have been using this layout for quite some time as it is honestly my favourite one I have seen in Shishio's club. As I am quite inexperienced with how CSS works, I wanted to ask some questions on how I can do the following. 1. How can I include a hover image border and arrow with the border being the same colour as the header. (ex. Dropped category entries will have a red border around the hover cover image.) 2. I would like to know how to rearrange the type (TV, Movie), Score, Progress, and Season as per the picture below. I would like for the type (TV, Movie) to be in a bubble-like format just like how season and tags are. I would also like for their colour to be associated with the category the entries are in. 3. After rearranging the season button, I want the season button to be hidden until you hover over the entry. I have made it so when you hover over the list entry, it pops up. I would like for the season button to show only when you hover over the entry row, otherwise, it would stay hidden. 4. How can I add decimal ratings. I understand that you can get decimal ratings by applying tags, and I got a basic idea of the code from another user. I want them to be right on top of where the ratings are normally, but when you hover over it, it shows the actual MAL rating that you enter. I also want it to interact the same way normal ratings do but think the best solution to that is for the tag to disappear when you hover over it which I do not know how to add. I also want to know if by adding decimal ratings through tags, if it will interfere with the heart and horizontal tags as I am currently using them right now. 5. I would also like for "Airing" and "Not airing" text to be placed beside the entry name like so: Would also appreciate it if they were the same colour as the category they are in. 6. Currently, I am using Hover Tag Descriptions, but after applying the following code: When I hover over the tags, they do not show the description like how it used to. I just wanted to know if there is something wrong with my code for Hover Tag Desc. or how I can fix it. Currently, when I hover over the tag, it does not show until I move my cursor away and only shows for a split second. I added that line to make it so list entries pop up when you hover over it, I want to know how I can implement that without breaking the Hover Tag Desc Code. The tag "Underrated" is one of the tags that should show a tag description. Another issue with this is that the tags get cut off and appear below my list entry. 7. Finally, I want to know how you can change the colour of rows when you hover over it. I want it so that when you hover over a row, it changes to a different colour. |
WakeUpAmadeus_Oct 1, 2020 9:37 AM
julesliana said: The header affixing on top of the page seems okay, but my main problem is the scrolling is lagging all the time, and that clicking on things like updating a certain entry takes a few seconds to load. The browser I'm currently using is Chrome Version 85.0.4183.121 (64-bit). I fired up a different PC and I see the issue now. Was getting a silky smooth <1 FPS. I'm pretty confident that the issue is an overly high resolution background image. It's a 7806x4392 (larger than 4K) image. When I swapped that image out for a lower resolution version, the lag was resolved, or at least lessened. Ideally, you can use an image size that is the same as your monitor, but since I do not know what that is I simply scaled it to 1080p (a common size) using ezgif. You can find the new version: [here]. And it can be applied by replacing your current background image code (you can find it at the bottom of your CSS): body { --background: url(https://i.imgur.com/fUgwNQC.jpg); } Give that a go, and see if it fixes it. If that works, great! If it doesn't work, could you confirm whether my mangalist is also laggy for you? As to the overlay loading, it shouldn't be different layout to layout. That will be on MAL's end, as the edit overlay is actually loading another MAL page. |
Valerio_Lyndon said: julesliana said: The header affixing on top of the page seems okay, but my main problem is the scrolling is lagging all the time, and that clicking on things like updating a certain entry takes a few seconds to load. The browser I'm currently using is Chrome Version 85.0.4183.121 (64-bit). I fired up a different PC and I see the issue now. Was getting a silky smooth <1 FPS. I'm pretty confident that the issue is an overly high resolution background image. It's a 7806x4392 (larger than 4K) image. When I swapped that image out for a lower resolution version, the lag was resolved, or at least lessened. Ideally, you can use an image size that is the same as your monitor, but since I do not know what that is I simply scaled it to 1080p (a common size) using ezgif. You can find the new version: [here]. And it can be applied by replacing your current background image code (you can find it at the bottom of your CSS): body { --background: url(https://i.imgur.com/fUgwNQC.jpg); }Give that a go, and see if it fixes it. If that works, great! If it doesn't work, could you confirm whether my mangalist is also laggy for you? As to the overlay loading, it shouldn't be different layout to layout. That will be on MAL's end, as the edit overlay is actually loading another MAL page. It worked like a charm! It's running so much smoother now. Thank you so much. I didn't really realize that the 4k background was the one causing the problem. Thank you so much for your time and sorry for the trouble. |
|
MonsieurAlarm said: I wanted to ask some questions on how I can do the following. Before anything else, add this code to the bottom of your CSS. It will be used by the other CSS in this post. Also, all new code should be added to the bottom of your CSS. MonsieurAlarm said: 1. How can I include a hover image border and arrow with the border being the same colour as the header. MonsieurAlarm said: 2. I would like to know how to rearrange the type (TV, Movie), Score, Progress, and Season as per the picture below. I would like for the type (TV, Movie) to be in a bubble-like format just like how season and tags are. I would also like for their colour to be associated with the category the entries are in. … 3. After rearranging the season button, I want the season button to be hidden until you hover over the entry. I have made it so when you hover over the list entry, it pops up. I would like for the season button to show only when you hover over the entry row, otherwise, it would stay hidden. MonsieurAlarm said: 4. How can I add decimal ratings. I understand that you can get decimal ratings by applying tags, and I got a basic idea of the code from another user. I want them to be right on top of where the ratings are normally, but when you hover over it, it shows the actual MAL rating that you enter. I also want it to interact the same way normal ratings do but think the best solution to that is for the tag to disappear when you hover over it which I do not know how to add. You can continue using your current code, but with an added opacity value. Also, you can apply your current code to all ".5" tags by changing from [href*="8.5"] to [href$=".5"]. The dollar sign represents the end of the tag, so it will look for all tags that end in ".5", be it "8.5", "3.5", or anything else. This is already applied in the code above. While I am personally not a fan of having hard-coded position values such as this tag (that require changing on each column move or change), I think it's probaly the best method in this scenario so I'd say keep with the tag-based method. A CSS-only decimal method would, at time of writing, be more effort for no benefit. MonsieurAlarm said: I also want to know if by adding decimal ratings through tags, if it will interfere with the heart and horizontal tags as I am currently using them right now. It's unlikely. MonsieurAlarm said: 5. I would also like for "Airing" and "Not airing" text to be placed beside the entry name like so: MonsieurAlarm said: 6. Currently, I am using Hover Tag Descriptions, but after applying the following code: When I hover over the tags, they do not show the description like how it used to. This is one of those oddities of CSS and can be quite annoying. To fix it, incorporate this CSS into your current transform code or add it to the bottom. MonsieurAlarm said: 7. Finally, I want to know how you can change the colour of rows when you hover over it. I want it so that when you hover over a row, it changes to a different colour. As in, the entire row background? That can be applied with a simple "background-color" property in the same .list-item:hover section as your transform. It should be noted that if you wanted the background to be based on the category colour, then different code will have to be used due to the HTML structure. Example: ----------------- Hopefully that all does what you were intending. |
julesliana said: It worked like a charm! It's running so much smoother now. Thank you so much. I didn't really realize that the 4k background was the one causing the problem. Thank you so much for your time and sorry for the trouble. Not to worry, glad to hear that fixed the problem. |
| Thank you for all your help! Everything worked like a charm! Messed around with some stuff and got what I wanted. Had some trouble with decimal ratings tho but somehow got it to work. I don't know if I did something wrong, but when I applied [href$=".5"], the tag wasn't working. When I changed it back to [href*=".5"], it worked for all .5 tags. The only problem I have now is that the text for the rating is not in the center. Was wondering how I could adjust that. |
| Hello I wanted some help with a few things. Just wanted to point out that I don't really know how to customize css so going to need help on some pretty simple things. Firstly, can you help me with changing the colour of the background. I don't want to have a different background and just want to change the colour of it. Wanted to know how to do that through CSS. Also wanted to know how to change the colour of the list entries and the bar that the categories and avatar are on. Next, I want some help on the banner. I changed the banner height to 300px because I want it to show more of the banner using the code you posted. The problem I have is that, in the preview, and in the actual anime list, the amount of the banner it shows is different. In the preview, when it shows the full wallpaper I want to use, it looks perfect, but when I see it in my profile, it gets cut off so wanted to know how I can fix that. As you can see in the spoilers, a bit of the face gets cut off. Just wanted some help with fixing that :) Also sometimes, I don't know how but my hover cover doesn't work. Sometimes I go on my profile and scroll through and see that the hover pop up is blank and I don't know how to fix that. Final thing I want to know is how I can change the colour of the icons near the avatar as well as the text colour. |
burnerfistahOct 7, 2020 3:32 PM
Cry5talz said: Is there a way that I could add a synopsis using the generator (from here) to display underneath the cover after it's activated and have it slide out from underneath the cover? Like this:  I can't get that tool working for some reason, but if it works for you then it is possible yes. You could use a template such as this: /* [TITLE] *[DEL]/ #tags-[ID]:after {content: "[DESC]";}This gets input to the tool before generation:  And then you can add this template code to your list CSS to style all the new synopses. .data.tags::after {
position: absolute;
top: 0;
left: -158px;
z-index: 50;
width: 142px;
background: var(--bg);
padding: 6px 4px;
border-radius: 8px;
box-shadow: 0 0 2px #000;
text-align: left;
opacity: 0;
pointer-events: none;
transition: all 0.3s ease;
}
.list-item:hover .data.tags::after {
top: calc(50% + 100px);
opacity: 1;
} |
MonsieurAlarm said: Thank you for all your help! Everything worked like a charm! Messed around with some stuff and got what I wanted. Had some trouble with decimal ratings tho but somehow got it to work. I don't know if I did something wrong, but when I applied [href$=".5"], the tag wasn't working. When I changed it back to [href*=".5"], it worked for all .5 tags. The only problem I have now is that the text for the rating is not in the center. Was wondering how I could adjust that. Ah yeah, the $ code won't work in the preview. But, it should work on the public list. Either way, if the * works for you then it doesn't matter. :) The misalignment on the text is due to some bad padding. I fixed this in my previous example but I don't think I mentioned it at the time, my bad. Replace this highlighted text:  With this new stuff: width: 26px; height: 26px; padding: 0 !important; The differences being the removal of padding, with an "!important" mark to override some older code, and the 26px width to make up for the lack of padding. |
burnerfistah said: Firstly, can you help me with changing the colour of the background. I don't want to have a different background and just want to change the colour of it. Wanted to know how to do that through CSS. Also wanted to know how to change the colour of the list entries and the bar that the categories and avatar are on. … Final thing I want to know is how I can change the colour of the icons near the avatar as well as the text colour. I'd advise looking at the theme colours section in the main forum post. This allows you to change just about any of the colours. But, to answer your question more specifically, here's the specific colours to change. "pbg" is the page, and "bg" is the bar and list items. The various "text" lines are different parts of the text. Detailed descriptions of what these apply to are available in the "Changing theme colours" dropdown of the main forum post. To pick a colour, you can use any CSS colour picker and replace the "black" or "#f99" etcetera. burnerfistah said: Next, I want some help on the banner. I changed the banner height to 300px because I want it to show more of the banner using the code you posted. It should be noted you have the banner code pasted twice, one with 300px specified, and one with 800px. The 800px is the one currently in effect. As to your question, the background will resize and scale to fit the available space, which is bound to change depending on your browser window's position and size on your screen. Thus, using a "px" value will not achieve what you want, as a "px" value is fixed and will not change. When trying to frame the image a certain way, the difference in dynamic width and fixed height make for different framings. So, we'll need to use a dynamic value to match the dynamic image. Here's an example that scales based on the horizontal width: :root {
--banner-height: 56.25vw ;
}There are still some issue with this, but it will solve the issue on the vast majority of browser sizes. Although, the value may not be 100% correct yet. I'm just guessing if it's the correct value, feel free to raise or lower the number until it looks correct. It does introduce the problem of the banner affixing at the incorrect scroll location, but this won't be an issue unless someone resizes the window while visiting your list. burnerfistah said: Also sometimes, I don't know how but my hover cover doesn't work. Sometimes I go on my profile and scroll through and see that the hover pop up is blank and I don't know how to fix that. I believe this is due to the cover generator having issues lately, it's been a wide-spread issue from what I can tell. The only way to fix this is to use the solution in the main forum post FAQ, under "Cover images aren't loading?". |
| Thank you! It worked like a charm, except the description appears when I hover over the list item instead of just the preview circle. I can't get the descriptions to update automatically either unfortunately so I'll probably just end up adding them in manually in the following days. Also, one more question, for some reason my category headers end up looking like this (for On Hold and Plan to Watch):  Is there any way to fix it from overlapping my list? Here's the code I'm using for the Category headers: |
 |
Cry5talz said: Thank you! It worked like a charm, except the description appears when I hover over the list item instead of just the preview circle. Also, one more question, for some reason my category headers end up looking like this (for On Hold and Plan to Watch): https://files.catbox.moe/h60c00.png Is there any way to fix it from overlapping my list? Glad to hear it. Ah, sorry, I didn't even realize you were using the on-image instead of on-list version. This alternate version uses the different hover mode. Hmm, that's an older version of the headers, no idea why it's coded like that. Anyhow, it can be fixed by changing the "left" and "width" values so that the text has more room to breath. Here's some code with that change that you can replace your current version with. |
Valerio_LyndonOct 9, 2020 2:35 AM
| Ahhh, I see. Thank you so much! It worked out great. I appreciate all the help and thank you for making such an awesome list design that's also super easy to customize. Thanks for taking the time to help me and everyone else out on here! And, last question (hopefully lmao), Can you see the background on my anime list? For some reason if I go to my list on another browser or firefox incognito, I can't see my background. I'm pretty sure I've got the variable for it all set up correctly --background: url(https://i.imgur.com/7x1vZvN.png); unless there's something else that would cause that? I also have the background tint set up and it displays fine when I'm looking at my own profile while logged in.
/*-S-T-A-R-T-------------------*
| Background Tint |
*-----------------------------*/
body::before {
/* change color here */
background: rgba(0, 0, 0, 0.8);
content: "";
z-index: -1;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*-----------------------E-N-D-*/
|
Cry5talzOct 9, 2020 5:18 AM
|
| Thankfully, I can finally say that I've actually added something to this thread beyond asking questions! The script I was talking about earlier (this one) no longer worked for adding descriptions to your MAL list. I've just done a really simple fix for it and it now works for descriptions (I didn't test anything other than that). If you're interested in any other things in that script that doesn't work, let me know and I might be able to fix them. Emphasis on might since I don't have much experience in JS. I don't know whether or not the author of that script is still around, so I've also posted the following on the forum page that I linked earlier. By the time this post is read, I'll also have sent the author a PM about it and will hopefully be able to get into contact with them. (All credits go to the original author) The following spoiler works for descriptions now (there was an unneeded "span" on line 486). This is the template I used: /* [TITLE] *[DEL]/ #tags-[ID]:after {content: "[DESC]";}EDIT: It looks like the built-in css editor for MAL can only process so much code. If you're wanting what seems like more than 1946 lines of code, you'll have to put some of it into an import statement. |
Cry5talzOct 9, 2020 10:19 AM
|
| hi I've been seeing a yui on the right hand side of my banner and i don't know how to change it. as much as i like k-on and yui it doesn't fit the theme of my banner image. here is my css code: @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Theme%20-%20Compressed.css";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Dark%20Mode%20Compressed.css";
@\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Hover%20Image%20Compressed.css";
body { --avatar: url( }
body { --banner: }any reply would be helpful thanks  |
 |
JAYSONLEM said: hi I've been seeing a yui on the right hand side of my banner and i don't know how to change it. as much as i like k-on and yui it doesn't fit the theme of my banner image. here is my css code: @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Theme%20-%20Compressed.css";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Dark%20Mode%20Compressed.css";
@\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Hover%20Image%20Compressed.css";
body { --avatar: url( }
body { --banner: }any reply would be helpful thanks Instead of this:
body { --avatar: url( }
body { --banner: }
You need to use something like this to set your customization variables. The one you're looking for is "--character:" and it needs to be set to either none (for no image) or the url of a rendered image. like this:
:root {
/* Primary Customization */
--name: "JAYSONLEM's\a Anime List";
--avatar: url(https://cdn.myanimelist.net/images/userimages/10298216.jpg?t=1602306600);
--banner:url(yourbannerimglinkgoeshere);
--character: none; /* Set to none to not display yui. Set to your own url link to display a custom render. */
--background: url(yourbackgroundlinkgoeshere);
}
|
Cry5talzOct 10, 2020 8:51 AM
|
| I'm jsut wondering is there anyway to have the tags show in my manga list like in my anime list (https://i.imgur.com/1RQ9dMZ.png). Is there a code I would need to add or modify? I did compress the code so it might look a bit of a mess. |
|
Cry5talz said: Ahhh, I see. Thank you so much! It worked out great. I appreciate all the help and thank you for making such an awesome list design that's also super easy to customize. Thanks for taking the time to help me and everyone else out on here! And, last question (hopefully lmao), Can you see the background on my anime list? For some reason if I go to my list on another browser or firefox incognito, I can't see my background. I'm pretty sure I've got the variable for it all set up correctly --background: url(https://i.imgur.com/7x1vZvN.png); I'm not entirely sure why that's happening. I can't see the image, but the code looks fine to me. When I duplicate your code onto my own list, it works both logged in and out. What I do know is it seems to be because of MAL's image rehosting (when lists are viewed by users other than the owner, the images are rehosted and processed by MAL). You can see it in action here on what used to be the Imgur link:  Perhaps try reuploading the image to Imgur and using the new URL so that MAL is forced to re-fetch. Bit of a shot in the dark, but it might fix the issue? Also, I notice you seem to have accidentally copied your code in twice, so that may make it harder to find problems or make changes. The second copy begins around line 968, and overwrites almost everything before it. If it still isn't working after you reupload and change the image URL and remove the duplicated code, send me your entire CSS and I will see if that changes anything in my attempt to reproduce the issue. Oh, and nice fix on that script! |
vousvoyez said: I'm jsut wondering is there anyway to have the tags show in my manga list like in my anime list (https://i.imgur.com/1RQ9dMZ.png). Is there a code I would need to add or modify? I did compress the code so it might look a bit of a mess. If you are using the same theme for both your anime and manga list, then the tags should already display like that on your mangalist. If you used a third-party tool to add the genres to your tags, then you should run it on your mangalist to generate the tags. |
Valerio_Lyndon said: Cry5talz said: Ahhh, I see. Thank you so much! It worked out great. I appreciate all the help and thank you for making such an awesome list design that's also super easy to customize. Thanks for taking the time to help me and everyone else out on here! And, last question (hopefully lmao), Can you see the background on my anime list? For some reason if I go to my list on another browser or firefox incognito, I can't see my background. I'm pretty sure I've got the variable for it all set up correctly --background: url(https://i.imgur.com/7x1vZvN.png); I'm not entirely sure why that's happening. I can't see the image, but the code looks fine to me. When I duplicate your code onto my own list, it works both logged in and out. What I do know is it seems to be because of MAL's image rehosting (when lists are viewed by users other than the owner, the images are rehosted and processed by MAL). You can see it in action here on what used to be the Imgur link: Perhaps try reuploading the image to Imgur and using the new URL so that MAL is forced to re-fetch. Bit of a shot in the dark, but it might fix the issue? Also, I notice you seem to have accidentally copied your code in twice, so that may make it harder to find problems or make changes. The second copy begins around line 968, and overwrites almost everything before it. If it still isn't working after you reupload and change the image URL and remove the duplicated code, send me your entire CSS and I will see if that changes anything in my attempt to reproduce the issue. Oh, and nice fix on that script! Looks like that worked! Thanks a bunch! I removed the duplicated code and uploaded my bg image to imgur and now it seems to work as it should. Thank you so much for your help! Thanks! Yeah, I'm hoping that other people can get some use out of it now too. I love having the descriptions, that way if someone visits my list and sees a show they like, they don't have to be linked off the pge to figure out whether or not they'd like it. |
|
Cry5talz said: JAYSONLEM said: hi I've been seeing a yui on the right hand side of my banner and i don't know how to change it. as much as i like k-on and yui it doesn't fit the theme of my banner image. here is my css code: @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Theme%20-%20Compressed.css";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Dark%20Mode%20Compressed.css";
@\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelinkbefore";
@\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Hover%20Image%20Compressed.css";
body { --avatar: url( }
body { --banner: }any reply would be helpful thanks Instead of this:
body { --avatar: url( }
body { --banner: }
You need to use something like this to set your customization variables. The one you're looking for is "--character:" and it needs to be set to either none (for no image) or the url of a rendered image. like this:
:root {
/* Primary Customization */
--name: "JAYSONLEM's\a Anime List";
--avatar: url(https://cdn.myanimelist.net/images/userimages/10298216.jpg?t=1602306600);
--banner:url(yourbannerimglinkgoeshere);
--character: none; /* Set to none to not display yui. Set to your own url link to display a custom render. */
--background: url(yourbackgroundlinkgoeshere);
}
thanks so much, it works and i've got no yui anymore thanks. |
| |
Hi again! One tiny thing - How do I make it so that instead of long titles getting a "...", it breaks a line and takes up 2 lines? I'm tryna put that MAL Score thing in the left, but need to move the title around a bit. EDIT: I moved some stuff around, but am still left with the problem of shortened titles. Now all I really need is a method to line break, which I remember seeing somewhere but cannot find it.  |
Uji_Gintoki_BowlOct 12, 2020 8:05 AM
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!) |
Uji_Gintoki_Bowl said: How do I make it so that instead of long titles getting a "...", it breaks a line and takes up 2 lines? https://i.imgur.com/mvATtFK.png It's possible to enable the title overflow, but there have to be some changes made to the "type" positioning. This is because it's not possible for it to vertically reposition depending on the title height. So, here's a couple of options. If any of them seem alright, then pick one and add it to the bottom of your CSS. |
Valerio_LyndonOct 14, 2020 2:20 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 |